/* somoscrecida.com — estilos compartidos (home, aprender, 5 productos).
   Paleta arena + azules + oro. Inter y JetBrains Mono. Sin librerías. */
:root{
  --bg:#F1EFE8;--card:#EAE7DD;--card2:#DCD8CC;--line:#C6C2B4;
  --ink:#0C1A26;--ink2:#2A3A47;--ink3:#4A5863;
  --b100:#8FCEE0;--b300:#35A7C4;--b500:#1E7FA8;--b700:#14587F;--b900:#0B2E4F;
  --gold:#C9A227;--goldtx:#6F5A0F;
  --dark-field:#14283A;--dark-line:#2A4A63;--on-dark2:#C9DCE6;--on-dark3:#8EA6B8;
  --f:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;
  --m:"JetBrains Mono",ui-monospace,Consolas,monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--f);
  -webkit-font-smoothing:antialiased;line-height:1.5}
img{max-width:100%;height:auto;display:block}
a{color:var(--b700)}
a:hover{color:var(--b900)}
::selection{background:var(--b100)}
:focus-visible{outline:2px solid var(--b300);outline-offset:2px}
input::placeholder{color:#7C93A6}
h1,h2,h3,p,ul,ol{margin:0}
ul,ol{padding:0;list-style:none}

.w{max-width:1240px;margin:0 auto;padding-inline:clamp(20px,4vw,40px)}
section{padding-bottom:clamp(64px,9vw,120px)}
.mono{font-family:var(--m)}

/* ── nav ── */
.nav{position:sticky;top:0;z-index:10;padding:12px clamp(12px,3vw,32px) 0}
.nav-in{max-width:1240px;margin:0 auto;height:60px;padding:0 8px 0 20px;display:flex;
  align-items:center;justify-content:space-between;gap:20px;
  background:rgba(234,231,221,.82);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  border:1px solid rgba(198,194,180,.7);border-radius:999px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);
  font-weight:700;font-size:18px;letter-spacing:-.03em}
.logo:hover{color:var(--ink)}
.iso{display:flex;flex-direction:column;gap:2px}
.iso i{display:block;height:3px;border-radius:2px}
.iso i:nth-child(1){width:22px;background:var(--b900)}
.iso i:nth-child(2){width:17px;background:var(--b700)}
.iso i:nth-child(3){width:12px;background:var(--b500)}
.iso i:nth-child(4){width:7px;background:var(--b300)}
.nav-links{display:none;gap:4px;font-size:14px;font-weight:500}
.nav-links a{padding:8px 14px;border-radius:999px;color:var(--ink);text-decoration:none}
.nav-links a:hover{background:var(--bg)}
@media(min-width:900px){.nav-links{display:flex}}
.btn-nav{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 18px;background:var(--ink);
  color:var(--bg);border-radius:999px;font-weight:600;font-size:14px;text-decoration:none;white-space:nowrap}
