/* ============================================================
   ADAPT.CSS — nivel de efectos (data-fx / data-scene en <html>)
   Cargar al final, después de fx.css.
   - Fundido entre el fondo ligero (engranajes en SVG) y el 3D
   - Modo ligero: sin blur costoso ni mezclas de capas, entradas
     más limpias y pulido de interacciones
   - Mapa bajo demanda (todos los niveles)
   ============================================================ */
@keyframes fxIn{from{opacity:0}}
@keyframes lg-turn{to{transform:rotate(360deg)}}
@keyframes lg-mote{0%{transform:translate3d(0,0,0);opacity:0}20%{opacity:.6}80%{opacity:.35}100%{transform:translate3d(var(--dx),-140px,0);opacity:0}}
@keyframes lg-streak{0%{transform:translate3d(0,0,0);opacity:0}3%{opacity:.5}13%{transform:translate3d(190vw,0,0);opacity:0}100%{transform:translate3d(190vw,0,0);opacity:0}}
@keyframes lg-drift{to{transform:translate3d(5%,-4%,0) scale(1.1)}}
@keyframes btnRip{to{transform:scale(1);opacity:0}}
@keyframes ringPulse{0%{transform:scale(1);opacity:.65}100%{transform:scale(1.18,1.55);opacity:0}}
@keyframes hero-in-lite{from{opacity:0;transform:translateY(18px)}}
@keyframes settle{from{transform:scale(1.12);opacity:0}}

/* ================ 3D: el canvas aparece con fundido cuando ya está listo ================ */
#scene-canvas{opacity:0;transition:opacity 1s var(--ease)}
html[data-scene="on"] #scene-canvas{opacity:1}
html[data-fx="lite"] #scene-canvas{display:none}
html[data-scene="on"] .lite-gears{opacity:0;visibility:hidden;transition:opacity 1s var(--ease),visibility 0s 1s}

/* ================ FONDO LIGERO: tren de engranajes que engranan y giran con el scroll ================ */
.lite-gears{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;contain:layout paint}
.lg-glow{position:absolute;left:-10%;top:-15%;width:70%;height:80%;will-change:transform;
  background:radial-gradient(closest-side,rgba(59,99,236,.2),rgba(59,99,236,.06) 55%,transparent 75%);animation:lg-drift 22s ease-in-out infinite alternate}
