/* Home V17 · estilo del recorrido del Conejo Blanco (spec home-v17-estilo-conejo, 2 oct 2026).
   Capa final sobre las hojas de la V16: solo color, aire, tipografía, composición e imágenes.
   Paleta y tipografía de /conejo/: fondo #030807, tinta #eef8f6, cian #8ff3ff, neón verde #5dffa8,
   magenta #e8456e; Plus Jakarta Sans en peso 200 para titulares y JetBrains Mono para rótulos.
   El movimiento cuelga de html[data-motion] (lo pone el JS de la página; ?motion=full lo fuerza). */

:root{
  --fondo:#030807; --tinta:#eef8f6; --tinta-2:#c3d3d0; --tinta-3:#93aaa6;
  --verde:#5dffa8; --verde-neon:#3dff8e; --cian:#8ff3ff; --cian-fuerte:#00f5ff; --wa:#25d366;
  --borde:rgba(143,243,255,.18); --borde-suave:rgba(143,243,255,.11);
  --ink-0:#030807; --ink-1:#06100f; --ink-2:#0a1716; --ink-3:#10201f; --ink-4:#183030;
  --cyan:#8ff3ff; --cyan-deep:#2fd8e4; --cyan-soft:#5dffa8; --magenta-lit:#e8456e;
  --txt:#eef8f6; --txt-soft:#c3d3d0; --txt-mute:#a3b8b4; --txt-dim:#93aaa6; --txt-faint:rgba(238,248,246,.16); --t3:#c3d3d0;
  --glass-1:rgba(8,22,22,.5); --glass-2:rgba(12,32,31,.62); --glass-3:rgba(18,48,48,.6);
  --glass-edge:rgba(143,243,255,.16); --glass-edge-bright:rgba(143,243,255,.3);
  --grad:linear-gradient(100deg,#8ff3ff,#5dffa8);
  --ed-rule:rgba(143,243,255,.14); --ed-text:#c3d3d0; --ed-muted:#a3b8b4; --rule:rgba(143,243,255,.14);
  --world-cyan:#8ff3ff; --world-pink:#5dffa8;
  --holo:linear-gradient(165deg,rgba(18,48,48,.62),rgba(5,15,16,.86) 55%,rgba(9,12,20,.88));
  --holo-filo:linear-gradient(90deg,transparent,rgba(143,243,255,.75),rgba(232,69,110,.55),transparent);
  --v17-ease:cubic-bezier(.23,1,.32,1);
  --margen:clamp(20px,5vw,72px);
}
html,body{background:var(--fondo);color:var(--tinta)}
body{font-family:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
::selection{background:rgba(93,255,168,.28);color:#fff}
:focus-visible{outline-color:var(--cian)}

/* Fondo: sin malla diagonal; un velo de luz cian arriba y un piso verde muy tenue, como el pasillo. */
.sm-mesh{opacity:.018}
.sm-beam{display:none}
.scroll-progress{background:linear-gradient(90deg,var(--verde),var(--cian));height:1px;box-shadow:0 0 12px rgba(93,255,168,.6)}

/* ---------- Rótulos (kicker del recorrido) ---------- */
.eyebrow,.hero__tag,.trust-label,.duo-card__serial,.rabbit-kicker,.red-route__step span,.angle-machine__card span,
.sys-num,.nivel-num,.badge,.tag,.chip,.num,.price-src span,.smpop__eyebrow,.lobo-caption{
  font-family:'JetBrains Mono',ui-monospace,monospace!important;font-weight:500!important;letter-spacing:.22em!important;text-transform:uppercase}
.eyebrow{font-size:10.5px;color:var(--tinta-2);gap:12px}
.eyebrow::before{width:26px;height:1px;background:linear-gradient(90deg,var(--magenta-lit),var(--cian))}

/* ---------- Titulares: peso 200, interletra cerrada, énfasis en cian sin itálica gruesa ---------- */
h1,h2,h3{color:var(--tinta)}
h2.sec-title,.duo-intro h2,.red-route__head h2,.rabbit-copy h2,.lobo-copy h2,#contacto .contact-info h2,.world__intro h2{
  font-weight:200!important;letter-spacing:-.05em!important;line-height:1!important}
:is(h1,h2,h3,h4) :is(em,.mag){font-style:normal!important;font-weight:300!important;color:var(--cian)!important;
  background:none;-webkit-text-fill-color:currentColor}
:is(h1,h2,h3) .mag{color:var(--verde)!important}
.sec-lead{color:var(--tinta-2)}

/* ---------- Botones: el verde neón del recorrido ---------- */
.cta-pill{background:linear-gradient(180deg,#63f3a2,#25d366)!important;color:#04140b!important;border:0!important;
  box-shadow:0 18px 50px rgba(37,211,102,.22),inset 0 1px 0 rgba(255,255,255,.5),0 0 0 1px rgba(255,255,255,.1) inset!important;
  font-weight:600;letter-spacing:-.01em;transition:transform .2s var(--v17-ease),box-shadow .2s var(--v17-ease)}
.cta-pill::after{display:none!important}
.cta-pill span{color:#04140b}
.cta-pill:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){.cta-pill:hover{transform:translateY(-2px);box-shadow:0 24px 60px rgba(37,211,102,.34),inset 0 1px 0 rgba(255,255,255,.5)!important}}
.cta-link{color:var(--tinta)}.cta-link .arr{color:var(--verde)}
.btn--ghost{background:rgba(6,20,16,.55)!important;border:1px solid rgba(93,255,168,.38)!important;color:var(--tinta)!important;border-radius:999px;box-shadow:0 0 24px rgba(61,255,142,.1)}
.signal-cta{color:var(--tinta)!important;border-color:rgba(93,255,168,.45)!important}

/* ---------- Barra superior ---------- */
.navbar{background:transparent}
.navbar.scrolled{background:rgba(3,8,7,.72)!important;border-bottom:1px solid var(--borde-suave);backdrop-filter:blur(16px) saturate(130%);-webkit-backdrop-filter:blur(16px) saturate(130%)}
.nav-links a{color:var(--tinta-2);font-weight:500}
.nav-links a:hover,.nav-links a.active{color:var(--tinta)}
.nav-cta{border:1px solid rgba(93,255,168,.38)!important;background:rgba(6,20,16,.55);color:var(--tinta)!important;border-radius:999px;
  box-shadow:0 0 24px rgba(61,255,142,.12);letter-spacing:.14em}
@media (hover:hover) and (pointer:fine){.nav-cta:hover{background:rgba(12,40,30,.75);border-color:var(--verde)!important}}
.mobile-menu{background:rgba(3,8,7,.97)!important}
.motion-toggle{background:rgba(3,8,7,.78)!important;border-color:var(--borde)!important;color:var(--tinta-2)!important;border-radius:999px;font-family:'JetBrains Mono',monospace!important}
.hamb span{background:var(--tinta)}

/* ---------- Paneles: de vidrio genérico a panel holográfico ---------- */
.glass{background:var(--holo-filo) 50% 0/calc(100% - 36px) 1px no-repeat,var(--holo)!important;border:1px solid var(--borde)!important;border-radius:20px;
  box-shadow:0 0 0 1px rgba(93,255,168,.03) inset,0 1px 0 rgba(255,255,255,.06) inset,0 30px 80px rgba(0,0,0,.45)}
.glass::before{padding:0!important;-webkit-mask:none!important;mask:none!important;border-radius:inherit;opacity:.45!important;
  background:repeating-linear-gradient(180deg,rgba(143,243,255,.03) 0 1px,transparent 1px 4px)!important}

/* ================= HERO: el Señor Lobo en el umbral ================= */
.hero{background:radial-gradient(ellipse 60% 70% at 78% 40%,#0c2624 0%,#061211 48%,#030807 100%)!important;min-height:100svh}
.hero::after{background:linear-gradient(0deg,#030807,transparent)!important;height:22%!important;opacity:1!important;z-index:1}
.hero__glow{background:radial-gradient(ellipse 50% 40% at 70% 18%,rgba(143,243,255,.10),transparent 70%),radial-gradient(ellipse 40% 30% at 20% 90%,rgba(61,255,142,.06),transparent 70%)!important}
.hero__grid{display:none}
.hero__field{opacity:.32;mix-blend-mode:screen}
.hero-stage{top:0!important;right:0!important;bottom:0;width:min(52vw,900px)!important;height:100%!important;opacity:1!important;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 30%,#000 100%);mask-image:linear-gradient(90deg,transparent 0%,#000 30%,#000 100%)}
.hero-stage img{width:100%!important;height:100%!important;aspect-ratio:auto!important;object-fit:cover!important;object-position:50% 34%!important;
  filter:saturate(1.02) contrast(1.04)!important;-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 70%,transparent 100%)!important;mask-image:linear-gradient(180deg,#000 0%,#000 70%,transparent 100%)!important}
.hero-stage__mesh{display:none}
.hero-stage::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 22% 34% at 50% 30%,rgba(176,247,253,.16),transparent 70%)}
.hero-stage__label{font-family:'JetBrains Mono',monospace;font-size:9.5px!important;letter-spacing:.24em!important;color:var(--tinta-3)!important;right:6%!important;bottom:9%!important;z-index:2}
.hero .hero__inner{position:relative;z-index:3}
.hero .hero__tag{color:var(--tinta-2)!important;font-size:10.5px!important;display:flex;align-items:center;gap:12px}
.hero .hero__tag::before{content:"";width:26px;height:1px;background:linear-gradient(90deg,var(--magenta-lit),var(--cian));flex:none}
.hero .hero__title{font-weight:200!important;letter-spacing:-.06em!important;line-height:.96!important;max-width:640px!important;font-size:clamp(54px,6.6vw,104px)!important;text-shadow:0 2px 40px rgba(0,0,0,.45)}
.hero .hero__sub{color:var(--tinta-2)!important;text-shadow:0 2px 18px #030807;max-width:520px!important}
.hero__tele{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--tinta-3)}
.hero__tele i{--c:var(--verde)!important}
.hero__cred{font-family:'JetBrains Mono',monospace!important;font-size:10.5px!important;letter-spacing:.22em!important;color:var(--tinta-3)!important}
.hero__cred .pip{background:var(--verde)!important;box-shadow:0 0 10px var(--verde)!important}

/* ================= ECOSISTEMA: Sofía y el Lobo, retrato realista ================= */
.world{background:radial-gradient(ellipse 50% 40% at 25% 30%,rgba(20,72,68,.32),transparent 75%),radial-gradient(ellipse 40% 35% at 85% 70%,rgba(61,255,142,.05),transparent 80%),#030807!important}
.world::before{display:none}
.duo-intro{border-top:1px solid var(--borde-suave)!important}
.duo-intro p{color:var(--tinta-2)}
.duo-grid{gap:clamp(24px,4vw,64px)!important;align-items:start}
.duo-card,.duo-card--sofia{min-height:0!important;display:flex;flex-direction:column;justify-content:flex-end;aspect-ratio:3/4.35;border:1px solid var(--borde-suave)!important;border-radius:22px!important;
  background:#06100f!important;overflow:hidden}
.duo-card--sofia{margin-top:clamp(0px,6vw,90px)!important}
.duo-card::after{display:none!important}
.duo-card>img,.duo-card--sofia>img{position:absolute!important;inset:0!important;left:0!important;top:0!important;width:100%!important;height:100%!important;aspect-ratio:auto!important;
  object-fit:cover!important;object-position:50% 18%!important;opacity:1!important;filter:none!important;-webkit-mask-image:none!important;mask-image:none!important;transform:none}
.duo-card__halo,.duo-card--sofia .duo-card__halo{inset:0;animation:none!important;
  background:linear-gradient(0deg,rgba(3,8,7,.97) 0%,rgba(3,8,7,.9) 24%,rgba(3,8,7,.35) 46%,transparent 62%)!important}
.duo-card__serial{left:22px!important;top:20px!important;font-size:9.5px!important;color:var(--tinta-2)!important;padding:7px 10px;border:1px solid var(--borde);border-radius:999px;background:rgba(3,8,7,.55);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.duo-card .sm-signal{bottom:auto!important;top:62px;opacity:.75}
.duo-card .sm-signal span{color:var(--tinta-2)}
.duo-card .sm-signal path{stroke:var(--cian)}.duo-card .sm-signal circle{fill:var(--cian)}
.duo-card--sofia .sm-signal path{stroke:var(--verde)}.duo-card--sofia .sm-signal circle{fill:var(--verde)}
.duo-card__glass,.duo-card--sofia .duo-card__glass{position:relative!important;left:auto!important;bottom:auto!important;z-index:3;padding:0 clamp(22px,2.6vw,36px) clamp(24px,2.8vw,36px)!important}
.duo-card__glass h3{font-weight:200!important;letter-spacing:-.05em;font-size:clamp(44px,4.6vw,68px)!important}
.duo-card__glass p{color:var(--tinta-2)!important}
.duo-card__glass a,.duo-card__glass button{color:var(--tinta)!important;border:1px solid rgba(93,255,168,.38)!important;border-radius:999px;padding:10px 16px!important;
  background:rgba(6,20,16,.55)!important;font-weight:600;display:inline-flex;gap:8px;align-items:center;text-decoration:none}
.duo-card__glass a span,.duo-card__glass button span{color:var(--verde)}
.duo-secondary{border-top:1px solid var(--borde-suave)!important}
.duo-secondary__item{border-color:var(--borde-suave)!important}
.duo-secondary__item::before{background:linear-gradient(90deg,#030807 0%,rgba(3,8,7,.92) 30%,rgba(3,8,7,.55) 55%,transparent 85%)!important}
.duo-secondary__item>img{filter:saturate(.8) hue-rotate(-12deg) brightness(.92)}
.duo-secondary__item b{font-weight:200!important;letter-spacing:-.04em}
.duo-secondary__item small{color:var(--tinta-2)!important}
.duo-secondary__item em{font-style:normal;font-family:'JetBrains Mono',monospace;font-size:11px!important;letter-spacing:.18em;text-transform:uppercase;color:var(--verde)!important}
.world__note{color:var(--tinta-3)!important;font-family:'JetBrains Mono',monospace;font-size:10.5px!important;letter-spacing:.1em;line-height:1.7}

/* ---------- Clientes ---------- */
.trust-wrap{background:#030807;border-color:var(--borde-suave)!important}
.trust-label{font-size:10.5px!important;color:var(--tinta-3)!important}
.marquee-outer::before{background:linear-gradient(to right,#030807,transparent)!important}
.marquee-outer::after{background:linear-gradient(to left,#030807,transparent)!important}
.logo-item img{filter:grayscale(1) brightness(1.6) contrast(.9);opacity:.62}
@media (hover:hover) and (pointer:fine){.logo-item:hover img{filter:none;opacity:1}}

/* ---------- Secciones editoriales: mismo fondo del pasillo, luz distinta en cada una ---------- */
#servicios{background:radial-gradient(ellipse 44% 48% at 100% 15%,rgba(20,90,84,.16),transparent 78%),#030807!important}
#metodologia{background:radial-gradient(ellipse 50% 50% at 0% 60%,rgba(20,90,84,.14),transparent 80%),#040a09!important}
#sistema{background:radial-gradient(ellipse 50% 45% at 80% 40%,rgba(143,243,255,.06),transparent 80%),#030807!important}
#porque{background:radial-gradient(ellipse 50% 50% at 10% 30%,rgba(20,90,84,.16),transparent 80%),#030807!important}
#detalle{background:#030807!important}
#comando{background:radial-gradient(ellipse 50% 40% at 50% 20%,rgba(20,90,84,.14),transparent 80%),#040a09!important}
#precios{background:linear-gradient(180deg,#030807,#05100e)!important}
#niveles-ia{background:radial-gradient(ellipse 55% 40% at 50% 0%,rgba(61,255,142,.05),transparent 80%),#05100e!important}
#contacto{background:radial-gradient(ellipse 50% 60% at 0 40%,rgba(20,90,84,.22),transparent 80%),#030807!important}
section.block{border-top:1px solid rgba(143,243,255,.06)}

#servicios .services-grid,#servicios .service-card,#metodologia .fly-grid,#metodologia .fly-step,#porque .why-cards,#porque .diff-card,#comando .mod-card{border-color:var(--borde-suave)!important}
#servicios .service-card .ic{background:rgba(93,255,168,.06)!important;border-color:rgba(93,255,168,.25)!important;color:var(--verde)!important}
#servicios .service-card .badge{color:var(--tinta-2)!important;font-size:10.5px!important}
#servicios .service-card h3{font-weight:200!important;letter-spacing:-.05em}
#servicios .service-items li{color:var(--tinta-2)!important;border-color:var(--borde-suave)!important}
#metodologia .fly-step .num{color:var(--cian)!important;font-size:10.5px!important}
#metodologia .fly-step .gl{color:var(--verde)!important}
#metodologia .fly-step h3{font-weight:200!important;letter-spacing:-.05em}
#metodologia .fly-note{border-top-color:rgba(93,255,168,.4)!important}
#porque .why-highlight{border-radius:22px!important}
#porque .why-highlight .tag{color:var(--verde)!important;font-size:10.5px}
#porque .diff-card .sym{color:var(--verde)!important}
#porque .diff-card h4{font-weight:400}
#detalle .glass{border-radius:22px!important}
#detalle .tag{font-size:10.5px}

/* Sistema: la traza es un panel holográfico con su cabecera en mono */
.sys-step{border-color:var(--borde-suave)!important}
.sys-step h3{font-weight:300!important;letter-spacing:-.03em}
.sys-num{color:var(--cian)!important;font-size:10.5px!important}
.sys-step.on .sys-num{color:var(--verde)!important}
.sys-top{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.18em;color:var(--tinta-3)!important;border-color:var(--borde-suave)!important}
.sys-top b{color:var(--verde)!important;text-shadow:0 0 10px var(--verde)}
.sys-rail .line{background:linear-gradient(90deg,var(--verde),var(--cian))!important}
.sys-bubble{background:rgba(143,243,255,.07)!important;border:1px solid rgba(143,243,255,.16)!important;color:var(--tinta)!important}
.sys-bubble.out{background:rgba(61,255,142,.14)!important;border-color:rgba(93,255,168,.22)!important;color:#e6fff0!important}
.sys-ev{font-family:'JetBrains Mono',monospace;color:var(--tinta-3)!important}
.sys-ev i{background:var(--verde)!important;box-shadow:0 0 8px var(--verde)}
.sys-kv span{color:var(--tinta-3)!important;font-family:'JetBrains Mono',monospace;letter-spacing:.12em}
.sys-kv b{color:var(--tinta)!important;font-weight:500}

/* ================= RUTA RED ================= */
.red-route{background:radial-gradient(ellipse 50% 40% at 85% 10%,rgba(20,90,84,.2),transparent 80%),#030807!important;border-top:1px solid rgba(143,243,255,.06)}
.red-route__head h2 em{color:var(--cian)!important}
.red-route__head p{color:var(--tinta-2)!important}
.red-route__offer article{background:var(--holo-filo) 50% 0/calc(100% - 30px) 1px no-repeat,var(--holo)!important;border:1px solid var(--borde)!important;border-radius:18px}
.red-route__offer b{font-weight:300;letter-spacing:-.02em}
.red-route__offer a{color:var(--verde)!important}
.red-route__line{background:var(--borde-suave)!important;border-color:var(--borde-suave)!important;border-radius:18px;overflow:hidden}
.red-route__step{background:#06100f!important}
.red-route__step::before{background:linear-gradient(90deg,var(--magenta-lit),var(--cian))!important}
.red-route__step span{color:var(--cian)!important;font-size:10px!important}
.red-route__step h3{font-weight:300!important;letter-spacing:-.03em}
.red-route__step p{color:var(--tinta-2)!important}
.red-route__step small{color:var(--verde)!important;font-family:'JetBrains Mono',monospace;letter-spacing:.04em}
.red-journey .red-route__step.is-current{background:#0b1d1b!important}
.red-journey__scene img{filter:saturate(.75) hue-rotate(-14deg) brightness(.9)}
.signature-sync,.journey-chapter{font-family:'JetBrains Mono',monospace!important;letter-spacing:.2em!important}
.journey-meter b{background:linear-gradient(90deg,var(--verde),var(--cian))!important}
.angle-machine{background:var(--holo)!important;border:1px solid var(--borde)!important;border-radius:22px;box-shadow:0 40px 100px rgba(0,0,0,.5)!important;overflow:hidden}
.angle-machine__left{border-color:var(--borde-suave)!important}
.angle-machine__left h3{font-weight:200!important}
.angle-machine__left p{color:var(--tinta-2)!important}
.angle-machine__left button{background:rgba(143,243,255,.04)!important;border:1px solid var(--borde-suave)!important;border-radius:12px;color:var(--tinta-2)!important;transition:border-color .2s var(--v17-ease),background-color .2s var(--v17-ease)}
.angle-machine__left button[aria-pressed=true]{border-color:rgba(93,255,168,.55)!important;background:rgba(61,255,142,.1)!important;color:var(--tinta)!important}
.angle-machine__card{background:rgba(3,8,7,.55)!important;border:1px solid var(--borde-suave)!important;border-radius:14px}
.angle-machine__card span{color:var(--verde)!important;font-size:10px!important}
.angle-machine__card p{color:var(--tinta-2)!important}
.angle-machine__disclaimer{color:var(--tinta-3)!important}
.angle-next{border-color:var(--borde-suave)!important}

/* ================= CONEJO BLANCO: la escena final del recorrido, a sangre ================= */
.white-rabbit{position:relative;display:block!important;max-width:none!important;margin:0!important;padding:0!important;min-height:min(100svh,980px);
  border:0!important;background:#030807!important;overflow:hidden;isolation:isolate}
.white-rabbit .rabbit-art{position:absolute!important;inset:0;margin:0!important;max-width:none!important;width:100%;height:100%;z-index:0;overflow:hidden}
.white-rabbit .rabbit-picture{display:block;width:100%;height:100%}
.white-rabbit .rabbit-portrait{width:100%!important;height:100%!important;aspect-ratio:auto!important;object-fit:cover!important;object-position:62% 50%;-webkit-mask-image:none!important;mask-image:none!important}
.white-rabbit .rabbit-art::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,rgba(3,8,7,.94) 0%,rgba(3,8,7,.78) 30%,rgba(3,8,7,.2) 55%,transparent 70%),linear-gradient(0deg,#030807 0%,transparent 22%),linear-gradient(180deg,#030807 0%,transparent 14%)}
.white-rabbit .rabbit-motion-path{display:none}
.white-rabbit .rabbit-copy{position:relative;z-index:2;max-width:560px;padding:clamp(110px,14vh,160px) var(--margen) clamp(90px,12vh,140px)}
.rabbit-kicker{font-size:10.5px!important;color:var(--tinta-2)!important;display:flex;align-items:center;gap:12px}
.rabbit-kicker::before{content:"";width:26px;height:1px;background:linear-gradient(90deg,var(--magenta-lit),var(--cian));flex:none}
.rabbit-copy h2{font-size:clamp(44px,5.2vw,82px)!important;margin:22px 0 24px!important}
.rabbit-copy p{color:var(--tinta-2)!important}
.rabbit-copy .rabbit-secondary{color:var(--tinta-3)!important}
.rabbit-cta{display:inline-flex!important;gap:12px!important;align-items:center;padding:16px 26px 16px 24px!important;margin-top:20px!important;border:1px solid rgba(143,243,255,.5)!important;border-radius:999px;
  background:rgba(4,24,26,.55)!important;color:var(--tinta)!important;box-shadow:0 0 34px rgba(143,243,255,.16),inset 0 1px 0 rgba(255,255,255,.12);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  transition:transform .2s var(--v17-ease),box-shadow .2s var(--v17-ease),background-color .2s var(--v17-ease)}
.rabbit-cta span{color:var(--cian)!important;font-size:18px!important}
@media (hover:hover) and (pointer:fine){.rabbit-cta:hover{transform:translateY(-2px);background:rgba(8,40,44,.7)!important;box-shadow:0 0 44px rgba(143,243,255,.26)}}
.rabbit-stages{color:var(--tinta-3)!important;font-family:'JetBrains Mono',monospace!important;font-size:9.5px!important;letter-spacing:.2em!important}
.rabbit-stages i{background:linear-gradient(90deg,var(--magenta-lit),var(--cian))!important}

/* ================= DEMO DEL LOBO: el panel holográfico del recorrido ================= */
#lobo{background:radial-gradient(ellipse 45% 55% at 75% 50%,rgba(20,90,84,.2),transparent 80%),#030807!important}
.lobo-points li{color:var(--tinta-2)!important}
.lobo-points li::before{color:var(--verde)!important}
.lobo-phone{border-radius:20px!important}
.lobo-head{border-color:rgba(143,243,255,.1)!important;background:transparent!important}
.lobo-av{background:#0b1d1b!important;overflow:hidden;border:1px solid var(--borde)}
.lobo-av img{width:100%;height:100%;object-fit:cover}
.lobo-head .st{color:var(--verde)!important;font-size:9.5px!important;letter-spacing:.18em!important}
.lobo-head .st::before{background:var(--verde)!important;box-shadow:0 0 10px var(--verde)!important}
.lobo-msg.user{background:rgba(61,255,142,.14)!important;border:1px solid rgba(93,255,168,.22)!important;color:#e6fff0!important}
.lobo-msg.bot{background:rgba(143,243,255,.07)!important;border:1px solid rgba(143,243,255,.16)!important;color:var(--tinta)!important}
.lobo-caption{color:var(--tinta-3)!important;border-color:rgba(143,243,255,.1)!important;font-size:9.5px!important}
.lobo-replay{color:var(--tinta-2)!important;font-family:'JetBrains Mono',monospace!important}

/* ================= COMANDO ================= */
#comando .comando-cinema{border-radius:22px;overflow:hidden;border:1px solid var(--borde-suave)}
#comando .comando-cinema img{filter:saturate(.75) hue-rotate(-14deg) brightness(.9)}
#comando .comando-cinema figcaption{font-family:'JetBrains Mono',monospace;letter-spacing:.2em;color:var(--tinta-2)}
#comando .mod-card{background:rgba(6,16,15,.85)!important}
#comando .mod-card .chip{color:var(--cian)!important}
#comando .mod-card .gl{color:var(--verde)!important}
#comando .mod-card h3{font-weight:300!important;letter-spacing:-.03em}
#comando .comando-cta{border-color:var(--borde-suave)!important}

/* ================= PRECIOS Y NIVELES ================= */
.price-card{border-radius:20px!important}
.price-name{font-weight:400;letter-spacing:-.02em}
.price-amt{font-weight:200!important;letter-spacing:-.04em;color:var(--tinta)!important}
.price-amt span{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.14em;color:var(--tinta-3)}
.price-src{color:var(--tinta-2)!important}
.price-src span{color:var(--verde)!important;font-size:10px!important}
.price-note{color:var(--tinta-3)!important}
.nivel-card{border-radius:20px!important}
.nivel-num{color:var(--cian)!important;font-size:10px!important}
.nivel-card h3{font-weight:300!important;letter-spacing:-.03em}
.nivel-tag{color:var(--verde)!important}
.nivel-inc{color:var(--tinta-3)!important;border-color:var(--borde-suave)!important}
.nivel-precio{border-color:var(--borde-suave)!important}
.nivel-precio span{font-family:'JetBrains Mono',monospace;letter-spacing:.14em;text-transform:uppercase;font-size:10px;color:var(--tinta-3)!important}
.nivel-precio b{font-weight:300!important;color:var(--tinta)!important;letter-spacing:-.02em}
.nivel-tabla{border-color:var(--borde)!important;border-radius:18px;background:rgba(6,16,15,.7)!important}
.nivel-tabla summary{color:var(--tinta)!important}
.nivel-tabla th{color:var(--tinta-2)!important;font-family:'JetBrains Mono',monospace;font-weight:500;letter-spacing:.1em;font-size:11px}
.nivel-tabla td,.nivel-tabla th{border-color:var(--borde-suave)!important}
.nivel-tabla td.si{color:var(--verde)!important}
.nivel-check li::before{color:var(--verde)!important}

/* ================= CONTACTO Y PIE ================= */
#contacto .contact-meta .row{border-color:var(--borde-suave)!important}
#contacto .contact-meta .row .lbl{color:var(--tinta-3)!important;font-family:'JetBrains Mono',monospace;letter-spacing:.16em;text-transform:uppercase;font-size:10.5px}
#contacto .form-card{border-radius:22px!important;border:1px solid var(--borde)!important;background:var(--holo-filo) 50% 0/calc(100% - 36px) 1px no-repeat,var(--holo)!important}
.contact-glow{display:none}
.ftitle{font-family:'JetBrains Mono',monospace;letter-spacing:.2em;text-transform:uppercase;font-size:11px;color:var(--tinta-2)}
.field label{color:var(--tinta-2)!important}
.field input,.field select{background:rgba(3,8,7,.6)!important;border:1px solid var(--borde)!important;border-radius:12px!important;color:var(--tinta)!important}
.field input:focus,.field select:focus{border-color:var(--verde)!important;box-shadow:0 0 0 3px rgba(93,255,168,.14)!important;outline:none}
.form-submit{background:linear-gradient(180deg,#63f3a2,#25d366)!important;color:#04140b!important;border:0!important;border-radius:999px!important;
  box-shadow:0 18px 50px rgba(37,211,102,.22),inset 0 1px 0 rgba(255,255,255,.5)!important;font-weight:600}
.form-ok .ic{background:rgba(61,255,142,.14)!important;color:var(--verde)!important;border-color:rgba(93,255,168,.4)!important}
footer{background:#030807!important;border-top:1px solid var(--borde-suave)!important}
.footer-col h4{font-family:'JetBrains Mono',monospace;font-weight:500;letter-spacing:.22em;font-size:10.5px;color:var(--tinta-3)!important;text-transform:uppercase}
.footer-col a,.footer-brand p{color:var(--tinta-2)!important}
.footer-bottom{border-color:var(--borde-suave)!important}
.copy{color:var(--tinta-3)!important}
.wa-float{background:linear-gradient(180deg,#63f3a2,#25d366)!important;box-shadow:0 14px 40px rgba(37,211,102,.32)!important}
.wa-float svg{fill:#04140b!important}
.wa-tip{background:rgba(3,8,7,.9)!important;border:1px solid rgba(93,255,168,.38)!important;color:var(--tinta)!important}
#cookieBanner{background:rgba(3,8,7,.96)!important;border-color:var(--borde)!important}

/* ================= POPUP A/B (mismo componente, piel del recorrido) ================= */
.smpop__card{background:var(--holo-filo) 50% 0/calc(100% - 36px) 1px no-repeat,var(--holo)!important;border:1px solid var(--borde)!important;border-radius:22px!important}
.smpop__bg{background:rgba(1,4,4,.72)!important}
.smpop__title{font-weight:200!important;letter-spacing:-.05em}
.smpop__sub{color:var(--tinta-2)!important}
.smpop__eyebrow{color:var(--tinta-2)!important;font-size:10px!important}
.smpop__scene{color:var(--cian)!important}.smpop__scene span{color:var(--verde)!important}
.smpop__media img{object-fit:cover;object-position:50% 30%}
/* La variante de Sofía la pinta el JS del popup (intacto) con su retrato anterior: se muestra el nuevo. */
.smpop__media img[src$="sofia-vertex.webp"]{content:url("assets/elenco/sofia-puerta-540.webp")}

/* ================= MOVIMIENTO (data-motion) ================= */
/* sm:cinematica — entradas de relato del recorrido: lentas a propósito, solo con data-motion="full". */
html[data-motion="full"] .hero-stage{animation:v17-umbral 2.6s var(--v17-ease) both}
@keyframes v17-umbral{from{opacity:0;transform:scale(1.06)}to{opacity:1;transform:none}}
html[data-motion="full"] .hero-stage::after{animation:v17-luz 7s ease-in-out infinite}
@keyframes v17-luz{50%{opacity:.45}}
html[data-motion="full"] .v17-r{opacity:0;transform:translateY(22px);transition:opacity .9s var(--v17-ease),transform 1.1s var(--v17-ease)}
html[data-motion="full"] .v17-r.v17-in{opacity:1;transform:none}
html[data-motion="full"] .white-rabbit .rabbit-portrait{transform:scale(calc(1.1 - var(--v17-p,0) * .1));transform-origin:62% 55%;will-change:transform}
/* sm:fin-cinematica */
.motion-paused .hero-stage::after,.tab-hidden .hero-stage::after{animation-play-state:paused}
html[data-motion="reduce"] .hero-stage,html[data-motion="reduce"] .hero-stage::after{animation:none!important}
html[data-motion="reduce"] .v17-r{opacity:1!important;transform:none!important}
@media (prefers-reduced-motion:reduce){html:not([data-motion="full"]) .hero-stage,html:not([data-motion="full"]) .hero-stage::after{animation:none}}

/* ================= CELULAR ================= */
@media (max-width:900px){
  .hero-stage{width:100vw!important;-webkit-mask-image:none;mask-image:none}
}
@media (max-width:740px){
  .hero{min-height:100svh}
  .hero-stage{height:66svh!important;bottom:auto}
  .hero-stage img{object-position:50% 22%!important;-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 52%,transparent 100%)!important;mask-image:linear-gradient(180deg,#000 0%,#000 52%,transparent 100%)!important}
  .hero-stage::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(3,8,7,.55),transparent 60%)}
  .hero .hero__inner{justify-content:flex-end!important;min-height:100svh!important;padding:46svh 0 34px!important}
  .hero .hero__title{font-size:clamp(46px,12.4vw,60px)!important;margin:16px 0 14px!important}
  .hero .hero__sub{font-size:16px!important}
  .hero__tele{margin:0 0 22px!important}
  .duo-card,.duo-card--sofia{aspect-ratio:3/4.4;margin-top:0!important}
  .white-rabbit{min-height:0}
  .white-rabbit .rabbit-art{position:relative!important;height:min(118vw,620px)}
  .white-rabbit .rabbit-portrait{object-position:50% 45%}
  .white-rabbit .rabbit-art::after{background:linear-gradient(0deg,#030807 0%,rgba(3,8,7,.6) 22%,transparent 45%),linear-gradient(180deg,#030807 0%,transparent 16%)}
  .white-rabbit .rabbit-copy{margin-top:-90px;padding:0 22px 72px}
  .rabbit-cta{width:100%;justify-content:center}
}

/* ================= Iteración 2 ================= */
/* Filas editoriales: sin caja; la regla fina las separa (el panel holográfico queda para lo que es "pantalla"). */
#servicios .service-card,#metodologia .fly-step,#porque .diff-card,#comando .mod-card{background:none!important;border:0!important;border-bottom:1px solid var(--borde-suave)!important;border-radius:0!important;box-shadow:none!important}
#comando .mod-card:nth-child(odd){border-right:1px solid var(--borde-suave)!important}
#servicios .service-card::before,#metodologia .fly-step::before,#porque .diff-card::before,#comando .mod-card::before{display:none!important}
/* Señales del sistema y del hero: cian -> cian -> verde (sin violeta ni magenta). */
#sistema [data-k="in"],.hero__tele [data-k="in"]{--c:var(--cian)}
#sistema [data-k="think"],#sistema [data-k="data"],.hero__tele [data-k="think"]{--c:#4fd8e8}
#sistema [data-k="act"],.hero__tele [data-k="act"]{--c:var(--verde)}
.hero-stage__label{bottom:auto!important;top:118px;right:5%!important}
/* Conejo en escritorio: la proporción de la imagen manda; el título conserva su corte. */
.white-rabbit{min-height:clamp(640px,56.25vw,1040px)}
.white-rabbit .rabbit-portrait{object-position:50% 50%}
.white-rabbit .rabbit-copy{max-width:min(640px,46vw)}
.rabbit-copy h2{font-size:clamp(40px,4.3vw,70px)!important}
@media (max-width:740px){
  .hero-stage{height:60svh!important}
  .hero .hero__inner{padding:34svh 0 26px!important}
  .hero .hero__title{font-size:clamp(42px,11.4vw,54px)!important;margin:12px 0 12px!important}
  .hero .hero__sub{font-size:15.5px!important;line-height:1.5!important;margin-bottom:18px}
  .hero__tele{margin:0 0 18px!important;gap:10px!important}
  .hero .hero__ctas{margin-bottom:16px!important}
  .cta-pill{padding-left:22px!important;padding-right:22px!important}
  .white-rabbit{display:flex!important;flex-direction:column}
  .white-rabbit .rabbit-art{order:-1}
  .white-rabbit .rabbit-copy{max-width:none;margin-top:-110px}
  .rabbit-copy h2{font-size:clamp(38px,10.4vw,48px)!important}
}

/* ================= Iteración 3 ================= */
.smpop__card{background:var(--holo-filo) 50% 0/calc(100% - 36px) 1px no-repeat,linear-gradient(165deg,#0c2422,#050d0c 55%,#070a10)!important}
.smpop__media{background:#06100f!important}
.smpop__media img{object-position:50% 28%!important}
.smpop__media:after{background:linear-gradient(90deg,#06100f 0,rgba(6,16,15,.2) 16%,transparent 34%)!important}
.white-rabbit .rabbit-copy{max-width:min(620px,41vw)}
@media (max-width:720px){
  .smpop__media{height:min(112vw,48vh)!important}
  .smpop__media img{object-position:50% 22%!important}
}
@media (max-width:740px){
  .hero-stage img{-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 40%,transparent 84%)!important;mask-image:linear-gradient(180deg,#000 0%,#000 40%,transparent 84%)!important}
  .hero .hero__tag{text-shadow:0 1px 12px #030807}
  .white-rabbit .rabbit-copy{max-width:none}
}
/* Contraste AA: el magenta de "Serie · El Detalle" sobre el panel daba 4,27:1; con este tono, 6:1+. */
#detalle{--magenta-lit:#ff7896}