.btn-nav span{color:var(--b100)}
.btn-nav:hover{background:var(--b700);color:#fff}

/* ── piezas comunes ── */
.badge{align-self:flex-start;display:inline-flex;align-items:center;gap:10px;padding:7px 14px 7px 10px;
  border-radius:999px;font-family:var(--m);font-size:12px}
.badge.claro{border:1px solid var(--line);background:var(--card);color:var(--b700)}
.badge.claro::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px rgba(201,162,39,.2)}
.badge.oro{background:var(--gold);color:var(--ink)}
.badge.oro::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--ink)}
.crumbs{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.crumbs a,.crumbs span{padding:7px 14px;border-radius:999px;font-family:var(--m);font-size:12px;text-decoration:none}
.crumbs a{border:1px solid var(--line);color:var(--ink3)}
.crumbs a:hover{background:var(--card)}
.crumbs span{background:var(--card);color:var(--b700)}

h1{font-weight:800;letter-spacing:-.055em;line-height:.95;text-wrap:balance}
h1.home{font-size:clamp(42px,7.4vw,104px)}
h1.prod{font-size:clamp(40px,6.4vw,88px);line-height:.96}
h1.apr{font-size:clamp(42px,6.8vw,96px)}
h1 em{font-style:normal;color:var(--b500)}
.lead{font-size:clamp(17px,1.5vw,20px);line-height:1.5;color:var(--ink2);max-width:33em;text-wrap:pretty}
h2.t{font-size:clamp(28px,3.4vw,44px);line-height:1.05;letter-spacing:-.045em;font-weight:800;margin-bottom:28px;text-wrap:balance}
.kick{font-family:var(--m);font-size:12px;color:var(--b700)}

.hero{padding:clamp(32px,6vw,88px) 0 clamp(48px,7vw,96px)}
.hero .w{display:flex;flex-wrap:wrap;gap:clamp(32px,4vw,56px);align-items:flex-end}
.hero.top .w{align-items:flex-start}
.hero-txt{flex:1 1 560px;display:flex;flex-direction:column;gap:26px;min-width:0}
.hero-txt.apr{flex-basis:520px;padding-top:clamp(0px,3vw,40px)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;gap:10px;padding:10px 16px;border-radius:999px;background:var(--card);font-size:14px}
.chip b{font-family:var(--m);font-size:11px;font-weight:400;color:var(--b700)}

/* ── tarjeta oscura con formulario ── */
.fcard{flex:1 1 380px;max-width:480px;min-width:0;background:var(--ink);color:var(--bg);border-radius:28px;
  padding:clamp(22px,3vw,32px);scroll-margin-top:96px;box-shadow:0 30px 60px -30px rgba(11,46,79,.55)}
.fcard.agenda{flex-basis:400px;max-width:500px}
.fcard .fk{font-family:var(--m);font-size:12px;color:var(--b100)}
.fcard .fk-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.fcard .bars{display:flex;flex-direction:column;gap:2px;align-items:flex-end}
.fcard .bars i{display:block;height:3px;border-radius:2px;background:var(--b300)}
.fcard .bars i:nth-child(1){width:22px}
.fcard .bars i:nth-child(2){width:17px;opacity:.75}
.fcard .bars i:nth-child(3){width:12px;opacity:.5}
.fcard .bars i:nth-child(4){width:7px;opacity:.3}
.fcard h2{font-size:26px;letter-spacing:-.03em;line-height:1.15;font-weight:700;margin:0 0 8px}
.fcard .fp{font-size:15px;line-height:1.5;color:var(--on-dark2);margin-bottom:22px}
.fcard form{display:flex;flex-direction:column;gap:10px}
.row2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:10px}
.in{width:100%;height:52px;padding:0 18px;border:1px solid var(--dark-line);background:var(--dark-field);
  border-radius:14px;font:400 16px var(--f);color:var(--bg);outline:none}
