/* ============================================================
   VARIANTE 5 — TURNO DE NOCHE (base heredada de la V1; arte en el bloque "VARIANTE 5" al final)
   "Un escenario industrial fijo donde el comercio se mueve:
    el fondo permanece, el entorno evoluciona."
   Tokens are closed by the brief (punto 4); nothing below adds a colour.
   ============================================================ */
:root{
  --ink:#0B0E11;
  --steel:#12161B;
  --steel-2:#181D24;
  --bone:#E8EAED;
  --mist:#9AA3AD;
  --mist-dim:#7D8690;
  --amber:#C9A96A;
  --amber-soft:#D8BD88;
  --amber-a08:rgba(201,169,106,.08);
  --amber-a16:rgba(201,169,106,.16);
  --amber-a40:rgba(201,169,106,.4);
  --hair:rgba(232,234,237,.14);
  --hair-2:rgba(232,234,237,.07);
  --panel:rgba(11,14,17,.84);
  --panel-2:rgba(18,22,27,.9);

  --f-display:'Archivo','Noto Sans SC',system-ui,-apple-system,'Segoe UI',sans-serif;
  --f-body:'Archivo','Noto Sans SC',system-ui,-apple-system,'Segoe UI',sans-serif;
  --f-mono:'Fragment Mono','Noto Sans SC',ui-monospace,Menlo,monospace;
  --w-display:600;          /* display weight, letter-spacing and width live in */
  --ls-display:-.03em;     /* variables so the type system can be swapped whole */
  --stretch-display:116%;

  --ease:cubic-bezier(.22,1,.36,1);
  --vh:100vh;
  --pad:clamp(20px,5vw,72px);
  --rail-w:0px;
  --nav-top:max(14px, env(safe-area-inset-top,0px));
  --safe-bottom:max(16px, env(safe-area-inset-bottom,0px));
  /* Grano: el interruptor y la variante viven en el atributo data-grain del
     .backdrop (body). Ver "SISTEMA DE GRANO" más abajo. */
  --measure:58ch;
}
@media (min-width:1025px){ :root{ --rail-w:156px; } }
/* Safari < 16 has no overflow:clip; hidden on <html> only (it propagates to the viewport, so position:sticky keeps working). */
@supports not (overflow-x:clip){ html{ overflow-x:hidden; } }

*{ box-sizing:border-box;margin:0;padding:0; }
html{ overflow-x:clip;-webkit-text-size-adjust:100%;background:var(--ink); }
body{
  background:var(--ink);color:var(--bone);
  font-family:var(--f-body);font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip;
}
button,a,input,textarea{ font-family:inherit;color:inherit; }
a{ text-decoration:none; }
img,video{ display:block;max-width:100%; }
::selection{ background:var(--amber);color:var(--ink); }
:focus-visible{ outline:2px solid var(--amber);outline-offset:3px; }
.mono{ font-family:var(--f-mono); }
.sr-only{ position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; }
.skip{ position:fixed;top:-60px;left:16px;z-index:700;background:var(--amber);color:var(--ink);padding:12px 16px;font-weight:600;font-size:14px; }
.skip:focus{ top:12px; }
.hidden{ display:none!important; }

/* ---------- Type roles ---------- */
.display{ font-family:var(--f-display);font-weight:var(--w-display);font-stretch:var(--stretch-display);font-optical-sizing:auto;letter-spacing:var(--ls-display);color:var(--bone);text-wrap:balance; }
html[data-lang="zh"] .display{ font-family:'Noto Serif SC',serif;font-stretch:100%;font-weight:600;letter-spacing:.01em;line-height:1.28; }
.h1{ font-size:clamp(42px,5.7vw,94px);line-height:1.01; }
.h2{ font-size:clamp(32px,3.9vw,60px);line-height:1.06; }
.h3{ font-size:clamp(24px,2.3vw,34px);line-height:1.12; }
html[data-lang="zh"] .h1{ font-size:clamp(36px,4.6vw,76px); }
html[data-lang="zh"] .h2{ font-size:clamp(28px,3.2vw,50px); }
.lead{ font-size:clamp(16px,1.25vw,19px);line-height:1.6;color:var(--bone);max-width:var(--measure); }
.body{ font-size:clamp(15px,1.08vw,17px);line-height:1.68;color:var(--mist);max-width:var(--measure); }
.body + .body{ margin-top:14px; }
.note{ font-size:13.5px;line-height:1.6;color:var(--mist); }
.label{ font-family:var(--f-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--mist); }
html[data-lang="zh"] .label{ letter-spacing:.06em; }

/* Manifest divider: hairline + mono label (punto 4). The number is the scene's
   real place in the sequence, so it is information, not ornament. */
.kicker{ display:flex;align-items:center;gap:14px;font-family:var(--f-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mist);margin-bottom:22px; }
html[data-lang="zh"] .kicker{ letter-spacing:.06em; }
.kicker .k-line{ width:36px;height:1px;background:var(--amber);flex:none; }
.kicker .k-num{ color:var(--amber); }

/* ---------- Buttons ---------- */
.btn{ display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:48px;padding:13px 22px;border-radius:2px;font-family:var(--f-body);font-size:15px;font-weight:500;letter-spacing:.005em;cursor:pointer;border:1px solid transparent;transition:background .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease);-webkit-tap-highlight-color:transparent;text-align:left; }
.btn-primary{ background:var(--amber);color:var(--ink);border-color:var(--amber); }
.btn-primary:hover{ background:var(--amber-soft);border-color:var(--amber-soft); }
.btn-ghost{ background:rgba(11,14,17,.35);color:var(--bone);border-color:var(--hair); }
.btn-ghost:hover{ border-color:var(--amber);color:var(--amber-soft); }
.btn[disabled]{ opacity:.45;cursor:not-allowed; }
.btn .arw{ font-family:var(--f-mono);font-size:14px;transition:transform .3s var(--ease); }
.btn:hover .arw{ transform:translateX(3px); }

/* ---------- Demonstration badge (punto 6) ---------- */
.demo-badge{ display:inline-flex;align-items:center;gap:7px;font-family:var(--f-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--amber);border:1px solid var(--amber-a40);padding:4px 9px 4px 8px;white-space:nowrap;line-height:1.3;vertical-align:middle; }
.demo-badge::before{ content:"";width:6px;height:6px;background:var(--amber);flex:none; }
html[data-lang="zh"] .demo-badge{ letter-spacing:.04em; }

/* ============================================================
   BACKDROP — the fixed stage. It never scrolls; scenes change what
   is on it (video layer, data grid, scrim). Posters are the floor:
   if a video is missing or blocked, its poster is the scene.
   ============================================================ */
.backdrop{ position:fixed;inset:0;z-index:0;overflow:hidden;background:var(--ink);pointer-events:none; }
.bd-layer{ position:absolute;inset:0;opacity:0;visibility:hidden; }
.bd-layer.is-on{ opacity:1;visibility:visible; }
.bd-layer > .bd-move{ position:absolute;inset:0; }
.bd-layer video,.bd-layer img{ position:absolute;inset:0;width:100%;height:100%;object-fit:cover; }
.bd-layer[data-bd="port"] .bd-move{ transform-origin:62% 55%; }
.motion .bd-layer[data-bd="port"] .bd-breathe{ animation:portBreathe 28s ease-in-out infinite alternate; }
@keyframes portBreathe{ from{ transform:scale(1); } to{ transform:scale(1.055); } }
.bd-breathe{ position:absolute;inset:0; }
/* No-JS: the port poster is the permanent stage. */
.bd-fallback{ display:none; }
.no-js .bd-fallback{ display:block;opacity:.55; }

