/* ═══════════════════════════════════════════════════════════
   ORBITAL · capa de inmersión
   Traspaso de enlace entre páginas, campo estelar, decodificado
   de titulares, retícula y barridos de consola.
   Sólo transform/opacity: ni un canvas, ni una sombra por cuadro.
   ═══════════════════════════════════════════════════════════ */

/* ── 1. Traspaso de enlace ─────────────────────────────────── */
.obx-link{
  position:fixed;z-index:400;inset:0;
  display:grid;place-items:center;
  background:var(--void);
  pointer-events:none;
  clip-path:inset(0 0 0 0);
  animation:obx-open 1s .12s cubic-bezier(.76,0,.24,1) forwards;
}
@keyframes obx-open{
  0%  { clip-path:inset(0 0 0 0); }
  55% { clip-path:inset(48% 0 48% 0); }
  100%{ clip-path:inset(50% 0 50% 0); }
}
.obx-link__hud{
  display:flex;flex-direction:column;gap:14px;align-items:center;
  font-family:var(--mono);opacity:0;
}
.obx-link__hud b{
  font-size:11px;font-weight:400;letter-spacing:.42em;text-indent:.42em;
  color:var(--ice);text-transform:uppercase;
}
.obx-link__hud u{
  font-size:clamp(22px,5vw,38px);font-weight:400;text-decoration:none;
  letter-spacing:.14em;text-indent:.14em;color:var(--ink);
}
.obx-link__bar{
  position:relative;width:min(260px,52vw);height:1px;background:var(--line-2);overflow:hidden;
}
.obx-link__bar::after{
  content:"";position:absolute;inset:0;background:var(--ice);
  transform:scaleX(0);transform-origin:left;
}

/* cierre: el enlace se pierde y la pantalla se vuelve a sellar */
.obx-link.is-handoff{
  pointer-events:all;
  animation:obx-close .6s cubic-bezier(.76,0,.24,1) forwards;
}
@keyframes obx-close{
  0%  { clip-path:inset(50% 0 50% 0); }
  100%{ clip-path:inset(0 0 0 0); }
}
.obx-link.is-handoff .obx-link__hud{ animation:obx-hud .5s .22s ease forwards; }
.obx-link.is-handoff .obx-link__bar::after{ animation:obx-bar .52s .26s cubic-bezier(.4,0,.2,1) forwards; }
@keyframes obx-hud{ from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:none} }
@keyframes obx-bar{ from{transform:scaleX(0)} to{transform:scaleX(1)} }

/* ── 2. Campo estelar y horizonte ──────────────────────────── */
.obx-sky{ position:fixed;z-index:0;inset:0;pointer-events:none;overflow:hidden; }
.obx-sky__layer{
  position:absolute;inset:-50%;
  background-repeat:repeat;
  will-change:transform;
}
.obx-sky__layer--far{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cg fill='%23b4cdf0'%3E%3Ccircle cx='22' cy='38' r='.6'/%3E%3Ccircle cx='96' cy='14' r='.5'/%3E%3Ccircle cx='168' cy='62' r='.7'/%3E%3Ccircle cx='240' cy='30' r='.5'/%3E%3Ccircle cx='58' cy='120' r='.6'/%3E%3Ccircle cx='134' cy='150' r='.5'/%3E%3Ccircle cx='206' cy='118' r='.6'/%3E%3Ccircle cx='30' cy='206' r='.5'/%3E%3Ccircle cx='110' cy='232' r='.7'/%3E%3Ccircle cx='186' cy='198' r='.5'/%3E%3Ccircle cx='250' cy='246' r='.6'/%3E%3C/g%3E%3C/svg%3E");
  opacity:.34;
  animation:obx-drift-far 200s linear infinite;
}
.obx-sky__layer--near{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='420' height='420'%3E%3Cg fill='%236fd6e8'%3E%3Ccircle cx='64' cy='72' r='1'/%3E%3Ccircle cx='268' cy='40' r='.9'/%3E%3Ccircle cx='372' cy='188' r='1.1'/%3E%3Ccircle cx='140' cy='262' r='.9'/%3E%3Ccircle cx='320' cy='344' r='1'/%3E%3Ccircle cx='34' cy='372' r='.9'/%3E%3C/g%3E%3C/svg%3E");
  opacity:.3;
  animation:obx-drift-near 120s linear infinite;
}
@keyframes obx-drift-far { from{transform:translate3d(0,0,0)} to{transform:translate3d(-260px,130px,0)} }
@keyframes obx-drift-near{ from{transform:translate3d(0,0,0)} to{transform:translate3d(420px,-210px,0)} }