.in:focus{border-color:var(--b300);box-shadow:0 0 0 3px rgba(53,167,196,.3)}
select.in{padding:0 14px}
.trampa{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.go{margin-top:6px;min-height:56px;padding:0 20px;border:0;border-radius:999px;background:var(--b100);
  color:var(--ink);font:700 17px var(--f);cursor:pointer}
.go:hover{background:var(--bg)}
.go:active{background:var(--b300)}
.go:disabled{opacity:.45;cursor:default}
.go:disabled:hover{background:var(--b100)}
.fnote{font-size:13px;color:var(--on-dark3);text-align:center;margin-top:4px}
.ferr{font-size:14.5px;color:#F5B7A5;min-height:1.2em}
.ok{padding:20px;border-radius:16px;background:var(--dark-field);border:1px solid var(--b300);font-size:15px;line-height:1.5;color:var(--on-dark2)}
.ok b{display:block;color:var(--bg);font-size:17px;margin-bottom:6px}

/* ── agenda ── */
.fcard .fsub{font-size:13px;color:var(--on-dark3)}
.dias{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}
.dias::-webkit-scrollbar{display:none}
.dia{flex:0 0 auto;min-width:68px;padding:10px 12px;border-radius:18px;border:1px solid var(--dark-line);
  background:var(--dark-field);color:var(--bg);font:500 14px var(--f);cursor:pointer;display:flex;
  flex-direction:column;align-items:center;gap:2px}
.dia:hover{border-color:var(--b300)}
.dia small{font-size:11px;text-transform:uppercase;letter-spacing:.06em;opacity:.8}
.dia b{font-size:22px;font-weight:800;letter-spacing:-.03em}
.dia.on,.hora.on{background:var(--b100);color:var(--ink);border-color:var(--b100)}
.horas{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:8px}
.hora{height:46px;border-radius:999px;border:1px solid var(--dark-line);background:var(--dark-field);
  color:var(--bg);font:600 15px var(--m);cursor:pointer}
.hora:hover{border-color:var(--b300)}
.agenda-sep{padding-top:16px;border-top:1px solid var(--dark-line)}
.vacio{font-size:15px;line-height:1.5;color:var(--on-dark2)}
.vacio a{color:var(--b100)}
.listo-h{font-size:28px;font-weight:800;letter-spacing:-.04em;line-height:1.1;margin:8px 0 12px;text-transform:none}

/* ── logos / prueba ── */
.logos{padding-bottom:clamp(40px,5vw,64px)}
.logos .w{display:flex;flex-wrap:wrap;align-items:center;gap:12px 40px}
.logos .et{font-family:var(--m);font-size:12px;color:var(--ink3)}
.logos ul{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.logos li{display:flex;align-items:center;justify-content:center;height:56px;padding:0 22px;border-radius:999px;background:var(--card)}
.logos img{height:34px;width:auto;max-width:150px;object-fit:contain}
.logos img.largo{height:22px}

.bento{display:flex;flex-wrap:wrap;gap:16px}
.bcard{border-radius:28px;padding:28px;display:flex;flex-direction:column;gap:18px;justify-content:space-between}
.bcard.cap{flex:2 1 520px;background:var(--card);padding:12px 12px 24px}
.bcard.cap img{border-radius:20px;width:100%}
.bcard.cap p{padding:0 16px;font-size:clamp(18px,1.8vw,22px);line-height:1.35;letter-spacing:-.02em;font-weight:600;max-width:34em}
.bcard.azul{flex:1 1 300px;background:var(--b900);color:var(--bg);min-height:260px}
.bcard.azul .fk{font-family:var(--m);font-size:12px;color:var(--b100)}
.bcard.azul p.g{font-size:clamp(24px,2.6vw,32px);font-weight:700;letter-spacing:-.035em;line-height:1.1}
.bcard.azul .iso i{height:6px}
.bcard.azul .iso{gap:4px}
.bcard.azul .iso i:nth-child(1){width:70px;background:var(--b100)}
.bcard.azul .iso i:nth-child(2){width:54px;background:var(--b300)}
.bcard.azul .iso i:nth-child(3){width:38px;background:var(--b500)}
.bcard.azul .iso i:nth-child(4){width:22px;background:var(--b700)}
.bcard.out{flex:1 1 300px;border:1px solid var(--line);color:var(--ink);text-decoration:none;min-height:260px}
.bcard.out:hover{background:var(--card);color:var(--ink)}
.bcard.out .fk{font-family:var(--m);font-size:12px;color:var(--goldtx)}
.bcard.out .g{font-size:clamp(20px,2vw,24px);font-weight:700;letter-spacing:-.025em;line-height:1.2}
.bcard.out .mas{font-weight:600;font-size:15px;color:var(--b700)}

/* ── el mapa ── */
.mapa .w{display:flex;flex-wrap:wrap;gap:clamp(32px,5vw,80px);align-items:center}
.mapa-txt{flex:1 1 380px;display:flex;flex-direction:column;gap:18px;min-width:0}
.mapa-txt h2{font-size:clamp(34px,4.6vw,60px);line-height:1;letter-spacing:-.05em;font-weight:800;text-wrap:balance}
.mapa-txt p{font-size:18px;line-height:1.5;color:var(--ink2);max-width:30em}
.capas{flex:1.3 1 460px;display:flex;flex-direction:column;gap:8px;min-width:0}
.capa{min-width:min(100%,260px);border-radius:16px;padding:16px 20px;display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.capa .n{font-family:var(--m);font-size:12px;opacity:.75}
.capa b{font-weight:700;font-size:19px;letter-spacing:-.02em}
.capa span.d{font-size:14px;line-height:1.4;opacity:.85;flex:1 1 180px}
.capa.c1{width:100%;background:var(--b900);color:var(--bg)}
.capa.c2{width:91%;background:var(--b700);color:var(--bg)}
.capa.c3{width:82%;background:var(--b500);color:#fff}
.capa.c4{width:73%;background:var(--b300);color:var(--ink)}
.capa.c5{width:64%;background:var(--b100);color:var(--ink)}

/* ── servicios ── */
.sec-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:28px}
.sec-head h2{margin:0}
.sec-head p{font-size:16px;color:var(--ink2)}
.servs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:12px}
.serv{min-height:240px;display:flex;flex-direction:column;justify-content:space-between;gap:20px;padding:24px;
  border-radius:24px;background:var(--card);text-decoration:none;color:var(--ink);transition:transform .2s,background .2s}
.serv:hover{background:var(--b900);color:var(--bg);transform:translateY(-4px)}
.serv .top{display:flex;justify-content:space-between;align-items:center}
.serv .top span{font-family:var(--m);font-size:12px;opacity:.7}
.serv .top i{width:36px;height:36px;border-radius:50%;border:1px solid currentColor;display:flex;align-items:center;justify-content:center;font-style:normal;font-size:16px}
.serv b{display:block;font-weight:700;font-size:22px;letter-spacing:-.03em;margin-bottom:10px}
.serv p{font-size:14px;line-height:1.45;opacity:.85}

/* ── equipo ── */
.equipo{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:16px}
.persona{border-radius:28px;background:var(--card);padding:12px 12px 24px;display:flex;flex-direction:column;gap:14px}
.persona img{aspect-ratio:1/1;width:100%;object-fit:cover;border-radius:20px;background:var(--card2)}
.persona div{padding:0 12px;display:flex;flex-direction:column;gap:8px}
.persona .rol{align-self:flex-start;padding:4px 10px;border-radius:999px;background:var(--bg);font-family:var(--m);font-size:11px;color:var(--b700)}
.persona b{font-weight:700;font-size:21px;letter-spacing:-.03em}
.persona p{font-size:15px;line-height:1.45;color:var(--ink2)}

/* ── también ── */
.tambien{padding-bottom:clamp(24px,3vw,32px)}
.tambien .et{font-family:var(--m);font-size:12px;color:var(--ink3);margin-bottom:14px}
.tgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:12px}
.tlink{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:24px 28px;border-radius:24px;
  border:1px solid var(--line);text-decoration:none;color:var(--ink)}
.tlink:hover{background:var(--card);color:var(--ink)}
.tlink b{display:block;font-weight:700;font-size:20px;letter-spacing:-.025em;margin-bottom:6px}
.tlink p{font-size:14px;line-height:1.45;color:var(--ink2)}
.tlink i{flex:0 0 auto;width:40px;height:40px;border-radius:50%;background:var(--ink);color:var(--b100);display:flex;
  align-items:center;justify-content:center;font-style:normal}

/* ── para quién / qué incluye / pasos ── */
.quien{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:12px}
.qcard{min-height:200px;border-radius:24px;background:var(--card);padding:24px;display:flex;flex-direction:column;justify-content:space-between;gap:20px}
.qcard .n{font-family:var(--m);font-size:12px;color:var(--b700)}
.qcard p{font-size:clamp(18px,1.7vw,21px);line-height:1.35;letter-spacing:-.02em;font-weight:600}
.dos{display:flex;flex-wrap:wrap;gap:16px}
.inc{flex:1 1 420px;border-radius:28px;background:var(--b900);color:var(--bg);padding:clamp(24px,3vw,36px);display:flex;flex-direction:column;gap:22px}
.inc h2{margin:0}
.inc ul{display:flex;flex-wrap:wrap;gap:8px}
.inc li{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:var(--b700);font-size:15px;line-height:1.3}
.inc li::before{content:"+";color:var(--b100);font-weight:700}
.trab{flex:1 1 420px;border-radius:28px;background:var(--card);padding:clamp(24px,3vw,36px);display:flex;flex-direction:column;gap:22px}
.trab h2{margin:0}
.trab ol{display:flex;flex-direction:column;gap:10px}
.trab li{display:grid;grid-template-columns:44px minmax(0,1fr);gap:2px 14px;align-items:start;padding:14px;border-radius:16px;background:var(--bg)}
.trab li .c{grid-row:span 2;width:44px;height:44px;border-radius:50%;background:var(--ink);color:var(--b100);display:flex;
  align-items:center;justify-content:center;font-family:var(--m);font-size:12px}
.trab li b{font-weight:700;font-size:17px;letter-spacing:-.02em;padding-top:2px}
.trab li span.d{font-size:14px;line-height:1.45;color:var(--ink2)}
.pasos3{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:12px}
.paso3{min-height:220px;border-radius:24px;background:var(--card);padding:24px;display:flex;flex-direction:column;justify-content:space-between;gap:20px}
.paso3 .c{width:44px;height:44px;border-radius:50%;background:var(--ink);color:var(--b100);display:flex;align-items:center;justify-content:center;font-family:var(--m);font-size:12px}
.paso3 b{display:block;font-weight:700;font-size:22px;letter-spacing:-.03em;margin-bottom:8px}
.paso3 p{font-size:15px;line-height:1.45;color:var(--ink2)}
.ign{display:flex;flex-wrap:wrap;gap:16px}
.ign .foto{flex:1 1 300px;max-width:420px;border-radius:28px;background:var(--card);padding:12px}
.ign .foto img{aspect-ratio:1/1;width:100%;object-fit:cover;border-radius:20px}
.ign .bio{flex:2 1 420px;border-radius:28px;background:var(--card);padding:clamp(24px,3vw,40px);display:flex;flex-direction:column;gap:16px;justify-content:center}
.ign .bio .rol{align-self:flex-start;padding:4px 10px;border-radius:999px;background:var(--bg);font-family:var(--m);font-size:11px;color:var(--b700)}
.ign .bio h2{margin:0}
.ign .bio p{font-size:18px;line-height:1.5;color:var(--ink2);max-width:30em}

/* ── cierre ── */
.cierre{padding:0 clamp(12px,3vw,32px) clamp(24px,3vw,32px)}
.cierre-in{max-width:1240px;margin:0 auto;border-radius:36px;background:var(--ink);color:var(--bg);
  padding:clamp(40px,7vw,96px) clamp(24px,5vw,72px);display:flex;flex-wrap:wrap;justify-content:space-between;
  align-items:flex-end;gap:32px;position:relative;overflow:hidden}
.cierre-in .deco{position:absolute;right:-40px;top:40px;display:flex;flex-direction:column;gap:14px;align-items:flex-end;opacity:.9}
.cierre-in .deco i{display:block;height:22px;border-radius:12px}
.cierre-in .deco i:nth-child(1){width:340px;background:var(--b900)}
.cierre-in .deco i:nth-child(2){width:260px;background:var(--b700)}
.cierre-in .deco i:nth-child(3){width:180px;background:var(--b500)}
.cierre-in .deco i:nth-child(4){width:100px;background:var(--b300)}
.cierre-in h2{position:relative;font-size:clamp(36px,6vw,80px);line-height:.95;letter-spacing:-.055em;font-weight:800;max-width:11em;text-wrap:balance}
.cierre-in .acc{position:relative;display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.btn-big{display:inline-flex;align-items:center;gap:10px;height:60px;padding:0 30px;background:var(--b100);color:var(--ink);
  border-radius:999px;font-weight:700;font-size:17px;text-decoration:none}
.btn-big:hover{background:var(--bg);color:var(--ink)}
.cierre-in .mail{font-size:14px;color:var(--on-dark2)}
.cierre-in .mail a{color:var(--bg)}
.otros{display:flex;flex-wrap:wrap;gap:8px;max-width:420px}
.otros a{padding:8px 14px;border-radius:999px;border:1px solid var(--dark-line);color:var(--bg);font-size:14px;text-decoration:none}
.otros a:hover{background:var(--dark-field);color:var(--bg)}

footer.pie{padding:32px 0 40px}
footer.pie .w{display:flex;flex-wrap:wrap;gap:16px 40px;justify-content:space-between;align-items:center;font-size:14px;color:var(--ink3)}
footer.pie .logo{font-size:16px}
footer.pie .iso i{height:2px}
footer.pie .iso i:nth-child(1){width:16px}
footer.pie .iso i:nth-child(2){width:12px}
footer.pie .iso i:nth-child(3){width:8px}
footer.pie .iso i:nth-child(4){width:4px}

/* el atributo hidden manda aunque el elemento tenga display propio */
[hidden]{display:none!important}