/* lab-sections.css — secciones bespoke aisladas por namespace. Generado. */

/* ==== dossier ==== */



.sec--dossier {
  --abismo:#04050b; --azure:#1e7fe0; --aqua:#8cecff; --ice:#eafbff; --gold:#F2B705;
  --mute:rgba(234,251,255,.68); --dim:rgba(234,251,255,.42);
  --glass:linear-gradient(135deg,rgba(255,255,255,.10),rgba(255,255,255,.03));
  --glass-solid:rgba(10,19,38,.55); --border:rgba(255,255,255,.14);
  --blur:blur(16px) saturate(150%); --shadow:0 24px 70px rgba(0,0,0,.5);
  scroll-margin-top:var(--header-h,69px);
}





.sec--dossier a {color:inherit;text-decoration:none}



.sec--dossier .tst {min-height:calc(100svh - var(--header-h,69px));display:flex;flex-direction:column;justify-content:center;gap:clamp(.9rem,1.7vw,1.3rem);padding:clamp(1.1rem,2.2vw,1.9rem) clamp(1.2rem,4vw,3rem)}
.sec--dossier .tst__head {text-align:center;max-width:60ch;margin:0 auto}
.sec--dossier .tst__cols {display:grid;grid-template-columns:minmax(200px,232px) minmax(0,clamp(840px,72vw,1090px));gap:clamp(1.1rem,2.4vw,2.2rem);justify-content:center;align-items:center;width:100%}



.sec--dossier .rail {display:flex;flex-direction:column;padding:clamp(1.8rem,3.4vw,3rem);border-right:1px solid rgba(255,255,255,.08)}

.sec--dossier .eyebrow {display:inline-flex;align-items:center;gap:.5rem;font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--aqua)}

.sec--dossier .eyebrow::before {content:"";width:8px;height:8px;border-radius:50%;background:var(--aqua);box-shadow:0 0 12px var(--aqua)}