.obx-sky__horizon{
  position:absolute;left:50%;bottom:-62vmax;
  width:150vmax;height:150vmax;margin-left:-75vmax;border-radius:50%;
  background:
    radial-gradient(closest-side, rgba(111,214,232,.09), rgba(111,214,232,.02) 62%, transparent 74%);
  will-change:transform;
  animation:obx-breathe 26s ease-in-out infinite;
}
@keyframes obx-breathe{ 0%,100%{transform:scale(1);opacity:.85} 50%{transform:scale(1.06);opacity:1} }

/* el contenido real, por encima del cielo */
main,.ft{ position:relative; z-index:1; }

/* ── 3. Titulares: máscara y decodificado ──────────────────── */
.obx-w{ display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.08em;margin-bottom:-.08em; }
.obx-w > span{
  display:inline-block;transform:translateY(115%);opacity:0;
  transition:transform 1s cubic-bezier(.16,.78,.16,1),opacity .7s ease;
  transition-delay:var(--d,0ms);
}
.obx-split.is-lit .obx-w > span{ transform:none;opacity:1; }

/* filete de enlace bajo los titulares de página */
.phead .d1::after,.phead .d2::after,.hero h1::after{
  content:"";display:block;width:0;height:1px;margin-top:.5em;
  background:linear-gradient(90deg,var(--ice),transparent);
  transition:width 1.3s .45s var(--ease);
}
.phead .d1.is-lit::after,.phead .d2.is-lit::after,.hero h1.is-lit::after{ width:min(360px,60%); }

/* el cintillo mono se escribe como una lectura de telemetría */
.eyebrow{ position:relative; }
.eyebrow.obx-type::after{
  content:"";display:inline-block;width:.55em;height:1em;margin-left:.35em;
  background:var(--ice);vertical-align:-.14em;
  animation:obx-caret .82s steps(1) infinite;
}
.eyebrow.obx-type.is-done::after{ display:none; }
@keyframes obx-caret{ 0%,49%{opacity:1} 50%,100%{opacity:0} }

/* ── 4. Retícula de puntería ───────────────────────────────── */
.obx-cross{ position:fixed;z-index:380;top:0;left:0;pointer-events:none;opacity:0;transition:opacity .35s ease; }
.obx-cross i{
  position:absolute;background:var(--ice);
  transition:transform .35s var(--ease),opacity .35s ease;
}
.obx-cross i:nth-child(1){ top:-13px;left:-.5px;width:1px;height:9px; }
.obx-cross i:nth-child(2){ bottom:-13px;left:-.5px;width:1px;height:9px; }
.obx-cross i:nth-child(3){ left:-13px;top:-.5px;height:1px;width:9px; }
.obx-cross i:nth-child(4){ right:-13px;top:-.5px;height:1px;width:9px; }
.obx-cross b{
  position:absolute;top:-3px;left:-3px;width:6px;height:6px;
  border:1px solid var(--ice);border-radius:50%;
  transition:transform .4s var(--ease),background .4s ease;
}
.obx-on .obx-cross{ opacity:.9; }
.obx-hot .obx-cross i{ transform:scale(1.9); }
.obx-hot .obx-cross b{ transform:scale(2.6);background:rgba(111,214,232,.18); }

/* ── 5. Barrido de consola ─────────────────────────────────── */
.console,.card,.spec,.tracker,.manifest,.next > a{ position:relative;overflow:hidden; }
.obx-sweep::before{
  content:"";position:absolute;z-index:3;inset:0;pointer-events:none;
  background:linear-gradient(100deg,transparent 42%,rgba(111,214,232,.13) 50%,transparent 58%);
  transform:translateX(-130%);
}
.obx-sweep.is-lit::before{ animation:obx-sweep 1.25s .1s cubic-bezier(.3,0,.2,1) forwards; }
@keyframes obx-sweep{ to{ transform:translateX(130%); } }

/* ── 6. Magnetismo ─────────────────────────────────────────── */
.btn,.next > a .go,.hero-cta a{
  will-change:transform;
  transform:translate3d(var(--mx,0px),var(--my,0px),0);
  transition:transform .5s var(--ease),background .4s ease,color .4s ease,border-color .4s ease;
}
.obx-magnet-live{ transition:transform .08s linear,background .4s ease,color .4s ease,border-color .4s ease; }

