:root{
  --color-background:#F6F7FB;
  --color-surface:#FFFFFF;
  --color-surface-soft:#EDEFFF;
  --color-primary:#58CC02;
  --color-primary-dark:#4CAE02;
  --color-progress:#4255FF;
  --color-progress-light:#EDEFFF;
  --color-text-primary:#282E3E;
  --color-text-secondary:#586380;
  --color-text-muted:#6b7183; /* antes #939BB4: 2.6:1 sobre el fondo, ilegible para muchos (WCAG AA pide 4.5:1) */
  --color-border:#E8EAF0;
  --color-danger:#FF4B4B;
  --radius-card:20px;
  --radius-btn:14px;
}

*{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0; background:var(--color-background); color:var(--color-text-primary);
  font-family:'Nunito', system-ui, sans-serif;
  padding-bottom:env(safe-area-inset-bottom,0px);
}
h1,h2{ font-family:'Inter', system-ui, sans-serif; }
img{ max-width:100%; }
a{ text-decoration:none; color:inherit; }

.lnd-header{
  position:sticky; top:0; z-index:10; background:rgba(246,247,251,0.92); backdrop-filter:blur(6px);
  border-bottom:1px solid var(--color-border);
  padding-top:env(safe-area-inset-top,0px);
}
.lnd-header-inner{
  max-width:1080px; margin:0 auto; padding:14px 20px;
  display:flex; align-items:center; justify-content:space-between;
}
/* Logo CoderaQuest (logo.png = codera.png recortado; ya incluye el lema). */
.lnd-logo{ display:block; flex-shrink:1; min-width:0; }
.lnd-logo .logo-img{ display:block; height:44px; width:auto; max-width:100%; }
@media(max-width:380px){ .lnd-logo .logo-img{ height:36px; } }
.lnd-header-cta{
  font-weight:800; font-size:14px; color:var(--color-text-primary);
  border:2px solid var(--color-border); border-radius:var(--radius-btn); padding:8px 16px;
}

main{ max-width:1080px; margin:0 auto; padding:0 20px; }

.lnd-hero{ text-align:center; padding:56px 0 40px; }
.lnd-hero h1{
  font-size:clamp(28px, 6vw, 44px); font-weight:900; line-height:1.15; margin:0 0 18px;
  color:var(--color-text-primary);
}
.lnd-hero-sub{
  font-size:16px; color:var(--color-text-secondary); max-width:560px; margin:0 auto 28px; line-height:1.5;
}
.lnd-hero-actions{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }

.lnd-btn{
  display:inline-block; font-weight:800; font-size:15px; border-radius:var(--radius-btn);
  padding:14px 26px; cursor:pointer; border:none; text-align:center;
}
.lnd-btn-primary{
  /* Verde de la app oscurecido lo justo para 4.5:1 con texto blanco (antes #58CC02: 2.1:1). */
  background:#008939; color:#fff; box-shadow:0 4px 0 #006b2c;
}
.lnd-btn-primary:active{ transform:translateY(2px); box-shadow:0 2px 0 #006b2c; }
.lnd-btn-primary:disabled{ opacity:0.7; cursor:default; }
.lnd-btn-ghost{
  background:var(--color-surface); color:var(--color-text-primary); border:2px solid var(--color-border);
}

.lnd-features{
  display:grid; grid-template-columns:repeat(2,1fr); gap:16px; padding:20px 0 48px;
}
@media (min-width:720px){ .lnd-features{ grid-template-columns:repeat(4,1fr); } }
.lnd-feature{
  background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius-card);
  padding:20px 16px;
}
.lnd-feature-icon{ font-size:28px; margin-bottom:10px; }
.lnd-feature-title{ font-weight:800; font-size:14.5px; margin-bottom:6px; }
.lnd-feature-desc{ font-size:12.5px; color:var(--color-text-secondary); line-height:1.4; }

.lnd-demo{ text-align:center; padding:20px 0 56px; }
.lnd-demo h2{ font-size:clamp(22px,4vw,30px); font-weight:900; margin:0 0 10px; }
.lnd-demo-sub{ color:var(--color-text-secondary); font-size:14.5px; max-width:480px; margin:0 auto 28px; }

.lnd-demo-card{
  background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius-card);
  padding:28px 24px; max-width:420px; margin:0 auto; box-shadow:0 8px 24px rgba(40,46,62,0.06);
}
.lnd-demo-eyebrow{
  font-weight:800; font-size:12px; letter-spacing:0.02em; color:var(--color-progress);
  text-transform:uppercase; margin-bottom:8px;
}
.lnd-demo-question{ font-weight:800; font-size:20px; }
.lnd-demo-error{ margin-top:14px; color:var(--color-danger); font-size:13px; font-weight:700; }

.lnd-final-cta{
  text-align:center; background:var(--color-surface-soft); border-radius:var(--radius-card);
  padding:48px 20px; margin-bottom:56px;
}
.lnd-final-cta h2{ font-size:26px; font-weight:900; margin:0 0 8px; }
.lnd-final-cta p{ color:var(--color-text-secondary); margin:0 0 22px; }

.lnd-footer{
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px 18px; max-width:1080px; margin:0 auto;
  padding:24px 20px calc(24px + env(safe-area-inset-bottom,0px));
  color:var(--color-text-muted); font-size:13px; border-top:1px solid var(--color-border);
}
.lnd-footer a{ font-weight:700; color:var(--color-text-secondary); }

/* Testimonios (landing.js, loadTestimonials) */
.lnd-testimonials{ padding:8px 0 56px; text-align:center; }
.lnd-testimonials[hidden]{ display:none; }
.lnd-testimonials h2{ font-size:clamp(22px,4vw,30px); font-weight:900; margin:0 0 24px; }
/* Centradas: con 1 o 2 aprobadas no queda un hueco a la derecha. */
.lnd-testimonial-grid{ display:flex; flex-wrap:wrap; justify-content:center; gap:16px; text-align:left; }
.lnd-testimonial{ flex:1 1 260px; max-width:340px; }
.lnd-testimonial{
  margin:0; background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius-card);
  padding:20px; display:flex; flex-direction:column; gap:12px;
}
.lnd-testimonial-stars{ color:#e8a317; font-size:17px; letter-spacing:2px; }
.lnd-testimonial-stars span{ color:#d5d9e3; }
.lnd-testimonial blockquote{ margin:0; font-size:14.5px; line-height:1.5; color:var(--color-text-primary); white-space:pre-line; overflow-wrap:anywhere; flex:1; }
.lnd-testimonial figcaption{ display:flex; align-items:center; gap:8px; font-weight:800; font-size:13.5px; color:var(--color-text-secondary); }
.lnd-testimonial-av{ width:32px; height:32px; border-radius:50%; background:var(--color-surface-soft); display:grid; place-items:center; font-size:17px; }