.lg-rig{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;will-change:transform,opacity}
.lg-in{flex:none;position:relative;width:160vh;height:100vh;width:max(100vw,125vh);height:max(62.5vw,78.125vh)}
.lg-g{position:absolute;will-change:transform}
.lg-spin{width:100%;height:100%;animation:lg-turn var(--sp) linear infinite;animation-direction:var(--rv)}
.lg-g svg{width:100%;height:100%;display:block;will-change:transform}
.lg-body{fill:url(#lgFill);stroke:rgba(139,150,194,.4);stroke-width:2.2;stroke-linejoin:round}
.lg-pitch{fill:none;stroke:rgba(239,36,48,.34);stroke-width:1.6;stroke-dasharray:7 11}
.lg-dial{fill:none;stroke:rgba(255,255,255,.17);stroke-width:12;stroke-dasharray:2 11}
.lg-axes{fill:none;stroke:rgba(255,255,255,.07);stroke-width:1.4}
.lg-bolt{fill:rgba(6,12,43,.7);stroke:rgba(239,36,48,.55);stroke-width:2.4}
.lg-bolt-in{fill:rgba(239,36,48,.5)}
.lg-g.far{opacity:.55}
.lg-g.far .lg-body{stroke:rgba(139,150,194,.3)}
.lg-glint{position:absolute;top:-10%;bottom:-10%;left:0;width:34%;will-change:transform;
  background:linear-gradient(100deg,transparent 20%,rgba(255,255,255,.07) 50%,transparent 80%)}
.lg-streaks i{position:absolute;left:-40vw;top:var(--y);width:36vw;height:2px;opacity:0;
  background:linear-gradient(90deg,transparent,var(--c),transparent);animation:lg-streak var(--d) cubic-bezier(.45,0,.2,1) var(--dl) infinite}
.lg-dust i{position:absolute;left:var(--x);top:var(--y);width:var(--s);height:var(--s);border-radius:50%;background:#cfdcff;opacity:0;
  animation:lg-mote var(--d) ease-in-out var(--dl) infinite}
.lg-dust i:nth-child(3n){background:#ff8a92}
@media(max-width:899px){.lg-g.far{display:none}.lg-streaks i:nth-child(n+3){display:none}}

/* ================ capas del 3D que no hacen falta sin él ================ */
html:not([data-scene="on"]) .scene-wrap::after{display:none}   /* grano con mix-blend-mode */
html[data-fx="lite"] .streaks{display:none}                    /* luces de faro con mix-blend-mode (el fondo ligero trae las suyas) */

/* ================ MODO LIGERO ================ */
html[data-fx="lite"]{--lite-surface:rgba(8,14,46,.9)}
/* sin desenfoque animado ni backdrop-filter: lo más caro de pintar en equipos modestos */
html[data-fx="lite"] .reveal,html[data-fx="lite"] .reveal.is-visible{filter:none}
html[data-fx="lite"] .reveal{transform:translateY(24px)}
html[data-fx="lite"] .reveal.is-visible{transform:none}
html[data-fx="lite"] .nav,html[data-fx="lite"] .marquee,html[data-fx="lite"] .footer,html[data-fx="lite"] .btn-ghost,
html[data-fx="lite"] .social-pill,html[data-fx="lite"] .service-card,html[data-fx="lite"] .testimonial-card,
html[data-fx="lite"] .mvv-panel,html[data-fx="lite"] .seal,html[data-fx="lite"] .lb,html[data-fx="lite"] .toast{
  -webkit-backdrop-filter:none;backdrop-filter:none}
html[data-fx="lite"] .nav.scrolled,html[data-fx="lite"] .nav.open{background:rgba(6,12,43,.95)}
html[data-fx="lite"] .footer{background:rgba(4,8,28,.94)}
html[data-fx="lite"] .lb{background:rgba(6,12,43,.97)}
html[data-fx="lite"] .seal{background:rgba(6,12,43,.9)}
html[data-fx="lite"] .service-card,html[data-fx="lite"] .testimonial-card{background-color:rgba(12,22,70,.62)}
html[data-fx="lite"] .mvv-panel{background-color:rgba(10,18,58,.78)}
/* animaciones que repintan en cada cuadro -> versiones que solo mueven capas */
html[data-fx="lite"] .wa-float{animation:none}
html[data-fx="lite"] .wa-float::before{content:"";position:absolute;inset:0;border-radius:inherit;border:2px solid rgba(31,184,85,.6);pointer-events:none;animation:ringPulse 3.4s ease-out infinite}
html[data-fx="lite"] .nav-cta .wa-glow{box-shadow:none;border:2px solid rgba(239,36,48,.55);animation:ringPulse 3.6s ease-out infinite}
html[data-fx="lite"] .marquee-track span::after{animation:none}   /* ~28 engranajes con máscara girando sin parar */
html[data-fx="lite"] .hero-load .hero-eyebrow,html[data-fx="lite"] .hero-load .hero-title,html[data-fx="lite"] .hero-load .hero-lead,
html[data-fx="lite"] .hero-load .hero-actions,html[data-fx="lite"] .hero-load .hero-tags,html[data-fx="lite"] .hero-load .hero-stats{animation-name:hero-in-lite}
html[data-fx="lite"] .split-visual.is-visible img{animation:settle 1.2s var(--ease) .1s backwards}

/* respuesta al toque / clic */
html[data-fx="lite"] .btn{position:relative;overflow:hidden}
.btn-rip{position:absolute;border-radius:50%;pointer-events:none;background:rgba(255,255,255,.3);transform:scale(0);animation:btnRip .6s var(--ease) forwards}
html[data-fx="lite"] .nav.hide:not(.open){translate:0 -115%}

/* modo ligero "bajo": si ni así rinde bien, se apagan los adornos que se repiten sin parar */
html[data-fx="lite"].fx-low .lg-spin,html[data-fx="lite"].fx-low .lg-glow,html[data-fx="lite"].fx-low .lg-streaks,
html[data-fx="lite"].fx-low .lg-dust,html[data-fx="lite"].fx-low .cursor-glow,html[data-fx="lite"].fx-low .seal svg,
html[data-fx="lite"].fx-low .wa-float::before,html[data-fx="lite"].fx-low .nav-cta .wa-glow,
html[data-fx="lite"].fx-low .scroll-hint span{animation:none}
html[data-fx="lite"].fx-low .lg-streaks,html[data-fx="lite"].fx-low .lg-dust{display:none}
html[data-fx="lite"].fx-low .marquee-track{animation-duration:120s}

@media(prefers-reduced-motion:reduce){.lg-streaks,.lg-dust{display:none}}

/* ================ 3D en celulares: el blur sobre un canvas vivo se recalcula en cada cuadro ================ */
@media(pointer:coarse),(max-width:899px){
  html[data-fx="full"] .nav,html[data-fx="full"] .marquee,html[data-fx="full"] .footer,html[data-fx="full"] .btn-ghost,
  html[data-fx="full"] .social-pill,html[data-fx="full"] .service-card,html[data-fx="full"] .testimonial-card,
  html[data-fx="full"] .mvv-panel,html[data-fx="full"] .seal,html[data-fx="full"] .lb,html[data-fx="full"] .toast{
    -webkit-backdrop-filter:none;backdrop-filter:none}
  html[data-fx="full"] .nav.scrolled,html[data-fx="full"] .nav.open{background:rgba(6,12,43,.95)}
  html[data-fx="full"] .footer{background:rgba(4,8,28,.92)}
  html[data-fx="full"] .lb{background:rgba(6,12,43,.97)}
  html[data-fx="full"] .seal{background:rgba(6,12,43,.9)}
  html[data-fx="full"] .service-card,html[data-fx="full"] .testimonial-card{background-color:rgba(12,22,70,.62)}
  html[data-fx="full"] .mvv-panel{background-color:rgba(10,18,58,.78)}
  html[data-fx="full"] .streaks{display:none}                  /* mix-blend-mode sobre un canvas vivo */
}

/* ================ MAPA BAJO DEMANDA ================ */
.map-facade{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:4px;padding:26px 20px;text-align:center;
  background:radial-gradient(60% 50% at 50% 46%,rgba(59,99,236,.22),transparent 70%),
    linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px) 0 0/40px 40px,
    linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px) 0 0/40px 40px,var(--navy-deep);
  transition:opacity .5s var(--ease),visibility 0s .5s}
.map-facade strong{font-family:var(--font-display);font-size:1.3rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--white)}
.map-facade>span{font-size:.88rem;color:var(--steel)}
.map-facade .btn{margin-top:14px}
.map-pin{position:absolute;top:44%;left:50%;transform:translate(-50%,-100%);display:flex;flex-direction:column;align-items:center}
.map-pin svg{width:44px;height:44px;color:var(--red-bright)}
.map-pin .pulse{width:16px;height:16px;border-radius:50%;margin-top:-8px;background:rgba(239,36,48,.35);animation:ringPulse 2.4s ease-out infinite}
.cta-map.is-live .map-facade{opacity:0;visibility:hidden;pointer-events:none}
.cta-map iframe:not([src]){visibility:hidden}

/* en pantallas angostas el texto ocupa todo el ancho: los engranajes se suavizan para no competir */
@media(max-width:560px){.lg-body{stroke:rgba(139,150,194,.28)}.lg-dial,.lg-axes{opacity:.6}}

/* logos: el ancho siempre sale de la proporción real (el alto lo manda cada regla del sitio) */
.brand-logo,.footer-logo{width:auto}