.bd-grid{ position:absolute;inset:-4%;opacity:0;transform-origin:50% 60%;
  background-image:
    linear-gradient(rgba(232,234,237,.075) 1px, transparent 1px),
    linear-gradient(90deg, rgba(232,234,237,.075) 1px, transparent 1px);
  background-size:96px 96px;
  -webkit-mask-image:radial-gradient(ellipse 70% 62% at 58% 52%, #000 30%, transparent 78%);
          mask-image:radial-gradient(ellipse 70% 62% at 58% 52%, #000 30%, transparent 78%);
}
.bd-grid i{ position:absolute;font-family:var(--f-mono);font-style:normal;font-size:10px;letter-spacing:.08em;color:rgba(201,169,106,.55); }
.bd-scrim{ position:absolute;inset:0;background:var(--ink);opacity:.4; }
.bd-shade{ position:absolute;inset:0;
  background:
    linear-gradient(180deg, rgba(11,14,17,.72) 0%, rgba(11,14,17,0) 22%, rgba(11,14,17,0) 58%, rgba(11,14,17,.9) 100%),
    linear-gradient(90deg, rgba(11,14,17,.78) 0%, rgba(11,14,17,.18) 52%, rgba(11,14,17,.32) 100%);
}
.bd-tone{ position:absolute;inset:0;background:radial-gradient(ellipse 80% 70% at 70% 40%, rgba(201,169,106,.05), transparent 70%); }

/* ============================================================
   SISTEMA DE GRANO — interruptor + 5 variantes sutiles
   ------------------------------------------------------------
   INTERRUPTOR: atributo data-grain del <div class="backdrop">.
     data-grain="off"       → sin grano ni viñeta (estado publicado)
     data-grain="original"  → el grano de antes (64px a 200px, .04)
     data-grain="polvo"     → 1 · Polvo fino
     data-grain="halo"      → 2 · Halo de lectura
     data-grain="penumbra"  → 3 · Penumbra (viñeta, sin grano)
     data-grain="pelicula"  → 4 · Película tenue (grano animado)
     data-grain="velo"      → 5 · Velo editorial (mezcla)
   Cualquier otro valor equivale a "off". Sin JS: es CSS puro.
   Capas: .bd-veil (viñeta/oscurecido) y .bd-grain (textura).
   Solo opacity/transform; nada se anima con movimiento reducido.
   ============================================================ */
:root{
  /* Ruido fino vectorial (feTurbulence): grano de ~1px, sin archivo extra. */
  --noise-fine:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 1.6 -.55'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  /* Zona de lectura: centro (--hx,--hy) y tamaño (--hw,--hh) del bloque de texto
     de la escena activa. Por defecto, el del Hero (≈26–71% ancho, 31–89% alto). */
  --read-zone:radial-gradient(ellipse var(--hw) var(--hh) at var(--hx) var(--hy), #000 0%, rgba(0,0,0,.85) 40%, transparent 80%);
}
/* Registradas para que el halo se deslice entre escenas en lugar de saltar. */
@property --hx{ syntax:"<percentage>";inherits:true;initial-value:46%; }
@property --hy{ syntax:"<percentage>";inherits:true;initial-value:62%; }
@property --hw{ syntax:"<percentage>";inherits:true;initial-value:46%; }
@property --hh{ syntax:"<percentage>";inherits:true;initial-value:52%; }
.backdrop{ --hx:46%;--hy:62%;--hw:46%;--hh:52%;transition:--hx 1.1s ease,--hy 1.1s ease,--hw 1.1s ease,--hh 1.1s ease; }
/* Posición del texto en cada escena (medida a 1920×1080; la JS pone data-scene). */
.backdrop[data-scene="about"]{ --hx:42%;--hy:52%;--hw:40%;--hh:58%; }
.backdrop[data-scene="how"]{ --hx:48%;--hy:52%;--hw:50%;--hh:62%; }
.backdrop[data-scene="programs"]{ --hx:50%;--hy:60%;--hw:52%;--hh:56%; }
.backdrop[data-scene="trace"]{ --hx:50%;--hy:50%;--hw:52%;--hh:56%; }
.backdrop[data-scene="contact"]{ --hx:44%;--hy:50%;--hw:42%;--hh:46%; }
.backdrop[data-scene="evidence"],.backdrop[data-scene="plan"],.backdrop[data-scene="funding"],.backdrop[data-scene="faq"]{ --hx:46%;--hy:52%;--hw:56%;--hh:66%; }
.backdrop[data-scene="end"]{ --hx:56%;--hy:74%;--hw:50%;--hh:40%; }
/* Móvil: el texto ocupa todo el ancho, así que el halo se ensancha. */
@media (max-width:700px){ .backdrop,.backdrop[data-scene]{ --hx:50%;--hw:80%; } }
.bd-veil,.bd-grain{ display:none;position:absolute;inset:0;pointer-events:none; }

/* Original (referencia) */
[data-grain="original"] .bd-grain{ display:block;opacity:.04;background-image:url("assets/grain.png");background-size:200px 200px; }

/* 1 · POLVO FINO — grano de 1px casi imperceptible en toda la pantalla.
   Da "papel" al video sin ensuciar la letra. */
[data-grain="polvo"] .bd-grain{ display:block;opacity:.05;background-image:var(--noise-fine);background-size:180px 180px;mix-blend-mode:overlay; }

/* 2 · HALO DE LECTURA — la textura existe solo detrás del texto del Hero,
   (la columna central), junto con un oscurecido leve: la letra se asienta sobre una base mate
   mientras los bordes de la imagen quedan limpios. */
/* Intensidad (subida un punto a pedido de Lex): centro .54 → borde .22 → limpio. */
[data-grain="halo"] .bd-veil{ display:block;background:radial-gradient(ellipse var(--hw) var(--hh) at var(--hx) var(--hy), rgba(11,14,17,.54), rgba(11,14,17,.22) 50%, transparent 82%); }
[data-grain="halo"] .bd-grain{ display:block;opacity:.11;background-image:var(--noise-fine);background-size:180px 180px;mix-blend-mode:overlay;-webkit-mask-image:var(--read-zone);mask-image:var(--read-zone); }

/* 3 · PENUMBRA — sin grano. Viñeta suave que baja los bordes y deja una
   luz centrada en la imagen; el texto gana contraste por el fondo, no por textura. */
[data-grain="penumbra"] .bd-veil{ display:block;background:
  radial-gradient(ellipse 120% 95% at 50% 50%, transparent 42%, rgba(11,14,17,.38) 82%, rgba(11,14,17,.62) 100%),
  linear-gradient(90deg, rgba(11,14,17,.22) 0%, transparent 46%); }

/* 4 · PELÍCULA TENUE — grano fino que "respira" como emulsión de cine.
   Saltos de 8 pasos cada 0.9 s (lento, nada de parpadeo). Con movimiento
   reducido queda quieto. */
[data-grain="pelicula"] .bd-grain{ display:block;inset:-180px;opacity:.06;background-image:var(--noise-fine);background-size:180px 180px;mix-blend-mode:overlay;will-change:transform; }
.motion [data-grain="pelicula"] .bd-grain{ animation:grainShift .9s steps(1) infinite; }
@keyframes grainShift{
  0%{transform:translate3d(0,0,0)} 12.5%{transform:translate3d(-61px,37px,0)} 25%{transform:translate3d(43px,-89px,0)} 37.5%{transform:translate3d(-117px,-23px,0)}
  50%{transform:translate3d(91px,71px,0)} 62.5%{transform:translate3d(-29px,113px,0)} 75%{transform:translate3d(127px,-53px,0)} 87.5%{transform:translate3d(-83px,-131px,0)} 100%{transform:translate3d(0,0,0)}
}
@media (prefers-reduced-motion:reduce){ [data-grain="pelicula"] .bd-grain{ animation:none!important; } }

/* 5 · VELO EDITORIAL (mezcla) — penumbra muy leve en los bordes + polvo fino
   en toda la imagen + un poco más de textura y sombra solo en la zona del texto.
   Es la que más ayuda a la letra con menos presencia visible. */
[data-grain="velo"] .bd-veil{ display:block;background:
  radial-gradient(ellipse 46% 52% at 46% 62%, rgba(11,14,17,.3), transparent 78%),
  radial-gradient(ellipse 125% 100% at 50% 50%, transparent 50%, rgba(11,14,17,.32) 100%); }
[data-grain="velo"] .bd-grain{ display:block;opacity:.035;background-image:var(--noise-fine),var(--noise-fine);background-size:180px 180px,180px 180px;mix-blend-mode:overlay;
  -webkit-mask-image:linear-gradient(rgba(0,0,0,.55),rgba(0,0,0,.55)),var(--read-zone);mask-image:linear-gradient(rgba(0,0,0,.55),rgba(0,0,0,.55)),var(--read-zone); }

/* ============================================================
   ROUTE RAIL — "el viaje del contenedor" (punto 2.2 / 3.2)
   Desktop: left edge. Mobile: slim top bar.
   ============================================================ */
.route{ position:fixed;z-index:70;pointer-events:none;color:var(--mist); }
.no-js .route{ display:none; }
.route-ai{ font-family:var(--f-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--amber);white-space:nowrap; }
html[data-lang="zh"] .route-ai{ letter-spacing:.04em; }
.route-track{ position:relative; }
.route-base,.route-fill{ position:absolute;background:var(--hair); }
.route-fill{ background:var(--amber); }
.route-stops{ list-style:none;position:absolute;inset:0; }
.route-stop{ position:absolute;display:flex;align-items:center;gap:10px;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--mist-dim);transition:color .4s var(--ease);white-space:nowrap; }
html[data-lang="zh"] .route-stop{ letter-spacing:.04em; }
.route-stop .dot{ width:9px;height:9px;border:1px solid var(--mist-dim);background:var(--ink);flex:none;transition:background .4s var(--ease),border-color .4s var(--ease); }
.route-stop.is-lit .dot{ background:var(--amber);border-color:var(--amber); }
.route-stop.is-lit{ color:var(--mist); }
.route-stop.is-here{ color:var(--bone); }
.route-tel{ white-space:nowrap;font-family:var(--f-mono);font-size:10px;letter-spacing:.02em;color:var(--mist-dim);display:flex;flex-direction:column;gap:6px;align-items:flex-start; }
.route-tel .demo-badge{ font-size:9px;padding:2px 6px; }
.route-here{ display:none; }

@media (min-width:1025px){
  .route{ left:calc(26px + env(safe-area-inset-left,0px));top:50%;transform:translateY(-50%);width:150px;height:min(62vh,500px);display:flex;flex-direction:column;gap:20px; }
  .route-track{ flex:1; }
  .route-base,.route-fill{ left:4px;top:0;width:1px;height:100%; }
  .route-fill{ transform-origin:50% 0;transform:scaleY(0); }
  .route-stop{ left:0;transform:translateY(-50%); }
  .route-stop:nth-child(1){ top:0%; } .route-stop:nth-child(2){ top:25%; } .route-stop:nth-child(3){ top:50%; }
  .route-stop:nth-child(4){ top:75%; } .route-stop:nth-child(5){ top:100%; }
}
@media (max-width:1024px){
  .route{ left:0;right:0;top:0;height:calc(30px + env(safe-area-inset-top,0px));padding:calc(7px + env(safe-area-inset-top,0px)) 16px 0;background:linear-gradient(180deg, rgba(11,14,17,.92), rgba(11,14,17,0));display:flex;justify-content:space-between;align-items:flex-start;gap:12px; }
  .route-ai{ font-size:9px; }
  .route-here{ display:block;font-family:var(--f-mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--bone); }
  .route-track{ position:absolute;left:16px;right:16px;top:calc(22px + env(safe-area-inset-top,0px));height:1px; }
  .route-base,.route-fill{ left:0;top:0;width:100%;height:1px; }
  .route-fill{ transform-origin:0 50%;transform:scaleX(0); }
  .route-stop{ top:0;transform:translate(-50%,-50%);gap:0; }
  .route-stop .lbl{ display:none; }
  .route-stop .dot{ width:7px;height:7px; }
  .route-stop:nth-child(1){ left:0%;transform:translate(0,-50%); } .route-stop:nth-child(2){ left:25%; } .route-stop:nth-child(3){ left:50%; }
  .route-stop:nth-child(4){ left:75%; } .route-stop:nth-child(5){ left:100%;transform:translate(-100%,-50%); }
  .route-tel{ display:none; }
}

/* ============================================================
   NAV
   ============================================================ */
.nav-wrap{ position:fixed;top:var(--nav-top);left:0;right:0;z-index:80;display:flex;justify-content:center;padding:0 max(14px, env(safe-area-inset-right,0px)) 0 max(14px, env(safe-area-inset-left,0px));pointer-events:none; }
@media (max-width:1024px){ .js .nav-wrap{ top:calc(34px + env(safe-area-inset-top,0px)); } }
.nav{ pointer-events:auto;display:flex;align-items:center;gap:8px;max-width:min(100%,900px);width:100%;padding:6px 8px 6px 16px;border-radius:3px;background:rgba(18,22,27,.66);border:1px solid var(--hair);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 10px 40px rgba(0,0,0,.24); }
.nav-wrap.scrolled{ justify-content:flex-end; }
.nav-wrap.scrolled .nav{ width:auto; }
.nav-wrap.scrolled .logo,.nav-wrap.scrolled .nav-links,.nav-wrap.scrolled .seg{ display:none; }
.nav-wrap.scrolled .nav-menu-btn{ display:flex; }
.no-js .nav-wrap{ position:absolute; }
.logo{ display:flex;align-items:center;gap:10px;padding-right:10px;flex:none;min-height:44px; }
.logo span{ font-family:var(--f-display);font-size:18px;font-weight:500;letter-spacing:.005em;white-space:nowrap; }
.nav-links{ display:flex;align-items:center;gap:2px;flex:1;overflow:hidden; }
.nav-links a{ position:relative;padding:9px 12px;font-size:13.5px;color:var(--mist);white-space:nowrap;transition:color .25s ease;min-height:44px;display:flex;align-items:center; }
.nav-links a:hover{ color:var(--bone); }
.nav-links a.active{ color:var(--bone); }
.nav-links a.active::after{ content:"";position:absolute;left:12px;right:12px;bottom:8px;height:1px;background:var(--amber); }
.seg{ display:flex;align-items:center;border:1px solid var(--hair);padding:2px;flex:none;gap:1px; }
.seg button{ border:0;background:transparent;color:var(--mist);font-size:12px;font-family:var(--f-mono);padding:8px 10px;min-height:44px;min-width:44px;cursor:pointer;transition:background .25s ease,color .25s ease; }
.seg button[aria-pressed="true"],.nav-drop-langs button[aria-pressed="true"]{ background:var(--amber-a16);color:var(--bone); }
.nav-menu-btn{ display:none;border:1px solid var(--hair);background:transparent;color:var(--bone);width:44px;height:44px;align-items:center;justify-content:center;cursor:pointer;flex:none; }
.nav-menu-btn svg{ width:16px;height:16px; }
.nav-drop{ position:fixed;top:calc(var(--nav-top) + 64px);right:14px;z-index:79;background:rgba(18,22,27,.95);border:1px solid var(--hair);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);padding:8px;display:none;flex-direction:column;min-width:210px;box-shadow:0 20px 50px rgba(0,0,0,.4); }
@media (max-width:1024px){ .nav-drop{ top:calc(100px + env(safe-area-inset-top,0px)); } }
.nav-drop.open{ display:flex; }
.nav-drop a{ padding:12px 14px;font-size:14px;color:var(--mist);min-height:44px;display:flex;align-items:center; }
.nav-drop a:hover,.nav-drop a.active{ color:var(--bone);background:rgba(232,234,237,.05); }
.nav-drop-langs{ display:flex;gap:6px;margin-top:6px;padding-top:8px;border-top:1px solid var(--hair); }
.nav-drop-langs button{ flex:1;border:1px solid var(--hair);background:transparent;color:var(--mist);font-family:var(--f-mono);font-size:12px;padding:10px 8px;min-height:44px;cursor:pointer; }

/* ============================================================
   SCENES
   Base (no-JS / reduced motion / CDN failure): plain document flow,
   every scene readable top to bottom over the fixed backdrop.
   .motion: stage scenes become sticky frames inside tall spacers;
   consecutive stage scenes overlap by one viewport, so the frame
   never "falls" — the content inside it is what changes.
   ============================================================ */
main{ position:relative;z-index:1; }
.scene{ position:relative; }
.scene-frame{ position:relative; }
.scene-content{ position:relative;width:100%; }
.grid12{ display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(16px,2vw,32px);width:100%;max-width:1360px;margin:0 auto;padding-left:calc(var(--pad) + var(--rail-w));padding-right:var(--pad); }

/* flow defaults */
.scene--stage .scene-content{ padding:calc(120px + env(safe-area-inset-top,0px)) 0 96px; }
.scene--stage + .scene--stage .scene-content{ border-top:0; }

.scene--stage.is-staged{ height:calc(var(--vh) + var(--beats,1) * var(--beat-len, 75vh));pointer-events:none; } /* overlapping spacers must never catch the pointer; only the active content does */
.scene--stage.is-staged + .scene--stage.is-staged{ margin-top:calc(var(--vh) * -1); }
.is-staged > .scene-frame{ position:sticky;top:0;height:var(--vh);overflow:hidden;pointer-events:none; }
.is-staged .scene-content{ position:absolute;inset:0;padding:0;display:flex;align-items:stretch;visibility:hidden;opacity:0; }
.is-staged .scene-content.is-active{ pointer-events:auto; }
.is-staged .scene-content > .grid12{ padding-top:calc(118px + env(safe-area-inset-top,0px));padding-bottom:calc(56px + var(--safe-bottom)); }
@media (min-width:1025px){ .is-staged .scene-content > .grid12{ padding-top:calc(104px + env(safe-area-inset-top,0px));padding-bottom:calc(92px + var(--safe-bottom)); } }
/* Runtime escape hatch: a stage scene whose content would not fit this
   viewport simply never receives .is-staged, so it reads in normal flow
   instead of being cropped (regla absoluta de disposición). */
.motion:not(.engine-ready) main,.motion:not(.engine-ready) footer{ visibility:hidden; }
.scene-inner{ grid-column:1 / -1;display:grid;grid-template-columns:subgrid;align-content:start; }

/* Flow scenes — the justified hybrid exception (punto 1): dense content
   (documents, figures, questions) reads as a polished page over the same stage. */
.scene--flow{ padding:clamp(88px,12vh,140px) 0 clamp(72px,10vh,120px); }
.scene--flow::before{ content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(11,14,17,0) 0, var(--panel) 160px, var(--panel) calc(100% - 160px), rgba(11,14,17,0) 100%);z-index:-1; }

/* ---------- HERO ---------- */
.hero .scene-content > .grid12{ align-content:end; }
.hero-copy{ grid-column:1 / span 10;display:flex;flex-direction:column; }
.hero-copy .h1{ max-width:14.5ch;margin-bottom:clamp(22px,3.4vh,40px); }
html[data-lang="en"] .hero-copy .h1{ max-width:13ch; }
html[data-lang="zh"] .hero-copy .h1{ max-width:11em; }
.hero-lower{ display:grid;grid-template-columns:repeat(10,minmax(0,1fr));column-gap:clamp(16px,2vw,32px);align-items:start; }
.hero-lower .lead{ grid-column:1 / span 5; }
.hero-statement{ grid-column:7 / span 4;padding-left:18px;border-left:1px solid var(--amber);font-family:var(--f-display);font-weight:var(--w-display);font-size:clamp(18px,1.45vw,22px);line-height:1.38;color:var(--bone); }
html[data-lang="zh"] .hero-statement{ font-weight:500; }
.hero-actions{ margin-top:clamp(22px,3.2vh,34px);display:flex;align-items:center;gap:20px 26px;flex-wrap:wrap; }
.hero-actions .note{ max-width:40ch;color:var(--mist); }
.scroll-cue{ position:absolute;left:calc(var(--pad) + var(--rail-w));bottom:calc(22px + var(--safe-bottom));display:none;align-items:center;gap:10px;font-family:var(--f-mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--mist-dim);pointer-events:none; }
.is-staged .scroll-cue{ display:flex; }
.scroll-cue i{ width:40px;height:1px;background:linear-gradient(90deg,var(--amber),transparent); }

/* ---------- ABOUT ---------- */
.about .scene-content > .grid12{ align-content:center; }
.about-copy{ grid-column:1 / span 6; }
.about-copy .h2{ margin-bottom:22px;max-width:16ch; }
/* semilla de vocación: dos líneas, en la misma escena, sin caja */
.about-seed{ max-width:46ch;margin-bottom:20px;font-size:clamp(16px,1.2vw,18px);line-height:1.6;color:var(--bone); }
.about-copy .about-close{ margin-top:22px;padding-top:18px;border-top:1px solid var(--hair);font-family:var(--f-display);font-size:clamp(19px,1.5vw,23px);font-weight:var(--w-display);color:var(--bone);max-width:34ch; }
html[data-lang="zh"] .about-copy .about-close{ font-weight:500; }

