/* ============================================================
   LÓGICA ESCÉNICA · Salas interiores
   El viaje de la penumbra a la claridad. Tokens por tono.
   ============================================================ */

:root{
  --carbon:#171717;
  --carbon-2:#101010;
  --ink:#0b0b0b;
  --yellow:#F6FF36;
  --ivory:#F4F3EF;
  --white:#ffffff;

  --disp:"Archivo",system-ui,sans-serif;
  --sans:"Hanken Grotesk",system-ui,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,monospace;

  --wrap:min(1200px,90vw);
  --ease:cubic-bezier(.16,1,.3,1);
}

/* ---- Tonos del viaje ---- */
body.tone-ivory{ --bg:var(--ivory); --fg:#141414; --muted:rgba(20,20,20,.62); --faint:rgba(20,20,20,.4); --line:rgba(20,20,20,.14); --card:#fff; --acc:#141414; }
body.tone-white{ --bg:#fff; --fg:#111; --muted:rgba(17,17,17,.6); --faint:rgba(17,17,17,.38); --line:rgba(17,17,17,.1); --card:#fafafa; --acc:#111; }
body.tone-carbon{ --bg:var(--ink); --fg:#F4F3EF; --muted:rgba(244,243,239,.55); --faint:rgba(244,243,239,.3); --line:rgba(244,243,239,.14); --card:#141414; --acc:#F4F3EF; }

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{background:var(--bg);color:var(--fg);font-family:var(--sans);
  font-size:clamp(1rem,.95rem + .3vw,1.15rem);line-height:1.6;overflow-x:hidden;
  transition:background .6s var(--ease),color .6s var(--ease)}
::selection{background:var(--yellow);color:#111}
img{display:block;max-width:100%}
a{color:inherit}

.wrap{width:var(--wrap);margin-inline:auto}
.disp{font-family:var(--disp);font-weight:900;line-height:.92;letter-spacing:-.02em}
.mono{font-family:var(--mono);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--faint)}
.yl{color:#111;background:var(--yellow);padding:0 .12em;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.lede{font-size:clamp(1.2rem,1rem + 1vw,1.6rem);line-height:1.45;color:var(--fg);max-width:34ch}
.muted{color:var(--muted)}

/* ---------- Revelado (auto-reproducido al cargar: nunca puede quedar invisible) ---------- */
@keyframes leReveal{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
.reveal{animation:leReveal .8s var(--ease) both}
.reveal.in{opacity:1;transform:none}
.reveal[data-d="1"]{animation-delay:.08s}
.reveal[data-d="2"]{animation-delay:.16s}
.reveal[data-d="3"]{animation-delay:.24s}
html:not(.js) .reveal{animation:none;opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{animation:none;opacity:1;transform:none}}
@keyframes leBeam{from{clip-path:polygon(0 0,0 0,0 100%,0 100%)}to{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}}
.beam{animation:leBeam 1.5s var(--ease) both}
.beam.in{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}
html:not(.js) .beam{animation:none;clip-path:none}
@media (prefers-reduced-motion:reduce){.beam{animation:none;clip-path:none}}

/* ============================================================
   NAV — institucional, sticky
   ============================================================ */
.nav{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;
  padding:1rem clamp(1.2rem,5vw,3rem);background:color-mix(in srgb,var(--bg) 86%,transparent);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav__logo{display:flex;align-items:center;gap:.55rem;text-decoration:none;color:var(--fg);
  font-family:var(--disp);font-weight:900;letter-spacing:-.01em;font-size:.92rem;text-transform:uppercase}
.nav__logo .be{width:0;height:0;border-style:solid;border-width:0 0 14px 14px;
  border-color:transparent transparent var(--fg) transparent;transform:rotate(-8deg)}
.nav__links{display:flex;gap:1.05rem;list-style:none}
.nav__links a{text-decoration:none;color:var(--fg);font-family:var(--mono);font-size:.66rem;
  letter-spacing:.11em;text-transform:uppercase;opacity:.6;transition:opacity .3s;position:relative;white-space:nowrap}
.nav__links a:hover,.nav__links a[aria-current]{opacity:1}
.nav__links a[aria-current]::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--yellow)}
.nav__cta{text-decoration:none;color:var(--fg);font-family:var(--mono);font-size:.7rem;
  letter-spacing:.14em;text-transform:uppercase;border:1px solid var(--fg);padding:.5rem .9rem;border-radius:2px;transition:.3s}
.nav__cta:hover{background:var(--yellow);border-color:var(--yellow);color:#111}
.nav__toggle{display:none}
.nav__links-cta{display:none}
@media(max-width:820px){
  .nav__toggle{display:flex;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;padding:0 11px;border:1px solid var(--line);border-radius:3px;background:transparent;cursor:pointer;flex:none}
  .nav__toggle span{display:block;height:2px;width:100%;background:var(--fg);border-radius:2px;transition:transform .3s var(--ease),opacity .2s}
  .nav.nav--open .nav__toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .nav.nav--open .nav__toggle span:nth-child(2){opacity:0}
  .nav.nav--open .nav__toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .nav__cta{display:none}
  .nav__links{display:flex;flex-direction:column;align-items:stretch;gap:0;position:absolute;left:0;right:0;top:100%;background:color-mix(in srgb,var(--bg) 97%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line);padding:0 clamp(1.2rem,5vw,3rem);max-height:0;overflow:hidden;opacity:0;pointer-events:none;transition:max-height .35s var(--ease),opacity .3s,padding .35s var(--ease)}
  .nav.nav--open .nav__links{max-height:min(80vh,600px);overflow:auto;opacity:1;pointer-events:auto;padding:.3rem clamp(1.2rem,5vw,3rem) 1.1rem}
  .nav__links a{display:block;width:100%;opacity:.85;font-size:.8rem;padding:1.05rem 0;border-bottom:1px solid var(--line)}
  .nav__links a[aria-current]::after{display:none}
  .nav__links-cta{display:block}
  .nav__links-cta a{opacity:1;border:1px solid var(--fg);border-radius:2px;text-align:center;margin-top:.85rem;padding:.95rem 1rem}
  .nav__links-cta a:hover{background:var(--yellow);border-color:var(--yellow);color:#111}
}
body.nav-lock{overflow:hidden}

/* ============================================================
   SALA HERO
   ============================================================ */
.sala{padding:clamp(3.5rem,10vh,7rem) 0 clamp(2.5rem,6vh,4rem)}
.sidx{display:flex;align-items:center;gap:.9rem;margin-bottom:1.8rem}
.sidx .n{font-family:var(--mono);font-size:.72rem;letter-spacing:.2em;color:var(--fg)}
.sidx .l{font-family:var(--mono);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--faint)}
.sidx .rule{flex:1;height:1px;background:var(--line)}
.sala h1{font-family:var(--disp);font-weight:900;letter-spacing:-.03em;line-height:.9;
  font-size:clamp(2.6rem,1.2rem + 6vw,6rem);max-width:15ch}
.sala .kick{font-size:clamp(1.2rem,1rem + 1vw,1.7rem);line-height:1.4;color:var(--muted);max-width:40ch;margin-top:1.8rem}

/* ============================================================
   SECCIONES genéricas
   ============================================================ */
.sec{padding:clamp(2.5rem,7vh,5rem) 0}
.sec--line{border-top:1px solid var(--line)}
.eyebrow{font-family:var(--mono);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--faint);display:block;margin-bottom:1.1rem}
.h-sec{font-family:var(--disp);font-weight:900;letter-spacing:-.02em;line-height:.98;font-size:clamp(1.9rem,1.1rem + 3vw,3.4rem);max-width:20ch}
.h-sub{font-family:var(--disp);font-weight:800;letter-spacing:-.01em;line-height:1.05;font-size:clamp(1.4rem,1rem + 1.6vw,2.2rem)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:start}
@media(max-width:820px){.split{grid-template-columns:1fr;gap:2rem}}
.stack>*+*{margin-top:1.1rem}

/* imagen-fotograma */
.frame{position:relative;overflow:hidden;background:#000}
.frame img{width:100%;height:100%;object-fit:cover;filter:contrast(1.05) saturate(.92)}
.frame.tall{aspect-ratio:3/4}
.frame.wide{aspect-ratio:16/10}
.frame .lbl{position:absolute;left:1rem;bottom:1rem;font-family:var(--mono);font-size:.66rem;
  letter-spacing:.16em;text-transform:uppercase;color:#fff;mix-blend-mode:difference}

/* ---------- Secuencia / pasos (problema→hipótesis→principios→consecuencias) ---------- */
.steps{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
.step{background:var(--bg);padding:clamp(1.5rem,3vw,2.4rem)}
.step .k{font-family:var(--mono);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);margin-bottom:.9rem}
.step h3{font-family:var(--disp);font-weight:800;letter-spacing:-.01em;font-size:clamp(1.3rem,1rem + 1.2vw,1.9rem);line-height:1.02;margin-bottom:.7rem}
.step p{color:var(--muted)}
@media(min-width:900px){.steps{grid-template-columns:repeat(4,1fr)}}

/* ---------- Pilares ---------- */
.pillars{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line)}
.pillar{background:var(--bg);padding:clamp(1.8rem,3.5vw,3rem);transition:background .3s var(--ease)}
.pillar,.pillar .muted,.pillar h3,.pillar .out{transition:color .3s var(--ease)}
.pillar:hover{background:#0b0b0b}
.pillar:hover h3,.pillar:hover .out{color:#F4F3EF}
.pillar:hover .muted{color:rgba(244,243,239,.72)}
.pillar .n{font-family:var(--mono);font-size:.72rem;letter-spacing:.2em;color:var(--yellow-ink,var(--fg))}
.pillar .n b{background:var(--yellow);color:#111;padding:.1em .4em;letter-spacing:.1em}
.pillar h3{font-family:var(--disp);font-weight:900;letter-spacing:-.02em;font-size:clamp(1.5rem,1rem + 1.8vw,2.4rem);line-height:1;margin:1rem 0 .8rem}
.pillar .out{margin-top:1.2rem;font-weight:600;color:var(--fg)}
@media(max-width:720px){.pillars{grid-template-columns:1fr}}

/* ---------- Módulos observa/entrena/cambia ---------- */
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.trio .c{background:var(--bg);padding:clamp(1.5rem,3vw,2.2rem)}
.trio .c .k{font-family:var(--mono);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);margin-bottom:1rem}
.trio .c h4{font-family:var(--disp);font-weight:800;font-size:1.3rem;line-height:1.05;margin-bottom:.6rem}
.trio .c p{color:var(--muted);font-size:.98rem}
@media(max-width:820px){.trio{grid-template-columns:1fr}}

/* ---------- Antes / Después ---------- */
.ba{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line)}
.ba figure{position:relative;margin:0;background:#000}
.ba img{width:100%;aspect-ratio:4/3;object-fit:cover;filter:contrast(1.05)}
.ba .tag{position:absolute;top:1rem;left:1rem;font-family:var(--mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;
  background:rgba(0,0,0,.7);color:#fff;padding:.4rem .7rem}
.ba figure.after .tag{background:var(--yellow);color:#111}
@media(max-width:640px){.ba{grid-template-columns:1fr}}

/* ---------- Módulos ciclo (lista de expedientes) ---------- */
.modlist{border-top:1px solid var(--line)}
.modrow{display:grid;grid-template-columns:auto 1fr auto;gap:1.4rem;align-items:baseline;
  padding:1.5rem 0;border-bottom:1px solid var(--line);transition:padding-left .4s var(--ease)}
.modrow:hover{padding-left:1rem}
.modrow .mi{font-family:var(--mono);font-size:.75rem;letter-spacing:.16em;color:var(--faint)}
.modrow h4{font-family:var(--disp);font-weight:800;letter-spacing:-.01em;font-size:clamp(1.3rem,1rem + 1.4vw,2rem);line-height:1}
.modrow .conq{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--yellow-ink,var(--fg))}
.modrow .conq b{background:var(--yellow);color:#111;padding:.15em .45em}

/* ============================================================
   EXPEDIENTES DE PROGRAMA
   ============================================================ */
.exp{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
.expcard{background:var(--card);padding:clamp(1.8rem,3.5vw,3rem);text-decoration:none;color:var(--fg);
  display:grid;gap:1rem;position:relative;transition:transform .4s var(--ease)}
.expcard:hover{transform:translateY(-3px);background:var(--yellow)!important;color:#111!important}
.expcard:hover .tag,.expcard:hover p,.expcard:hover .meta,.expcard:hover .go{color:#111!important}
.expcard:hover .meta{border-color:rgba(0,0,0,.2)!important}
.expcard .tag{font-family:var(--mono);font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--faint)}
.expcard.feat{background:var(--carbon);color:#F4F3EF;border:0}
.expcard.feat .tag{color:var(--yellow)}
.expcard.feat .meta,.expcard.feat .go{color:rgba(244,243,239,.6)}
.expcard h3{font-family:var(--disp);font-weight:900;letter-spacing:-.02em;line-height:.98;font-size:clamp(1.5rem,1rem + 1.8vw,2.4rem)}
.expcard p{color:var(--muted)}
.expcard.feat p{color:rgba(244,243,239,.7)}
.expcard .meta{font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);
  border-top:1px solid var(--line);padding-top:1rem;margin-top:.4rem}
.expcard.feat .meta{border-color:rgba(244,243,239,.16)}
.expcard .go{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--fg)}
@media(min-width:900px){.exp{grid-template-columns:1fr 1fr}.expcard.feat{grid-column:1/-1}}

/* chips */
.chips{display:flex;flex-wrap:wrap;gap:.5rem}
.chip{font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;
  border:1px solid var(--line);padding:.55rem .85rem;color:var(--muted)}

/* ============================================================
   CAMPUS (interfaz)
   ============================================================ */
.app{display:grid;grid-template-columns:240px 1fr;border:1px solid var(--line);background:var(--card);overflow:hidden}
.app .side{padding:1.4rem;border-right:1px solid var(--line)}
.app .u{display:flex;align-items:center;gap:.7rem;margin-bottom:1.6rem}
.app .av{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,#333,#111)}
.app .nm{font-weight:600;font-size:.9rem;line-height:1.2}
.app .nm span{display:block;font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;color:var(--faint);text-transform:uppercase;margin-top:.2rem}
.app .snav{display:flex;flex-direction:column;gap:.2rem}
.app .snav a{display:flex;align-items:center;gap:.6rem;padding:.6rem .5rem;font-size:.85rem;color:var(--muted);border-radius:4px;text-decoration:none}
.app .snav a .dt{width:6px;height:6px;border-radius:50%;background:var(--faint)}
.app .snav a.on{background:var(--fg);color:var(--bg)}
.app .snav a.on .dt{background:var(--yellow)}
.app .main{padding:clamp(1.4rem,3vw,2.2rem)}
.app .bc{font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin-bottom:.6rem}
.app .main h4{font-family:var(--disp);font-weight:800;font-size:1.6rem;margin-bottom:1.2rem}
.app .player{position:relative;aspect-ratio:16/9;background:#000;overflow:hidden;margin-bottom:1.2rem}
.app .player img{width:100%;height:100%;object-fit:cover;opacity:.85}
.app .pl{position:absolute;inset:0;margin:auto;width:64px;height:64px;border:1px solid #fff;border-radius:50%;display:grid;place-items:center}
.app .pl i{width:0;height:0;border-style:solid;border-width:9px 0 9px 15px;border-color:transparent transparent transparent #fff;margin-left:3px}
.app .bar{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(255,255,255,.25)}
.app .bar::after{content:"";position:absolute;left:0;top:0;bottom:0;width:38%;background:var(--yellow)}
.app .lst{display:flex;flex-direction:column}
.app .it{display:grid;grid-template-columns:auto 1fr auto;gap:.9rem;align-items:center;padding:.8rem 0;border-top:1px solid var(--line);font-size:.9rem}
.app .it .ci{width:16px;height:16px;border:1px solid var(--faint);border-radius:50%}
.app .it.done .ci{background:var(--fg);border-color:var(--fg)}
.app .it .tt span{display:block;font-family:var(--mono);font-size:.62rem;letter-spacing:.08em;color:var(--faint);text-transform:uppercase;margin-top:.15rem}
.app .it .dur{font-family:var(--mono);font-size:.72rem;color:var(--faint)}
@media(max-width:720px){.app{grid-template-columns:1fr}.app .side{border-right:0;border-bottom:1px solid var(--line)}}

/* ============================================================
   SOBRE — retratos
   ============================================================ */
.founders{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,3rem)}
.founder .frame{aspect-ratio:4/5;margin-bottom:1.2rem}
.founder h3{font-family:var(--disp);font-weight:900;letter-spacing:-.02em;font-size:1.6rem;line-height:1}
.founder .role{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);margin:.5rem 0 .9rem}
@media(max-width:720px){.founders{grid-template-columns:1fr}}

/* ============================================================
   ADMISIÓN — proceso + faq
   ============================================================ */
.proc{counter-reset:p;display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
.proc .s{background:var(--bg);padding:clamp(1.5rem,3vw,2.4rem);counter-increment:p;position:relative}
.proc .s::before{content:"0" counter(p);font-family:var(--mono);font-size:.8rem;letter-spacing:.1em;color:var(--yellow);display:block;margin-bottom:1rem}
.proc .s h4{font-family:var(--disp);font-weight:800;font-size:1.25rem;margin-bottom:.5rem}
.proc .s p{color:var(--muted);font-size:.95rem}
@media(min-width:820px){.proc{grid-template-columns:repeat(3,1fr)}}
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:1.4rem 0;font-family:var(--disp);font-weight:700;
  font-size:clamp(1.1rem,1rem + .8vw,1.4rem);display:flex;justify-content:space-between;align-items:center;gap:1rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--mono);color:var(--yellow);font-size:1.4rem;transition:transform .3s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{color:var(--muted);padding:0 0 1.4rem;max-width:60ch}

/* ---------- CTA band ---------- */
.cta{padding:clamp(3rem,9vh,7rem) 0;text-align:center;background:var(--carbon);color:#F4F3EF}
.cta h2{font-family:var(--disp);font-weight:900;letter-spacing:-.02em;line-height:.98;
  font-size:clamp(2rem,1.2rem + 4vw,4.4rem);max-width:20ch;margin:0 auto 1.4rem}
.cta p{color:rgba(244,243,239,.65);max-width:44ch;margin:0 auto 2.2rem}
.btn{display:inline-flex;align-items:center;gap:.6rem;font-family:var(--mono);font-size:.76rem;
  letter-spacing:.14em;text-transform:uppercase;text-decoration:none;padding:1rem 1.6rem;transition:.3s}
.btn--y{background:var(--yellow);color:#111}
.btn--y:hover{background:#fff}
.btn--ghost{border:1px solid rgba(244,243,239,.4);color:#F4F3EF}
.btn--ghost:hover{border-color:#fff;background:rgba(255,255,255,.06)}
.btnrow{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}

/* ============================================================
   FOOTER
   ============================================================ */
.foot{background:var(--ink);color:#F4F3EF;padding:clamp(3rem,7vh,5rem) 0 2.5rem}
.foot .grid{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:2.5rem}
.foot .brand .lg{display:flex;align-items:center;gap:.55rem;font-family:var(--disp);font-weight:900;text-transform:uppercase;font-size:1rem;margin-bottom:1rem}
.foot .brand .lg .be{width:0;height:0;border-style:solid;border-width:0 0 14px 14px;border-color:transparent transparent #F4F3EF transparent;transform:rotate(-8deg)}
.foot .brand p{color:rgba(244,243,239,.5);max-width:34ch;font-size:.95rem}
.foot h5{font-family:var(--mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(244,243,239,.5);margin-bottom:1rem}
.foot ul{list-style:none;display:flex;flex-direction:column;gap:.6rem}
.foot a{color:rgba(244,243,239,.8);text-decoration:none;font-size:.92rem}
.foot a:hover{color:var(--yellow)}
.foot .bottom{margin-top:3rem;padding-top:1.5rem;border-top:1px solid rgba(244,243,239,.14);
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:1.4rem;align-items:flex-start}
.foot .legal-block h5{margin-bottom:.7rem}
.foot .bottom small{font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(244,243,239,.4)}
@media(max-width:760px){.foot .grid{grid-template-columns:1fr 1fr}.foot .brand{grid-column:1/-1}}
.foot .legal-links{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem}
.foot .legal-links a{font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(244,243,239,.4)}
.foot .legal-links a:hover{color:var(--yellow)}
.foot .legal-links .cookie-settings{font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;
  text-transform:uppercase;color:rgba(244,243,239,.4);background:none;border:0;padding:0;cursor:pointer}
.foot .legal-links .cookie-settings:hover{color:var(--yellow)}

/* ============================================================
   PÁGINAS LEGALES
   ============================================================ */
.legal{max-width:820px;margin-inline:auto;padding:clamp(3rem,8vh,5rem) 0 clamp(3rem,7vh,5rem)}
.legal .doc-head{margin-bottom:2.6rem;padding-bottom:2rem;border-bottom:1px solid var(--line)}
.legal .doc-head h1{font-family:var(--disp);font-weight:900;letter-spacing:-.02em;line-height:.95;
  font-size:clamp(2rem,1.2rem + 3.4vw,3.4rem)}
.legal .doc-head .ver{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);margin-top:1rem;display:block}
.legal .prestador{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);
  border:1px solid var(--line);margin:0 0 2.4rem}
.legal .prestador div{background:var(--bg);padding:1rem 1.2rem}
.legal .prestador dt{font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin-bottom:.35rem}
.legal .prestador dd{font-size:.95rem;font-weight:500}
.legal h2{font-family:var(--disp);font-weight:800;letter-spacing:-.01em;line-height:1.1;
  font-size:clamp(1.2rem,1rem + 1vw,1.6rem);margin:2.4rem 0 .9rem;scroll-margin-top:90px}
.legal h3{font-family:var(--sans);font-weight:600;font-size:1.05rem;margin:1.6rem 0 .5rem}
.legal p{color:var(--muted);margin-bottom:1rem;max-width:70ch}
.legal ul{margin:0 0 1.2rem 1.2rem;color:var(--muted)}
.legal li{margin-bottom:.5rem;max-width:68ch}
.legal strong{color:var(--fg);font-weight:600}
.legal a{color:inherit;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--faint)}
.legal a:hover{text-decoration-color:var(--yellow)}
.legal .toc{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:2.4rem}
.legal .toc a{font-family:var(--mono);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;
  border:1px solid var(--line);padding:.5rem .8rem;text-decoration:none;color:var(--muted)}
.legal .toc a:hover{border-color:var(--yellow);color:var(--fg)}
.legal .callout{border-left:3px solid var(--yellow);background:color-mix(in srgb,var(--yellow) 8%,transparent);
  padding:1.1rem 1.3rem;margin:1.6rem 0;font-size:.95rem;color:var(--fg)}
.legal .form-model{border:1px dashed var(--line);padding:1.6rem;margin:1.4rem 0;font-family:var(--mono);
  font-size:.82rem;line-height:2.1;color:var(--muted);white-space:pre-wrap}
.legal .ctable{width:100%;border-collapse:collapse;margin:1rem 0 1.4rem;font-size:.85rem}
.legal .ctable th,.legal .ctable td{border:1px solid var(--line);padding:.7rem .8rem;text-align:left;color:var(--muted)}
.legal .ctable th{font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--fg)}
@media(max-width:620px){.legal .prestador{grid-template-columns:1fr}.legal .ctable{display:block;overflow-x:auto}}

/* ============================================================
   ASISTENTE GUIADO (chat) — oscuro en todas las páginas
   ============================================================ */
.chat-launch{position:fixed;right:clamp(1rem,3vw,1.6rem);bottom:clamp(1rem,3vw,1.6rem);z-index:60;
  display:flex;align-items:center;gap:.6rem;background:var(--yellow);color:#111;border:1px solid #111;
  font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;
  padding:.85rem 1.15rem;border-radius:40px;cursor:pointer;box-shadow:0 10px 30px rgba(0,0,0,.35);transition:.3s}
.chat-launch:hover{background:#0b0b0b;color:#F4F3EF;border-color:#0b0b0b}
.chat-launch .dot{width:9px;height:9px;border-radius:50%;background:#111;flex:none;box-shadow:0 0 0 0 rgba(17,17,17,.6);animation:pulse 1.4s infinite}
.chat-launch:hover .dot{background:var(--yellow);animation:pulseY 1.4s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(17,17,17,.55);transform:scale(1)}70%{box-shadow:0 0 0 10px rgba(17,17,17,0);transform:scale(1.25)}100%{box-shadow:0 0 0 0 rgba(17,17,17,0);transform:scale(1)}}
@keyframes pulseY{0%{box-shadow:0 0 0 0 rgba(247,255,54,.6);transform:scale(1)}70%{box-shadow:0 0 0 10px rgba(247,255,54,0);transform:scale(1.25)}100%{box-shadow:0 0 0 0 rgba(247,255,54,0);transform:scale(1)}}
.chat-launch.hide{opacity:0;pointer-events:none;transform:translateY(10px)}
@media (prefers-reduced-motion:reduce){.chat-launch .dot{animation:none}}
.chat{position:fixed;right:clamp(1rem,3vw,1.6rem);bottom:clamp(1rem,3vw,1.6rem);z-index:61;
  width:min(380px,calc(100vw - 2rem));height:min(560px,calc(100vh - 2rem));background:#111114;color:#F4F3EF;
  border:1px solid rgba(244,243,239,.16);border-radius:14px;display:flex;flex-direction:column;overflow:hidden;
  box-shadow:0 24px 70px rgba(0,0,0,.6);opacity:0;transform:translateY(16px) scale(.98);pointer-events:none;
  transition:opacity .35s var(--ease),transform .35s var(--ease)}
.chat.open{opacity:1;transform:none;pointer-events:auto}
.chat__head{display:flex;align-items:center;gap:.7rem;padding:.9rem 1rem;border-bottom:1px solid rgba(244,243,239,.12)}
.chat__avatar{width:34px;height:34px;flex:none;background:#000;border-radius:7px;display:grid;place-items:center}
.chat__avatar svg{width:20px;height:20px}
.chat__id .n{font-family:var(--disp);font-weight:800;font-size:.92rem;letter-spacing:-.01em}
.chat__id .s{font-family:var(--mono);font-size:.58rem;letter-spacing:.06em;text-transform:uppercase;color:rgba(244,243,239,.5);margin-top:.15rem}
.chat__id .s b{color:var(--yellow);font-weight:400}
.chat__close{margin-left:auto;background:none;border:0;color:rgba(244,243,239,.6);font-size:1.4rem;cursor:pointer;line-height:1}
.chat__close:hover{color:#fff}
.chat__body{flex:1;overflow-y:auto;padding:1.1rem 1rem;display:flex;flex-direction:column;gap:.7rem}
.chat .msg{max-width:88%;font-size:.9rem;line-height:1.45;border-radius:12px;padding:.7rem .9rem}
.chat .msg.bot{background:#1c1c20;border:1px solid rgba(244,243,239,.08);align-self:flex-start;border-bottom-left-radius:3px}
.chat .msg.bot b{color:#fff}
.chat .msg.user{background:var(--yellow);color:#111;align-self:flex-end;font-weight:500;border-bottom-right-radius:3px}
.chat .msg.card{background:#000;border:1px solid rgba(247,255,54,.3);align-self:stretch;max-width:100%}
.chat .msg.card .k{font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--yellow)}
.chat .msg.card h4{font-family:var(--disp);font-weight:800;font-size:1.1rem;margin:.4rem 0 .5rem}
.chat .msg.card p{color:rgba(244,243,239,.7);font-size:.84rem;margin:0}
.chat .msg.card .meta{font-family:var(--mono);font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;color:rgba(244,243,239,.5);margin-top:.7rem}
.chat .typing{display:inline-flex;gap:4px}
.chat .typing i{width:6px;height:6px;border-radius:50%;background:rgba(244,243,239,.5);animation:blink 1.2s infinite}
.chat .typing i:nth-child(2){animation-delay:.2s}.chat .typing i:nth-child(3){animation-delay:.4s}
@keyframes blink{0%,60%,100%{opacity:.25}30%{opacity:1}}
.chat__opts{display:flex;flex-wrap:wrap;gap:.5rem;padding:.9rem 1rem;border-top:1px solid rgba(244,243,239,.12)}
.chat__opts .chip{font-family:var(--sans);font-size:.8rem;border:1px solid rgba(244,243,239,.22);background:transparent;
  color:#F4F3EF;padding:.5rem .8rem;border-radius:40px;cursor:pointer;text-decoration:none;transition:.25s}
.chat__opts .chip:hover{border-color:var(--yellow);color:var(--yellow)}
.chat__opts .chip.primary{background:var(--yellow);color:#111;border-color:var(--yellow);font-weight:600}
.chat__opts .chip.primary:hover{background:#fff;border-color:#fff;color:#111}
.chat__opts .chip.wa{border-color:#25d366;color:#25d366}
.chat__opts .chip.wa:hover{background:#25d366;color:#fff}

/* ============================================================
   LOGO REAL (lockup) — negro por defecto, invertido en carbón
   ============================================================ */
.nav__logo{display:flex;align-items:center;gap:0}
.nav__logo img{height:21px;width:auto;display:block}
.nav__logo .be{display:none}
body.tone-carbon .nav__logo img{filter:invert(1)}
.foot .brand .lg{display:block}
.foot .brand .lg .be{display:none}
.foot .brand .lg img{height:24px;width:auto;filter:invert(1)}

/* ============================================================
   PROGRAMA PROFESIONAL — página profunda
   ============================================================ */
.factbar{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:2.4rem}
.factbar .f{background:var(--bg);padding:1.2rem}
.factbar .f .v{font-family:var(--disp);font-weight:900;font-size:clamp(1.3rem,1rem + 1.2vw,1.9rem);line-height:.95;letter-spacing:-.02em}
.factbar .f .k{font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);margin-top:.5rem}
@media(max-width:860px){.factbar{grid-template-columns:1fr 1fr}}

.ciclo{margin-top:2.4rem}
.ciclo .ch{display:flex;align-items:baseline;gap:1rem;margin-bottom:.4rem}
.ciclo .ch .cn{font-family:var(--mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--fg)}
.ciclo .ch .cn b{background:var(--yellow);color:#111;padding:.12em .5em}
.ciclo .ch h3{font-family:var(--disp);font-weight:900;letter-spacing:-.02em;font-size:clamp(1.3rem,1rem + 1.4vw,2rem)}

.module{border:1px solid var(--line);background:var(--card);margin-top:1px}
.module summary{cursor:pointer;list-style:none;display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:1rem 1.2rem;align-items:center;padding:1.2rem 1.35rem}
.module summary::-webkit-details-marker{display:none}
.module .mi{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;color:var(--faint)}
.module .mt{font-family:var(--disp);font-weight:800;letter-spacing:-.01em;font-size:clamp(1.15rem,1rem + 1vw,1.6rem);line-height:1.05}
.module .mc{font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:#111;background:var(--yellow);padding:.35em .6em;white-space:nowrap}
.module .plus{width:36px;height:36px;flex:none;border-radius:50%;border:2px solid var(--yellow);
  color:var(--yellow);background:transparent;display:grid;place-items:center;font-family:var(--disp);
  font-weight:500;font-size:1.5rem;line-height:0;transition:transform .3s var(--ease),background .3s var(--ease),color .3s var(--ease)}
.module[open] .plus{transform:rotate(135deg);background:var(--yellow);color:#111}
.module summary:hover .plus{background:var(--yellow);color:#111}
.module .mbody{padding:0 1.4rem 1.6rem;color:var(--muted);max-width:none}
.module .mbody p{margin-bottom:.8rem}
@media(max-width:600px){.module summary{grid-template-columns:1fr auto;gap:.5rem 1rem}.module .mi{grid-column:1}.module .mt{grid-column:1}.module .mc{grid-column:1;justify-self:start}.module .plus{grid-column:2;grid-row:1/4;align-self:start}}

.deliver{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.6rem}
.deliver .d{font-family:var(--mono);font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;border:1px solid var(--line);padding:.6rem .9rem;color:var(--fg);display:flex;align-items:center;gap:.5rem}
.deliver .d::before{content:"";width:6px;height:6px;background:var(--yellow)}

.compare{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:1.4rem}
.compare .col{background:var(--bg);padding:clamp(1.4rem,3vw,2.2rem)}
.compare .col.them{color:var(--muted)}
.compare .col h4{font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;margin-bottom:1.1rem}
.compare .col.us h4{color:var(--fg)}.compare .col.us h4 b{background:var(--yellow);color:#111;padding:.12em .5em}
.compare .col ul{list-style:none;display:flex;flex-direction:column;gap:.7rem}
.compare .col li{padding-left:1.4rem;position:relative;font-size:.95rem}
.compare .col.them li::before{content:"\00d7";position:absolute;left:0;color:var(--faint)}
.compare .col.us li::before{content:"\2192";position:absolute;left:0;color:var(--fg)}
@media(max-width:640px){.compare{grid-template-columns:1fr}}

.fin{border:1px solid var(--line);padding:clamp(1.6rem,3.5vw,2.6rem);margin-top:1.4rem;display:grid;grid-template-columns:auto 1fr;gap:2rem;align-items:center}
.fin .price{font-family:var(--disp);font-weight:900;font-size:clamp(2rem,1.2rem + 3vw,3.4rem);line-height:.9;letter-spacing:-.03em}
.fin .price small{display:block;font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);margin-top:.5rem;font-weight:400}
.fin .fnote{color:var(--muted);font-size:.95rem}
@media(max-width:600px){.fin{grid-template-columns:1fr;gap:1.1rem}}

/* ============================================================
   LA TÉCNICA EN ACCIÓN — videoteca editorial
   ============================================================ */
.vfeature{position:relative;aspect-ratio:16/8;overflow:hidden;border:1px solid var(--line);background:#000;margin-top:2rem}
.vfeature img{width:100%;height:100%;object-fit:cover;opacity:.72}
.vfeature .ov{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(1.4rem,4vw,2.8rem);background:linear-gradient(0deg,rgba(0,0,0,.8),transparent 60%)}
.vfeature .k{font-family:var(--mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--yellow)}
.vfeature h3{font-family:var(--disp);font-weight:900;letter-spacing:-.02em;color:#fff;font-size:clamp(1.5rem,1rem + 2.4vw,2.8rem);line-height:1;margin-top:.5rem;max-width:18ch}
.vplay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:72px;height:72px;border:1px solid rgba(255,255,255,.7);border-radius:50%;display:grid;place-items:center;transition:.3s}
.vplay::after{content:"";width:0;height:0;border-style:solid;border-width:11px 0 11px 18px;border-color:transparent transparent transparent #fff;margin-left:4px}
.vfeature:hover .vplay,.vtile:hover .vplay{background:var(--yellow);border-color:var(--yellow)}
.vfeature:hover .vplay::after,.vtile:hover .vplay::after{border-left-color:#111}
.vfilm{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-top:1.4rem}
.vtile{position:relative;text-decoration:none;color:inherit}
.vtile .pic{position:relative;aspect-ratio:4/3;overflow:hidden;background:#000;border:1px solid var(--line)}
.vtile .pic img{width:100%;height:100%;object-fit:cover;opacity:.8;transition:.4s}
.vtile:hover .pic img{opacity:1;transform:scale(1.03)}
.vtile .vplay{width:52px;height:52px}
.vtile .vplay::after{border-width:8px 0 8px 13px}
.vtile .k{font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);margin-top:.8rem;display:block}
.vtile .t{font-family:var(--disp);font-weight:700;font-size:1.05rem;line-height:1.1;margin-top:.3rem}
@media(max-width:820px){.vfilm{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.vfilm{grid-template-columns:1fr}}

/* Muro de cita grande */
.quote-big{padding:clamp(2.4rem,6vw,4rem) 0;text-align:center}
.quote-big p{font-family:var(--disp);font-weight:800;letter-spacing:-.02em;line-height:1.05;font-size:clamp(1.6rem,1.1rem + 3vw,3.4rem);max-width:22ch;margin:0 auto}
.quote-big p .yl{color:#111}
.quote-big .src{font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin-top:1.6rem}

/* ============================================================
   CAMPUS — panel de progreso / biblioteca
   ============================================================ */
.dash{border:1px solid var(--line);background:var(--card);padding:clamp(1.4rem,3vw,2rem)}
.dash .dh{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:1rem;flex-wrap:wrap;gap:.5rem}
.dash .dh .who{font-family:var(--disp);font-weight:800;font-size:1.2rem}
.dash .dh .meta{font-family:var(--mono);font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}
.track{display:flex;flex-direction:column}
.track .row{display:grid;grid-template-columns:5.5rem 1fr 3rem;gap:1rem;align-items:center;padding:.8rem 0;border-top:1px solid var(--line)}
.track .row .mi{font-family:var(--mono);font-size:.66rem;letter-spacing:.06em;color:var(--faint)}
.track .lab{font-size:.92rem;display:flex;flex-direction:column;gap:.4rem}
.track .lab b{font-weight:600}
.track .bar{height:6px;background:var(--line);position:relative;border-radius:3px;overflow:hidden}
.track .bar span{position:absolute;inset:0 auto 0 0;background:var(--fg)}
.track .row.now .bar span{background:var(--yellow)}
.track .pct{font-family:var(--mono);font-size:.7rem;color:var(--faint);text-align:right}
.track .row.now .pct{color:var(--fg)}
.reslist{border-top:1px solid var(--line);margin-top:.4rem}
.reslist .r{display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:center;padding:.9rem 0;border-bottom:1px solid var(--line)}
.reslist .r .ic{font-family:var(--mono);font-size:.6rem;letter-spacing:.06em;text-transform:uppercase;color:#111;background:var(--yellow);padding:.35em .55em}
.reslist .r .rt{font-weight:500}
.reslist .r .rt span{display:block;font-family:var(--mono);font-size:.62rem;letter-spacing:.06em;color:var(--faint);text-transform:uppercase;margin-top:.2rem;font-weight:400}
.reslist .r .rm{font-family:var(--mono);font-size:.66rem;color:var(--faint)}

/* ============================================================
   DIAGNÓSTICO DEL ACTOR — selector interactivo
   ============================================================ */
.dg-opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-top:2rem}
.dg-opt{background:var(--bg);padding:1.2rem 1.3rem;text-align:left;cursor:pointer;font-family:inherit;color:var(--fg);border:0;transition:background .3s}
.dg-opt:hover{background:var(--card)}
.dg-opt.active{background:var(--yellow);color:#111}
.dg-opt .qn{font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
.dg-opt.active .qn{color:rgba(0,0,0,.55)}
.dg-opt .ql{display:block;font-family:var(--disp);font-weight:700;font-size:1.05rem;margin-top:.5rem;line-height:1.1}
.dg-result{margin-top:1px;border:1px solid var(--line);background:var(--card);padding:clamp(1.4rem,3vw,2.4rem);display:none}
.dg-result.show{display:block;animation:dgin .5s var(--ease)}
@keyframes dgin{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.dg-result .rphrase{font-family:var(--disp);font-weight:800;letter-spacing:-.01em;line-height:1.1;font-size:clamp(1.2rem,1rem + 1.2vw,1.8rem);margin-bottom:1.4rem;max-width:26ch}
.dg-result .rphrase .yl{color:#111}
.dg-result .rk{font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.dg-result h3{font-family:var(--disp);font-weight:900;letter-spacing:-.02em;font-size:clamp(1.3rem,1rem + 1.4vw,2rem);margin:.4rem 0 .5rem}
.dg-result .rp{color:var(--muted);max-width:58ch;margin-bottom:1rem}
.dg-result .rmeta{font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);margin-bottom:1.4rem}

/* ============================================================
   ARCHIVO VIVO — filtros + lightbox
   ============================================================ */
.arc-filters{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.4rem 0}
.arc-filters button{font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;border:1px solid var(--line);background:transparent;color:var(--muted);padding:.55rem .9rem;cursor:pointer;transition:.25s}
.arc-filters button:hover{color:var(--fg);border-color:var(--faint)}
.arc-filters button.active{background:var(--yellow);color:#111;border-color:var(--yellow)}
.vtile.hidden{display:none}
.lightbox{position:fixed;inset:0;z-index:80;background:rgba(0,0,0,.93);display:none;align-items:center;justify-content:center;padding:6vw}
.lightbox.open{display:flex}
.lightbox .lb-inner{width:min(1000px,92vw);aspect-ratio:16/9;background:#0b0b0b;position:relative;border:1px solid rgba(244,243,239,.2)}
.lightbox iframe{width:100%;height:100%;border:0;display:block}
.lightbox .lb-ph{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.8rem;color:#F4F3EF;text-align:center;padding:2rem}
.lightbox .lb-ph .k{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--yellow)}
.lightbox .lb-ph h4{font-family:var(--disp);font-weight:800;font-size:clamp(1.2rem,1rem + 1.4vw,1.9rem);max-width:20ch}
.lightbox .lb-close{position:absolute;top:-2.8rem;right:0;background:none;border:0;color:#fff;font-size:2rem;cursor:pointer;line-height:1}

/* ============================================================
   LABORATORIO INTERACTIVO — comprender haciendo clic
   ============================================================ */
.lab{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--line);margin-top:1.6rem;overflow:hidden}
.lab .lab-vis{position:relative;background:#000;min-height:360px;overflow:hidden}
.lab .lab-vis img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;opacity:.42;filter:grayscale(1) contrast(1.05);transition:opacity .6s var(--ease),filter .6s var(--ease)}
.lab .lab-vis[data-level="1"] img{opacity:.6;filter:grayscale(.7) contrast(1.05)}
.lab .lab-vis[data-level="2"] img{opacity:.78;filter:grayscale(.35)}
.lab .lab-vis[data-level="3"] img{opacity:.95;filter:none}
.lab .lab-cap{position:absolute;left:1.1rem;bottom:1.6rem;right:1.1rem;font-family:var(--disp);font-weight:700;color:#fff;font-size:clamp(1.1rem,1rem + 1vw,1.5rem);line-height:1.1;z-index:2;text-shadow:0 2px 20px rgba(0,0,0,.6)}
.lab .lab-meter{position:absolute;left:0;right:0;bottom:0;height:6px;background:rgba(255,255,255,.16);z-index:2}
.lab .lab-meter span{position:absolute;inset:0 auto 0 0;width:8%;background:var(--yellow);transition:width .6s var(--ease)}
.lab .lab-meter em{position:absolute;right:.6rem;bottom:.7rem;font-family:var(--mono);font-style:normal;font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:#fff}
.lab .lab-ctrl{padding:clamp(1.3rem,3vw,2rem);display:flex;flex-direction:column;gap:.8rem;background:var(--card)}
.lab .lab-ctrl>.lead-in{font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
.lab .lc{display:flex;align-items:flex-start;gap:.8rem;cursor:pointer;padding:.9rem 1rem;border:1px solid var(--line);transition:.25s;background:var(--bg);text-align:left;font-family:inherit;color:var(--fg)}
.lab .lc:hover{border-color:var(--faint)}
.lab .lc.on{border-color:var(--yellow)}
.lab .lc .box{width:20px;height:20px;border:1px solid var(--faint);flex:none;margin-top:.1rem;position:relative;transition:.25s}
.lab .lc.on .box{background:var(--yellow);border-color:var(--yellow)}
.lab .lc.on .box::after{content:"";position:absolute;left:6px;top:2px;width:5px;height:10px;border:solid #111;border-width:0 2px 2px 0;transform:rotate(45deg)}
.lab .lc h4{font-family:var(--disp);font-weight:700;font-size:1rem;line-height:1.1}
.lab .lc p{color:var(--muted);font-size:.88rem;margin-top:.25rem}
.lab .lab-note{font-family:var(--mono);font-size:.7rem;letter-spacing:.06em;color:var(--faint);margin-top:.3rem;min-height:2.4em}
@media(max-width:760px){.lab{grid-template-columns:1fr}.lab .lab-vis{min-height:240px}}

/* Módulo · recorrido explorable */
.mgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:.2rem}
.mgrid .mrow{background:var(--card);padding:1.15rem 1.35rem}
.mgrid .mrow.wide{grid-column:1/-1}
.mgrid .mrow .rl{font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);margin-bottom:.5rem}
.mgrid .mrow p{margin:0;color:var(--muted);font-size:1.05rem;line-height:1.5}
.mgrid .mrow .quote{font-family:var(--disp);font-weight:700;color:var(--fg);font-size:1.22rem;line-height:1.2}
.module .mbody .mout{margin-top:1.1rem;font-family:var(--disp);font-weight:800;font-size:1.25rem;color:var(--fg);max-width:64ch}
.module .mbody .mout .yl{color:#111}
.module .mbody .mnext{margin-top:.6rem;font-size:1rem;color:var(--muted);max-width:70ch}
@media(max-width:600px){.mgrid{grid-template-columns:1fr}}

/* ============================================================
   AJUSTES VISUALES (feedback) — chat amarillo, menos cajas, franja fin
   ============================================================ */
/* Botón del chat en amarillo corporativo sobre fondo oscuro */
body.tone-carbon .chat-launch{background:var(--yellow);color:#111;border-color:#111;box-shadow:0 10px 30px rgba(0,0,0,.5)}
body.tone-carbon .chat-launch:hover{background:#0b0b0b;color:#F4F3EF;border-color:#0b0b0b}
body.tone-carbon .chat-launch .dot{background:#111}

/* Diagnóstico: botones más visibles */
.dg-opts{display:flex;flex-wrap:wrap;gap:.7rem;background:none;border:0}
.dg-opt{flex:1 1 210px;border:1.5px solid rgba(20,20,20,.24);background:#fff;padding:1.3rem 1.35rem;border-radius:3px;transition:border-color .2s var(--ease),transform .2s var(--ease),box-shadow .2s var(--ease)}
.dg-opt:hover{background:#fff;border-color:#141414;transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,.08)}
.dg-opt .qn{color:var(--faint)}
.dg-opt .ql{font-size:1.18rem;margin-top:.55rem}
.dg-opt.active{background:var(--yellow);border-color:#111}
.dg-opt.active .ql{color:#111}

/* Módulo: fuera las cajas internas, dejar separadores finos */
.mgrid{grid-template-columns:1fr 1fr;gap:1.3rem 2.2rem;background:none;border:0;margin-top:.9rem}
.mgrid .mrow{background:none;border:0;padding:.85rem 0 0;border-top:1px solid var(--line)}
.mgrid .mrow.wide{grid-column:1/-1}
@media(max-width:600px){.mgrid{grid-template-columns:1fr;gap:1rem}}

/* Financiación: franja amarilla, apilada (se acabó el corte raro) */
.fin{background:var(--yellow);color:#111;border:0;grid-template-columns:1fr;gap:1rem;align-items:start}
.fin .price{color:#111}
.fin .price small{color:rgba(0,0,0,.6)}
.fin .fnote{color:rgba(0,0,0,.82);max-width:62ch}
.fin .fnote strong,.fin strong{color:#111}

/* Franjas-kicker en amarillo corporativo sobre fondo oscuro */
body.tone-carbon .eyebrow{color:var(--yellow)}
/* … salvo dentro de bandas claras, donde el amarillo no contrasta */
body.tone-carbon .band-ivory .eyebrow{color:rgba(20,20,20,.55)}
body.tone-carbon .band-y .eyebrow{color:rgba(0,0,0,.55)}
body.tone-carbon .band-ivory a{color:#141414}
body.tone-carbon .band-ivory .faq a{color:#141414;text-decoration:underline;text-decoration-color:var(--yellow);text-underline-offset:3px;text-decoration-thickness:2px}

/* ============================================================
   ADMISIÓN personalizada según diagnóstico
   ============================================================ */
.adm-ctx{display:none}
.adm-ctx.show{display:block;border:1px solid var(--line);border-left:3px solid var(--yellow);
  background:var(--card);padding:clamp(1.2rem,3vw,1.8rem);margin-top:1.6rem;animation:dgin .5s var(--ease)}
.adm-ctx .k{font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.adm-ctx p{margin-top:.5rem;color:var(--muted)}
.adm-ctx p strong{color:var(--fg)}
.adm-ctx a{color:var(--fg);text-decoration:underline;text-decoration-color:var(--yellow);text-underline-offset:3px}

/* ============================================================
   OBSERVATORIO — mira esto, no aquello (interactivo)
   ============================================================ */
.mira{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--line);margin-top:1.6rem;overflow:hidden}
.mira .mira-fig{position:relative;background:#000;min-height:340px;overflow:hidden}
.mira .mira-fig img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;opacity:.7;filter:grayscale(.4) contrast(1.05)}
/* zona iluminada por foco según qué se mira */
.mira .mira-fig::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at var(--fx,50%) var(--fy,50%),transparent 0,transparent 90px,rgba(0,0,0,.62) 200px);
  transition:background .5s var(--ease)}
.mira .mira-fig[data-focus="accion"]{--fx:38%;--fy:62%}
.mira .mira-fig[data-focus="vinculo"]{--fx:66%;--fy:46%}
.mira .mira-fig[data-focus="espectador"]{--fx:50%;--fy:84%}
.mira .mira-fig[data-focus="emocion"]{--fx:50%;--fy:34%}
.mira .mira-side{padding:clamp(1.3rem,3vw,2rem);background:var(--card);display:flex;flex-direction:column;gap:1rem}
.mira .mira-tabs{display:flex;flex-wrap:wrap;gap:.5rem}
.mira .mira-tab{font-family:var(--mono);font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;
  border:1px solid var(--line);background:var(--bg);color:var(--muted);padding:.5rem .8rem;cursor:pointer;transition:.25s}
.mira .mira-tab:hover{color:var(--fg);border-color:var(--faint)}
.mira .mira-tab.on{background:var(--yellow);color:#111;border-color:var(--yellow)}
.mira .mira-read .mk{font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin-bottom:.6rem}
.mira .mira-read p{color:var(--fg);font-size:1.02rem;line-height:1.5;max-width:40ch}
@media(max-width:760px){.mira{grid-template-columns:1fr}.mira .mira-fig{min-height:240px}}

/* ============================================================
   CAMPUS — demo con pestañas (dashboard / lección / bitácora)
   ============================================================ */
.demo-tabs{display:flex;gap:.4rem;margin-top:2rem;flex-wrap:wrap}
.demo-tab{font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;
  border:1px solid var(--line);background:transparent;color:var(--muted);padding:.6rem 1rem;cursor:pointer;transition:.25s}
.demo-tab:hover{color:var(--fg);border-color:var(--faint)}
.demo-tab.on{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.demo-pane{display:none;margin-top:1px;animation:dgin .45s var(--ease)}
.demo-pane.on{display:block}
.les{border:1px solid var(--line);background:var(--card)}
.les .lesmain{padding:clamp(1.3rem,3vw,2rem)}
.les .lesplayer{position:relative;aspect-ratio:16/9;background:#000;overflow:hidden}
.les .lesplayer img{width:100%;height:100%;object-fit:cover;opacity:.8}
.les .vplay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:64px;height:64px;border:1px solid rgba(255,255,255,.7);border-radius:50%;display:grid;place-items:center}
.les .vplay::after{content:"";width:0;height:0;border-style:solid;border-width:10px 0 10px 16px;border-color:transparent transparent transparent #fff;margin-left:4px}
.les .lesbc{font-family:var(--mono);font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);margin-bottom:.5rem}
.les h4{font-family:var(--disp);font-weight:800;font-size:1.4rem;margin-bottom:1rem}
.les .lesrow{display:grid;grid-template-columns:auto 1fr auto;gap:.9rem;align-items:center;padding:.75rem 0;border-top:1px solid var(--line);font-size:.9rem}
.les .lesrow .ci{width:16px;height:16px;border:1px solid var(--faint);border-radius:50%}
.les .lesrow.done .ci{background:var(--fg);border-color:var(--fg)}
.les .lesrow.now .ci{border-color:var(--yellow);background:var(--yellow)}
.les .lesrow .dur{font-family:var(--mono);font-size:.7rem;color:var(--faint)}
.bit{border:1px solid var(--line);background:var(--card);padding:clamp(1.3rem,3vw,2rem)}
.bit .entry{padding:1.1rem 0;border-top:1px solid var(--line)}
.bit .entry:first-child{border-top:0}
.bit .entry .d{font-family:var(--mono);font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;color:var(--yellow)}
.bit .entry h5{font-family:var(--disp);font-weight:700;font-size:1.05rem;margin:.3rem 0}
.bit .entry p{color:var(--muted);font-size:.92rem}
.bit .entry .tag{font-family:var(--mono);font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);margin-top:.5rem;display:inline-block}

/* ============================================================
   WEBINAR — clase abierta (landing + registro + replay)
   ============================================================ */
.wb-state{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--mono);font-size:.66rem;
  letter-spacing:.14em;text-transform:uppercase;border:1px solid var(--line);padding:.45rem .8rem;color:var(--muted)}
.wb-state .d{width:7px;height:7px;border-radius:50%;background:var(--yellow);animation:blink 1.6s infinite}
.wb-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:0;border:1px solid var(--line);margin-top:2rem;overflow:hidden}
.wb-grid .wb-info{padding:clamp(1.6rem,4vw,2.6rem);border-right:1px solid var(--line)}
.wb-grid .wb-info ul{list-style:none;display:flex;flex-direction:column;gap:.9rem;margin-top:1.2rem}
.wb-grid .wb-info li{padding-left:1.6rem;position:relative;color:var(--muted)}
.wb-grid .wb-info li::before{content:"";position:absolute;left:0;top:.55em;width:7px;height:7px;background:var(--yellow)}
.wb-form{padding:clamp(1.6rem,4vw,2.6rem);background:var(--card);display:flex;flex-direction:column;gap:.9rem}
.wb-form .fl{font-family:var(--mono);font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
.wb-form input{font-family:var(--sans);font-size:1rem;padding:.9rem 1rem;background:var(--bg);
  border:1px solid var(--line);color:var(--fg);border-radius:0;width:100%}
.wb-form input:focus{outline:2px solid var(--yellow);outline-offset:1px;border-color:var(--yellow)}
.wb-form .btn{justify-content:center;border:0;cursor:pointer;width:100%}
.wb-form .fnote{font-family:var(--mono);font-size:.62rem;letter-spacing:.06em;color:var(--faint);text-transform:uppercase}
.wb-form [data-webinar-ok]{display:none;border:1px solid var(--yellow);border-left-width:3px;padding:1rem;background:var(--bg)}
.wb-form [data-webinar-ok].show{display:block;animation:dgin .5s var(--ease)}
.wb-form [data-webinar-ok] strong{color:var(--fg)}
@media(max-width:760px){.wb-grid{grid-template-columns:1fr}.wb-grid .wb-info{border-right:0;border-bottom:1px solid var(--line)}}
.wb-chapters{border-top:1px solid var(--line);margin-top:1.4rem}
.wb-chapters .ch{display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:baseline;padding:1rem 0;border-bottom:1px solid var(--line)}
.wb-chapters .ch .n{font-family:var(--mono);font-size:.7rem;color:var(--yellow)}
.wb-chapters .ch .t{font-family:var(--disp);font-weight:700;font-size:1.1rem}
.wb-chapters .ch .tm{font-family:var(--mono);font-size:.7rem;color:var(--faint)}

/* ============================================================
   HOVER de recuadros — pasos/trio a amarillo o negro
   ============================================================ */
.step{transition:background .3s var(--ease)}
.step .k,.step h3,.step p{transition:color .3s var(--ease)}
.steps .step:hover{background:var(--yellow)}
.steps .step:hover .k{color:rgba(0,0,0,.55)}
.steps .step:hover h3{color:#111}
.steps .step:hover p{color:rgba(0,0,0,.74)}

.trio .c{transition:background .3s var(--ease)}
.trio .c .k,.trio .c h4,.trio .c p{transition:color .3s var(--ease)}
/* amarillo al pasar (unidad mínima de trabajo) */
.trio--y .c:hover{background:var(--yellow)}
.trio--y .c:hover .k{color:rgba(0,0,0,.55)}
.trio--y .c:hover h4{color:#111}
.trio--y .c:hover p{color:rgba(0,0,0,.74)}
/* negro al pasar (las seis herramientas) */
.trio--b .c:hover{background:#0b0b0b}
.trio--b .c:hover .k{color:rgba(244,243,239,.5)}
.trio--b .c:hover h4{color:#F4F3EF}
.trio--b .c:hover p{color:rgba(244,243,239,.74)}

/* Laboratorio · remate cuando se completan las capas */
.lab .lab-vis::after{content:"La emoción aparece";position:absolute;top:1.1rem;left:1.1rem;z-index:3;
  font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:#111;
  background:var(--yellow);padding:.42em .7em;opacity:0;transform:translateY(-6px);
  transition:opacity .5s var(--ease),transform .5s var(--ease);pointer-events:none}
.lab.complete .lab-vis::after{opacity:1;transform:none}

/* ============================================================
   RESEÑAS DE GOOGLE — carrusel horizontal (prueba social)
   ============================================================ */
.reviews{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;margin-top:1.4rem;
  padding-bottom:.8rem;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.reviews::-webkit-scrollbar{height:0}
.rev{flex:0 0 clamp(256px,78vw,330px);scroll-snap-align:start;border:1px solid var(--line);
  background:var(--card);padding:clamp(1.3rem,2.4vw,1.7rem);display:flex;flex-direction:column;gap:.7rem}
.rev-top{display:flex;align-items:center;gap:.7rem}
.rev-av{width:38px;height:38px;border-radius:50%;background:var(--yellow);color:#111;display:grid;place-items:center;
  font-family:var(--disp);font-weight:800;font-size:.95rem;flex:none}
.rev-id{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.rev-id .nm{font-weight:600;font-size:.92rem}
.rev-id .mt{font-family:var(--mono);font-size:.6rem;letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.rev-stars{color:#F5B400;letter-spacing:2px;font-size:.82rem;line-height:1}
.rev p{color:var(--muted);font-size:.9rem;line-height:1.55;margin:0}
.rev .g{margin-top:auto;padding-top:.4rem;font-family:var(--mono);font-size:.58rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--faint);display:flex;align-items:center;gap:.45rem}
.rev .g .goo{font-family:var(--disp);font-weight:800;font-size:.85rem;letter-spacing:0}
.rev .g .goo b:nth-child(1){color:#4285F4}.rev .g .goo b:nth-child(2){color:#EA4335}.rev .g .goo b:nth-child(3){color:#FBBC05}
.rev .g .goo b:nth-child(4){color:#4285F4}.rev .g .goo b:nth-child(5){color:#34A853}.rev .g .goo b:nth-child(6){color:#EA4335}
.rev-head{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1.2rem;margin-top:.5rem}
.rev-score{display:flex;align-items:center;gap:.6rem;font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.rev-score b{font-family:var(--disp);font-size:1.4rem;color:var(--fg);letter-spacing:-.01em}
.rev-arrows{display:flex;gap:.4rem;margin-left:auto}
.rev-nav{width:40px;height:40px;border:1px solid var(--line);background:var(--card);color:var(--fg);
  font-size:1.2rem;line-height:1;cursor:pointer;display:grid;place-items:center;transition:.2s;padding-bottom:2px}
.rev-nav:hover{background:var(--yellow);border-color:var(--yellow);color:#111}
.rev-nav:disabled{opacity:.3;cursor:default;background:var(--card);border-color:var(--line);color:var(--fg)}
@media(max-width:620px){.rev-arrows{width:100%;justify-content:flex-end}}

/* ============================================================
   CAMPUS PRIVADO — puerta de acceso (usuario + contraseña)
   ============================================================ */
.campus-gate{position:fixed;inset:0;z-index:200;background:var(--ivory);color:#141414;
  display:flex;align-items:center;justify-content:center;padding:1.5rem;
  background-image:radial-gradient(circle at 50% -10%,rgba(247,255,54,.35),transparent 55%)}
.campus-gate.hidden{display:none}
.cg-card{width:min(430px,100%);border:1px solid rgba(20,20,20,.14);background:#fff;
  padding:clamp(1.6rem,4vw,2.6rem);display:flex;flex-direction:column;gap:1rem;animation:dgin .5s var(--ease);box-shadow:0 20px 60px rgba(0,0,0,.1)}
.cg-card .cg-logo{height:26px;width:auto;object-fit:contain;align-self:flex-start}
.cg-eyebrow{font-family:var(--mono);font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(20,20,20,.55);box-shadow:inset 0 -0.55em 0 var(--yellow);align-self:flex-start}
.cg-card h2{font-family:var(--disp);font-weight:900;letter-spacing:-.02em;font-size:1.7rem;line-height:1.02}
.cg-card>p{color:rgba(20,20,20,.6);font-size:.92rem;margin-top:-.4rem}
.cg-field{display:flex;flex-direction:column;gap:.4rem}
.cg-field label{font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(20,20,20,.5)}
.cg-card input{font-family:var(--sans);font-size:1rem;padding:.85rem 1rem;background:var(--ivory);
  border:1px solid rgba(20,20,20,.2);color:#141414;border-radius:0;width:100%}
.cg-card input::placeholder{color:rgba(20,20,20,.4)}
.cg-card input:focus{outline:2px solid var(--yellow);outline-offset:1px;border-color:#141414;background:#fff}
.cg-btn{font-family:var(--mono);font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;
  background:var(--yellow);color:#111;border:0;padding:.95rem 1rem;cursor:pointer;font-weight:500;transition:.25s}
.cg-btn:hover{background:#0b0b0b;color:#F4F3EF;box-shadow:inset 0 0 0 1px var(--yellow)}
.cg-error{display:none;font-size:.85rem;color:#c0392b;border-left:2px solid #c0392b;padding-left:.7rem}
.cg-error.show{display:block;animation:dgin .3s var(--ease)}
.cg-hint{font-family:var(--mono);font-size:.62rem;letter-spacing:.04em;color:rgba(20,20,20,.55);
  border-top:1px solid rgba(20,20,20,.12);padding-top:.9rem;line-height:1.6}
.cg-hint b{color:#141414;font-weight:600;box-shadow:inset 0 -0.5em 0 var(--yellow)}
.cg-foot{font-family:var(--mono);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(20,20,20,.4)}

/* App bloqueada hasta autenticar */
body.campus-locked{overflow:hidden}
.campus-app{display:none}
.campus-app.authed{display:block}

/* Barra de cuenta dentro del campus */
.campus-acct{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;
  border:1px solid var(--line);background:var(--card);padding:.85rem 1.1rem;margin-bottom:1.6rem}
.campus-acct .who{display:flex;align-items:center;gap:.7rem;font-size:.92rem}
.campus-acct .av{width:34px;height:34px;border-radius:50%;background:#111;color:var(--yellow);
  display:grid;place-items:center;font-family:var(--disp);font-weight:800;font-size:.9rem}
.campus-acct .who b{font-weight:600}.campus-acct .who span{color:var(--faint);font-family:var(--mono);font-size:.64rem;letter-spacing:.08em;text-transform:uppercase}
.campus-acct .logout{font-family:var(--mono);font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;
  border:1px solid var(--line);background:transparent;color:var(--muted);padding:.55rem .9rem;cursor:pointer;transition:.25s}
.campus-acct .logout:hover{border-color:var(--fg);color:var(--fg)}

/* ============================================================
   BANDAS DE COLOR — romper el negro en Programa Profesional
   ============================================================ */
.fullband{width:100%;border-top:1px solid var(--line)}
.fullband>.wrap{width:var(--wrap);margin-inline:auto}

/* Banda amarilla */
.band-y{background:var(--yellow);color:#111}
.band-y .eyebrow{color:rgba(0,0,0,.5)}
.band-y .h-sec,.band-y h2{color:#111}
.band-y .muted{color:rgba(0,0,0,.66)}
.band-y .compare{background:rgba(0,0,0,.16);border-color:rgba(0,0,0,.16)}
.band-y .compare .col.them{background:var(--yellow);color:rgba(0,0,0,.62)}
.band-y .compare .col.them h4{color:rgba(0,0,0,.5)}
.band-y .compare .col.them li::before{color:rgba(0,0,0,.4)}
.band-y .compare .col.us{background:#0b0b0b;color:#F4F3EF}
.band-y .compare .col.us h4{color:#F4F3EF}
.band-y .compare .col.us h4 b{background:var(--yellow);color:#111}
.band-y .compare .col.us li::before{color:var(--yellow)}

/* Banda marfil */
.band-ivory{--bg:var(--ivory);--fg:#141414;--muted:rgba(20,20,20,.62);--faint:rgba(20,20,20,.42);
  --line:rgba(20,20,20,.14);--card:#fff;--acc:#141414;background:var(--ivory);color:#141414}

/* Banda clara SIN tocar tokens — fondo blanco pero tarjetas/módulos siguen en negro */
.band-light{background:var(--ivory)}
.band-light .ciclo:first-child{margin-top:.4rem}
.band-light .ciclo .ch h3{color:#141414}
.band-light .ciclo .ch .cn{color:rgba(20,20,20,.6)}
.band-ivory .eyebrow{color:rgba(20,20,20,.5)}
.band-ivory .h-sec,.band-ivory h2{color:#141414}
.band-ivory .muted{color:rgba(20,20,20,.64)}

/* Mapa de transformación · columna Después en amarillo sólido */
.compare .col.us.solid{background:var(--yellow);color:#111}
.compare .col.us.solid h4{color:#111}
.compare .col.us.solid h4 b{background:#0b0b0b;color:var(--yellow)}
.compare .col.us.solid li{color:#111}
.compare .col.us.solid li::before{color:#111}

/* ============================================================
   CON QUÉ SALES — materiales, todos destacados por igual
   ============================================================ */
.mats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:1.6rem}
.mat{background:var(--yellow);border:1px solid rgba(0,0,0,.12);padding:1.4rem 1.3rem;display:flex;
  flex-direction:column;gap:.5rem;min-height:196px;position:relative;overflow:hidden;
  transition:background .3s var(--ease),color .3s var(--ease),transform .3s var(--ease),box-shadow .3s var(--ease)}
.mat .mn{font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;color:rgba(0,0,0,.55);transition:color .3s var(--ease)}
.mat h3{font-family:var(--disp);font-weight:800;letter-spacing:-.01em;font-size:1.3rem;line-height:1.02;color:#111;transition:color .3s var(--ease)}
.mat p{font-size:.84rem;line-height:1.5;color:rgba(0,0,0,.7);margin-top:auto;transition:color .3s var(--ease)}
.mat::after{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:#111;transform:scaleY(0);transform-origin:top;transition:transform .35s var(--ease)}
.mat:hover{background:#0b0b0b;color:#F4F3EF;transform:translateY(-4px);box-shadow:0 16px 40px rgba(0,0,0,.28)}
.mat:hover::after{background:var(--yellow);transform:scaleY(1)}
.mat:hover .mn{color:var(--yellow)}
.mat:hover h3{color:#fff}
.mat:hover p{color:rgba(244,243,239,.72)}
@media(max-width:900px){.mats{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.mats{grid-template-columns:1fr}.mat{min-height:0}}

/* Transformaciones · cuadros claros con testimonio real */
.tgrid.tgrid--y{border:0!important;gap:14px}
.tgrid--y .tcard{background:#fff!important;border:1px solid rgba(20,20,20,.12);padding:clamp(1.4rem,3vw,2rem);display:flex;flex-direction:column;gap:.9rem}
.tgrid--y .tcard .quote{color:#111!important;font-family:var(--disp);font-weight:800;font-size:clamp(1.1rem,1rem + .8vw,1.45rem);line-height:1.12}
.tgrid--y .tcard .who{font-family:var(--mono);font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(20,20,20,.55);margin-top:auto}
.tgrid--y .tcard .stars{color:#111;letter-spacing:2px;font-size:.8rem}

/* ============================================================
   CONSENTIMIENTO DE COOKIES (RGPD + LSSI) — negro/blanco/amarillo
   ============================================================ */
.le-cc *{box-sizing:border-box}
.le-cc-banner{position:fixed;left:0;right:0;bottom:0;z-index:120;
  background:#0b0b0b;color:#F4F3EF;border-top:2px solid var(--yellow);
  display:flex;align-items:center;gap:1.4rem 2rem;flex-wrap:wrap;justify-content:space-between;
  padding:clamp(1rem,2.2vw,1.5rem) clamp(1.1rem,5vw,3rem);
  box-shadow:0 -14px 40px rgba(0,0,0,.45);animation:le-cc-up .45s cubic-bezier(.16,1,.3,1)}
@keyframes le-cc-up{from{transform:translateY(100%)}to{transform:none}}
.le-cc-banner__tx{flex:1 1 440px;min-width:0}
.le-cc-banner__tx strong{font-family:"Archivo",system-ui,sans-serif;font-weight:800;font-size:1rem;display:block;margin-bottom:.3rem}
.le-cc-banner__tx p{font-family:"Hanken Grotesk",system-ui,sans-serif;font-size:.86rem;line-height:1.5;color:rgba(244,243,239,.72);margin:0;max-width:70ch}
.le-cc-banner__tx a{color:var(--yellow);text-underline-offset:2px}
.le-cc-banner__btn{display:flex;gap:.6rem;flex-wrap:wrap;flex:0 0 auto}
.le-cc-b{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:.7rem;letter-spacing:.08em;
  text-transform:uppercase;padding:.8rem 1.15rem;border-radius:2px;cursor:pointer;border:1px solid;
  transition:background .25s,color .25s,border-color .25s;white-space:nowrap}
.le-cc-b--y{background:var(--yellow);color:#111;border-color:var(--yellow)}
.le-cc-b--y:hover{background:#0b0b0b;color:var(--yellow)}
.le-cc-b--ghost{background:transparent;color:#F4F3EF;border-color:rgba(244,243,239,.35)}
.le-cc-b--ghost:hover{border-color:var(--yellow);color:var(--yellow)}

/* Modal */
.le-cc-modal{position:fixed;inset:0;z-index:130;display:flex;align-items:center;justify-content:center;
  padding:1.2rem;background:rgba(0,0,0,.72);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
  animation:le-cc-fade .25s ease}
.le-cc-modal[hidden]{display:none}
@keyframes le-cc-fade{from{opacity:0}to{opacity:1}}
.le-cc-modal__card{width:min(560px,100%);max-height:90vh;overflow:auto;background:#0b0b0b;color:#F4F3EF;
  border:1px solid rgba(244,243,239,.16);border-top:3px solid var(--yellow);
  padding:clamp(1.4rem,3.5vw,2.2rem);animation:le-cc-pop .35s cubic-bezier(.16,1,.3,1)}
@keyframes le-cc-pop{from{transform:translateY(14px);opacity:0}to{transform:none;opacity:1}}
.le-cc-modal__head{position:relative;margin-bottom:.4rem}
.le-cc-eyebrow{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:.62rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--yellow)}
.le-cc-modal__head h3{font-family:"Archivo",system-ui,sans-serif;font-weight:900;letter-spacing:-.02em;
  font-size:1.6rem;line-height:1;margin-top:.3rem}
.le-cc-x{position:absolute;top:-.4rem;right:-.4rem;width:40px;height:40px;background:transparent;border:0;
  color:#F4F3EF;font-size:1.7rem;line-height:1;cursor:pointer;border-radius:50%;transition:.2s}
.le-cc-x:hover{background:rgba(244,243,239,.1);color:var(--yellow)}
.le-cc-intro{font-family:"Hanken Grotesk",system-ui,sans-serif;font-size:.88rem;line-height:1.5;
  color:rgba(244,243,239,.66);margin:.7rem 0 1.2rem}
.le-cc-cats{display:flex;flex-direction:column;gap:1px;background:rgba(244,243,239,.14);
  border:1px solid rgba(244,243,239,.14)}
.le-cc-cat{background:#111;padding:1.1rem 1.2rem;display:block;cursor:pointer}
.le-cc-cat.is-locked{cursor:default}
.le-cc-cat__top{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.le-cc-cat__name{font-family:"Archivo",system-ui,sans-serif;font-weight:800;font-size:1rem}
.le-cc-cat__desc{font-family:"Hanken Grotesk",system-ui,sans-serif;font-size:.82rem;line-height:1.45;
  color:rgba(244,243,239,.6);margin:.5rem 0 0}
/* Switch */
.le-cc-switch{position:relative;flex:none;width:46px;height:26px}
.le-cc-switch input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.le-cc-slider{position:absolute;inset:0;background:rgba(244,243,239,.2);border-radius:40px;transition:background .25s}
.le-cc-slider::before{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;
  background:#F4F3EF;transition:transform .25s}
.le-cc-switch input:checked + .le-cc-slider{background:var(--yellow)}
.le-cc-switch input:checked + .le-cc-slider::before{transform:translateX(20px);background:#111}
.le-cc-switch input:disabled + .le-cc-slider{background:var(--yellow);opacity:.5}
.le-cc-switch input:focus-visible + .le-cc-slider{outline:2px solid var(--yellow);outline-offset:2px}
.le-cc-modal__foot{display:flex;gap:.6rem;flex-wrap:wrap;justify-content:flex-end;margin-top:1.4rem}
body.le-cc-lock{overflow:hidden}

/* Enlace "Configurar cookies" en el footer */
.cookie-settings{background:none;border:0;padding:0;cursor:pointer;font:inherit;color:inherit}

@media(max-width:640px){
  .le-cc-banner{flex-direction:column;align-items:stretch;gap:1rem}
  .le-cc-banner__btn{justify-content:stretch}
  .le-cc-banner__btn .le-cc-b{flex:1 1 auto;text-align:center}
  .le-cc-modal__foot{justify-content:stretch}
  .le-cc-modal__foot .le-cc-b{flex:1 1 auto;text-align:center}
}

/* Casilla de privacidad en formularios */
.le-consent{display:flex;align-items:flex-start;gap:.6rem;font-family:"Hanken Grotesk",system-ui,sans-serif;
  font-size:.82rem;line-height:1.4;color:var(--muted);cursor:pointer;margin:.2rem 0}
.le-consent input{margin-top:.15rem;width:18px;height:18px;flex:none;accent-color:var(--yellow);cursor:pointer}
.le-consent a{color:var(--yellow);text-underline-offset:2px}
.le-consent.err{color:#ff6b5e}
.le-consent.err input{outline:2px solid #ff6b5e;outline-offset:2px}
.le-consent-note{font-family:"Hanken Grotesk",system-ui,sans-serif;font-size:.72rem;line-height:1.45;
  color:var(--faint);margin:-.2rem 0 .2rem;max-width:52ch}
.le-consent-note a{color:var(--yellow);text-underline-offset:2px}

/* ============================================================
   PARALLAX — franjas de imagen a todo el ancho
   (la imagen se desplaza más despacio que el scroll)
   ============================================================ */
.px-img{will-change:transform}
.hero__img.px-on{overflow:hidden}
.hero__img.px-on img{height:200%;position:relative;top:-50%}
.vfeature.px-on img{height:200%;position:absolute;left:0;top:-50%;width:100%}
.filmband.px-on:not(.filmband--rota) img{position:absolute;left:0;right:0;top:-50%;width:100%;height:200%;object-fit:cover}
@media(prefers-reduced-motion:reduce){
  .hero__img.px-on img,.vfeature.px-on img,.filmband.px-on img{top:0!important;height:100%!important;transform:none!important}
}