/**
 * AIQ Studio — motion CSS (reveals, canvas, reduced-motion guards).
 * Enqueued after style.css. Animates transform/opacity only.
 */

/* Canvas host: completely disabled */
.hero__canvas {
  display: none !important;
}

.js-motion-ready .hero__canvas,
.js-motion-ready .hero__canvas.is-active {
  display: none !important;
}

.hero__canvas canvas,
.hero-canvas {
  display: block;
  width: 100%;
  height: 100%;
}

/* Never paint a black veil over the showreel. */

/* Scroll reveals: only hide after JS boots (LCP-safe without JS). */
.js-motion-ready .js-reveal:not(.is-inview):not(.gsap-inited) {
  /* GSAP owns state; no forced opacity:0 here to avoid FOUC fighting timelines */
}

.js-motion-ready .js-bento-card {
  will-change: transform, opacity;
}

[data-reduced-motion="true"] .marquee__track,
[data-reduced-motion="true"] .ticker__track {
  animation: none !important;
  transform: translate3d(0, 0, 0);
}

@media (prefers-reduced-motion: reduce) {
  .js-hero-title-line,
  .js-hero-sub,
  .js-hero-cta,
  .js-hero-actions,
  .js-reveal,
  .js-bento-card {
    opacity: 1 !important;
    transform: none !important;
  }

  .hero__canvas {
    display: none !important;
  }

  .marquee__track,
  .ticker__track {
    animation: none !important;
  }
}

/* CSS fallback hero-in if GSAP fails to load (progressive). */
@keyframes aiq-hero-in {
  from {
    opacity: 0;
    transform: translate3d(0, 24px, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

[data-motion-home="pending"] .js-hero-title-line {
  animation: aiq-hero-in 0.7s cubic-bezier(0.22, 1, 0.36, 1) both;
}

[data-motion-home="pending"] .js-hero-title-line:nth-child(2) {
  animation-delay: 0.08s;
}

[data-motion-home="pending"] .js-hero-title-line:nth-child(3) {
  animation-delay: 0.16s;
}