/* ---------- HOW ---------- */
.how .scene-content > .grid12{ align-content:space-between;row-gap:28px; }
.how-head{ grid-column:1 / span 7; }
.how-head .h2{ max-width:20ch; }
.how-body{ grid-column:1 / -1;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(16px,2vw,32px);row-gap:26px;align-items:end; }
.steps{ grid-column:1 / -1;list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:clamp(16px,2vw,32px); }
.step{ position:relative;padding-top:22px;border-top:1px solid var(--hair);transition:border-color .5s var(--ease); }
.step::before{ content:"";position:absolute;left:0;top:-1px;height:1px;width:100%;background:var(--amber);transform:scaleX(0);transform-origin:0 50%;transition:transform .6s var(--ease); }
.step .n{ display:block;font-family:var(--f-mono);font-size:12px;letter-spacing:.1em;color:var(--mist-dim);margin-bottom:12px;transition:color .4s var(--ease); }
.step .t{ display:block;font-family:var(--f-display);font-weight:var(--w-display);font-size:clamp(20px,1.7vw,27px);line-height:1.18;color:var(--mist);transition:color .4s var(--ease); }
html[data-lang="zh"] .step .t{ font-weight:500; }
.step .s{ display:block;margin-top:10px;font-size:14px;line-height:1.55;color:var(--mist); }
.step.is-past .t,.step.is-on .t{ color:var(--bone); }
.step.is-past::before,.step.is-on::before{ transform:scaleX(1); }
.step.is-on .n,.step.is-past .n{ color:var(--amber); }
.scene--stage:not(.is-staged) .step .t{ color:var(--bone); }
.scene--stage:not(.is-staged) .step::before{ transform:scaleX(1); }
.scene--stage:not(.is-staged) .step .n{ color:var(--amber); }
.ai-block{ grid-column:7 / span 6;grid-row:1;margin-bottom:6px;background:var(--panel-2);border:1px solid var(--hair);border-left:2px solid var(--amber);padding:24px 26px 26px; }
.ai-block .ai-lab{ display:flex;align-items:center;gap:10px;margin-bottom:12px; }
.ai-block .ai-lab .label{ color:var(--amber); }
.ai-block .ai-title{ font-family:var(--f-display);font-weight:var(--w-display);font-size:clamp(21px,1.7vw,26px);line-height:1.2;margin-bottom:12px;color:var(--bone); }
html[data-lang="zh"] .ai-block .ai-title{ font-weight:600; }
.ai-block .ai-text{ font-size:15px;line-height:1.66;color:var(--mist); }
/* AI con preponderancia: pulso "en tiempo real", los cuatro frentes validados y el cierre */
.ai-live{ display:flex;align-items:center;gap:10px;margin-bottom:14px;font-family:var(--f-mono);font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--amber); }
.ai-pulse{ position:relative;width:7px;height:7px;border-radius:50%;background:var(--amber);flex:none; }
.ai-pulse::after{ content:"";position:absolute;inset:-5px;border-radius:50%;border:1px solid var(--amber);opacity:0; }
.motion .ai-pulse::after{ animation:aiPulse 2.4s ease-out infinite; }
@keyframes aiPulse{ 0%{ transform:scale(.4);opacity:.7; } 80%,100%{ transform:scale(1.5);opacity:0; } }
.ai-flow{ list-style:none;margin:16px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:22px;border-top:1px solid var(--hair); }
.ai-flow li{ display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--hair-2);font-family:var(--f-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--bone); }
.ai-flow li::before{ content:"";width:9px;height:5px;margin-top:-3px;border-left:1.5px solid var(--amber);border-bottom:1.5px solid var(--amber);transform:rotate(-45deg);flex:none; }
.ai-block .ai-close{ margin-top:16px;font-family:var(--f-display);font-weight:var(--w-display);font-stretch:var(--stretch-display);font-size:clamp(16px,1.25vw,19px);line-height:1.35;color:var(--bone); }
html[data-lang="zh"] .ai-live,html[data-lang="zh"] .ai-flow li{ letter-spacing:.06em; }
html[data-lang="zh"] .ai-block .ai-close{ font-family:'Noto Serif SC',serif;font-stretch:100%;font-weight:600; }
@media (prefers-reduced-motion:reduce){ .ai-pulse::after{ animation:none; } }


