/* Portada DeliverIM. Un color de fondo por capitulo, como en las piezas
   editoriales de referencia: un campo de color monolitico, un objeto y
   tipografia enorme. El objeto aqui es el edificio (ver escena.js). */

:root{
  /* Colores de la marca (Identidad_Visual_DeliverIM, manual p. 05): verde
     palmera de senal, grafito en lugar del cobalto, verde nodo para el scan. */
  --senal:#4A8034; --tinta:#0b0c0e; --hueso:#ece8e1; --scan:#B0D48C; --cobalto:#283038;
  --marca-display:"Rajdhani","Agency FB","Oswald",var(--display);
  --fondo:var(--senal); --texto:var(--tinta); --suave:rgba(11,12,14,.66); --linea:rgba(11,12,14,.22);
  --display:"Inter Tight",system-ui,"Segoe UI",sans-serif;
  --serif:"Instrument Serif",Georgia,serif;
  --mono:"JetBrains Mono",ui-monospace,Consolas,monospace;
  --margen:clamp(18px,4vw,56px);
  color-scheme:light dark;
}
/* tema por capitulo: [fondo, texto] */
/* Portada: noche verde con el pozo (escena.js); el cierre, verde de la marca. */
body[data-cap="0"]{--fondo:#040a07;--texto:#e6f2ea;--suave:rgba(230,242,234,.66);--linea:rgba(176,212,140,.22)}
body[data-cap="9"]{--fondo:var(--senal);--texto:var(--tinta);--suave:rgba(11,12,14,.7);--linea:rgba(11,12,14,.24)}
body[data-cap="1"]{--fondo:#060708;--texto:var(--hueso);--suave:rgba(236,232,225,.62);--linea:rgba(236,232,225,.16)}
body[data-cap="2"]{--fondo:#0a0d12;--texto:var(--hueso);--suave:rgba(236,232,225,.62);--linea:rgba(236,232,225,.16)}
body[data-cap="3"]{--fondo:#131519;--texto:var(--hueso);--suave:rgba(236,232,225,.64);--linea:rgba(236,232,225,.16)}
body[data-cap="4"]{--fondo:var(--hueso);--texto:var(--tinta);--suave:rgba(11,12,14,.64);--linea:rgba(11,12,14,.16)}
body[data-cap="5"]{--fondo:var(--cobalto);--texto:#f4f1ea;--suave:rgba(244,241,234,.74);--linea:rgba(244,241,234,.24)}
body[data-cap="6"]{--fondo:#0b0c0e;--texto:var(--hueso);--suave:rgba(236,232,225,.62);--linea:rgba(236,232,225,.16)}
body[data-cap="7"]{--fondo:#0e0f12;--texto:var(--hueso);--suave:rgba(236,232,225,.62);--linea:rgba(236,232,225,.16)}
body[data-cap="8"]{--fondo:#040506;--texto:var(--hueso);--suave:rgba(236,232,225,.62);--linea:rgba(236,232,225,.16)}

*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fondo);color:var(--texto);font:16px/1.55 var(--display);
  transition:background-color .9s cubic-bezier(.6,0,.2,1),color .6s;overflow-x:hidden;
  -webkit-font-smoothing:antialiased}
em{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:0}
a{color:inherit}
::selection{background:var(--texto);color:var(--fondo)}

/* ------------------------------------------------------------- escenario */
#escenario{position:fixed;inset:0;z-index:0;pointer-events:none}
/* El resplandor del pozo, bajo el edificio; solo en la portada. */
#escenario::before{content:"";position:absolute;inset:0;z-index:0;opacity:0;transition:opacity .9s;
  background:radial-gradient(46vw 34vw at 71% 70%,rgba(64,190,118,.20),rgba(64,190,118,.05) 45%,transparent 70%),
             radial-gradient(90vw 70vw at 30% 0%,rgba(176,212,140,.06),transparent 60%)}
body[data-cap="0"] #escenario::before{opacity:1}
#lienzo{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:2}
#capa-atras{position:absolute;inset:0;display:flex;pointer-events:none;will-change:opacity,transform}
/* --tope: la palabra empieza bajo el kicker y el bloque latinoamericano */
#escenario{--tope:max(176px,calc(11vh + 92px))}
#capa-atras{z-index:1;align-items:flex-start;padding:var(--tope) var(--margen) 0}
.gigante{font:700 23vw/.8 var(--marca-display);letter-spacing:-.02em;color:var(--tinta);white-space:nowrap;
  margin-left:-.04em;user-select:none}
.gigante.contorno{color:transparent;-webkit-text-stroke:max(2px,.16vw) var(--tinta);letter-spacing:-.04em}
/* El titular (portada.js lo mide y lo pliega): DELIVER en luz menta que se
   apaga hacia el pozo; la I y la M, en contorno. */
#capa-atras .titular{font-size:5vw;line-height:.86;display:inline-block;transform-origin:0 0;will-change:transform}
.titular>span{display:inline-block;vertical-align:top;white-space:nowrap}
.titular .t-d,.titular .t-x{color:transparent;-webkit-background-clip:text;background-clip:text;
  background-image:linear-gradient(180deg,rgba(222,246,230,.94) 0%,rgba(150,222,176,.46) 55%,rgba(95,227,154,.06) 100%)}
.titular .t-x{overflow:hidden}
.titular .t-esp{width:.26em}
#capa-atras .titular.midiendo{font-size:100px!important;transform:none!important}
#capa-atras .titular.midiendo>span{font-size:100px;max-width:none!important}
.titular .t-im{color:transparent;-webkit-text-stroke:max(1.5px,.024em) rgba(176,226,190,.88)}
body.sin-3d #escenario{background:
  radial-gradient(60vw 60vw at 72% 55%,rgba(11,12,14,.22),transparent 60%)}

/* etiquetas de choque */
#etiquetas{position:absolute;inset:0;z-index:4}
.etq{position:absolute;transform:translate(14px,-50%);font:500 11px/1.3 var(--mono);color:var(--tinta);
  background:var(--hueso);border:1px solid var(--tinta);padding:5px 8px 5px 10px;white-space:nowrap;
  box-shadow:4px 4px 0 var(--tinta);transition:opacity .3s}
.etq::before{content:"";position:absolute;left:-15px;top:50%;width:14px;border-top:1px solid var(--tinta)}
.etq b{color:#e0281b;font-weight:500}

/* marco del movil en el capitulo AR */
#movil-ar{position:absolute;z-index:4;left:71%;top:50%;width:min(300px,62vw);aspect-ratio:9/18.5;
  transform:translate(-50%,-50%) scale(.96);border:2px solid rgba(236,232,225,.85);border-radius:38px;
  box-shadow:0 0 0 9999px rgba(4,5,6,.38),inset 0 0 0 7px rgba(4,5,6,.9);opacity:0;transition:opacity .4s}
#movil-ar .esquinas i{position:absolute;width:34px;height:34px;border:2px solid var(--scan);left:50%;top:62%}
#movil-ar .esquinas i:nth-child(1){transform:translate(-62px,-62px);border-right:0;border-bottom:0}
#movil-ar .esquinas i:nth-child(2){transform:translate(28px,-62px);border-left:0;border-bottom:0}
#movil-ar .esquinas i:nth-child(3){transform:translate(-62px,28px);border-right:0;border-top:0}
#movil-ar .esquinas i:nth-child(4){transform:translate(28px,28px);border-left:0;border-top:0}
#movil-ar.anclado .esquinas i{border-color:#6dffa8}
#movil-ar .linea-scan{position:absolute;left:10%;right:10%;height:2px;top:20%;
  background:linear-gradient(90deg,transparent,var(--scan),transparent);animation:barrido 2.4s ease-in-out infinite alternate}
#movil-ar.anclado .linea-scan{opacity:0}
@keyframes barrido{to{top:84%}}
.ar-estado{position:absolute;left:14px;right:14px;bottom:18px;background:rgba(4,5,6,.8);border:1px solid rgba(127,240,255,.35);
  border-radius:14px;padding:10px 12px;display:grid;grid-template-columns:auto 1fr;gap:0 9px;align-items:center;
  font:500 11px/1.35 var(--mono);color:var(--hueso)}
.ar-estado b{font-weight:500}
.ar-estado small{grid-column:2;color:rgba(236,232,225,.6)}
.ar-estado .punto{width:8px;height:8px;border-radius:50%;background:var(--scan);grid-row:span 2;animation:latido 1s infinite}
#movil-ar.anclado .punto{background:#6dffa8}
@keyframes latido{50%{opacity:.25}}

/* ------------------------------------------------------------- cabecera */
#cabecera{position:fixed;top:0;left:0;right:0;z-index:20;display:flex;align-items:center;gap:24px;
  padding:18px var(--margen);color:var(--texto);transition:color .6s}
.marca{display:flex;align-items:center;gap:6px;text-decoration:none;line-height:0}
.marca img{display:block;height:auto}
.marca .iso{width:34px}
.marca .palabra{width:132px;margin-top:-2px}
/* Negativo sobre verde u oscuro; color sobre el capitulo claro (4). */
.marca .col{display:none}
body[data-cap="4"] .marca .col{display:block}
body[data-cap="4"] .marca .neg{display:none}
.menu{display:flex;gap:22px;margin-left:auto;font:500 12px/1 var(--mono);text-transform:uppercase;letter-spacing:.06em}
.menu a{text-decoration:none;opacity:.72;transition:opacity .2s}
.menu a:hover{opacity:1}
.btn-acceso{display:flex;align-items:center;gap:9px;background:var(--texto);color:var(--fondo);border:0;cursor:pointer;
  font:600 13px/1 var(--display);padding:11px 16px;border-radius:999px;transition:background .6s,color .6s,transform .2s}
.btn-acceso:hover{transform:translateY(-1px)}
.btn-acceso .led{width:7px;height:7px;border-radius:50%;background:var(--senal);box-shadow:0 0 0 3px rgba(176,212,140,.35)}
body[data-cap="9"] .btn-acceso .led{background:#fff}
.btn-acceso.dentro .led{background:#3fdc7a}

/* riel */
#riel{position:fixed;right:calc(var(--margen) - 6px);top:50%;transform:translateY(-50%);z-index:20;display:flex;flex-direction:column;gap:4px}
#riel a{display:flex;align-items:center;justify-content:flex-end;gap:10px;text-decoration:none;
  font:500 10px/1 var(--mono);color:var(--texto);opacity:.42;padding:5px 0;transition:opacity .3s}
#riel a em{font:500 10px/1 var(--mono);text-transform:uppercase;letter-spacing:.08em;opacity:0;transform:translateX(6px);transition:.3s}
#riel a::after{content:"";width:14px;height:1px;background:currentColor;transition:width .35s}
#riel a:hover{opacity:.9}
#riel a:hover em,#riel a.activo em{opacity:1;transform:none}
#riel a.activo{opacity:1}
#riel a.activo::after{width:34px}

/* telemetria */
#telemetria,#coordenadas{position:fixed;z-index:20;font:500 10px/1.5 var(--mono);letter-spacing:.06em;color:var(--texto);opacity:.62;
  transition:color .6s}
#telemetria{left:var(--margen);bottom:18px;display:flex;gap:16px}
#telemetria b{font-weight:500;display:inline-block;min-width:3.2ch}
#coordenadas{right:var(--margen);bottom:18px;text-align:right}

/* ------------------------------------------------------------- capitulos */
#capitulos{position:relative;z-index:10}
.cap{position:relative;min-height:150vh;padding:0 var(--margen)}
.cap-portada{min-height:140vh}
.cap-ancha{min-height:165vh}
.cap-acceso{min-height:115vh}
.fijo{position:sticky;top:0;min-height:100vh;display:flex;flex-direction:column;justify-content:safe center;padding:84px 0 56px}
.texto{max-width:470px}
.texto.ancho{max-width:700px}

.kicker{display:flex;align-items:center;gap:9px;margin:0 0 18px;font:500 11px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.1em;color:var(--suave)}
.kicker .dot{width:7px;height:7px;border-radius:50%;background:currentColor}
.num{display:flex;align-items:center;gap:12px;margin:0 0 20px;font:500 12px/1 var(--mono);text-transform:uppercase;letter-spacing:.12em}
.num i{width:38px;height:1px;background:currentColor}
.num .tag{border:1px solid var(--scan);color:var(--scan);padding:3px 7px;border-radius:999px;font-size:10px}
h2{font:800 clamp(38px,5.2vw,78px)/.96 var(--display);letter-spacing:-.045em;margin:0 0 22px}
h2 em{font-size:1.1em;line-height:.8}
h2.grande{font-size:clamp(44px,6.6vw,112px)}
.cuerpo{font-size:17px;line-height:1.6;color:var(--suave);margin:0 0 28px;max-width:44ch}
.cifras{display:flex;flex-wrap:wrap;gap:12px 36px;margin:0;padding-top:20px;border-top:1px solid var(--linea)}
.cifras div{min-width:0}
.cifras dt{font:500 10px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.09em;color:var(--suave);margin-bottom:6px}
.cifras dd{margin:0;font:700 30px/1 var(--display);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.cifras dd.chico{font-size:17px;font-weight:600;letter-spacing:-.01em;line-height:1.25;padding-top:6px}
.cifras small{font:500 12px var(--mono);letter-spacing:0;color:var(--suave)}

/* portada */
.cap-portada .fijo{justify-content:flex-end;padding-bottom:12vh}
.cap-portada .kicker{position:absolute;top:max(84px,11vh);left:0;color:var(--texto);opacity:.78}
/* Orgullosamente latinoamericano: el mapa en puntos (de la imagen de Alvaro)
   con Asuncion encendida, bajo el kicker. */
.latam{position:absolute;top:calc(max(84px,11vh) + 30px);left:0;display:flex;align-items:center;gap:14px;margin:0;
  opacity:0;transform:translateY(6px)}
body:not(.entrando) .latam{animation:latam-entra .9s cubic-bezier(.2,.7,.2,1) .25s forwards}
.latam-mapa{width:52px;height:auto;flex:none;overflow:visible;color:#8fdcae}
.latam-mapa .tierra{stroke:currentColor;stroke-width:.82;stroke-linecap:round;fill:none;opacity:.82}
.latam-mapa .asu{fill:#fff}
.latam-mapa .asu-aro{fill:none;stroke:#fff;stroke-width:.35;transform-box:fill-box;transform-origin:center;
  animation:latam-pulso 2.4s ease-out infinite}
body:not(.entrando) .latam-mapa{-webkit-mask-image:linear-gradient(180deg,#000 40%,transparent 60%);mask-image:linear-gradient(180deg,#000 40%,transparent 60%);
  -webkit-mask-size:100% 250%;mask-size:100% 250%;-webkit-mask-position:0 100%;mask-position:0 100%;
  animation:latam-barre 1.6s cubic-bezier(.4,0,.2,1) .35s forwards}
.latam p{margin:0;padding-left:14px;border-left:1px solid var(--linea);display:flex;flex-direction:column;gap:5px}
.latam b{font:500 19px/1.1 var(--display);letter-spacing:-.01em;color:var(--texto)}
.latam b em{font-size:1.14em;color:#bfe9cc}
.latam small{font:500 10px/1.2 var(--mono);text-transform:uppercase;letter-spacing:.12em;color:var(--suave)}
@keyframes latam-entra{to{opacity:1;transform:none}}
@keyframes latam-barre{to{-webkit-mask-position:0 0;mask-position:0 0}}
@keyframes latam-pulso{0%{transform:scale(.6);opacity:.95}100%{transform:scale(2.6);opacity:0}}
@media (prefers-reduced-motion:reduce){.latam{opacity:1;transform:none;animation:none!important}
  .latam-mapa{-webkit-mask-image:none!important;mask-image:none!important;animation:none!important}.latam-mapa .asu-aro{animation:none}}
body[data-cap="0"] .cap-portada .btn.primario{background:var(--scan);border-color:var(--scan);color:#06110b}
body[data-cap="0"] .cap-portada .btn.fantasma{border-color:rgba(176,226,190,.5)}
.portada-pie{max-width:520px}
.bajada{font:500 clamp(18px,1.7vw,23px)/1.4 var(--display);letter-spacing:-.01em;margin:0 0 26px}
.bajada em{font-size:1.12em}
.acciones{display:flex;flex-wrap:wrap;gap:12px}
.esquina-datos{position:absolute;right:calc(var(--margen) + 64px);bottom:12vh;list-style:none;margin:0;padding:0;
  display:flex;gap:28px;text-align:left}
.esquina-datos li{display:flex;flex-direction:column;gap:4px;border-left:1px solid var(--linea);padding-left:12px}
.esquina-datos b{font:800 17px/1 var(--display);letter-spacing:-.02em}
.esquina-datos span{font:500 10px/1.3 var(--mono);text-transform:uppercase;letter-spacing:.07em;color:var(--suave)}

/* botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:999px;cursor:pointer;
  font:600 15px/1 var(--display);padding:16px 24px;text-decoration:none;border:1px solid var(--texto);transition:transform .2s,background .3s,color .3s}
.btn:hover{transform:translateY(-2px)}
.btn.primario{background:var(--texto);color:var(--fondo)}
.btn.fantasma{background:transparent;color:var(--texto)}
.btn.grande{font-size:18px;padding:20px 30px;margin:8px 0 26px;align-self:flex-start}
.btn.ancho{width:100%}
.btn:disabled{opacity:.5;cursor:default;transform:none}

/* estructura */
.leyenda-dc{display:flex;align-items:center;gap:10px;margin-top:22px;font:500 10px var(--mono);color:var(--suave)}
.leyenda-dc i{flex:0 1 180px;height:5px;border-radius:3px;background:linear-gradient(90deg,#338cff,#40f2d9,#f2eb4d,#ff4d1a)}

/* coordinacion */
.disciplinas{display:flex;flex-wrap:wrap;gap:8px 18px;list-style:none;padding:0;margin:22px 0 0;font:500 11px var(--mono)}
.disciplinas li{display:flex;align-items:center;gap:7px}
.disciplinas i{width:10px;height:10px;border:1px solid var(--linea)}

/* 4D */
.linea-tiempo{margin:0 0 22px}
.lt-cab{display:flex;justify-content:space-between;font:500 12px var(--mono);margin-bottom:8px}
.lt-cab b{font-weight:500;color:var(--texto)}
.lt-barra{height:4px;background:var(--linea);position:relative;overflow:hidden}
.lt-barra i{position:absolute;inset:0 auto 0 0;width:0;background:var(--senal)}

/* metodo */
.flujo{list-style:none;margin:6px 0 24px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  background:var(--linea);border:1px solid var(--linea);counter-reset:paso}
.flujo li{background:var(--fondo);padding:18px 18px 20px;counter-increment:paso;transition:background .9s}
.flujo li::before{content:"0" counter(paso);display:block;font:500 10px var(--mono);color:var(--senal);margin-bottom:12px}
.flujo b{display:block;font:700 20px/1.1 var(--display);letter-spacing:-.02em;margin-bottom:6px}
.flujo span{font-size:13px;color:var(--suave);line-height:1.4}
.herramientas{font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--suave);margin:0}

/* acceso */
.cap-acceso .fijo{justify-content:center}
.roles{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin:0 0 30px;padding-top:20px;border-top:1px solid var(--linea)}
.roles h3{font:800 18px/1 var(--display);letter-spacing:-.02em;margin:0 0 8px}
.roles p{margin:0;font-size:13px;line-height:1.5;color:var(--suave)}
.pie{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 30px;margin-top:36px;font:500 10px/1.5 var(--mono);
  letter-spacing:.05em;text-transform:uppercase;color:var(--suave)}

/* ------------------------------------------------------------- dialogo */
#acceso{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:18px}
#acceso[hidden]{display:none}
#acceso .velo{position:absolute;inset:0;background:rgba(6,7,8,.55);backdrop-filter:blur(10px) saturate(1.2);
  -webkit-backdrop-filter:blur(10px) saturate(1.2);animation:aparecer .35s ease both}
.panel-acceso{position:relative;width:min(440px,100%);background:#0d0e10;color:var(--hueso);border:1px solid rgba(236,232,225,.14);
  border-radius:22px;padding:34px 30px 26px;box-shadow:0 40px 120px rgba(0,0,0,.5);animation:subir .45s cubic-bezier(.2,.8,.2,1) both;
  --texto:var(--hueso);--fondo:#0d0e10;--suave:rgba(236,232,225,.6);--linea:rgba(236,232,225,.14)}
.panel-acceso::before{content:"";position:absolute;inset:-1px;border-radius:22px;padding:1px;pointer-events:none;
  background:conic-gradient(from var(--giro,0deg),transparent 0 70%,var(--senal) 85%,transparent 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
  animation:girar 5s linear infinite}
@property --giro{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes girar{to{--giro:360deg}}
@keyframes aparecer{from{opacity:0}}
@keyframes subir{from{opacity:0;transform:translateY(18px) scale(.98)}}
.panel-acceso h2{font-size:38px;margin:0 0 24px}
.panel-acceso .logo-acceso{display:block;width:230px;height:auto;margin:-6px 0 18px -6px}
.panel-acceso .kicker{margin-bottom:12px}
.panel-acceso .kicker .dot{background:var(--senal)}
.cerrar{position:absolute;top:14px;right:16px;background:none;border:0;color:var(--suave);font-size:26px;cursor:pointer;line-height:1}
.panel-acceso label{display:block;font:500 10px/1 var(--mono);text-transform:uppercase;letter-spacing:.1em;color:var(--suave);margin:0 0 8px}
.panel-acceso input{width:100%;padding:14px 15px;border-radius:12px;border:1px solid rgba(236,232,225,.16);background:#060708;
  color:var(--hueso);font:15px var(--display);margin-bottom:18px;transition:border-color .2s,box-shadow .2s}
.panel-acceso input:focus{outline:none;border-color:var(--senal);box-shadow:0 0 0 4px rgba(96,150,70,.25)}
.campo-codigo{position:relative}
.campo-codigo .enlace{position:absolute;right:12px;top:14px}
.enlace{background:none;border:0;color:var(--suave);font:500 11px var(--mono);text-transform:uppercase;letter-spacing:.08em;cursor:pointer;padding:0}
.enlace:hover{color:var(--hueso)}
#salir{display:block;margin:16px auto 0}
.panel-acceso .btn.primario{background:var(--senal);border-color:var(--senal);color:var(--tinta);margin-top:4px}
.panel-acceso .btn.fantasma{border-color:rgba(236,232,225,.22)}
.o{display:flex;align-items:center;gap:12px;margin:16px 0;color:var(--suave);font:500 10px var(--mono);text-transform:uppercase}
.o::before,.o::after{content:"";flex:1;height:1px;background:rgba(236,232,225,.12)}
.aviso{display:none;margin-top:16px;font-size:14px;padding:11px 13px;border-radius:10px}
.aviso.ver{display:block}
.aviso.bien{background:#10231a;color:#56d98a;border:1px solid #1f4d2e}
.aviso.mal{background:#2a1517;color:#ff8a80;border:1px solid #5c2427}
.nota{margin:18px 0 0;font-size:12px;color:var(--suave);text-align:center}
.sin-js{position:fixed;bottom:0;left:0;right:0;z-index:60;background:var(--tinta);color:var(--hueso);padding:14px;text-align:center;margin:0}

/* ------------------------------------------------------------- movil */
@media (max-width:1180px){
  .esquina-datos{position:static;margin-top:30px;gap:18px;flex-wrap:wrap}
}
@media (max-width:900px){
  .menu{display:none}
  #riel{display:none}
  .flujo{grid-template-columns:repeat(2,1fr)}
  .roles{grid-template-columns:1fr;gap:16px}
}
@media (max-width:760px){
  #cabecera{padding:14px 16px;gap:12px}
  #cabecera .btn-acceso{margin-left:auto}
  .cap{padding:0 16px}
  #escenario{--tope:176px}
  .gigante{font-size:23vw}
  .fijo{justify-content:flex-end;padding:90px 0 56px}
  .texto{max-width:none}
  .texto:not(.ancho){background:linear-gradient(to top,var(--fondo) 55%,transparent);margin:0 -16px;padding-left:16px;padding-right:16px;
    transition:background .9s}
  h2{font-size:clamp(34px,10vw,48px)}
  .cuerpo{font-size:15px}
  .cifras dd{font-size:24px}
  .cap-portada .kicker{top:78px}
  .latam{top:120px;gap:10px}.latam-mapa{width:40px}.latam b{font-size:16px}.latam p{padding-left:10px}
  #telemetria{display:none}
  #coordenadas{display:none}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* ------------------------------------------------------------- pushover */
.curva{margin:0 0 20px;max-width:360px}
.curva svg{width:100%;height:clamp(70px,12vh,110px);display:block;overflow:visible}
.curva .ejes{fill:none;stroke:var(--linea);stroke-width:1}
.curva .total{fill:none;stroke:var(--linea);stroke-width:1.5;stroke-dasharray:3 4}
.curva .avance{fill:none;stroke:var(--scan);stroke-width:2.2}
.curva circle{fill:var(--senal);stroke:var(--fondo);stroke-width:2}
.curva text{font:500 8px var(--mono);fill:var(--suave);letter-spacing:.06em}
.curva figcaption{display:flex;gap:12px;align-items:center;font:500 10px var(--mono);color:var(--suave);margin-top:6px}
.curva figcaption span::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px;vertical-align:-1px}
.curva figcaption span:nth-child(1)::before{background:#59f28c}
.curva figcaption span:nth-child(2)::before{background:#ffd933}
.curva figcaption span:nth-child(3)::before{background:#ff381f}
.curva figcaption em{font-family:var(--mono);font-style:normal;margin-left:auto;opacity:.7}

/* ------------------------------------------------------------- informacion */
.chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.chips li{font:500 11px var(--mono);border:1px solid var(--linea);border-radius:999px;padding:6px 11px;color:var(--suave)}
#guia{position:absolute;inset:0;z-index:4;opacity:0;overflow:visible}
#guia polyline{fill:none;stroke:var(--senal);stroke-width:1.5}
#guia circle{fill:var(--senal)}
.ficha{position:absolute;z-index:5;left:0;top:0;width:250px;background:rgba(11,12,14,.92);color:var(--hueso);
  border:1px solid rgba(96,150,70,.6);border-radius:14px;padding:14px 16px;opacity:0;
  box-shadow:0 24px 60px rgba(0,0,0,.45);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.ficha-cab{display:flex;justify-content:space-between;margin:0 0 6px;font:500 10px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--senal)}
.ficha-cab b{font-weight:500;color:var(--hueso)}
.ficha h4{margin:0 0 10px;font:800 17px/1.1 var(--display);letter-spacing:-.02em}
.ficha dl{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:8px 12px}
.ficha dt{font:500 9px var(--mono);text-transform:uppercase;letter-spacing:.08em;color:rgba(236,232,225,.5)}
.ficha dd{margin:2px 0 0;font:500 12px var(--mono);word-break:break-all}

/* ------------------------------------------------------------- herramientas e IA */
.cinta{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--linea);border:1px solid var(--linea);margin:0 0 18px}
.cinta div{background:var(--fondo);padding:12px 14px 14px;transition:background .9s}
.cinta h5{margin:0 0 5px;font:500 10px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--senal)}
.cinta p{margin:0;font-size:13px;line-height:1.35}
.cinta .ia{background:linear-gradient(135deg,rgba(96,150,70,.24),transparent 70%),var(--fondo)}
.mcp{display:flex;align-items:center;flex-wrap:wrap;gap:10px;font:500 11px var(--mono);text-transform:uppercase;letter-spacing:.08em}
.mcp i{width:34px;height:1px;background:linear-gradient(90deg,var(--senal),var(--scan));position:relative}
.mcp i::after{content:"";position:absolute;right:-1px;top:-3px;border:3px solid transparent;border-left-color:var(--scan)}
.mcp .nodo{border:1px solid var(--linea);padding:7px 11px;border-radius:8px}
.mcp .nodo.ia{background:var(--senal);color:var(--tinta);border-color:var(--senal)}
.mcp .destinos{display:flex;flex-wrap:wrap;gap:6px}
.mcp .destinos span{border:1px solid var(--linea);padding:7px 10px;border-radius:8px;color:var(--suave)}
@media (max-width:900px){.cinta{grid-template-columns:repeat(2,1fr)}.ficha{display:none}#guia{display:none}}
@media (max-width:760px){#movil-ar{left:50%}}
@media (max-height:720px){.kicker{margin-bottom:10px}.num{margin-bottom:12px}.cifras dd{font-size:24px}.roles{margin-bottom:18px}#telemetria,#coordenadas{display:none}.cuerpo{font-size:15px;margin-bottom:18px}h2{font-size:clamp(34px,4.4vw,64px)}}

/* firma y contacto */
.firma{margin:0 0 14px;font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--suave)}
.firma b{color:var(--texto);font-weight:500}
.contacto{margin:6px 0 0;padding-top:22px;border-top:1px solid var(--linea)}
.firma-grande{margin:0;font:800 24px/1.1 var(--display);letter-spacing:-.02em}
.contacto .rol{margin:4px 0 12px;font:500 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--suave)}
.contacto ul{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.contacto a{display:inline-block;text-decoration:none;font:500 12px var(--mono);border:1px solid var(--linea);border-radius:999px;padding:8px 13px;transition:background .2s,color .2s}
.contacto a:hover{background:var(--texto);color:var(--fondo)}

/* recuperar codigo */
.olvide{display:block;margin:16px auto 0}
.cuerpo.chico{font-size:13px;line-height:1.5;margin:0 0 16px}

/* captcha y doble factor */
.captcha:not(:empty){margin:0 0 14px;min-height:0}
.panel-acceso input.totp{font:600 26px var(--mono);letter-spacing:.3em;text-align:center}