/* ── 7. Entradas escalonadas ───────────────────────────────── */
.obx-stagger > *{
  opacity:0;transform:translateY(22px);
  transition:opacity .8s ease var(--sd,0ms),transform .9s cubic-bezier(.16,.78,.16,1) var(--sd,0ms);
}
.obx-stagger.is-lit > *{ opacity:1;transform:none; }

/* menú móvil: los destinos entran uno tras otro */
.nav.is-open > a{ animation:obx-menu .6s cubic-bezier(.16,.78,.16,1) both; }
.nav.is-open > a:nth-child(1){animation-delay:.05s}
.nav.is-open > a:nth-child(2){animation-delay:.11s}
.nav.is-open > a:nth-child(3){animation-delay:.17s}
.nav.is-open > a:nth-child(4){animation-delay:.23s}
.nav.is-open > a:nth-child(5){animation-delay:.29s}
.nav.is-open > a:nth-child(6){animation-delay:.35s}
@keyframes obx-menu{ from{opacity:0;transform:translateY(22px)} to{opacity:1;transform:none} }

/* ── 8. Móvil y accesibilidad ──────────────────────────────── */
@media (hover:none),(pointer:coarse){ .obx-cross{ display:none; } }
@media (max-width:760px){
  .obx-sky__layer--far{ opacity:.26;animation-duration:280s; }
  .obx-sky__layer--near{ opacity:.22;animation-duration:180s; }
  .obx-sky__horizon{ opacity:.7; }
  .phead .d1.is-lit::after,.phead .d2.is-lit::after,.hero h1.is-lit::after{ width:120px; }
}

/* Área táctil mínima en todos los anchos táctiles, no sólo en el móvil */
.ft-in nav a{ min-height:44px;display:inline-flex;align-items:center; }
.nav > a{ min-height:44px;display:inline-flex;align-items:center; }
.burger{ min-width:44px;min-height:44px; }

/* ── 9. Densidad en el teléfono ────────────────────────────── */
@media (max-width:760px){
  /* menos aire entre secciones: la página cabe en menos pulgares */
  .sec{ padding:52px 0; }
  .sec-head .lede{ margin-top:14px; }
  .hero{ padding-top:104px; }

  /* las cifras en dos columnas hasta el final: cuatro filas son tres de más */
  .figs{ grid-template-columns:1fr 1fr!important; }
  .figs div{ padding:22px 16px; }
  .figs b{ font-size:32px; }
  .figs small{ margin-top:9px;font-size:8.5px;letter-spacing:.14em; }
  .figs p{ display:none; }

  /* tesis y destinos: tarjetas más compactas */
  .thesis article{ padding:26px 20px; }
  .thesis .n{ margin-bottom:14px; }
  .thesis h3{ margin-bottom:9px; }
  .thesis .fig{ margin-top:18px;padding-top:16px; }
  .next a{ padding:24px 20px;gap:10px; }
  .next a h3{ font-size:20px; }

  /* la imagen del bloque partido no necesita ser un retrato entero */
  .split{ gap:26px; }
  .split-media img{ aspect-ratio:16/10; }

  /* superficies táctiles cómodas */
  .nav > a{ min-height:48px;display:flex;align-items:center; }
  .btn,.hero-cta a{ min-height:48px; }
  .ft-in nav a{ min-height:44px;display:inline-flex;align-items:center; }
}

@media (max-width:400px){
  .sec{ padding:44px 0; }
  .figs b{ font-size:28px; }
  .next a{ padding:20px 18px; }
}

@media (prefers-reduced-motion:reduce){
  .obx-link,.obx-sky,.obx-cross{ display:none!important; }
  .obx-w > span{ transform:none!important;opacity:1!important; }
  .phead .d1::after,.phead .d2::after,.hero h1::after{ width:min(360px,60%);transition:none; }
  .obx-sweep::before{ display:none; }
  .obx-stagger > *{ opacity:1!important;transform:none!important; }
  .nav.is-open > a{ animation:none; }
}

/* el salto al contenido también es un control: 44 px de alto */
.skip:focus,.skip:focus-visible{ min-height:44px;display:inline-flex;align-items:center; }