@media (min-width:1025px){
  .how .scene-content > .grid12{ grid-template-rows:auto auto; }
  .how-body{ display:contents; }
  .how-head{ grid-column:1 / span 6;grid-row:1;align-self:start; }
  .how .ai-block{ grid-column:8 / span 5;grid-row:1;align-self:end;margin:0; }
  .how .steps{ grid-row:2;align-self:end; }
}
/* ---------- PROGRAMS ---------- */
.programs .scene-content > .grid12{ align-content:end;row-gap:26px; }
.pgm-head{ grid-column:1 / span 6;align-self:start; }
.pgm-list{ grid-column:1 / span 5;list-style:none;border-top:1px solid var(--hair);align-self:end; }
.pgm-item{ border-bottom:1px solid var(--hair); }
.pgm-item button{ width:100%;display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:12px;min-height:48px;padding:10px 0;background:none;border:0;cursor:pointer;text-align:left;color:var(--mist);transition:color .3s var(--ease); }
.pgm-item .code{ font-family:var(--f-mono);font-size:12px;color:var(--mist-dim); }
.pgm-item .nm{ font-family:var(--f-display);font-size:clamp(18px,1.45vw,22px);font-weight:var(--w-display); }
html[data-lang="zh"] .pgm-item .nm{ font-weight:500; }
.pgm-item .st{ font-family:var(--f-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--mist-dim);text-align:right; }
html[data-lang="zh"] .pgm-item .st{ letter-spacing:.03em; }
.pgm-item.is-on button,.pgm-item button:hover{ color:var(--bone); }
.pgm-item.is-on .code{ color:var(--amber); }
.pgm-item.is-live .st{ color:var(--amber); }
.pgm-stack{ grid-column:7 / span 6;display:grid;row-gap:16px;align-self:end; }
.is-staged .pgm-card{ grid-area:1 / 1; }
.programs:not(.is-staged) .pgm-list{ display:none; }
.pgm-card{ background:var(--panel-2);border:1px solid var(--hair);padding:26px 28px 28px;align-self:end; }
.pgm-card .pc-top{ display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-bottom:14px; }
.pgm-card .pc-code{ font-family:var(--f-mono);font-size:12px;letter-spacing:.1em;color:var(--amber); }
.pgm-status{ display:inline-flex;align-items:center;gap:8px;font-family:var(--f-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;padding:4px 9px;border:1px solid var(--hair);color:var(--mist); }
html[data-lang="zh"] .pgm-status{ letter-spacing:.03em; }
.pgm-status .d{ width:6px;height:6px;background:var(--mist-dim);flex:none; }
.pgm-status.is-live{ border-color:var(--amber-a40);color:var(--amber); }
.pgm-status.is-live .d{ background:var(--amber); }
.pgm-card .pc-name{ margin-bottom:8px; }
.pgm-card .pc-hook{ font-family:var(--f-display);font-style:italic;font-weight:var(--w-display);font-size:18px;color:var(--amber-soft);margin-bottom:12px; }
html[data-lang="zh"] .pgm-card .pc-hook{ font-style:normal;font-weight:500; }
.pgm-card .pc-body{ font-size:15px;line-height:1.62;color:var(--mist); }
.pgm-card .pc-actions{ display:flex;flex-wrap:wrap;gap:10px;margin-top:20px; }
.pgm-card .pc-noraise{ margin-top:16px;font-family:var(--f-mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--mist-dim); }

/* ---------- EVIDENCE (flow) ---------- */
.ev-head{ grid-column:1 / span 7; }
.ev-head .h2{ margin-bottom:22px; }
.ev-note{ grid-column:9 / span 4;align-self:end;padding-left:18px;border-left:1px solid var(--amber);font-size:14px;line-height:1.6;color:var(--mist); }
.evidence-grid{ grid-column:1 / span 9;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,1.6vw,22px);margin-top:44px; }
.evidence-card{ border:1px solid var(--hair);background:var(--steel);display:flex;flex-direction:column;cursor:pointer;transition:border-color .3s var(--ease);padding:0;text-align:left;font:inherit;color:inherit;width:100%; }
.evidence-ph,.evidence-cap{ display:block; }
.evidence-card:hover,.evidence-card:focus-visible{ border-color:var(--amber-a40); }
.evidence-ph{ aspect-ratio:var(--thumb-ratio,4/3);position:relative;overflow:hidden;background:var(--ink); }
.evidence-ph img{ position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease),opacity .35s var(--ease); }
.evidence-ph img.ep-frame{ opacity:0;transition:opacity 1.1s var(--ease); }
.evidence-ph img.ep-frame.is-on{ opacity:1; }
.evidence-card:hover .evidence-ph img{ transform:scale(1.025); }
.evidence-plan-badge{ position:absolute;z-index:2;bottom:10px;right:10px;background:rgba(11,14,17,.82);color:var(--bone);font-family:var(--f-mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;padding:6px 10px;border:1px solid var(--hair); }
.evidence-cap{ padding:13px 15px;border-top:1px solid var(--hair);font-family:var(--f-mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--mist); }


/* ---------- SELLO AI en el Hero — propuesta 01 Monograma (sello-ai/propuestas.html) ----------
   Azulejo de 40 px; una franja metalizada cruza en diagonal de abajo hacia arriba
   en un ciclo de 7 s (visible menos de 3 s). Solo transform/opacity; quieta con
   movimiento reducido. */
.hero-seal{ display:flex;align-items:center;gap:12px;margin-bottom:18px; }
.hero-seal .seal{ position:relative;width:40px;height:40px;border-radius:23%;overflow:hidden;flex:none;isolation:isolate;
  background:linear-gradient(160deg,#1C232B 0%,#12171C 55%,#0D1014 100%);
  box-shadow:inset 0 0 0 1px rgba(232,234,237,.13), inset 0 1px 0 rgba(232,234,237,.08), 0 6px 18px rgba(0,0,0,.45); }
.hero-seal .seal svg{ position:absolute;inset:0;width:100%;height:100%;z-index:1; }
.hero-seal .seal::after{ content:"";position:absolute;z-index:2;left:-60%;top:-60%;width:220%;height:220%;pointer-events:none;
  background:linear-gradient(135deg, transparent 42%, rgba(170,182,196,.10) 47%, rgba(214,222,230,.34) 50%, rgba(150,162,176,.10) 53%, transparent 58%);
  mix-blend-mode:screen;opacity:0;transform:translate(-32%,32%);
  animation:sealSheen 7s cubic-bezier(.45,.05,.35,1) infinite; }
@keyframes sealSheen{
  0%{ transform:translate(-32%,32%);opacity:0; }
  6%{ opacity:.5; }
  38%{ opacity:.5; }
  46%{ transform:translate(32%,-32%);opacity:0; }
  100%{ transform:translate(32%,-32%);opacity:0; }
}
@media (prefers-reduced-motion:reduce){ .hero-seal .seal::after{ animation:none;opacity:0; } }
.hero-seal-lab{ font-family:var(--f-mono);font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--mist);text-shadow:0 1px 10px rgba(5,7,9,.6); }
html[data-lang="zh"] .hero-seal-lab{ letter-spacing:.12em; }

/* ---------- PLAN HOOK (flow) — aggregated, approved figures only ---------- */
.plan-head{ grid-column:1 / span 8; }
.plan-blocks{ grid-column:1 / -1;margin-top:clamp(36px,5vh,56px);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(16px,2vw,32px);row-gap:40px; }
.pb{ position:relative;padding-top:22px;border-top:1px solid var(--hair); }
.pb::before{ content:"";position:absolute;left:0;top:-1px;width:56px;height:1px;background:var(--amber); }
.pb-econ{ grid-column:1 / span 4; } .pb-proj{ grid-column:5 / span 4; } .pb-ctrl{ grid-column:9 / span 4; }
.pb-head{ display:flex;align-items:baseline;gap:14px;margin-bottom:18px; }
.pb-letter{ font-family:var(--f-mono);font-size:12px;letter-spacing:.1em;color:var(--amber); }
.pb-title{ font-family:var(--f-display);font-weight:var(--w-display);font-stretch:var(--stretch-display);letter-spacing:var(--ls-display);font-size:clamp(24px,2vw,30px);line-height:1.1;color:var(--bone); }
.pb-sub{ font-family:var(--f-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--mist-dim);margin:16px 0 4px; }
html[data-lang="zh"] .pb-sub{ letter-spacing:.04em; }
.pb-rows > div{ display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:11px 0;border-bottom:1px solid var(--hair-2); }
.pb-rows dt{ font-size:15px;color:var(--mist); }
.pb-rows dd{ font-size:17px; }
.pb-rows .is-total dt{ color:var(--bone); }
.pb-rows .is-total dd{ color:var(--amber); }
.fig{ font-family:var(--f-mono);font-variant-numeric:tabular-nums lining-nums;color:var(--bone);white-space:nowrap; }
.pb-unit{ font-size:14px;color:var(--mist); }
.pb-rows dd.pb-unit{ font-size:15px; }
.pb-rows dd .fig{ font-size:17px; }
/* scope line: the projection's frame, said once, quietly */
.scope-line{ display:flex;align-items:center;gap:10px;font-family:var(--f-mono);font-size:12px;letter-spacing:.07em;text-wrap:balance;text-transform:uppercase;color:var(--amber);margin:2px 0 14px; }
.scope-line::before{ content:"";width:18px;height:1px;background:var(--amber);flex:none; }
html[data-lang="zh"] .scope-line{ letter-spacing:.04em; }
.pb-ledger > div{ display:flex;justify-content:space-between;align-items:baseline;gap:18px;padding:11px 0;border-bottom:1px solid var(--hair-2); }
.pb-ledger dt{ font-size:15px;line-height:1.4;color:var(--mist); }
.pb-ledger dd{ font-size:19px; }
.pb-ledger .is-total{ flex-direction:column;align-items:flex-start;gap:6px;padding-top:16px;border-bottom:0; }
.pb-ledger .is-total dt{ color:var(--bone);max-width:32ch; }
.pb-ledger .is-total dd{ color:var(--amber);font-size:clamp(54px,5.4vw,86px);line-height:.95;letter-spacing:-.03em; }
.pb-m{ display:flex;flex-direction:column;gap:8px; }
.fig-xl{ font-size:clamp(54px,5.4vw,86px);line-height:.95;letter-spacing:-.03em; }
.pb-m:first-child .fig-xl{ color:var(--amber); }
.pb-cap{ font-size:14.5px;line-height:1.5;color:var(--mist);max-width:32ch; }
.pb-recovery{ margin-top:28px;padding-left:16px;border-left:1px solid var(--amber);font-family:var(--f-display);font-weight:var(--w-display);font-stretch:var(--stretch-display);font-size:clamp(17px,1.35vw,20px);line-height:1.42;color:var(--bone); }
.pb-list{ list-style:none;counter-reset:pc; }
.pb-list li{ counter-increment:pc;display:grid;grid-template-columns:30px 1fr;gap:8px;padding:12px 0;border-bottom:1px solid var(--hair-2);font-size:15.5px;line-height:1.45;color:var(--bone); }
.pb-list li::before{ content:counter(pc, decimal-leading-zero);font-family:var(--f-mono);font-size:12px;color:var(--amber);padding-top:4px; }
.plan-foot{ grid-column:1 / -1;margin-top:clamp(40px,6vh,60px);padding-top:28px;border-top:1px solid var(--hair);display:flex;flex-direction:column;align-items:flex-start;gap:18px; }
.plan-private{ font-size:13.5px;line-height:1.5;color:var(--mist);letter-spacing:.005em;text-wrap:balance; }
.mono,.fund-pct,.fund-stat-val,.fund-calc-years,.fund-calc-total,.fund-share-val,.tp-coord,.route-tel{ font-variant-numeric:tabular-nums; }
@media (max-width:1024px){
  .plan-head{ grid-column:1 / -1; }
  .pb-econ{ grid-column:1 / span 3; } .pb-proj{ grid-column:4 / span 3; } .pb-ctrl{ grid-column:1 / -1; }
}
@media (max-width:640px){
  .pb-econ,.pb-proj,.pb-ctrl{ grid-column:1 / -1; }
}

/* ---------- FUNDING (flow) ---------- */
.fund-head{ grid-column:1 / span 7; }
.fund-head .h2{ margin-bottom:18px; }
.fund-head-side{ grid-column:9 / span 4;align-self:end;display:flex;flex-direction:column;align-items:flex-start;gap:14px; }
.fund-board{ grid-column:1 / -1;margin-top:40px;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(16px,2vw,32px);row-gap:clamp(16px,2vw,24px); }
.fund-panel{ grid-column:1 / span 7;display:grid;grid-template-columns:96px 1fr;gap:26px;background:var(--panel-2);border:1px solid var(--hair);padding:26px; }
.fund-gauge{ position:relative;border:1px solid var(--hair);background:var(--ink);overflow:hidden;min-height:250px; }
.fund-gauge-cap{ position:absolute;top:9px;left:0;right:0;text-align:center;font-family:var(--f-mono);font-size:12px;letter-spacing:.14em;color:var(--mist-dim);text-transform:uppercase;z-index:2; }
.fund-tick{ position:absolute;left:0;right:0;height:1px;background:var(--hair);z-index:1; }
.fund-fill{ position:absolute;left:0;right:0;bottom:0;height:100%;background:linear-gradient(180deg,var(--amber),rgba(201,169,106,.35));transform-origin:50% 100%;transform:scaleY(0);transition:transform 1.4s var(--ease); }
.fund-info{ display:flex;flex-direction:column;justify-content:center;min-width:0; }
.fund-lab{ font-family:var(--f-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mist-dim); }
html[data-lang="zh"] .fund-lab{ letter-spacing:.04em; }
.fund-name{ font-family:var(--f-display);font-size:24px;font-weight:var(--w-display);margin:4px 0 12px; }
.fund-pct{ font-family:var(--f-mono);font-weight:500;font-size:clamp(40px,5vw,56px);line-height:.95;margin-bottom:18px;color:var(--bone); }
.fund-pct-u{ font-size:.42em;color:var(--mist); }
.fund-stats{ display:flex;flex-direction:column; }
.fund-stats > div{ display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:10px 0;border-bottom:1px solid var(--hair); }
.fund-stats > div:last-child{ border-bottom:none; }
.fund-stat-val{ font-family:var(--f-mono);font-size:15px;color:var(--bone);text-align:right; }
.fund-stat-val small{ display:block;font-size:12px;color:var(--mist);letter-spacing:.04em; }
.fund-deploy{ margin-top:12px;padding-top:12px;border-top:1px solid var(--hair);font-family:var(--f-mono);font-size:12px;letter-spacing:.04em;color:var(--mist);display:flex;align-items:center;gap:9px; }
.fund-dot{ width:7px;height:7px;background:var(--amber);flex:none; }
.fund-terms{ grid-column:8 / span 5;display:flex;flex-direction:column;border-top:1px solid var(--hair); }
.fund-term{ padding:18px 0;border-bottom:1px solid var(--hair); }
.fund-term .fund-lab{ color:var(--amber);margin-bottom:8px;display:block; }
.fund-term p{ font-size:15px;line-height:1.6;color:var(--bone); }
.fund-card{ background:var(--panel-2);border:1px solid var(--hair);padding:24px; }
.fund-calc-card{ grid-column:1 / span 7; }
.fund-trust{ grid-column:8 / span 5;align-self:start; }
.fund-card-top{ display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap; }
.fund-badge{ display:inline-flex;align-items:center;gap:7px;font-family:var(--f-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;padding:4px 9px;border:1px solid var(--hair);color:var(--mist); }
.fund-badge-dot{ width:6px;height:6px;background:var(--mist-dim);flex:none; }
.fund-badge-raising{ color:var(--amber);border-color:var(--amber-a40); }
.fund-badge-raising .fund-badge-dot{ background:var(--amber); }
.fund-badge-done{ opacity:.6; }
.fund-badge[hidden]{ display:none; }
.fund-badge-group{ display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap; }
.fund-amount-row{ display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:14px 0 4px; }
.fund-participate-btn{ font-size:14px;padding:10px 16px; }
.fund-sub{ color:var(--mist);font-size:13px; }
.fund-share{ margin-top:14px;padding-top:14px;border-top:1px solid var(--hair);display:flex;justify-content:space-between;align-items:baseline;gap:12px; }
.fund-share-val{ font-size:16px;color:var(--bone); }
.fund-calc-input{ display:inline-flex;align-items:center;gap:6px;background:rgba(232,234,237,.04);border:1px solid var(--hair);padding:4px; }
.fund-calc-step{ width:44px;height:44px;flex:none;border:1px solid var(--hair);background:transparent;color:var(--bone);font-family:var(--f-mono);font-size:16px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:border-color .2s var(--ease),color .2s var(--ease); }
.fund-calc-step:hover:not(:disabled){ border-color:var(--amber);color:var(--amber); }
.fund-calc-step:disabled{ opacity:.3;cursor:default; }
.fund-calc-amt-wrap{ display:flex;align-items:baseline;gap:1px; }
.fund-calc-cur{ font-size:16px;color:var(--mist); }
.fund-big{ font-weight:500;font-size:24px; }
.fund-calc-amt{ width:120px;height:44px;background:transparent;border:0;padding:0;color:var(--amber); }
.fund-calc-amt:focus{ outline:none; }
.fund-calc-range{ color:var(--mist-dim);font-size:12px; }
.fund-calc-block{ margin-top:16px;padding-top:16px;border-top:1px solid var(--hair); }
.fund-calc-block-title{ font-family:var(--f-display);font-weight:var(--w-display);font-size:17px;color:var(--bone);margin-bottom:12px; }
.fund-calc-frame{ font-size:12px;color:var(--mist-dim);line-height:1.55;margin-top:3px; }
.fund-calc-context{ margin-top:16px;padding-top:14px;border-top:1px solid var(--hair);opacity:.8; }
.fund-calc-context-lab{ font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--mist-dim);margin-bottom:10px; }
.fund-calc-out{ display:flex;flex-direction:column;gap:7px; }
.fund-calc-out-line{ display:flex;justify-content:space-between;align-items:baseline;gap:10px; }
.fund-calc-out-line .fund-lab{ font-size:12px; }
.fund-calc-out-line > span:last-child{ font-size:12.5px;color:var(--bone);text-align:right; }
.fund-calc-values{ display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;justify-content:flex-end; }
.fund-calc-years{ display:grid;grid-template-columns:repeat(3,88px);gap:2px 8px;width:min(280px,100%); }
.fund-calc-year{ display:block;font-size:var(--calc-year-fs);color:var(--bone);text-align:right;white-space:nowrap; }
.fund-calc-year .yr{ color:var(--mist-dim);margin-right:3px; }
.fund-calc-out-net .fund-calc-year{ color:var(--amber); }
.fund-calc-total{ font-size:16px;font-weight:500;color:var(--amber);white-space:nowrap; }
.fund-calc-note{ margin-top:12px;font-size:12px;color:var(--mist-dim);line-height:1.55;display:flex;flex-wrap:wrap;gap:6px;align-items:baseline; }
.fund-calc-note-btn{ background:none;border:0;padding:6px 0;min-height:44px;color:var(--amber);font-family:var(--f-mono);font-size:12px;text-decoration:underline;cursor:pointer; }
.fund-calc-note-full{ margin-top:6px;font-size:12px;color:var(--mist-dim);line-height:1.6; }
.fund-calc-note-full[hidden]{ display:none; }
.fund-trust-ico{ width:34px;height:34px;border:1px solid var(--hair);display:flex;align-items:center;justify-content:center;margin-bottom:14px; }
.fund-trust-ico svg{ width:15px;height:15px;stroke:var(--amber);fill:none;stroke-width:1.6; }
.fund-trust h3{ font-family:var(--f-display);font-weight:var(--w-display);font-size:22px;margin:6px 0 10px; }
.fund-trust p{ color:var(--mist);font-size:14.5px;line-height:1.62; }
.fund-cands{ list-style:none;margin-top:16px;border-top:1px solid var(--hair); }
.fund-cands li{ padding:10px 0;border-bottom:1px solid var(--hair);font-size:14px;color:var(--bone);display:flex;justify-content:space-between;gap:12px;align-items:baseline; }
.fund-cands li .mono{ font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--mist-dim);white-space:nowrap; }
@media (max-width:480px){
  .nav{ gap:4px;padding:6px 4px 6px 10px; }
  .logo{ gap:8px;padding-right:6px; }
  .fund-calc-amt{ width:100px;font-size:20px; }
  .fund-calc-out-line{ flex-direction:column;align-items:flex-start;gap:2px; }
  .fund-calc-out-line > span:last-child{ text-align:left; }
  .fund-calc-values{ justify-content:flex-start;width:100%; }
  .fund-calc-year{ text-align:left; }
}

/* ---------- TRACE & GOVERNANCE ---------- */
.trace .scene-content > .grid12{ align-content:center;row-gap:26px; }
.trace-copy{ grid-column:1 / span 5;align-self:center; }
.trace-copy .h2{ margin-bottom:22px; }
.trace-copy .demo-badge{ margin-bottom:20px; }
.trace-stack{ grid-column:7 / span 6;display:grid;row-gap:16px;align-self:center; }
.is-staged .trace-panel{ grid-area:1 / 1; }
.trace-panel{ background:var(--panel-2);border:1px solid var(--hair);padding:24px 26px 26px; }
.tp-head{ display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:6px; }
.tp-head .label{ color:var(--amber); }
.tp-coord{ font-family:var(--f-mono);font-size:12px;color:var(--mist-dim);letter-spacing:.04em; }
.trace-row{ display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--hair); }
.trace-row:last-child{ border-bottom:0;padding-bottom:0; }
.trace-row .k{ font-family:var(--f-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--mist-dim); }
html[data-lang="zh"] .trace-row .k{ letter-spacing:.04em; }
.trace-row .v{ font-family:var(--f-display);font-size:20px;font-weight:var(--w-display);color:var(--bone);display:flex;align-items:center;gap:10px; }
html[data-lang="zh"] .trace-row .v{ font-weight:500;font-size:18px; }
.trace-row .v .g{ width:7px;height:7px;background:var(--amber);flex:none; }
.gov-title{ font-family:var(--f-display);font-weight:var(--w-display);font-size:clamp(22px,1.9vw,28px);margin:6px 0 8px; }
html[data-lang="zh"] .gov-title{ font-weight:600; }
.gov-rules{ list-style:none; }
.gov-rules li{ display:grid;grid-template-columns:28px 1fr;gap:10px;padding:13px 0;border-bottom:1px solid var(--hair);font-size:15px;line-height:1.5;color:var(--bone); }
.gov-rules li:last-child{ border-bottom:0; }
.gov-rules li .mono{ font-size:12px;color:var(--amber);padding-top:3px; }
.fund-gov-list{ margin-top:4px; }
.fund-gov-row{ display:grid;grid-template-columns:1fr auto;gap:8px 14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--hair); }
.fund-gov-row:last-child{ border-bottom:none; }
.fund-gov-q{ font-size:14.5px;color:var(--mist); }
.fund-gov-votes{ font-family:var(--f-mono);font-size:12px;color:var(--mist);white-space:nowrap; }
.fund-gov-bar{ grid-column:1 / -1;height:3px;background:var(--hair);overflow:hidden; }
.fund-gov-bar > i{ display:block;height:100%;background:var(--mist-dim);transform-origin:0 50%; }
.fund-gov-row.top .fund-gov-q{ color:var(--bone); }
.fund-gov-row.top .fund-gov-bar > i{ background:var(--amber); }
.fund-tag{ display:inline-block;margin-left:10px;font-family:var(--f-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--amber);border:1px solid var(--amber-a40);padding:2px 6px;vertical-align:2px; }