.sec--dossier .tst__head h2 {margin:.4rem 0 .55rem;font-size:clamp(2.2rem,4.9vw,3.7rem);line-height:1.02;letter-spacing:-.02em;font-weight:800;color:#fff}

.sec--dossier .tst__head h2 em {font-style:italic;color:#fff;-webkit-text-fill-color:#fff}

.sec--dossier .rail__sub {color:#fff;font-size:clamp(1.02rem,1.5vw,1.32rem);margin-top:.25rem}

.sec--dossier .index {display:flex;flex-direction:column;justify-content:center;align-self:center;border-right:1px solid rgba(255,255,255,.08);padding-right:clamp(.6rem,1.2vw,1rem)}

.sec--dossier .index__label {font-size:10.5px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--dim);margin-bottom:.6rem}

.sec--dossier .case-row {display:grid;grid-template-columns:auto 1fr;gap:.05rem .8rem;align-items:baseline;width:100%;text-align:left;
  padding:.72rem .6rem;border:none;background:none;cursor:pointer;border-top:1px solid rgba(255,255,255,.07);border-radius:10px;
  transition:padding .3s cubic-bezier(.16,1,.3,1),background .3s}

.sec--dossier .case-row:last-child {border-bottom:1px solid rgba(255,255,255,.07)}

.sec--dossier .case-row__n {grid-row:span 2;font-family:ui-monospace,Menlo,monospace;font-size:.78rem;color:var(--dim);padding-top:.15rem}

.sec--dossier .case-row__company {font-weight:700;font-size:.95rem;color:var(--mute);transition:color .3s;line-height:1.2}

.sec--dossier .case-row__name {font-size:.78rem;color:var(--dim);margin-top:.1rem}

.sec--dossier .case-row:hover {background:rgba(255,255,255,.03)}

.sec--dossier .case-row:hover .case-row__company {color:var(--ice)}

.sec--dossier .case-row.is-active {background:var(--glass);box-shadow:inset 3px 0 0 var(--aqua)}

.sec--dossier .case-row.is-active .case-row__n {color:var(--aqua)}

.sec--dossier .case-row.is-active .case-row__company {color:#fff}



.sec--dossier .main {display:flex;flex-direction:column;justify-content:center;gap:clamp(.9rem,1.6vw,1.25rem);
  padding:clamp(.9rem,1.6vw,1.35rem) clamp(1rem,2.4vw,2rem);transition:opacity .3s ease,transform .3s ease}

.sec--dossier .main.is-swapping {opacity:0;transform:translateY(10px)}

.sec--dossier .say__company {font-size:clamp(1.05rem,1.9vw,1.5rem);font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--aqua)}

.sec--dossier .say__name {margin-top:.3rem;font-size:clamp(1.5rem,2.6vw,2.1rem);font-weight:800;line-height:1.04;letter-spacing:-.02em;color:#fff}



.sec--dossier .scene {display:grid;grid-template-columns:auto 1fr;gap:clamp(1.2rem,2.6vw,2.2rem);align-items:start}

.sec--dossier .phone {position:relative;width:clamp(210px,20vw,300px);aspect-ratio:9/16;border-radius:24px;overflow:hidden;flex:none;
  border:1px solid var(--border);background:#04070f;box-shadow:0 26px 60px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.18)}

.sec--dossier .phone__v {width:100%;height:100%;object-fit:cover;display:block}

.sec--dossier .phone__badge {position:absolute;top:.55rem;left:.55rem;z-index:2;font-size:.62rem;font-weight:800;letter-spacing:.04em;padding:.2rem .55rem;border-radius:999px;
  background:rgba(4,7,15,.7);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:var(--aqua);border:1px solid rgba(140,236,255,.3)}

.sec--dossier .phone__play {position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;width:52px;height:52px;border-radius:50%;border:none;
  background:var(--gold);color:#1a1400;display:grid;place-items:center;cursor:pointer;box-shadow:0 8px 24px rgba(242,183,5,.45);transition:transform .2s}

.sec--dossier .phone__play:hover {transform:translate(-50%,-50%) scale(1.08)}

.sec--dossier .phone__play svg {width:22px;height:22px;margin-left:3px}

.sec--dossier .phone.is-playing .phone__play, .sec--dossier .phone.is-playing .phone__badge {opacity:0;pointer-events:none;transition:opacity .25s}

.sec--dossier .phone--wait {display:grid;place-items:center;background:linear-gradient(160deg,#0b1a3a,#04070f);border:1.5px dashed rgba(140,236,255,.28)}

.sec--dossier .phone--wait div {text-align:center;color:var(--mute);font-size:.72rem;font-weight:600;display:grid;gap:.5rem;justify-items:center;padding:.5rem}

.sec--dossier .phone--wait svg {width:26px;height:26px;color:var(--aqua)}


.sec--dossier .site-pane {align-self:start;border-radius:14px;overflow:hidden;border:1px solid var(--border);background:#04070f;
  box-shadow:var(--shadow),inset 0 1px 0 rgba(255,255,255,.12)}

.sec--dossier .site-pane__chrome {display:flex;align-items:center;gap:.4rem;padding:.5rem .65rem;background:rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.08)}

.sec--dossier .site-pane__chrome i {width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.22)}

.sec--dossier .site-pane__chrome em {margin-left:.5rem;font-style:normal;font-size:.7rem;color:var(--mute);font-family:ui-monospace,Menlo,monospace}

.sec--dossier .site-pane__shot {width:100%;height:auto;display:block}



.sec--dossier .quote {position:relative;padding-left:2rem;max-width:70ch}

.sec--dossier .quote__mark {position:absolute;left:-.1rem;top:-1.2rem;font-family:Georgia,serif;font-size:4rem;line-height:1;color:var(--aqua);opacity:.5}

.sec--dossier .quote p {font-size:clamp(1rem,1.25vw,1.12rem);line-height:1.6;color:var(--mute)}

.sec--dossier .foot {display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap}

.sec--dossier .chip {display:inline-flex;align-items:center;gap:.4rem;padding:.38rem .75rem;border-radius:999px;font-family:ui-monospace,Menlo,monospace;
  font-size:.72rem;color:var(--mute);background:rgba(255,255,255,.05);border:1px solid var(--border)}

.sec--dossier .chip b {color:var(--aqua)}

.sec--dossier .link {display:inline-flex;align-items:center;gap:.4rem;font-weight:800;color:#fff;border-bottom:1px solid rgba(255,255,255,.3);padding-bottom:2px;transition:color .2s,border-color .2s}

.sec--dossier .link:hover {color:var(--aqua);border-color:var(--aqua)}

/* Visor: cita + web desktop apiladas (doble ancho) a la izq; el video estirado a la misma altura a la der. Todo acotado y centrado. */
.sec--dossier .scene {display:flex;flex-wrap:wrap;justify-content:center;align-items:stretch;gap:clamp(1rem,2.2vw,1.7rem);max-width:clamp(840px,70vw,1020px);margin-inline:auto;margin-top:clamp(.6rem,1.8vw,1.3rem)}
.sec--dossier .scene__stack {display:flex;flex-direction:column;gap:clamp(.7rem,1.5vw,1.1rem);flex:1 1 320px;min-width:280px;max-width:clamp(472px,40vw,640px)}
.sec--dossier .scene > .phone {aspect-ratio:auto;align-self:stretch;width:clamp(196px,21vw,350px);flex:none}
/* el video se saca del flujo: si no, el alto intrinseco del poster (478x850) manda sobre
   la columna cuando la cita es corta y deja aire muerto debajo de la captura del sitio */
.sec--dossier .scene > .phone .phone__v {position:absolute;inset:0}
.sec--dossier .qcard {background:linear-gradient(165deg,#0b1a3a,#04070f);border:1px solid rgba(140,236,255,.14);border-radius:18px;padding:clamp(1rem,1.9vw,1.5rem);display:flex;flex-direction:column;gap:.45rem;text-align:left}
.sec--dossier .qcard .quote__mark {font-family:Georgia,serif;font-size:2.6rem;line-height:.4;color:var(--aqua);opacity:.5}
.sec--dossier .qcard__text {font-size:clamp(.82rem,1.02vw,1.05rem);line-height:1.55;color:var(--ice-mute);margin:0}
.sec--dossier .webcard {display:block;border-radius:14px;overflow:hidden;border:1px solid rgba(255,255,255,.12);background:#04070f;flex:none;text-decoration:none;color:inherit;cursor:pointer;transition:border-color .2s,transform .2s,box-shadow .2s}
.sec--dossier .webcard:hover {border-color:rgba(140,236,255,.5);transform:translateY(-2px);box-shadow:0 12px 34px rgba(0,0,0,.4)}
.sec--dossier .webcard:hover .webcard__go {color:var(--aqua)}
.sec--dossier .webcard__bar {display:flex;align-items:center;gap:.4rem;padding:.45rem .6rem;background:rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.08)}
.sec--dossier .webcard__bar i {width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.22);flex:none}
.sec--dossier .webcard__bar em {margin-left:.5rem;font-style:normal;font-size:.7rem;color:var(--mute);font-family:ui-monospace,Menlo,monospace}
.sec--dossier .webcard__go {margin-left:auto;font-size:.68rem;font-weight:800;letter-spacing:.02em;color:var(--dim);white-space:nowrap;transition:color .2s}
.sec--dossier .webcard__shot {width:100%;aspect-ratio:16/9;object-fit:cover;object-position:top center;display:block}
.sec--dossier .qcard__visit {display:none;margin-top:.8rem;font-size:.8rem;font-weight:800;letter-spacing:.02em;color:var(--aqua)}

.sec--dossier .tst__dots, .sec--dossier .tst__dots-note {display:none}

@media (max-width:900px){
  .sec--dossier .scene{max-width:440px;align-items:center}
  .sec--dossier .scene__stack{max-width:none;flex-basis:auto;width:100%}
  .sec--dossier .scene > .phone{align-self:center;width:min(70vw,240px);aspect-ratio:9/16}

  /* orden mobile: empresa/nombre, cita con link al sitio, video. La captura no va. */
  .sec--dossier .webcard {display:none}
  .sec--dossier .qcard__visit {display:inline-block}

  /* el expediente se reemplaza por puntitos de colores bajo el video */
  .sec--dossier .index {display:none}
  .sec--dossier .tst__dots {position:relative;z-index:1;display:flex;justify-content:center;gap:1rem;margin:1.3rem 0 0}
  .sec--dossier .tst-dot {width:15px;height:15px;border-radius:50%;border:none;padding:0;cursor:pointer;
    background:var(--c);opacity:.45;box-shadow:0 0 10px var(--c);transition:opacity .25s,transform .25s}
  .sec--dossier .tst-dot.is-on {opacity:1;transform:scale(1.3);box-shadow:0 0 16px var(--c)}
  .sec--dossier .tst__dots-note {position:relative;z-index:1;display:block;margin:.7rem 0 0;text-align:center;font-size:.78rem;color:var(--dim)}
}



@media (max-width:900px) {

  .sec--dossier .tst {min-height:auto}
  .sec--dossier .tst__cols {grid-template-columns:1fr;gap:1.2rem}

  .sec--dossier .rail {border-right:none;border-bottom:1px solid rgba(255,255,255,.08)}

  .sec--dossier .index {border-right:none;padding-right:0;flex-direction:row;gap:.5rem;overflow-x:auto;-webkit-overflow-scrolling:touch}

  .sec--dossier .index__label {display:none}

  .sec--dossier .case-row {flex:0 0 auto;border:1px solid rgba(255,255,255,.12) !important;border-radius:999px;padding:.5rem .85rem;box-shadow:none;grid-template-columns:auto auto}

  .sec--dossier .case-row.is-active {box-shadow:none;border-color:var(--aqua) !important;background:var(--glass)}

  .sec--dossier .case-row__name {display:none}

  .sec--dossier .case-row__n {grid-row:auto}

  .sec--dossier .main {padding:1.4rem 1rem 1.6rem;gap:1.2rem}

  .sec--dossier .scene {grid-template-columns:1fr;justify-items:center;gap:1.4rem}

  .sec--dossier .phone {width:min(58vw,220px)}

  .sec--dossier .site-pane {width:100%}

  .sec--dossier .site-pane__shot {max-height:none}

  .sec--dossier .quote {padding-left:1.6rem}

}


/* ==== camino ==== */



.sec--camino {
  --abismo:#04050b; --azure:#1e7fe0; --aqua:#8cecff; --ice:#eafbff; --gold:#F2B705;
  --mute:rgba(234,251,255,.68); --dim:rgba(234,251,255,.42);
  --glass:linear-gradient(150deg,rgba(255,255,255,.10),rgba(255,255,255,.02));
  --border:rgba(255,255,255,.14); --blur:blur(16px) saturate(150%);
}



.sec--camino a {color:inherit;text-decoration:none}



.sec--camino .lab {position:relative;overflow:hidden;padding:clamp(3rem,7vw,6rem) 0 clamp(3.5rem,8vw,7rem);
  background:radial-gradient(120% 80% at 50% 0%, #071227 0%, #05070f 55%, #04050b 100%)}

.sec--camino .lab__grid {position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.55;
  background-image:
    repeating-linear-gradient(0deg, rgba(140,236,255,.06) 0 1px, transparent 1px 46px),
    repeating-linear-gradient(90deg, rgba(140,236,255,.06) 0 1px, transparent 1px 46px);
  -webkit-mask-image:radial-gradient(120% 90% at 50% 32%, #000 34%, transparent 82%);
  mask-image:radial-gradient(120% 90% at 50% 32%, #000 34%, transparent 82%)}

.sec--camino .lab__glow {position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(46% 40% at 50% 30%, rgba(30,127,224,.18), transparent 62%)}

/* costura suave: el borde superior e inferior funden al abismo para que no se
   vea una linea dura contra las secciones vecinas (queda como degradado). */
.sec--camino .lab::after {content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:linear-gradient(180deg,#04050b 0%,rgba(4,5,11,0) 16%,rgba(4,5,11,0) 84%,#04050b 100%)}

.sec--camino .wrap {position:relative;z-index:1;max-width:1120px;margin:0 auto;padding:0 clamp(1.2rem,4vw,2.4rem)}



.sec--camino .head {text-align:center;max-width:640px;margin:0 auto clamp(1rem,3vw,2rem)}

.sec--camino .kicker {display:inline-flex;align-items:center;gap:.5rem;font-family:ui-monospace,Menlo,monospace;font-size:12px;font-weight:700;
  letter-spacing:.18em;text-transform:uppercase;color:var(--aqua)}

.sec--camino .kicker::before {content:"";width:8px;height:8px;border-radius:50%;background:var(--aqua);box-shadow:0 0 12px var(--aqua)}

.sec--camino .head h2 {margin:.9rem 0 0;font-size:clamp(2rem,4.6vw,3.1rem);line-height:1.03;letter-spacing:-.03em;font-weight:800}

.sec--camino .head p {margin:.8rem auto 0;color:var(--mute);font-size:1.06rem;max-width:52ch}



.sec--camino .stage {position:relative;aspect-ratio:1000/560;margin-top:clamp(.5rem,2vw,1.5rem)}

.sec--camino .circuit {position:absolute;inset:0;width:100%;height:100%;overflow:visible;z-index:1}

.sec--camino .tube {fill:none;stroke-linecap:round}

.sec--camino .tube--glow {stroke:rgba(140,236,255,.22);stroke-width:14;filter:blur(7px)}

.sec--camino .tube--wall {stroke:rgba(255,255,255,.10);stroke-width:7}

.sec--camino .tube--flow {stroke:url(#flowgrad);stroke-width:3.2;stroke-dasharray:16 13;animation:camino_flow 1.3s linear infinite;
  filter:drop-shadow(0 0 5px rgba(140,236,255,.8))}

.sec--camino .path--a.is-live .tube--flow, .sec--camino .path--b.is-live .tube--flow {animation-duration:.55s;stroke-width:4.2}

.sec--camino .path--a.is-live .tube--glow, .sec--camino .path--b.is-live .tube--glow {stroke:rgba(140,236,255,.4)}

@keyframes camino_flow {to{stroke-dashoffset:-29}}

.sec--camino .bubble {fill:var(--aqua);filter:drop-shadow(0 0 4px var(--aqua))}

.sec--camino .node__ring {fill:none;stroke:var(--aqua);stroke-width:2;opacity:.5;transform-origin:center;animation:camino_pulse 2.6s ease-out infinite}

@keyframes camino_pulse {0%{r:10;opacity:.6}100%{r:30;opacity:0}}

.sec--camino .node__core {fill:url(#nodegrad);stroke:rgba(140,236,255,.6);stroke-width:1.5}

.sec--camino .port {fill:#04070f;stroke:var(--aqua);stroke-width:2}



.sec--camino .card {position:absolute;top:53.5%;width:min(31%,320px);transform:translate(-50%,0);
  background:var(--glass);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);
  border:1px solid var(--border);border-radius:18px;padding:1.5rem 1.4rem 1.6rem;z-index:2;overflow:hidden;
  box-shadow:0 24px 60px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.16);
  transition:transform .35s cubic-bezier(.16,1,.3,1),border-color .35s,box-shadow .35s}

/* reveal de puntos al hover (port vanilla del CanvasRevealEffect) */
.sec--camino .card > * {position:relative;z-index:1}
.sec--camino .card .card__fx {position:absolute;inset:0;z-index:0;opacity:0;transition:opacity .45s ease;pointer-events:none;
  -webkit-mask-image:radial-gradient(130% 130% at 50% 45%, rgba(0,0,0,.3), #000 78%);
  mask-image:radial-gradient(130% 130% at 50% 45%, rgba(0,0,0,.3), #000 78%)}
.sec--camino .card.is-fx .card__fx {opacity:.75}

.sec--camino .card--a {left:25%}

.sec--camino .card--b {left:75%}

.sec--camino .card:hover {transform:translate(-50%,-8px);border-color:rgba(140,236,255,.5);box-shadow:0 34px 70px rgba(0,0,0,.55),0 0 0 1px rgba(140,236,255,.25)}


.sec--camino .card__t {margin:.5rem 0 .5rem;font-size:1.3rem;font-weight:800;letter-spacing:-.01em;color:#fff;display:flex;align-items:center;gap:.4rem}

.sec--camino .card__t .arrow {color:var(--aqua);transition:transform .3s}

.sec--camino .card:hover .card__t .arrow {transform:translateX(5px)}

.sec--camino .card__d {margin:0;font-size:.95rem;line-height:1.55;color:var(--mute)}


@media (max-width:820px) {

  /* los dos caminos en paralelo, uno al lado del otro */
  .sec--camino .stage {aspect-ratio:auto;min-height:0;display:flex;flex-direction:row;align-items:stretch;gap:.7rem;margin-top:1.5rem}

  .sec--camino .circuit {display:none}

  .sec--camino .card {position:static;transform:none;flex:1 1 0;min-width:0;width:auto;max-width:none;padding:1rem .85rem}

  .sec--camino .card--a, .sec--camino .card--b {left:auto}

  .sec--camino .card:hover {transform:translateY(-4px)}

  .sec--camino .card__t {font-size:1.02rem}

  .sec--camino .card__d {font-size:.8rem;line-height:1.5}

  .sec--camino .mlink {display:none}

}

.sec--camino .desktop-only-flow {}


/* ==== precio ==== */


.sec--precio {--abismo:#04050b;--azure:#1e7fe0;--aqua:#8cecff;--ice:#eafbff;--gold:#F2B705;
  --mute:rgba(234,251,255,.68);--dim:rgba(234,251,255,.42);
  --glass:linear-gradient(150deg,rgba(255,255,255,.09),rgba(255,255,255,.02));--border:rgba(255,255,255,.14);--blur:blur(14px) saturate(150%)}



.sec--precio .op {position:relative;overflow:hidden;padding:clamp(3rem,7vw,6rem) 0}


.sec--precio .op__glow {position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(46% 40% at 50% 18%, rgba(30,127,224,.16), transparent 60%)}

.sec--precio .wrap {position:relative;z-index:1;max-width:1000px;margin:0 auto;padding:0 clamp(1.2rem,4vw,2.4rem)}


.sec--precio .head {text-align:center;max-width:640px;margin:0 auto clamp(1.6rem,3vw,2.4rem)}

.sec--precio .kicker {display:inline-flex;align-items:center;gap:.5rem;font-family:ui-monospace,Menlo,monospace;font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--aqua)}

.sec--precio .kicker::before {content:"";width:8px;height:8px;border-radius:50%;background:var(--aqua);box-shadow:0 0 12px var(--aqua)}

.sec--precio .head h2 {margin:.9rem 0 .3rem;font-size:clamp(1.35rem,2.5vw,1.75rem);font-weight:800;color:var(--mute);letter-spacing:.03em;text-transform:uppercase}

.sec--precio .claim {font-size:clamp(1.9rem,4.2vw,2.9rem);line-height:1.04;letter-spacing:-.03em;font-weight:800;
  background:linear-gradient(100deg,#fff 55%,var(--aqua));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}

.sec--precio .head p {margin:1rem auto 0;color:var(--mute);font-size:1.05rem;max-width:52ch;line-height:1.55}



.sec--precio .slab {background:var(--glass);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);border:1px solid var(--border);border-radius:22px;
  padding:clamp(1.5rem,3vw,2.2rem);box-shadow:0 24px 60px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.16)}

.sec--precio .slab__bar {display:flex;align-items:center;gap:1rem;padding-bottom:1.3rem;border-bottom:1px solid rgba(255,255,255,.1)}

.sec--precio .slab__status {font-family:ui-monospace,Menlo,monospace;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--aqua);white-space:nowrap}

.sec--precio .gauge {flex:1;height:8px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden;position:relative}

.sec--precio .gauge__fill {position:absolute;left:0;top:0;bottom:0;width:100%;border-radius:999px;background:linear-gradient(90deg,var(--azure),var(--aqua));box-shadow:0 0 14px rgba(140,236,255,.6);transition:width 1.6s cubic-bezier(.22,.61,.36,1)}
.sec--precio .slab.is-prep .gauge__fill {width:0}
.sec--precio .slab.is-prep.is-live .gauge__fill {width:100%}
.sec--precio .slab.is-prep .pt {opacity:0;transform:translateY(16px);transition:opacity .55s ease,transform .55s ease}
.sec--precio .slab.is-prep.is-live .pt {opacity:1;transform:none}
.sec--precio .slab.is-prep.is-live .slab__pts .pt:nth-child(1){transition-delay:1s}
.sec--precio .slab.is-prep.is-live .slab__pts .pt:nth-child(2){transition-delay:1.18s}
.sec--precio .slab.is-prep.is-live .slab__pts .pt:nth-child(3){transition-delay:1.36s}
@media (prefers-reduced-motion:reduce){
  .sec--precio .slab.is-prep .gauge__fill{width:100%;transition:none}
  .sec--precio .slab.is-prep .pt{opacity:1;transform:none;transition:none}
}

.sec--precio .gauge__fill::after {content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent);
  transform:translateX(-100%);animation:precio_sheen 2.6s ease-in-out infinite}

@keyframes precio_sheen {60%,100%{transform:translateX(100%)}}

.sec--precio .slab__pts {display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2.5vw,1.8rem);padding-top:1.5rem}

.sec--precio .pt__ic {width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:rgba(140,236,255,.1);border:1px solid rgba(140,236,255,.25);color:var(--aqua);margin-bottom:.7rem}

.sec--precio .pt__ic svg {width:20px;height:20px}

.sec--precio .pt b {display:block;font-size:1.02rem;color:#fff;margin-bottom:.2rem}

.sec--precio .pt span {font-size:.9rem;line-height:1.45;color:var(--mute)}

.sec--precio .migra {margin-top:1.6rem;text-align:center;color:var(--mute);font-size:1rem}

.sec--precio .migra strong {color:var(--aqua)}

@media (max-width:720px) {
.sec--precio .slab__pts {grid-template-columns:1fr;gap:1.2rem}
.sec--precio .slab__bar {flex-wrap:wrap}
}

/* En mobile la seccion de hosting no va (pedido del fundador; el pago
   unico ya se cuenta en los planes y en el cierre). El selector largo
   es para ganarle al main.home > section de theme-glass. */
@media (max-width:820px) {
main.home > section.sec--precio {display:none}
}


/* ==== fundador ==== */


.sec--fundador {--abismo:#04050b;--azure:#1e7fe0;--aqua:#8cecff;--ice:#eafbff;--gold:#F2B705;--gold-2:#D9A404;
  --mute:rgba(234,251,255,.72);--dim:rgba(234,251,255,.44);--border:rgba(255,255,255,.14);--blur:blur(14px) saturate(150%)}



.sec--fundador a {color:inherit;text-decoration:none}

.sec--fundador .fd {position:relative;overflow:hidden;padding:clamp(3.5rem,8vw,7rem) 0}


.sec--fundador .fd__glow {position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(40% 46% at 30% 46%, rgba(30,127,224,.20), transparent 60%)}

.sec--fundador .fd__rings {position:absolute;left:30%;top:46%;transform:translate(-50%,-50%);width:640px;height:640px;z-index:0;pointer-events:none;opacity:.35;
  background:radial-gradient(circle, transparent 39%, rgba(140,236,255,.14) 40%, transparent 41%),
             radial-gradient(circle, transparent 55%, rgba(140,236,255,.09) 56%, transparent 57%),
             radial-gradient(circle, transparent 71%, rgba(140,236,255,.06) 72%, transparent 73%)}

.sec--fundador .wrap {position:relative;z-index:1;max-width:1080px;margin:0 auto;padding:0 clamp(1.2rem,4vw,2.4rem)}

.sec--fundador .grid {display:grid;grid-template-columns:.85fr 1fr;gap:clamp(2rem,5vw,4rem);align-items:center}



.sec--fundador .badge {position:relative;border-radius:24px;padding:.9rem;background:var(--glass, linear-gradient(150deg,rgba(255,255,255,.09),rgba(255,255,255,.02)));
  -webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);border:1px solid var(--border);
  box-shadow:0 30px 70px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.18)}

.sec--fundador .badge::before {content:"";position:absolute;inset:0;border-radius:24px;pointer-events:none;
  background:linear-gradient(130deg, rgba(140,236,255,.16), transparent 40%, transparent 70%, rgba(30,127,224,.12))}

.sec--fundador .badge__top {display:flex;align-items:center;justify-content:space-between;padding:.35rem .55rem .7rem}

.sec--fundador .badge__chip {font-family:ui-monospace,Menlo,monospace;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--aqua)}

.sec--fundador .badge__dot {display:inline-flex;align-items:center;gap:.4rem;font-family:ui-monospace,Menlo,monospace;font-size:11px;color:var(--dim)}

.sec--fundador .badge__dot::before {content:"";width:7px;height:7px;border-radius:50%;background:var(--aqua);box-shadow:0 0 10px var(--aqua)}

.sec--fundador .badge__scr {position:relative;aspect-ratio:4/5;border-radius:16px;overflow:hidden;background:linear-gradient(160deg,#0b1a3a,#04070f);
  border:1px solid rgba(255,255,255,.1);display:grid;place-items:center}

.sec--fundador .badge__play {width:64px;height:64px;border-radius:50%;border:none;background:var(--gold);color:#1a1400;display:grid;place-items:center;cursor:pointer;
  box-shadow:0 10px 28px rgba(242,183,5,.45)}

.sec--fundador .badge__play svg {width:26px;height:26px;margin-left:3px}

.sec--fundador .badge__tag {position:absolute;left:.7rem;bottom:.7rem;font-size:.7rem;font-weight:700;padding:.25rem .6rem;border-radius:999px;
  background:rgba(4,7,15,.7);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:var(--aqua);border:1px solid rgba(140,236,255,.3)}


.sec--fundador .txt .kicker {display:inline-flex;align-items:center;gap:.5rem;font-family:ui-monospace,Menlo,monospace;font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--aqua)}

.sec--fundador .txt .kicker::before {content:"";width:8px;height:8px;border-radius:50%;background:var(--aqua);box-shadow:0 0 12px var(--aqua)}

.sec--fundador .txt h2 {margin:1rem 0 0;font-size:clamp(1.9rem,3.6vw,2.7rem);line-height:1.05;letter-spacing:-.02em;font-weight:800}

.sec--fundador .txt h2 em {font-style:normal;background:linear-gradient(100deg,#fff,var(--aqua));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}

.sec--fundador .txt p {margin:1.1rem 0 0;color:var(--mute);font-size:1.1rem;line-height:1.6;max-width:46ch}

.sec--fundador .cta {display:inline-flex;align-items:center;gap:.5rem;margin-top:1.8rem;font-weight:800;font-size:1rem;padding:1rem 1.7rem;border-radius:999px;
  background:var(--gold);color:#1a1400;box-shadow:0 12px 34px rgba(242,183,5,.32);transition:transform .2s,background .2s}

.sec--fundador .cta:hover {background:var(--gold-2);transform:translateY(-2px)}

@media (max-width:820px) {
.sec--fundador .grid {grid-template-columns:1fr;gap:2.2rem}
.sec--fundador .badge {max-width:360px;margin:0 auto}
.sec--fundador .fd__rings {left:50%;top:34%}
}


/* ==== hex ==== */


.sec--hex {
  --abismo:#04050b; --azure:#1e7fe0; --aqua:#8cecff; --ice:#eafbff; --gold:#F2B705;
  --mute:rgba(234,251,255,.68); --dim:rgba(234,251,255,.42);
  --glass:linear-gradient(150deg,rgba(255,255,255,.09),rgba(255,255,255,.02));
  --border:rgba(255,255,255,.14); --blur:blur(14px) saturate(150%);
}



.sec--hex a {color:var(--aqua);text-decoration:none}


.sec--hex .hex {position:relative;overflow:hidden;padding:clamp(3rem,7vw,6rem) 0}


.sec--hex .hex__bg {position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.10;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='90' height='156' viewBox='0 0 56 96'><path d='M28 0 L56 16 L56 48 L28 64 L0 48 L0 16 Z M28 64 L56 80 L56 96 M28 64 L0 80 L0 96' fill='none' stroke='%235f7fb0' stroke-width='1'/></svg>");
  background-size:90px 156px;
  -webkit-mask-image:radial-gradient(56% 52% at 30% 52%, #000 0%, transparent 66%);
  mask-image:radial-gradient(56% 52% at 30% 52%, #000 0%, transparent 66%)}

.sec--hex .hex__glow {position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(42% 38% at 30% 46%, rgba(30,127,224,.12), transparent 64%)}

.sec--hex .wrap {position:relative;z-index:1;max-width:1120px;margin:0 auto;padding:0 clamp(1.2rem,4vw,2.4rem)}


.sec--hex .head {margin-bottom:clamp(1.4rem,3vw,2.2rem);max-width:640px}

.sec--hex .kicker {display:inline-flex;align-items:center;gap:.5rem;font-family:ui-monospace,Menlo,monospace;font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--aqua)}

.sec--hex .kicker::before {content:"";width:8px;height:8px;border-radius:50%;background:var(--aqua);box-shadow:0 0 12px var(--aqua)}

.sec--hex .head h2 {margin:.9rem 0 0;font-size:clamp(1.9rem,4.4vw,2.9rem);line-height:1.03;letter-spacing:-.03em;font-weight:800}


.sec--hex .grid {display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(1.5rem,3vw,2.6rem);align-items:center}



.sec--hex .honey {position:relative;width:100%;max-width:560px;margin:0 auto;aspect-ratio:600/620}

.sec--hex .honey svg {position:absolute;inset:0;width:100%;height:100%;overflow:visible}

.sec--hex .bond {stroke:url(#bondgrad);stroke-width:1.1;opacity:.35;transition:opacity .3s}

.sec--hex .bond.is-hint {opacity:.85}

.sec--hex .bond.is-active {opacity:1;stroke:var(--aqua);stroke-width:1.6}

.sec--hex .cell {fill:url(#cellfill);stroke:rgba(140,236,255,.28);stroke-width:1.4;cursor:pointer;
  transform-box:fill-box;transform-origin:center;
  transition:stroke .3s,stroke-width .3s,fill .3s,filter .3s,transform .35s cubic-bezier(.34,1.56,.64,1)}

.sec--hex .cell:hover,
.sec--hex .cell.is-hint {stroke:rgba(140,236,255,.85);transform:scale(1.05)}

/* la celda elegida respira: el contorno se ilumina en loop */
.sec--hex .cell.is-active {stroke:var(--aqua);stroke-width:2.2;fill:rgba(140,236,255,.13);transform:scale(1.07);
  animation:hexpulse 2.2s ease-in-out infinite}

@keyframes hexpulse {
  0%,100% {filter:drop-shadow(0 0 5px rgba(140,236,255,.3));stroke:rgba(140,236,255,.8)}
  50% {filter:drop-shadow(0 0 18px rgba(140,236,255,.9));stroke:#8cecff}
}

@media (prefers-reduced-motion:reduce){
  .sec--hex .cell.is-active {animation:none;filter:drop-shadow(0 0 12px rgba(140,236,255,.45))}
}

.sec--hex .labels {position:absolute;inset:0}

.sec--hex .hlabel {position:absolute;transform:translate(-50%,-50%);width:26%;display:flex;flex-direction:column;align-items:center;
  background:none;border:none;cursor:pointer;text-align:center;padding:0}

.sec--hex .hlabel__q {font-size:clamp(.78rem,1.4vw,.95rem);font-weight:800;line-height:1.2;color:var(--mute);transition:color .3s}

.sec--hex .hlabel:hover .hlabel__q {color:var(--ice)}

.sec--hex .hlabel.is-active .hlabel__q {color:#fff}



.sec--hex .panel {position:relative;background:var(--glass);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);
  border:1px solid var(--border);border-radius:20px;padding:clamp(1.6rem,3vw,2.4rem);
  box-shadow:0 24px 60px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.16);min-height:280px;
  transition:opacity .3s ease,transform .3s ease}

.sec--hex .panel__body {transition:opacity .28s ease,transform .28s ease}

.sec--hex .panel__body.is-out-l {opacity:0;transform:translateX(-14px)}

.sec--hex .panel__body.is-out-r {opacity:0;transform:translateX(14px)}

.sec--hex .panel__nav {display:flex;align-items:center;gap:.9rem;margin-top:1.5rem;padding-top:1.2rem;border-top:1px solid rgba(255,255,255,.08)}

.sec--hex .pn-btn {display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;flex:none;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);color:var(--ice);cursor:pointer;
  transition:background .25s,border-color .25s,transform .25s}

.sec--hex .pn-btn:hover {background:rgba(140,236,255,.12);border-color:rgba(140,236,255,.5);transform:scale(1.06)}

.sec--hex .pn-btn svg {width:16px;height:16px}

.sec--hex .pn-dots {display:flex;gap:.45rem;margin:0 auto}

.sec--hex .pn-dot {width:8px;height:8px;border-radius:50%;border:none;padding:0;background:rgba(255,255,255,.18);cursor:pointer;
  transition:background .25s,transform .25s,box-shadow .25s}

.sec--hex .pn-dot:hover {background:rgba(140,236,255,.6)}

.sec--hex .pn-dot.is-active {background:var(--aqua);transform:scale(1.25);box-shadow:0 0 8px rgba(140,236,255,.6)}

.sec--hex .panel__q {margin:0 0 .9rem;font-size:clamp(1.2rem,2vw,1.5rem);font-weight:800;line-height:1.14;letter-spacing:-.01em;color:#fff}

.sec--hex .panel__a {color:var(--mute);font-size:1.02rem;line-height:1.62}

.sec--hex .panel__a a {border-bottom:1px solid rgba(140,236,255,.4)}


@media (max-width:860px) {

  .sec--hex .grid {grid-template-columns:1fr;gap:2rem}

  .sec--hex .honey {max-width:420px}

  .sec--hex .hlabel__q {font-size:.72rem}

}


/* ==== cierre ==== */


.sec--cierre {--abismo:#04050b;--azure:#1e7fe0;--aqua:#8cecff;--ice:#eafbff;--gold:#F2B705;--gold-2:#D9A404;
  --mute:rgba(234,251,255,.72);--dim:rgba(234,251,255,.44);--border:rgba(255,255,255,.16)}



.sec--cierre a {color:inherit;text-decoration:none}

.sec--cierre .cl {position:relative;overflow:hidden;padding:clamp(3.5rem,8vw,7rem) 0 clamp(4rem,9vw,8rem);text-align:center}


.sec--cierre .cl__pool {position:absolute;left:50%;bottom:-6%;transform:translateX(-50%);width:min(760px,120%);height:420px;z-index:0;pointer-events:none;
  background:radial-gradient(50% 60% at 50% 100%, rgba(30,127,224,.30), rgba(140,236,255,.12) 40%, transparent 70%)}

.sec--cierre .cl__top {position:absolute;inset:0 0 auto 0;height:180px;z-index:0;pointer-events:none;
  background:linear-gradient(180deg, rgba(8,16,38,.5), transparent)}

.sec--cierre .wrap {position:relative;z-index:1;max-width:760px;margin:0 auto;padding:0 clamp(1.2rem,4vw,2.4rem)}

.sec--cierre h2 {margin:0;font-size:clamp(2.1rem,5vw,3.4rem);line-height:1.03;letter-spacing:-.03em;font-weight:800}

.sec--cierre .sub {margin:1.1rem auto 0;color:var(--mute);font-size:1.1rem;line-height:1.6;max-width:68ch}

.sec--cierre .pts {display:flex;flex-wrap:wrap;justify-content:center;gap:.7rem;margin:1.8rem 0 0}

.sec--cierre .pt {display:inline-flex;align-items:center;gap:.5rem;padding:.5rem .9rem;border-radius:999px;background:rgba(255,255,255,.05);
  border:1px solid var(--border);font-size:.9rem;color:var(--mute)}

.sec--cierre .pt b {color:#fff}

/* En mobile el cierre va al hueso: titulo y botones, nada mas */
@media (max-width:820px) {
.sec--cierre .sub, .sec--cierre .pts, .sec--cierre .drip {display:none}
.sec--cierre .cl {padding:clamp(3rem,14vw,4.5rem) 0}
.sec--cierre .cta {margin-top:1.6rem}
}

.sec--cierre .pt svg {width:15px;height:15px;color:var(--aqua);flex:none}


.sec--cierre .drip {margin:2rem auto .4rem;width:2px;height:54px;position:relative}

.sec--cierre .drip__line {position:absolute;inset:0;border-radius:2px;background:repeating-linear-gradient(180deg,var(--aqua) 0 7px,transparent 7px 14px);
  -webkit-mask-image:linear-gradient(180deg,transparent,#000);mask-image:linear-gradient(180deg,transparent,#000);
  animation:cierre_drop 1s linear infinite;box-shadow:0 0 8px var(--aqua)}

@keyframes cierre_drop {to{background-position:0 14px}}

.sec--cierre .drip__bead {position:absolute;left:50%;bottom:-3px;transform:translateX(-50%);width:9px;height:9px;border-radius:50%;background:var(--aqua);box-shadow:0 0 14px var(--aqua)}

.sec--cierre .cta {display:flex;flex-wrap:wrap;justify-content:center;gap:.9rem;margin-top:1.4rem}

.sec--cierre .btn {display:inline-flex;align-items:center;gap:.5rem;font-weight:800;font-size:1rem;padding:1rem 1.8rem;border-radius:999px;transition:transform .2s,background .2s,border-color .2s}

.sec--cierre .btn--gold {background:var(--gold);color:#1a1400;box-shadow:0 14px 40px rgba(242,183,5,.36)}

.sec--cierre .btn--gold:hover {background:var(--gold-2);transform:translateY(-2px)}

.sec--cierre .btn--ghost {background:rgba(255,255,255,.04);color:#fff;border:1px solid rgba(255,255,255,.3);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}

.sec--cierre .btn--ghost:hover {border-color:rgba(255,255,255,.7);transform:translateY(-2px)}



/* ==== consola (planfinder) ==== */

.sec--consola {
  --abismo:#04050b; --azure:#1e7fe0; --aqua:#8cecff; --ice:#eafbff; --gold:#F2B705; --gold-2:#D9A404;
  --mute:rgba(234,251,255,.68); --dim:rgba(234,251,255,.42);
  --glass:linear-gradient(150deg,rgba(255,255,255,.09),rgba(255,255,255,.02));
  --border:rgba(255,255,255,.14); --blur:blur(14px) saturate(150%);
  position:relative; overflow:hidden; padding:0;
}

.sec--consola .con__grid {position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.5;
  background-image:
    repeating-linear-gradient(0deg, rgba(140,236,255,.06) 0 1px, transparent 1px 46px),
    repeating-linear-gradient(90deg, rgba(140,236,255,.06) 0 1px, transparent 1px 46px);
  -webkit-mask-image:radial-gradient(120% 84% at 50% 40%, #000 28%, transparent 80%);
  mask-image:radial-gradient(120% 84% at 50% 40%, #000 28%, transparent 80%)}

.sec--consola .con__glow {position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(46% 40% at 50% 22%, rgba(30,127,224,.16), transparent 62%)}

/* full bleed: la consola llena la altura del viewport, como .sec--dossier .tst
   width:100% es clave: sin él, margin:0 auto en el flex column mete márgenes auto
   en el eje transversal y el marco se encoge al contenido (baila entre pasos). */
.sec--consola .wrap {position:relative;z-index:1;width:100%;max-width:min(1480px,94vw);margin:0 auto;padding:clamp(1.1rem,3vh,2.2rem) clamp(1.2rem,4vw,2.4rem);
  min-height:calc(100svh - var(--header-h,69px));display:flex;flex-direction:column;justify-content:center;gap:clamp(1rem,2.4vh,1.9rem)}

/* el marco queda estable y full-bleed en todos los pasos; el contenido legible
   se centra en columna. Intro y preguntas no se estiran, el resultado sí ocupa el ancho. */
.sec--consola .pf-intro {max-width:640px;margin-inline:auto}
.sec--consola .pf-step:has(.pf__options) {max-width:680px;margin-inline:auto;width:100%}
.sec--consola .pf__options {max-width:600px;margin-inline:auto;width:100%}

.sec--consola .head {text-align:center;max-width:640px;margin:0 auto}

@keyframes consola_beat {0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.7)}}

.sec--consola .head h2 {margin:0 0 0;font-size:clamp(2rem,4.6vw,3.1rem);line-height:1.03;letter-spacing:-.03em;font-weight:800;
  background:linear-gradient(100deg,#fff 52%,var(--aqua));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}

.sec--consola .head h2 em {font-style:italic;color:var(--aqua);-webkit-text-fill-color:var(--aqua)}

.sec--consola .head .sub {margin:.9rem auto 0;color:var(--mute);font-size:1.06rem;max-width:52ch;line-height:1.55}


/* consola · faceplate + pantalla (el widget .pf) — ocupa todo el marco disponible */
.sec--consola .console {position:relative;z-index:1;max-width:none;width:100%;margin:0;flex:1 1 auto;min-height:0;display:flex;flex-direction:column}

.sec--consola .console__face {display:flex;align-items:center;gap:.6rem;padding:.72rem 1.1rem;
  background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.02));
  -webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);
  border:1px solid var(--border);border-bottom:none;border-radius:22px 22px 0 0}

.sec--consola .console__led {width:9px;height:9px;border-radius:50%;background:var(--aqua);box-shadow:0 0 12px var(--aqua);flex:none;animation:consola_beat 1.8s ease-in-out infinite}

.sec--consola .console__id {font-family:ui-monospace,Menlo,monospace;font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ice)}

.sec--consola .console__read {margin-left:auto;font-family:ui-monospace,Menlo,monospace;font-size:11px;letter-spacing:.06em;color:var(--dim)}

/* la pantalla = widget .pf retintado al abismo (el quiz no se toca, solo su piel) */
.sec--consola .console .pf {max-width:none;margin:0;flex:1 1 auto;min-height:0;border-radius:0 0 22px 22px;
  background:
    radial-gradient(120% 120% at 12% -4%, rgba(30,127,224,.22) 0%, transparent 52%),
    linear-gradient(162deg, #081227 0%, #04070f 100%);
  border:1px solid var(--border);
  box-shadow:0 30px 80px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.12)}

.sec--consola .pf__blob--1 {background:var(--aqua);opacity:.14}
.sec--consola .pf__blob--2 {background:var(--azure);opacity:.18}

.sec--consola .pf__progress {background:rgba(140,236,255,.14)}
.sec--consola .pf__progress > span {background:linear-gradient(90deg,var(--azure),var(--aqua));box-shadow:0 0 12px rgba(140,236,255,.5)}

/* fix subgrid: el badge "Tu camino" tiene que salir del flujo (site.css .pf__plan>* lo forzaba a relative y corría las 6 filas, superponiendo la bajada con los items en la card recomendada) */
.sec--consola .pf__plan-badge {position:absolute}

@media (max-width:720px){
  .sec--consola .console__read {display:none}
  /* la consola ocupa casi todo el ancho para darle aire a la formula */
  .sec--consola .wrap {min-height:auto;gap:1rem;padding-block:clamp(2rem,7vw,3.2rem);padding-inline:.45rem}
  .sec--consola .console .pf {flex:none;min-height:480px}
}
/* pantallas bajas: no forzar el alto completo para que no se corte el quiz */
@media (max-height:620px){
  .sec--consola .wrap {min-height:auto;padding-block:2rem}
  .sec--consola .console .pf {flex:none;min-height:460px}
}


/* ==== fondos de laboratorio (stills del plan miga-lab-social, Higgsfield) ==== */
/* Cada uno va detras del contenido con scrim oscuro para cuidar legibilidad. */

/* trabajos · plano de expediente muy tenue */
.sec--dossier .tst {position:relative}
.sec--dossier .tst::before {content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:linear-gradient(180deg,#04050b 0%,rgba(4,5,11,0) 14%,rgba(4,5,11,0) 86%,#04050b 100%),linear-gradient(180deg,rgba(4,5,11,.86),rgba(4,5,11,.92)), url(/assets/liquid/bg-trabajos.webp) center/cover no-repeat;
  opacity:.42}
.sec--dossier .tst > * {position:relative;z-index:1}

/* consola (#hablemos) · gradiente ambar animado (animated-gradient.js)
   reemplaza al still del matraz; el ::before queda solo como scrim */
.sec--consola .consola__grad {position:absolute;inset:0;z-index:0;width:100%;height:100%;pointer-events:none;opacity:.55}
.sec--consola::before {content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,#04050b 0%,rgba(4,5,11,0) 15%,rgba(4,5,11,0) 85%,#04050b 100%),linear-gradient(90deg,rgba(4,7,15,.9) 34%,rgba(4,7,15,.35) 100%)}

/* cierre · sombras etereas (humo SVG desplazado) sobre el abismo */
.sec--cierre .cl__shadows {position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;opacity:.5}
.sec--cierre .cl__shadows-defs {position:absolute;width:0;height:0}
.sec--cierre .cl__shadows-wrap {position:absolute;inset:-100px;filter:url(#sombras-f) blur(4px)}
.sec--cierre .cl__shadows-layer {width:100%;height:100%;background:#7fa4c9;
  -webkit-mask-image:url(/assets/liquid/sombras-mask.webp);mask-image:url(/assets/liquid/sombras-mask.webp);
  -webkit-mask-size:cover;mask-size:cover;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-position:center;mask-position:center}

/* fundador · atmosfera suave cyan/ambar */
.sec--fundador .fd::before {content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:linear-gradient(180deg,#04050b 0%,rgba(4,5,11,0) 16%,rgba(4,5,11,0) 84%,#04050b 100%),linear-gradient(180deg,rgba(4,5,11,.72),rgba(4,5,11,.82)), url(/assets/liquid/bg-fundador.webp) center/cover no-repeat;
  opacity:.9}