/* XaviorLabs · cielo nocturno institucional (paleta aurora, siempre oscuro).
   Capas quietas o muy lentas: estrellas, aurora boreal tenue, alguna estrella fugaz y la cordillera al pie.
   Todo va detrás del contenido (z-index 0) y se apaga con «movimiento reducido». */
.lab-cielo{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;
  background:
    radial-gradient(120% 70% at 50% 118%,#0a2a26 0%,rgba(10,42,38,0) 60%),
    radial-gradient(90% 60% at 50% -20%,#061c1a 0%,rgba(6,28,26,0) 70%),
    linear-gradient(#020a09,#03100f 45%,#041513)}
.lab-cielo canvas{position:absolute;inset:0;width:100%;height:100%}

/* aurora: tres cortinas con estrías verticales, borrosas y lentas, solo en la parte alta */
.lab-aurora{position:absolute;left:-20%;right:-20%;top:-8%;height:62%;filter:blur(26px) saturate(1.15);opacity:.52;mix-blend-mode:screen;
  -webkit-mask:linear-gradient(#000 0,#000 35%,transparent 95%);mask:linear-gradient(#000 0,#000 35%,transparent 95%)}
.lab-aurora i{position:absolute;inset:0;transform-origin:50% 0;
  -webkit-mask:repeating-linear-gradient(90deg,#000 0 7px,rgba(0,0,0,.35) 7px 13px,#000 13px 19px,rgba(0,0,0,.6) 19px 31px);
          mask:repeating-linear-gradient(90deg,#000 0 7px,rgba(0,0,0,.35) 7px 13px,#000 13px 19px,rgba(0,0,0,.6) 19px 31px)}
.lab-aurora i:nth-child(1){background:radial-gradient(55% 46% at 28% 42%,rgba(124,245,200,.95),rgba(45,212,191,.45) 45%,transparent 72%);animation:labOla 46s ease-in-out infinite alternate}
.lab-aurora i:nth-child(2){background:radial-gradient(48% 40% at 70% 34%,rgba(45,212,191,.85),rgba(56,189,248,.35) 50%,transparent 74%);animation:labOla 58s ease-in-out -20s infinite alternate-reverse}
.lab-aurora i:nth-child(3){background:radial-gradient(36% 30% at 52% 22%,rgba(157,252,207,.6),rgba(167,139,250,.18) 55%,transparent 75%);animation:labOla 72s ease-in-out -35s infinite alternate}
@keyframes labOla{
  0%{transform:translateX(-4%) skewX(-8deg) scaleY(.92)}
  50%{transform:translateX(3%) skewX(6deg) scaleY(1.06)}
  100%{transform:translateX(6%) skewX(-3deg) scaleY(.96)}}

/* velo de lectura: oscurece apenas el centro donde va el texto */
.lab-velo{position:absolute;inset:0;background:radial-gradient(70% 60% at 50% 55%,rgba(3,16,15,.55),rgba(3,16,15,0) 75%)}

/* estrella fugaz (la crea cielo.js cada tanto, solo en la franja alta) */
.lab-fugaz{position:absolute;width:150px;height:1.5px;border-radius:2px;opacity:0;
  background:linear-gradient(90deg,rgba(157,252,207,0),rgba(214,255,240,.9));transform-origin:100% 50%;animation:labFugaz 1.4s ease-out forwards}
@keyframes labFugaz{0%{opacity:0;translate:0 0}12%{opacity:.85}100%{opacity:0;translate:-260px 120px}}

/* cordillera al pie de la página, antes de la firma */
.lab-cordillera{position:relative;z-index:1;height:150px;margin-top:-40px;pointer-events:none}
.lab-cordillera svg{position:absolute;inset:auto 0 0 0;width:100%;height:100%}

/* constelación en torno al cristal de la portada */
.xl-hero-art .lab-red{position:absolute;inset:-6%;width:112%;height:112%;opacity:.55}
.lab-red line{stroke:url(#labTrazo);stroke-width:.6}
.lab-red circle{fill:#d9fff1}
.lab-red .n{animation:labTitila 6s ease-in-out infinite}
.lab-red .n:nth-of-type(2n){animation-delay:-2s}.lab-red .n:nth-of-type(3n){animation-delay:-4s}
@keyframes labTitila{50%{opacity:.35}}

/* tarjetas de producto: cada una conserva su paleta */
.lab-product.prisma{--edge:linear-gradient(120deg,rgba(137,227,245,.55),rgba(185,162,255,.35) 45%,rgba(255,138,200,.5))}
.lab-product.prisma .xl-prism{background:linear-gradient(120deg,#89e3f5,#b9a2ff 48%,#f6a5c8);-webkit-background-clip:text;background-clip:text}

@media (max-width:760px){.lab-aurora{opacity:.32;height:48%}.lab-cordillera{height:90px}}
@media (prefers-reduced-motion:reduce){.lab-aurora i,.lab-red .n{animation:none}.lab-fugaz{display:none}}
.lab-pie{margin-top:0;border-top:0;background:#020908}

/* ---------- transiciones al estilo presentación (como el XaviorPEP original) ---------- */
@keyframes labUp{from{opacity:0;transform:translateY(26px);filter:blur(8px)}to{opacity:1;transform:none;filter:none}}
@keyframes labCristal{from{opacity:0;transform:scale(.45) rotateY(-150deg)}to{opacity:1;transform:none}}
.lab-fx .xl-hero .xl-eyebrow{animation:labUp 1.1s .15s cubic-bezier(.2,.9,.2,1) both}
.lab-fx .xl-hero h1{animation:labUp 1.2s .3s cubic-bezier(.2,.9,.2,1) both}
.lab-fx .xl-hero .xl-lede{animation:labUp 1.2s .5s cubic-bezier(.2,.9,.2,1) both}
.lab-fx .xl-hero .row{animation:labUp 1.2s .7s cubic-bezier(.2,.9,.2,1) both}
.xl-hero-art{perspective:900px}
.lab-escena{position:relative;width:100%;height:100%;display:grid;place-items:center;will-change:transform,opacity;transform-style:preserve-3d}
.lab-fx .lab-escena>img{animation:labCristal 1.6s cubic-bezier(.2,.9,.2,1) both,xlfloat 9s 1.6s ease-in-out infinite}
.lab-fx .lab-red{animation:labUp 2s .9s both}

.lab-fx .rv{opacity:0;transform:translateY(34px) scale(.98);filter:blur(6px);
  transition:opacity 1s cubic-bezier(.2,.9,.2,1),transform 1s cubic-bezier(.2,.9,.2,1),filter 1s;transition-delay:var(--d,0s)}
.lab-fx .rv.in{opacity:1;transform:none;filter:none}

/* frase que se enciende palabra por palabra al cruzar la pantalla */
.lab-frase{min-height:70svh;display:flex;align-items:center;justify-content:center;text-align:center;padding:8vh 0}
.lab-frase p{font:700 clamp(28px,min(4.4vw,7vh),56px)/1.1 var(--sans);letter-spacing:-.03em;max-width:20ch;color:var(--ink)}
.lab-fx .lab-frase .w{color:rgba(230,245,241,.16);transition:color .25s,text-shadow .25s}
.lab-fx .lab-frase .w.lit{color:#eafff7;text-shadow:0 0 40px rgba(45,212,191,.28)}
.lab-frase em{font-family:var(--serif);font-weight:400;font-style:italic}

@media (prefers-reduced-motion:reduce){
  .lab-fx .rv,.lab-fx .xl-hero *,.lab-fx .lab-escena>img{opacity:1!important;transform:none!important;filter:none!important;animation:none!important}
  .lab-fx .lab-frase .w{color:#eafff7}}