/* ---------- FAQ (flow) ---------- */
.faq-head{ grid-column:1 / span 4; }
.faq-head .h2{ max-width:12ch; }
.faq-list{ grid-column:6 / span 7;display:flex;flex-direction:column;border-top:1px solid var(--hair); }
.faq-item{ border-bottom:1px solid var(--hair); }
.faq-item summary{ list-style:none;cursor:pointer;display:grid;grid-template-columns:34px 1fr 16px;align-items:center;gap:14px;padding:18px 0;min-height:48px;font-family:var(--f-display);font-weight:var(--w-display);font-size:clamp(17px,1.35vw,20px);line-height:1.35;color:var(--bone); }
html[data-lang="zh"] .faq-item summary{ font-weight:500; }
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary::marker{ content:""; }
.faq-item summary .n{ font-family:var(--f-mono);font-size:12px;color:var(--mist-dim); }
.faq-item[open] summary .n{ color:var(--amber); }
.faq-ic{ position:relative;width:14px;height:14px; }
.faq-ic::before,.faq-ic::after{ content:"";position:absolute;background:var(--amber); }
.faq-ic::before{ top:6.5px;left:0;width:14px;height:1px; }
.faq-ic::after{ top:0;left:6.5px;width:1px;height:14px;transition:transform .3s var(--ease); }
.faq-item[open] .faq-ic::after{ transform:rotate(90deg); }
.faq-item p{ padding:0 30px 22px 48px;max-width:calc(var(--measure) + 48px);color:var(--mist);font-size:15px;line-height:1.7; }

/* ---------- CONTACT ---------- */
.contact .scene-content > .grid12{ align-content:center; }
.contact-copy{ grid-column:1 / span 9; }
.contact-cta{ display:inline-flex;align-items:flex-end;gap:22px;background:none;border:0;padding:0;cursor:pointer;text-align:left;color:var(--bone); }
.contact-cta .display{ font-size:clamp(40px,5.6vw,92px);line-height:1.02;max-width:12ch;transition:color .35s var(--ease); }
.contact-cta .arw{ font-family:var(--f-mono);font-size:clamp(22px,2.4vw,36px);color:var(--amber);padding-bottom:.4em;transition:transform .35s var(--ease); }
.contact-cta:hover .display{ color:var(--amber-soft); }
.contact-cta:hover .arw{ transform:translateX(6px); }
.contact-lines{ margin-top:clamp(28px,4vh,44px);display:flex;flex-wrap:wrap;gap:12px 40px;padding-top:20px;border-top:1px solid var(--hair);max-width:760px; }
.contact-lines p{ font-family:var(--f-mono);font-size:12.5px;letter-spacing:.04em;color:var(--mist); }

/* ---------- FOOTER ---------- */
footer{ position:relative;z-index:1;background:linear-gradient(180deg, rgba(11,14,17,0), var(--ink) 120px);padding:120px 0 calc(48px + var(--safe-bottom)); }
.foot-brand{ grid-column:1 / span 5;display:flex;flex-direction:column;gap:10px; }
.foot-brand-row{ display:flex;align-items:center;gap:10px;font-family:var(--f-display);font-size:22px; }
.foot-brand-row .b2{ color:var(--mist); }
.foot-brand .tag{ font-family:var(--f-mono);font-size:12px;letter-spacing:.2em;color:var(--amber);text-transform:uppercase; }
.foot-pie{ grid-column:7 / span 6;font-family:var(--f-display);font-size:clamp(17px,1.3vw,20px);line-height:1.45;color:var(--bone); }
.disclaimer{ grid-column:1 / -1;margin-top:40px;padding-top:22px;border-top:1px solid var(--hair);font-size:12.5px;line-height:1.7;color:var(--mist-dim);max-width:110ch; }
.disclaimer strong{ color:var(--mist);font-weight:600; }
.foot-legal{ grid-column:1 / -1;margin-top:24px;font-family:var(--f-mono);font-size:12px;color:var(--mist-dim);letter-spacing:.05em;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px; }


/* ---------- Modal / overlays ---------- */
.overlay{ position:fixed;inset:0;background:rgba(5,7,9,.84);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);opacity:0;visibility:hidden;transition:.35s var(--ease);z-index:100;display:flex;align-items:center;justify-content:center;padding:20px; }
.overlay.open{ opacity:1;visibility:visible; }
.overlay.legal-overlay{ z-index:600; }
.modal{ width:100%;max-width:540px;background:var(--steel);border:1px solid var(--hair);padding:34px 30px;transform:translateY(16px);transition:.4s var(--ease);max-height:90vh;overflow:auto; }
.overlay.open .modal{ transform:none; }
.legal-modal{ max-width:640px; }
.legal-body p{ font-size:13.5px;line-height:1.65;color:var(--mist);margin-bottom:14px; }
.legal-body p:last-child{ margin-bottom:0;font-size:12px;color:var(--mist-dim);padding-top:14px;border-top:1px solid var(--hair); }
.legal-body strong{ color:var(--bone); }
.modal-inner{ position:relative; }
.modal h2{ font-family:var(--f-display);font-weight:var(--w-display);font-size:30px;line-height:1.1;margin-bottom:10px;padding-right:44px; }
html[data-lang="zh"] .modal h2{ font-weight:600; }
.modal .m-sub{ font-size:14px;color:var(--mist);margin-bottom:20px;line-height:1.6; }
.proto-note{ display:flex;gap:12px;align-items:flex-start;border:1px solid var(--amber-a40);background:var(--amber-a08);padding:14px 16px;margin-bottom:22px;font-size:13.5px;line-height:1.55;color:var(--bone); }
.proto-note::before{ content:"";width:7px;height:7px;background:var(--amber);flex:none;margin-top:7px; }
.field{ margin-bottom:16px;display:flex;flex-direction:column;gap:7px; }
.field label{ font-family:var(--f-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--mist); }
html[data-lang="zh"] .field label{ letter-spacing:.04em; }
.field input,.field textarea{ background:var(--ink);border:1px solid var(--hair);color:var(--bone);padding:12px 13px;min-height:46px;font-family:var(--f-body);font-size:15px;border-radius:0; }
.field input:disabled,.field textarea:disabled{ opacity:.55;cursor:not-allowed; }
.field textarea{ resize:vertical;min-height:78px; }
.m-actions{ display:flex;gap:12px;margin-top:22px;flex-wrap:wrap; }
.m-actions .btn{ flex:1; }
.m-close{ position:absolute;top:-10px;right:-8px;background:none;border:none;color:var(--mist);font-size:26px;cursor:pointer;line-height:1;width:44px;height:44px;display:flex;align-items:center;justify-content:center; }
.m-close:hover{ color:var(--bone); }
.form-note{ font-family:var(--f-mono);font-size:12px;color:var(--mist-dim);margin-top:14px;line-height:1.6; }
.modal-wa-link{ display:inline-flex;align-items:center;min-height:44px;margin-top:10px;font-family:var(--f-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--mist);text-decoration:underline;text-underline-offset:4px; }
.modal-wa-link:hover{ color:var(--amber); }

/* Evidence lightbox (preserved) */
.ev-lightbox{ position:fixed;inset:0;z-index:100;background:rgba(5,7,9,.94);opacity:0;visibility:hidden;transition:opacity .3s var(--ease),visibility .3s var(--ease);display:flex;align-items:center;justify-content:center; }
.ev-lightbox.open{ opacity:1;visibility:visible; }
.ev-lb-stage{ position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center; }
.ev-lb-media{ width:min(92vw,1440px);height:86vh;display:flex;align-items:center;justify-content:center;overflow:hidden;transform:scale(.97);opacity:0;transition:transform .3s var(--ease),opacity .3s var(--ease);touch-action:pan-y; }
.ev-lightbox.open .ev-lb-media{ transform:scale(1);opacity:1; }
.ev-lb-media img,.ev-lb-media video{ max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;transition:transform .2s var(--ease);cursor:zoom-in;touch-action:none; }
.ev-lb-media img.is-zoomed{ cursor:zoom-out; }
.ev-lb-cap{ position:absolute;left:0;right:0;bottom:calc(14px + var(--safe-bottom));text-align:center;font-size:12px;letter-spacing:.1em;color:var(--mist); }
.ev-lb-close,.ev-lb-arrow{ position:absolute;z-index:3;width:46px;height:46px;border:1px solid var(--hair);background:rgba(11,14,17,.6);color:var(--bone);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:border-color .25s var(--ease); }
.ev-lb-close{ top:calc(14px + env(safe-area-inset-top,0px));right:calc(14px + env(safe-area-inset-right,0px)); }
.ev-lb-close svg{ width:16px;height:16px; }
.ev-lb-arrow{ top:50%;transform:translateY(-50%); }
.ev-lb-arrow svg{ width:18px;height:18px; }
.ev-lb-close:hover,.ev-lb-arrow:hover{ border-color:var(--amber); }
.ev-lb-prev{ left:calc(14px + env(safe-area-inset-left,0px)); }
.ev-lb-next{ right:calc(14px + env(safe-area-inset-right,0px)); }
.ev-lb-arrow[disabled]{ opacity:.25;cursor:default;pointer-events:none; }

/* ============================================================
   RESPONSIVE — mobile first legibility
   ============================================================ */
@media (max-width:1024px){
  .nav-links{ display:none; }
  .nav-menu-btn{ display:flex; }
  .seg{ margin-left:auto; }
  .grid12{ grid-template-columns:repeat(6,minmax(0,1fr)); }
  .hero-copy,.about-copy,.how-head,.pgm-head,.ev-head,.fund-head,.trace-copy,.faq-head,.contact-copy,.foot-brand,.foot-pie{ grid-column:1 / -1; }
  .hero-lower{ grid-template-columns:1fr;row-gap:18px; }
  .hero-lower .lead,.hero-statement{ grid-column:1 / -1; }
  .how-body{ grid-template-columns:1fr; }
  .steps{ grid-template-columns:1fr 1fr;row-gap:22px; }
  .ai-block{ grid-column:1 / -1;grid-row:auto; }
  .pgm-list,.pgm-stack{ grid-column:1 / -1; }
  .ev-note{ grid-column:1 / -1;margin-top:24px; }
  .evidence-grid{ grid-column:1 / -1; }
  .fund-head-side{ grid-column:1 / -1;margin-top:22px; }
  .fund-board{ grid-template-columns:1fr; }
  .fund-panel,.fund-terms,.fund-calc-card,.fund-trust{ grid-column:1 / -1; }
  .trace-stack{ grid-column:1 / -1; }
  .faq-list{ grid-column:1 / -1;margin-top:28px; }
  .foot-pie{ margin-top:26px; }
}
@media (max-width:1024px) and (min-width:641px){
  .how.is-staged .steps{ grid-template-columns:repeat(4,minmax(0,1fr)); }
}
@media (max-width:640px){
  :root{ --pad:20px; }
  .grid12{ grid-template-columns:repeat(4,minmax(0,1fr));column-gap:14px; }
  .h1{ font-size:clamp(36px,10.4vw,52px); }
  html[data-lang="zh"] .h1{ font-size:clamp(32px,9vw,44px); }
  .h2{ font-size:clamp(28px,8vw,38px); }
  .hero-statement{ font-size:17px; }
  .steps{ grid-template-columns:1fr;row-gap:0; }
  .step{ padding:14px 0 14px 46px;border-top:1px solid var(--hair); }
  .step .n{ position:absolute;left:0;top:16px;margin:0; }
  .step .t{ font-size:20px; }
  .ai-block{ padding:20px 18px; }
  .pgm-card{ padding:20px 18px 22px; }
  .pgm-item button{ min-height:46px;padding:8px 0; }
  .evidence-grid{ grid-template-columns:1fr 1fr;gap:10px; }
  .fund-panel{ grid-template-columns:64px 1fr;gap:16px;padding:18px; }
  .fund-gauge{ min-height:200px; }
  .fund-card{ padding:18px; }
  .trace-panel{ padding:18px 18px 20px; }
  .trace-row{ padding:11px 0; }
  .trace-row .v{ font-size:18px; }
  .faq-item summary{ grid-template-columns:28px 1fr 14px;gap:10px; }
  .faq-item p{ padding:0 0 20px 38px; }
  .contact-cta{ display:block; }
  .contact-cta .display{ display:inline; }
  .contact-cta .arw{ display:inline-block;margin-left:10px;padding-bottom:0; }
  .scroll-cue{ display:none!important; }
}
/* Motion-only mobile compaction: inside a stuck frame only the active step /
   panel carries its full body; the rest stay as titles. Flow fallback and
   reduced motion show everything. */
@media (max-width:640px){
  .how.is-staged .step:not(.is-on) .s{ display:none; }
  .how.is-staged .steps,.how.is-staged .ai-block{ grid-area:1 / 1; }
  .programs.is-staged .pgm-list{ display:none; }
}
@media (max-height:760px) and (min-width:1025px){
  .h1{ font-size:clamp(40px,5vw,76px); }
  .is-staged .scene-content > .grid12{ padding-top:92px;padding-bottom:84px; }
}


/* ---------- Typography #2 (Archivo ensanchada + Fragment Mono): smaller display
   texts step down to 500 and a narrower width so they read as copy, not shouting. ---------- */
.h1{ line-height:.98; }
.hero-statement,.about-copy .about-close,.pb-recovery,.step .t,.pgm-item .nm,.faq-item summary,.trace-row .v,.ai-block .ai-title,.gov-title,.fund-calc-block-title,.fund-trust h3,.pb-title,.modal h2,.fund-name{ font-weight:500;font-stretch:108%;letter-spacing:-.01em; }
.pgm-card .pc-hook{ font-style:normal;font-weight:500;font-stretch:100%; }
.logo span,.foot-brand-row{ font-stretch:112%;font-weight:600;letter-spacing:-.01em; }
html[data-lang="zh"] .hero-statement,html[data-lang="zh"] .about-copy .about-close,html[data-lang="zh"] .pb-recovery,html[data-lang="zh"] .step .t,html[data-lang="zh"] .faq-item summary,html[data-lang="zh"] .pb-title,html[data-lang="zh"] .ai-block .ai-title,html[data-lang="zh"] .gov-title{ font-family:'Noto Sans SC',sans-serif;font-stretch:100%; }
/* capital: three statements, lead in bone */
.cap-list{ list-style:none;display:flex;flex-direction:column;gap:10px; }
.cap-list li{ font-size:15px;line-height:1.6;color:var(--mist); }
.cap-list strong{ color:var(--bone);font-weight:600; }


