/* LIGHT TRONIC — motion: encendido inicial, reveals, reduced-motion.
   Regla: todo estado oculto va detrás de html.js — sin JS el sitio
   se ve completo. Flickers suaves (fotosensibilidad: sin strobes). */

/* ---------- Encendido del hero ("lights on") ----------
   Simula un tubo LED estabilizándose: 3 pulsos suaves de opacidad
   (nunca a negro total, sin frecuencias altas) y luego luz plena. */
@keyframes tube-warmup {
  0% {
    opacity: 0.06;
  }
  18% {
    opacity: 0.32;
  }
  26% {
    opacity: 0.14;
  }
  46% {
    opacity: 0.6;
  }
  56% {
    opacity: 0.38;
  }
  78% {
    opacity: 0.88;
  }
  100% {
    opacity: 1;
  }
}

html.js .hero-inner,
html.js .hero-beam {
  animation: tube-warmup 1.6s var(--ease-out) both;
}

html.js .hero-beam {
  animation-duration: 2s;
}

/* ---------- Reveals por scroll (JS + IntersectionObserver/ScrollTrigger) ---------- */
html.js [data-reveal] {
  opacity: 0;
  transform: translateY(26px);
  transition:
    opacity var(--dur-slow) var(--ease-out),
    transform var(--dur-slow) var(--ease-out);
}

html.js [data-reveal].is-in {
  opacity: 1;
  transform: none;
}

/* stagger simple por hijos */
html.js [data-reveal-children] > * {
  opacity: 0;
  transform: translateY(22px);
  transition:
    opacity var(--dur-slow) var(--ease-out),
    transform var(--dur-slow) var(--ease-out);
}

html.js [data-reveal-children].is-in > * {
  opacity: 1;
  transform: none;
}

html.js [data-reveal-children].is-in > *:nth-child(2) {
  transition-delay: 90ms;
}

html.js [data-reveal-children].is-in > *:nth-child(3) {
  transition-delay: 180ms;
}

html.js [data-reveal-children].is-in > *:nth-child(4) {
  transition-delay: 270ms;
}

html.js [data-reveal-children].is-in > *:nth-child(5) {
  transition-delay: 360ms;
}

html.js [data-reveal-children].is-in > *:nth-child(n + 6) {
  transition-delay: 440ms;
}

/* Botón primario: pulso de corriente sutil al hover */
@keyframes current-pulse {
  0%,
  100% {
    box-shadow: var(--glow-full);
  }
  50% {
    box-shadow:
      0 0 8px rgba(0, 168, 224, 0.7),
      0 0 36px 0 var(--glow-brand),
      0 0 90px -8px var(--glow-brand);
  }
}

.btn-primary:hover {
  animation: current-pulse 1.8s ease-in-out infinite;
}

/* Líneas de cota: trazo que se dibuja */
html.js .lab-dim-line path,
html.js .lab-dim-line line {
  stroke-dasharray: 400;
  stroke-dashoffset: 400;
  transition: stroke-dashoffset 1.4s var(--ease-out) 0.2s;
}

html.js .lab-panel.is-in .lab-dim-line path,
html.js .lab-panel.is-in .lab-dim-line line {
  stroke-dashoffset: 0;
}

/* ---------- Reduced motion: luz plena inmediata, cero animación ---------- */
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  html.js .hero-inner,
  html.js .hero-beam {
    animation: none;
    opacity: 1;
  }

  html.js [data-reveal],
  html.js [data-reveal-children] > * {
    opacity: 1;
    transform: none;
    transition: none;
  }

  html.js .lab-dim-line path,
  html.js .lab-dim-line line {
    stroke-dashoffset: 0;
    transition: none;
  }

  .btn-primary:hover {
    animation: none;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}