/* ============================================================
   TERMINACIONES — línea SpaceX. Los CTAs son texto puro integrado a la
   escena: sin bordes, sin cajas, sin rellenos. Una sombra sutil sostiene
   la lectura sobre la luz del video. Aplica a CTAs, formulario,
   calculadora, evidencia, plan privado e idiomas.
   ============================================================ */
.btn{ background:none!important;border:0!important;border-radius:0;box-shadow:none;justify-content:flex-start;
  padding:20px 0;min-height:44px;gap:14px;
  font-family:var(--f-body);font-weight:600;font-stretch:100%;font-size:14px;letter-spacing:.26em;text-transform:uppercase;line-height:1.35;
  color:var(--bone);text-shadow:0 1px 14px rgba(5,7,9,.7),0 0 2px rgba(5,7,9,.45);cursor:pointer;
  transition:color .25s ease,transform .12s ease; }
html[data-lang="zh"] .btn{ letter-spacing:.1em; }
.btn .arw{ font-family:var(--f-body);font-size:17px;letter-spacing:0;color:var(--amber);transition:transform .3s cubic-bezier(.2,.8,.2,1),color .25s ease; }
.btn:hover{ color:var(--amber); }
.btn:hover .arw{ transform:translateX(6px); }
.btn:active{ transform:translateY(1px); }
.btn:focus-visible{ outline:2px solid var(--amber);outline-offset:6px;border-radius:2px; }
.btn-ghost{ color:var(--mist); }
.btn-ghost .arw{ color:var(--mist); }
.btn-ghost:hover{ color:var(--bone); }
.btn-ghost:hover .arw{ color:var(--amber); }
.btn[disabled],.btn[disabled]:hover{ color:var(--mist-dim);opacity:1;cursor:not-allowed;transform:none; }
.btn[disabled] .arw{ color:var(--mist-dim);transform:none; }
.hero-actions{ gap:6px 34px; }
.m-actions{ gap:8px 32px; }
.m-actions .btn{ flex:0 0 auto; }

/* language selector: "ES · EN · ZH", hairline separators, no box */
.seg,.nav-drop-langs{ border:0!important;background:none!important;padding:0;gap:0;align-items:center; }
.nav-drop-langs{ justify-content:flex-start;border-top:1px solid var(--hair)!important;padding-top:6px; }
.seg button,.nav-drop-langs button{ position:relative;flex:0 0 auto;background:none!important;border:0!important;border-radius:0;box-shadow:none;
  min-width:44px;min-height:44px;padding:0 12px;font-family:var(--f-body);font-weight:600;font-stretch:100%;font-size:12px;letter-spacing:.2em;text-indent:.2em;
  color:var(--mist);text-shadow:0 1px 10px rgba(5,7,9,.6);cursor:pointer;transition:color .2s ease; }
.seg button + button::before,.nav-drop-langs button + button::before{ content:"";position:absolute;left:0;top:50%;width:1px;height:12px;margin-top:-6px;background:rgba(232,234,237,.28); }
.seg button:hover,.nav-drop-langs button:hover{ color:var(--bone); }
.seg button[aria-pressed="true"],.nav-drop-langs button[aria-pressed="true"]{ color:var(--amber);background:none!important; }
.seg button:focus-visible,.nav-drop-langs button:focus-visible{ outline:2px solid var(--amber);outline-offset:-4px; }

/* calculator */
.fund-calc-input{ border:0;background:none;padding:0;gap:2px; }
.fund-calc-step{ width:44px;height:44px;border:0;background:none;color:var(--mist);font-size:20px;text-shadow:none; }
.fund-calc-step:hover:not(:disabled){ color:var(--amber);border:0; }
.fund-calc-step:active:not(:disabled){ transform:translateY(1px); }
.fund-calc-step:focus-visible{ outline:2px solid var(--amber);outline-offset:-2px; }
.fund-calc-amt{ border-bottom:1px solid var(--hair);text-align:center; }
.fund-calc-amt:focus{ border-bottom-color:var(--amber); }
.fund-calc-note-btn{ color:var(--mist);text-decoration:none;font-family:var(--f-body);font-weight:600;font-size:12px;letter-spacing:.2em;text-transform:uppercase; }
.fund-calc-note-btn:hover{ color:var(--bone); }

/* nav, modal, evidence viewer, floating chat: no boxes */
.nav-menu-btn{ border:0;background:none;color:var(--bone);filter:drop-shadow(0 1px 6px rgba(5,7,9,.7)); }
.nav-menu-btn:hover{ color:var(--amber); }
.m-close{ color:var(--mist);background:none;border:0; }
.m-close:hover{ color:var(--amber); }
.ev-lb-close,.ev-lb-arrow{ border:0!important;background:none!important;color:var(--bone);filter:drop-shadow(0 1px 8px rgba(0,0,0,.8)); }
.ev-lb-close:hover,.ev-lb-arrow:hover{ color:var(--amber); }
.evidence-plan-badge{ background:none;border:0;padding:0;bottom:12px;right:14px;font-family:var(--f-body);font-weight:600;font-size:12px;letter-spacing:.22em;color:var(--bone);text-shadow:0 1px 10px rgba(0,0,0,.9),0 0 2px rgba(0,0,0,.8); }
.evidence-plan-badge::after{ content:" →";color:var(--amber); }
.evidence-card:hover .evidence-plan-badge{ color:var(--amber); }
.modal-wa-link{ color:var(--mist);text-decoration:none;font-family:var(--f-body);font-weight:600;font-size:12px;letter-spacing:.22em; }
.modal-wa-link:hover{ color:var(--bone); }

/* the large contact CTA follows the same rules at display size */
.contact-cta .display{ color:var(--bone);text-shadow:0 2px 24px rgba(5,7,9,.6); }
.contact-cta .arw{ color:var(--amber);transition:transform .3s cubic-bezier(.2,.8,.2,1); }
.contact-cta:hover .display{ color:var(--amber); }
.contact-cta:hover .arw{ transform:translateX(6px); }
.contact-cta:active{ transform:translateY(1px); }
.contact-cta:focus-visible{ outline:2px solid var(--amber);outline-offset:8px; }
/* the arrow follows the last word at every width */
.contact-cta{ display:block; }
.contact-cta .display{ display:inline; }
.contact-cta .arw{ display:inline-block;margin-left:.35em;padding-bottom:0;vertical-align:baseline; }
.btn{ max-width:100%; }
/* text and arrow flow inline, so when a CTA wraps the arrow stays with its last word */
.btn:not(.fund-calc-step){ display:inline-block;text-align:left; }
.btn > span:first-child{ display:inline; }
.btn .arw{ display:inline-block;margin-left:.75em; }
.contact-cta .display{ font-size:clamp(38px,4.8vw,80px); }
@media (max-width:420px){ .btn{ letter-spacing:.2em; } } /* keeps the arrow on the CTA line on narrow phones */

/* ============================================================
   PLAN PRIVADO — bloque en Evidencia + visor en página.
   Línea SpaceX: texto integrado al fondo, filetes de 1px, sin cajas.
   Archivo ensanchada en titulares, Archivo en texto, Fragment Mono en cifras.
   ============================================================ */
.pp{ grid-column:1 / -1;margin-top:clamp(56px,9vh,104px);padding-top:clamp(26px,3.6vh,36px);border-top:1px solid var(--hair);
  display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(16px,2vw,32px);row-gap:28px;align-items:end; }
.pp-copy{ grid-column:1 / span 6;min-width:0; }
.pp-form,.pp-unlocked{ grid-column:8 / span 5;min-width:0; }
.pp-tag{ display:flex;align-items:center;gap:10px;margin-bottom:18px;font-family:var(--f-mono);font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--amber); }
.pp-tag svg,.pv-confid svg{ width:13px;height:13px;flex:none; }
.pp-title{ font-family:var(--f-display);font-stretch:var(--stretch-display);font-weight:var(--w-display);letter-spacing:var(--ls-display);
  font-size:clamp(26px,2.5vw,40px);line-height:1.08;color:var(--bone);text-wrap:balance;margin-bottom:16px; }
.pp-title-dim{ color:var(--mist);font-weight:500; }
.pp-desc{ font-size:15px;line-height:1.65;color:var(--mist);max-width:54ch; }
.pp-label{ display:block;margin-bottom:4px;font-family:var(--f-mono);font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--mist); }
.pp-row{ display:flex;align-items:center;gap:18px;border-bottom:1px solid var(--hair);transition:border-color .25s ease; }
.pp-row:focus-within{ border-bottom-color:var(--amber); }
.pp-input{ flex:1;min-width:0;min-height:52px;padding:10px 0;background:none;border:0;border-radius:0;outline:0;
  font-family:var(--f-mono);font-size:18px;letter-spacing:.2em;text-transform:uppercase;color:var(--bone);caret-color:var(--amber); }
.pp-input::placeholder{ color:var(--mist-dim);letter-spacing:.06em;text-transform:none;font-family:var(--f-body);font-size:15px; }
.pp .btn.pp-open{ flex:none;padding:12px 0;min-height:48px; }
.pp-msg{ min-height:1.6em;margin-top:10px;font-size:13px;line-height:1.5;color:var(--mist); }
.pp-msg[data-kind="busy"]{ color:var(--amber); }
.pp-msg[data-kind="error"]{ color:#E3A49B; }
.pp-terms{ margin-top:4px;font-size:12.5px;line-height:1.6;color:var(--mist-dim); }
.pp-legal{ background:none;border:0;padding:0;margin:0;font:inherit;color:var(--mist);text-decoration:underline;text-decoration-color:var(--hair);text-underline-offset:3px;cursor:pointer; }
.pp-legal:hover{ color:var(--amber);text-decoration-color:var(--amber); }
.pp-legal:focus-visible{ outline:2px solid var(--amber);outline-offset:3px; }
.pp-ok{ font-family:var(--f-mono);font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--amber);margin-bottom:2px; }
.pp-unlocked[hidden],.pp-form[hidden]{ display:none; }
html[data-lang="zh"] .pp-title{ font-family:'Noto Serif SC',serif;font-stretch:100%;font-weight:600;letter-spacing:.01em; }
html[data-lang="zh"] .pp-tag,html[data-lang="zh"] .pp-label,html[data-lang="zh"] .pp-ok{ letter-spacing:.08em; }

/* ---------- visor ---------- */
.pv{ position:fixed;inset:0;z-index:400;display:flex;flex-direction:column;background:var(--ink);opacity:0;transition:opacity .32s var(--ease); }
.pv[hidden]{ display:none; }
.pv.open{ opacity:1; }
.pv::before{ content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 70% 50% at 50% 0%, var(--amber-a08), transparent 70%); }
.pv-top{ position:relative;z-index:1;flex:none;display:flex;align-items:center;justify-content:space-between;gap:12px 20px;
  padding:calc(8px + env(safe-area-inset-top,0px)) var(--pad) 8px;border-bottom:1px solid var(--hair-2);background:rgba(11,14,17,.94); }
.pv-confid{ display:flex;align-items:center;gap:10px;min-width:0;font-family:var(--f-mono);font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--amber); }
.pv-tools{ display:flex;align-items:center;gap:6px;flex:none; }
.pv-langs{ display:flex; }
.pv-close{ display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 2px 0 14px;background:none;border:0;cursor:pointer;
  font-family:var(--f-body);font-weight:600;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--bone);transition:color .2s ease; }
.pv-close svg{ width:14px;height:14px;color:var(--amber); }
.pv-close:hover{ color:var(--amber); }
.pv-close:focus-visible{ outline:2px solid var(--amber);outline-offset:2px; }
.pv-scroll{ position:relative;z-index:1;flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch; }
.pv-scroll:focus{ outline:none; }
.pv-body{ max-width:960px;margin:0 auto;padding:clamp(44px,8vh,96px) var(--pad) calc(72px + var(--safe-bottom)); }
html[data-lang="zh"] .pv-confid{ letter-spacing:.08em; }

/* ---------- documento ---------- */
.pv-doc{ font-family:var(--f-body);font-size:16px;line-height:1.72;color:var(--mist); }
.pv-doc p{ margin:0 0 1em;max-width:70ch; }
.pv-doc strong{ color:var(--bone);font-weight:600; }
.pv-k,.pv-subhead{ font-family:var(--f-mono);font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--mist); }
.pv-cover{ padding-bottom:clamp(52px,9vh,96px); }
.pv-brand{ display:flex;align-items:center;gap:12px;margin-bottom:clamp(48px,9vh,96px);font-family:var(--f-mono);font-size:12px;letter-spacing:.26em;color:var(--mist); }
.pv-dot{ width:6px;height:6px;border-radius:50%;background:var(--amber);flex:none; }
.pv-eyebrow{ margin-bottom:20px;font-family:var(--f-mono);font-size:12px;letter-spacing:.26em;color:var(--amber); }
.pv-title{ display:flex;flex-direction:column;margin-bottom:22px;font-family:var(--f-display);font-stretch:var(--stretch-display);font-weight:600;letter-spacing:-.01em;
  font-size:clamp(30px,4.4vw,60px);line-height:1;color:var(--bone); }
.pv-sub{ font-size:clamp(16px,1.4vw,19px);color:var(--mist);margin-bottom:clamp(40px,7vh,72px)!important; }
.pv-figs{ margin:0;border-top:1px solid var(--hair); }
.pv-fig{ display:flex;align-items:baseline;justify-content:space-between;gap:8px 24px;padding:17px 0;border-bottom:1px solid var(--hair-2); }
.pv-fig dt{ font-family:var(--f-mono);font-size:12px;letter-spacing:.06em;color:var(--mist); }
.pv-fig dd{ margin:0;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:0 14px;text-align:right;font-family:var(--f-mono);font-size:clamp(16px,1.7vw,21px);color:var(--bone);font-variant-numeric:tabular-nums; }
.pv-fig-t{ color:var(--amber); }
.pv-cfoot{ display:flex;align-items:center;gap:14px;margin-top:40px!important;font-family:var(--f-mono);font-size:12px;letter-spacing:.2em;color:var(--mist-dim); }
.pv-rule{ width:34px;height:1px;background:var(--mist-dim);flex:none; }
.pv-sec{ padding-top:clamp(56px,9vh,96px); }
.pv-secnum{ margin-bottom:12px;font-family:var(--f-mono);font-size:12px;letter-spacing:.22em;color:var(--amber); }
.pv-h2{ margin-bottom:28px;padding-bottom:18px;border-bottom:1px solid var(--hair);font-family:var(--f-display);font-stretch:var(--stretch-display);font-weight:600;letter-spacing:.01em;
  font-size:clamp(22px,2.5vw,34px);line-height:1.12;color:var(--bone);text-wrap:balance; }
.pv-doc .pv-lead{ font-size:clamp(18px,1.55vw,21px);line-height:1.5;font-weight:500;color:var(--bone); }
.pv-h3{ margin:40px 0 4px;font-family:var(--f-display);font-stretch:var(--stretch-display);font-weight:600;font-size:clamp(17px,1.5vw,20px);color:var(--bone); }
.pv-subhead{ margin:-10px 0 4px; }
.pv-call{ margin:30px 0;padding:2px 0 2px 22px;border-left:1px solid var(--hair); }
.pv-call.is-accent{ border-left-color:var(--amber); }
.pv-call .pv-k{ margin-bottom:10px; }
.pv-call.is-accent .pv-k{ color:var(--amber); }
.pv-call p:last-child{ margin-bottom:0; }
.pv-call.is-plain p{ font-size:clamp(17px,1.45vw,19px);line-height:1.55; }
.pv-unit{ margin:34px 0;padding:30px 0 28px;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);text-align:center; }
.pv-unit ul{ list-style:none;margin:16px 0 0;padding:0;font-family:var(--f-mono);font-size:clamp(17px,2.2vw,27px);line-height:1.65;color:var(--bone);font-variant-numeric:tabular-nums; }
.pv-unit li.is-hl{ margin-top:8px;color:var(--amber); }
.pv-tw{ margin:22px 0 12px;overflow-x:auto;-webkit-overflow-scrolling:touch; }
.pv-tw:focus-visible{ outline:2px solid var(--amber);outline-offset:4px; }
.pv-t{ width:100%;border-collapse:collapse;font-size:14.5px;line-height:1.45;font-variant-numeric:tabular-nums; }
.pv-t th{ padding:0 14px 12px;border-bottom:1px solid var(--hair);font-family:var(--f-mono);font-weight:400;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--mist-dim);white-space:nowrap; }
.pv-t td{ padding:12px 14px;border-bottom:1px solid var(--hair-2);color:var(--mist);vertical-align:baseline; }
.pv-t th:first-child,.pv-t td:first-child{ padding-left:0; }
.pv-t th:last-child,.pv-t td:last-child{ padding-right:0; }
.pv-t .l{ text-align:left; }
.pv-t .r{ text-align:right; }
.pv-t td.n{ font-family:var(--f-mono);font-size:14px;color:var(--bone);white-space:nowrap; }
.pv-t tr.is-strong td{ color:var(--bone);font-weight:600;border-top:1px solid var(--hair); }
.pv-t tr.is-hl td,.pv-t tr.is-hl td.n{ color:var(--amber); }
.pv-t tr.is-hl td:first-child{ font-weight:600; }
.pv-doc .pv-caption{ font-size:13px;color:var(--mist-dim); }
.pv-doc .pv-note{ font-size:12.5px;line-height:1.65;color:var(--mist-dim);max-width:none; }
.pv-doc .pv-note strong{ color:var(--mist); }
.pv-bar{ margin:36px 0 26px;padding:24px 0 6px;border-top:1px solid var(--hair); }
.pv-track{ display:flex;gap:3px;height:6px;margin:18px 0 16px; }
.pv-seg{ min-width:4px; }
.pv-seg b{ position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0); }
.pv-bar .s1{ background:rgba(232,234,237,.62); } .pv-bar .s2{ background:rgba(232,234,237,.28); }
.pv-bar .s3{ background:var(--amber-a40); } .pv-bar .s4{ background:var(--amber); }
.pv-legend{ list-style:none;margin:0 0 18px;padding:0;display:flex;flex-wrap:wrap;gap:10px 28px;font-family:var(--f-mono);font-size:12px;letter-spacing:.14em;color:var(--mist); }
.pv-legend li{ display:flex;align-items:center;gap:8px; }
.pv-legend i{ width:10px;height:3px;flex:none; }
.pv-lv{ color:var(--bone);letter-spacing:0; }
.pv-terms{ list-style:none;margin:16px 0 0;padding:0;border-top:1px solid var(--hair); }
.pv-terms li{ display:grid;grid-template-columns:44px minmax(0,1fr);padding:16px 0;border-bottom:1px solid var(--hair-2); }
.pv-tn{ font-family:var(--f-mono);font-size:14px;color:var(--amber);line-height:1.72; }
.pv-terms p{ margin:0; }
.pv-risks{ margin:30px 0;border-top:1px solid var(--hair); }
.pv-risk{ display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:10px 36px;padding:20px 0;border-bottom:1px solid var(--hair-2); }
.pv-rk strong{ display:block;margin-bottom:6px; }
.pv-rk span{ display:block;font-size:13.5px;line-height:1.6;color:var(--mist-dim); }
.pv-risk p{ margin:0; }
.pv-result{ margin-top:52px;padding:46px 0 10px;border-top:1px solid var(--amber);text-align:center; }
.pv-big{ margin:16px 0 18px;font-family:var(--f-display);font-stretch:125%;font-weight:600;letter-spacing:-.01em;font-size:clamp(40px,7.4vw,88px);line-height:1;color:var(--bone);font-variant-numeric:tabular-nums; }
.pv-doc .pv-result p{ margin:0 auto .35em;max-width:none;font-family:var(--f-mono);font-size:13px;color:var(--mist); }
.pv-amber{ color:var(--amber); }
.pv-end{ display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;margin-top:72px;padding-top:18px;border-top:1px solid var(--hair-2);font-family:var(--f-mono);font-size:12px;letter-spacing:.16em;color:var(--mist-dim); }
/* chino: titulares en Noto Serif SC como el resto del sitio; mono con menos tracking */
.pv-doc:lang(zh) .pv-title,.pv-doc:lang(zh) .pv-h2,.pv-doc:lang(zh) .pv-h3{ font-family:'Noto Serif SC',serif;font-stretch:100%;letter-spacing:.02em; }
.pv-doc:lang(zh) .pv-title{ line-height:1.18; }
.pv-doc:lang(zh) .pv-k,.pv-doc:lang(zh) .pv-subhead,.pv-doc:lang(zh) .pv-eyebrow,.pv-doc:lang(zh) .pv-legend,.pv-doc:lang(zh) .pv-t th,.pv-doc:lang(zh) .pv-cfoot{ letter-spacing:.06em; }
.pv-doc:lang(zh){ line-height:1.85; }
@media (max-width:1024px){
  .pp-copy,.pp-form,.pp-unlocked{ grid-column:1 / -1; }
}
@media (max-width:700px){
  .pv-top{ flex-wrap:wrap;padding-left:16px;padding-right:8px;padding-bottom:10px;row-gap:2px; }
  .pv-tools{ order:1;width:100%;justify-content:space-between; }
  .pv-confid{ order:2;width:100%;font-size:12px;letter-spacing:.12em; }
  .pv-close span{ position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0); }
  .pv-close{ padding:0 10px;min-width:44px;justify-content:center; }
  .pv-langs button{ min-width:40px;padding:0 8px; }
  .pv-body{ padding-left:20px;padding-right:20px; }
  .pv-doc{ font-size:15px; }
  .pv-fig{ flex-direction:column;align-items:flex-start;gap:4px; }
  .pv-fig dd{ justify-content:flex-start;text-align:left; }
  /* tables fit the screen: labels wrap, headers wrap, no sideways scroll */
  .pv-t{ font-size:13px; }
  .pv-t td.n{ font-size:12.5px; }
  .pv-t th{ white-space:normal;font-size:9.5px;letter-spacing:.1em;vertical-align:bottom; }
  .pv-t th,.pv-t td{ padding-left:6px;padding-right:6px; }
  .pv-c6 td.n{ font-size:11.5px; }
  .pv-c6 th{ font-size:8.5px;letter-spacing:.06em; }
  .pv-c5 td.n{ font-size:10px; }
  .pv-c5 th{ font-size:8px;letter-spacing:.04em; }
  .pv-c5 th,.pv-c5 td{ padding-left:4px;padding-right:4px; }
  .pv-c5 td.l{ font-size:12px; }
  .pv-risk{ grid-template-columns:1fr; }
  .pv-terms li{ grid-template-columns:32px minmax(0,1fr); }
}
@media (prefers-reduced-motion:reduce){ .pv{ transition:none; } }

/* ---------- Grain / reduced ---------- */
body.reduced *,body.reduced *::before,body.reduced *::after{ animation:none!important;transition:none!important; }

/* ============================================================
   VARIANTE 5 — "TURNO DE NOCHE"
   Una sola visión a partir de tres referencias:
   · SpaceX — disciplina: cada capítulo es una banda de video a pantalla
     completa; en su primer tiempo solo hay kicker, titular y (si existe)
     su CTA, abajo a la izquierda. Nada más.
   · Terminal Industries — alma industrial: capítulos numerados que
     avanzan con el scroll; un riel de capítulo; el expediente como hoja
     técnica con numerales grandes.
   · Illoca / Unseen — la cámara: cada capítulo tiene un movimiento
     (dolly, grúa, paneo) que el scroll conduce y que se asienta con
     inercia; el corte entre capítulos es un empuje a través de la imagen.
   Paleta: noche de acero; el ámbar vive en las luces prácticas del
   metraje y en las señales; el hueso es la voz.
   Solo transform/opacity. Sin JS o con movimiento reducido no hay cámara:
   todo se lee en flujo sobre acero.
   ============================================================ */
:root{ --rail-w:0px;--nav-h:76px; }
@media (min-width:1025px){ :root{ --rail-w:0px; } }
@media (max-width:1024px){ :root{ --nav-h:calc(60px + env(safe-area-inset-top,0px)); } }
.grid12{ max-width:none; }

/* ---------- the plates: night grade, a SpaceX floor of shadow for the type ---------- */
.bd-layer video,.bd-layer img{ filter:saturate(.62) contrast(1.14) brightness(.9); }
.motion .bd-layer[data-bd="port"] .bd-breathe{ animation:none; }   /* the camera owns the plate now */
.bd-layer > .bd-move{ will-change:transform; }
.backdrop .bd-tone{ display:none; }
.backdrop .bd-shade{ background:
  linear-gradient(180deg, rgba(11,14,17,.5) 0%, rgba(11,14,17,0) 20%, rgba(11,14,17,0) 46%, rgba(11,14,17,.9) 100%),
  linear-gradient(90deg, rgba(11,14,17,.7) 0%, rgba(11,14,17,.12) 55%, rgba(11,14,17,0) 100%); }
.backdrop .bd-scrim,.backdrop .bd-grid,.backdrop .bd-shade,.backdrop .bd-veil,.backdrop .bd-grain{ z-index:5; }
@media (max-width:1024px){
  .backdrop .bd-shade{ background:linear-gradient(180deg, rgba(11,14,17,.55) 0%, rgba(11,14,17,.2) 26%, rgba(11,14,17,.55) 52%, rgba(11,14,17,.94) 100%); }
  .bd-layer[data-bd="welder"] video,.bd-layer[data-bd="welder"] img{ filter:saturate(.55) contrast(1.06) brightness(.55); }
  .bd-layer[data-bd="origin"] video,.bd-layer[data-bd="origin"] img{ filter:saturate(.58) contrast(1.08) brightness(.72); }
  .bd-layer[data-bd="trace"] video,.bd-layer[data-bd="trace"] img{ filter:saturate(.55) contrast(1.06) brightness(.66); }
}

/* ---------- nav: SpaceX — transparent, uppercase, tucks away on the way down ---------- */
.nav-wrap,.nav-wrap.scrolled,.js .nav-wrap,.js .nav-wrap.scrolled{ top:0;height:var(--nav-h);padding:env(safe-area-inset-top,0px) var(--pad) 0;align-items:center;justify-content:stretch;
  background:linear-gradient(180deg, rgba(11,14,17,.6), rgba(11,14,17,0));transition:transform .6s var(--ease),background-color .4s var(--ease); }
.nav-wrap.is-tucked{ transform:translateY(-100%); }
html:not(.motion) .nav-wrap{ background:rgba(11,14,17,.95);border-bottom:1px solid var(--hair-2); }
.nav,.nav-wrap.scrolled .nav{ width:100%;max-width:none;padding:0;border:0;border-radius:0;background:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;gap:32px; }
.nav-wrap.scrolled .logo,.nav-wrap.scrolled .seg{ display:flex; }
@media (min-width:1025px){
  .nav-wrap.scrolled .nav-links{ display:flex; }
  .nav-wrap.scrolled .nav-menu-btn{ display:none; }
  .nav-links{ justify-content:flex-start;gap:4px;margin-left:24px; }
  .nav-links a{ font-family:var(--f-body);font-weight:600;font-stretch:100%;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--bone);opacity:.72;transition:opacity .25s ease; }
  html[data-lang="zh"] .nav-links a{ letter-spacing:.06em;font-size:13px; }
  .nav-links a:hover,.nav-links a.active{ opacity:1; }
  .nav-links a.active::after{ left:12px;right:12px;bottom:6px;height:1px; }
}
.nav-drop{ top:calc(var(--nav-h) + 4px); }

/* ---------- chapter rail (Terminal): the route on the right edge ---------- */
html.motion .route{ left:auto;right:calc(var(--pad) * .5);top:50%;bottom:auto;width:auto;height:min(46vh,360px);transform:translateY(-50%);
  display:block;padding:0;background:none;transition:opacity .5s var(--ease); }
html.motion .route-ai,html.motion .route-tel,html.motion .route-here{ display:none; }
html.motion .route-track{ position:absolute;right:0;top:0;bottom:0;width:1px;height:auto; }
html.motion .route-base,html.motion .route-fill{ left:0;top:0;width:1px;height:100%; }
html.motion .route-base{ background:rgba(232,234,237,.22); }
html.motion .route-fill{ transform-origin:50% 0;transform:scaleY(0); }
html.motion .route-stops{ inset:0; }
html.motion .route-stop{ left:auto;right:0;transform:translateY(-50%);gap:12px;flex-direction:row-reverse; }
html.motion .route-stop .dot{ width:9px;height:1px;border:0;background:rgba(232,234,237,.4);transition:width .5s var(--ease),background .4s var(--ease); }
html.motion .route-stop.is-lit .dot{ background:var(--amber); }
html.motion .route-stop.is-here .dot{ width:22px; }
html.motion .route-stop .lbl{ font-size:9.5px;opacity:0;transform:translateX(6px);transition:opacity .4s var(--ease),transform .5s var(--ease); }
html.motion .route-stop.is-here .lbl{ opacity:1;transform:none;color:var(--bone); }
html.motion .route-stop:nth-child(1){ top:0; } html.motion .route-stop:nth-child(2){ top:25%; } html.motion .route-stop:nth-child(3){ top:50%; }
html.motion .route-stop:nth-child(4){ top:75%; } html.motion .route-stop:nth-child(5){ top:100%; }
html.motion.in-sheet .route{ opacity:0; }
@media (max-width:1024px){
  html.motion .route{ right:0;left:0;top:0;height:2px;transform:none; }
  html.motion .route-track{ left:0;right:0;width:auto;height:2px;top:0;bottom:auto; }
  html.motion .route-base,html.motion .route-fill{ width:100%;height:2px; }
  html.motion .route-base{ background:transparent; }
  html.motion .route-fill{ transform-origin:0 50%;transform:scaleX(0); }
  html.motion .route-stop{ display:none; }
}
html:not(.motion) .route{ display:none; }

/* ============================================================
   THE BANDS — one headline, one CTA, bottom left
   ============================================================ */
html.motion .is-staged .scene-content > .grid12{ padding-top:calc(var(--nav-h) + 16px);padding-bottom:clamp(40px,8vh,88px);align-content:end; }
@media (max-width:1024px){ html.motion .is-staged .scene-content > .grid12{ padding-bottom:calc(28px + var(--safe-bottom)); } }
.scene--stage .h2{ font-size:clamp(30px,min(3.4vw,6vh),60px);line-height:1.04;letter-spacing:-.025em; }
.hero-copy .h1{ font-size:clamp(40px,min(5vw,8.6vh),96px);line-height:.98;letter-spacing:-.03em; }
html[data-lang="en"] .hero-copy .h1{ max-width:12ch; }
html[data-lang="zh"] .hero-copy .h1{ font-size:clamp(34px,min(4.2vw,7.4vh),80px);line-height:1.16; }
.scroll-cue{ display:none!important; }
/* the kicker as a chapter mark */
.scene--stage .kicker .k-num{ font-family:var(--f-display);font-stretch:var(--stretch-display);font-weight:600;font-size:13px;letter-spacing:0; }
@media (min-width:1025px){
  /* hero: headline, then the call; the lead arrives in the second beat beneath it */
  .hero .scene-content > .grid12{ align-content:end; }
  /* hero: headline across, then one row — the call on the left, the lead (second beat) on the right */
  .hero-copy{ grid-column:1 / -1;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(16px,2vw,32px);align-items:end; }
  .hero-copy > .hero-seal,.hero-copy > .kicker{ grid-column:1 / span 8; }
  .hero-copy > .h1{ grid-column:1 / span 9; }
  .hero-copy .hero-actions{ grid-column:1 / span 5;grid-row:4;margin-top:clamp(14px,2.4vh,26px);flex-direction:column;align-items:flex-start;gap:2px; }
  .hero-copy .hero-lower{ grid-column:7 / -1;grid-row:4;margin-top:0;grid-template-columns:1fr;row-gap:14px; }
  .hero-lower .lead,.hero-statement{ grid-column:1 / -1; }
  .about .scene-content > .grid12{ align-content:end; }
  .about-copy{ grid-column:1 / span 6; }
  .about-copy .h2{ font-size:clamp(34px,min(4vw,7vh),72px);max-width:14ch; }
  /* how: head left, the steps and the AI to the right, as the camera rises */
  .how .scene-content > .grid12{ grid-template-rows:auto;align-content:end; }
  .how-body{ display:contents; }
  .how-head{ grid-column:1 / span 5;grid-row:1;align-self:end; }
  .how .steps{ grid-column:7 / span 6;grid-row:1;align-self:end;grid-template-columns:1fr 1fr;row-gap:22px; }
  .how .ai-block{ grid-column:7 / span 6;grid-row:2;align-self:end;margin:28px 0 0; }
  .how.is-staged .ai-block{ grid-row:1;margin:0; }
  .how.is-staged .steps[data-show]{ transition:none; }
  .programs .scene-content > .grid12{ align-content:end; }
  .pgm-head{ grid-column:1 / span 5;grid-row:1;align-self:end; }
  .pgm-list{ grid-column:1 / span 5;grid-row:2;margin-top:18px; }
  .pgm-stack{ grid-column:7 / span 6;grid-row:1 / span 2;align-self:end; }
  .trace .scene-content > .grid12{ align-content:end; }
  .trace-copy{ grid-column:1 / span 5;align-self:end; }
  .trace-stack{ grid-column:7 / span 6;align-self:end; }
  .contact .scene-content > .grid12{ align-content:end; }
  .contact-cta .display{ font-size:clamp(42px,min(5.6vw,9.6vh),108px); }
}
/* in the how band the AI replaces the steps (same place, next beat) */
.how.is-staged .steps,.how.is-staged .ai-block{ grid-area:1 / 7 / 2 / -1; }
@media (max-width:1024px){ .how.is-staged .how-body{ display:grid;grid-template-columns:minmax(0,1fr); } .how.is-staged .steps,.how.is-staged .ai-block{ grid-area:1 / 1 / 2 / 2;align-self:end; } }
.how .step .t{ color:var(--bone); }
.how .step .n{ color:var(--amber); }
.how .step::before{ transform:scaleX(1); }
/* panels: night glass, hairline, an amber top edge */
.pgm-card,.trace-panel,.ai-block{ background:rgba(11,14,17,.78);border:1px solid var(--hair);border-top-color:var(--amber-a40); }
.ai-block{ border-left:1px solid var(--hair); }

/* ---------- phones: the band keeps its discipline ---------- */
@media (max-width:1024px){
  .programs.is-staged .pgm-list{ display:none; }
  /* trace: the body and its three panels take turns in one place */
  .trace.is-staged .trace-copy,.trace.is-staged .trace-stack{ display:contents; }
  .trace.is-staged .scene-content > .grid12 > *,.trace.is-staged .trace-copy > *,.trace.is-staged .trace-stack > *{ grid-column:1 / -1; }
  .trace.is-staged .trace-copy .body,.trace.is-staged .trace-panel{ grid-row:4;align-self:end; }
  .trace.is-staged .trace-copy .body{ margin-bottom:0; }
  .trace.is-staged .trace-copy .demo-badge{ justify-self:start; }
  .hero-copy .hero-actions{ order:3; }
  .hero-copy .hero-lower{ order:4;margin-top:18px; }
  .hero-copy{ display:flex;flex-direction:column; }
}

/* "how" on phones held upright: the welder is a close-up in a landscape plate, so a
   full-screen crop cut him at the edge of the mask. Here the plate is sized so the
   whole welder fits (mask, hands, torch, arc), sits in the upper half framed on him,
   and melts with a long fade into the port behind it: the containers carry the lower
   half of the screen. No band, no fill. Only this scene, only portrait. */
@media (max-width:1024px) and (orientation:portrait){
  .bd-layer[data-bd="origin"] > .bd-move{ transform-origin:50% 26vh; }   /* the camera turns around the welder */
  .bd-layer[data-bd="origin"] video,.bd-layer[data-bd="origin"] img{ top:0;bottom:auto;height:52vh;object-position:34% 50%;
    -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 52%,rgba(0,0,0,.6) 74%,transparent 100%);
            mask-image:linear-gradient(180deg,#000 0%,#000 52%,rgba(0,0,0,.6) 74%,transparent 100%); }
  @supports (height:1svh){ .bd-layer[data-bd="origin"] video,.bd-layer[data-bd="origin"] img{ height:52svh; } }
}
/* short phones: the same band, tighter type */
@media (max-width:1024px) and (max-height:760px){
  html.motion .is-staged .scene-content > .grid12{ padding-top:calc(var(--nav-h) + 6px);padding-bottom:calc(16px + var(--safe-bottom)); }
  .hero-copy .h1{ font-size:clamp(30px,8.4vw,38px); }
  .hero-lower .lead{ font-size:14px;line-height:1.5; }
  .hero-actions .note{ font-size:12.5px; }
  .trace-row .v{ font-size:16px; }
  .trace-copy .h2{ margin-bottom:12px; }
  .trace.is-staged .scene-content > .grid12{ row-gap:0; }
  .trace.is-staged .trace-copy .demo-badge{ margin-bottom:12px;justify-self:start; }
  .scene--stage .h2,.about-copy .h2{ font-size:clamp(26px,7.4vw,32px); }
  .scene--stage .kicker{ margin-bottom:12px; }
  .hero-seal{ margin-bottom:10px; }
  .about-seed,.scene--stage .body,.pgm-card .pc-body{ font-size:14px;line-height:1.5; }
  .pgm-card{ padding:16px 16px 18px; }
  .trace-panel{ padding:14px 16px 16px; }
  .trace-row{ padding:8px 0; }
  .gov-rules li{ padding:8px 0;font-size:14px; }
  .fund-gov-row{ padding:9px 0; }
  .hero-statement{ font-size:16px; }
}
/* ============================================================
   THE SHEET (Terminal) — evidence, plan, funding, FAQ
   ============================================================ */
.scene--flow{ background:var(--ink);padding:clamp(80px,11vh,140px) 0 clamp(72px,10vh,120px);border-top:1px solid var(--hair-2); }
.scene--flow::before{ display:none; }
.evidence.scene--flow{ border-top:0; }
.evidence.scene--flow::after{ content:"";position:absolute;left:0;right:0;bottom:100%;height:40vh;pointer-events:none;background:linear-gradient(180deg, rgba(11,14,17,0), var(--ink)); }
.scene--flow > .grid12{ position:relative; }
/* the chapter numeral, set large like a sheet number */
.scene--flow .kicker{ display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:16px;row-gap:14px;align-items:center; }
.scene--flow .kicker .k-num{ grid-column:1 / -1;grid-row:1;font-family:var(--f-display);font-stretch:var(--stretch-display);font-weight:600;letter-spacing:-.04em;
  font-size:clamp(72px,8vw,150px);line-height:.8;color:var(--mist-dim);text-shadow:none; }
.scene--flow .kicker .k-line{ grid-row:2; }
.scene--flow .kicker > span:last-child{ grid-row:2; }
.scene--flow .h2{ font-size:clamp(34px,4vw,72px);line-height:1.02;letter-spacing:-.035em; }
html[data-lang="zh"] .scene--flow .h2{ font-size:clamp(30px,3.2vw,56px);line-height:1.22;letter-spacing:.01em; }
.scene--flow .fund-card,.scene--flow .fund-panel{ background:var(--steel); }
.scene--flow .evidence-card{ background:var(--steel); }
/* a caption scrim under the label, so "View documents" reads even over the white invoice */
.evidence-ph::after{ content:"";position:absolute;left:0;right:0;bottom:0;height:42%;z-index:1;pointer-events:none;background:linear-gradient(180deg, rgba(11,14,17,0), rgba(11,14,17,.78)); }
/* ---------- WhatsApp · opción 5: glifo monocromático en el nav ----------
   Glifo dibujado a línea en hueso (sin el logo relleno ni su verde) + "WHATSAPP" en mono.
   Escritorio (≥1025 px): glifo + etiqueta, tras EN·ES·ZH con un filete.
   Tablet y teléfonos grandes (480–1024 px): solo el glifo; la etiqueta queda para
   lectores de pantalla. Teléfonos (<480 px): el nav no tiene sitio, el enlace se oculta
   y ahí sigue el botón flotante actual. Hover y foco: latón. */
.nav-wa{ position:relative;display:inline-flex;align-items:center;gap:9px;flex:none;min-height:44px;padding:0 2px 0 22px;
  font-family:var(--f-mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--bone);
  text-shadow:0 1px 10px rgba(5,7,9,.6);transition:color .25s ease; }
.nav-wa::before{ content:"";position:absolute;left:0;top:50%;width:1px;height:14px;margin-top:-7px;background:var(--hair); }
.nav-wa-g{ width:17px;height:17px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;
  filter:drop-shadow(0 1px 6px rgba(5,7,9,.7)); }
.nav-wa:hover,.nav-wa:focus-visible{ color:var(--amber); }
.nav-wa:focus-visible{ outline:2px solid var(--amber);outline-offset:4px; }
@media (max-width:1024px){
  .nav-wa{ min-width:44px;justify-content:center;padding:0;margin-left:-14px; }
  .nav-wa::before{ display:none; }
  .nav-wa-g{ width:19px;height:19px; }
  .nav-wa-lbl{ position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap; }
}
@media (max-width:479px){
  .nav,.nav-wrap.scrolled .nav{ gap:0; }
  .nav .logo{ padding-right:0; }
  .nav .seg button{ padding-left:0;padding-right:0; }
  .nav-wa{ margin-left:0; }
}
@media (max-width:374px){
  .nav-wrap,.nav-wrap.scrolled,.js .nav-wrap,.js .nav-wrap.scrolled{ padding-left:12px;padding-right:12px; }
}
/* Small labels over the video: a soft shadow keeps them legible on bright frames (A11Y-04). */
.hero .kicker,.hero-seal-lab,.hero .note{ text-shadow:0 1px 10px rgba(11,14,17,.85),0 0 2px rgba(11,14,17,.6); }