/* =========================================================
   Motion — initial states for GSAP reveals + reduced motion
   ========================================================= */

/* Elements with data-reveal start hidden only when JS + GSAP are present */
.js [data-reveal] { opacity: 0; will-change: transform, opacity; }
.js [data-reveal="clip"] { clip-path: inset(0 0 100% 0); opacity: 1; }
.js [data-reveal="clip-left"] { clip-path: inset(0 100% 0 0); opacity: 1; }
.js [data-reveal="line"] { transform: scaleX(0); transform-origin: left; opacity: 1; }
.js [data-reveal-stagger] > * { opacity: 0; will-change: transform, opacity; }

/* Elements that finish revealing get GPU hints removed */
.js .is-revealed, .js .is-revealed > * { will-change: auto; }

/* Draw-on SVG paths */
.js [data-draw] path, .js [data-draw] line, .js [data-draw] polyline, .js [data-draw] rect, .js [data-draw] circle { visibility: hidden; }

/* Parallax targets */
[data-parallax] { will-change: transform; }

/* Tilt cards */
[data-tilt] { transform-style: preserve-3d; transition: transform 0.15s linear; }
[data-tilt] > * { transform: translateZ(0); }

/* Magnetic buttons */
[data-magnetic] { display: inline-flex; will-change: transform; }

/* Marquee pause helper */
.marquee.is-paused .marquee__track { animation-play-state: paused; }

/* Reduced motion: collapse everything to simple fades or nothing.
   Applied via the OS preference OR the html.reduce-motion class (?nomotion). */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
  .js [data-reveal], .js [data-reveal-stagger] > * { opacity: 1 !important; transform: none !important; clip-path: none !important; }
  .js [data-draw] * { visibility: visible !important; stroke-dashoffset: 0 !important; }
  .hero__title .word > span { transform: none !important; }
  .cursor, .preloader, .veil, .scroll-progress { display: none !important; }
  .marquee__track, .ticker__track { animation: none !important; }
}
html.reduce-motion [data-reveal], html.reduce-motion [data-reveal-stagger] > * { opacity: 1 !important; transform: none !important; clip-path: none !important; }
html.reduce-motion [data-draw] * { visibility: visible !important; stroke-dashoffset: 0 !important; }
html.reduce-motion .hero__title .word > span { transform: none !important; }
html.reduce-motion .cursor, html.reduce-motion .preloader, html.reduce-motion .veil { display: none !important; }
html.reduce-motion .marquee__track, html.reduce-motion .ticker__track { animation: none !important; }
html.reduce-motion .preloader__logo path { stroke-dashoffset: 0; }
/* QA helper: ?flat collapses viewport-height sections so full-page captures work */
html.flat .hero, html.flat .notfound { min-height: 0; }
html.flat .hero__content { padding-block: 80px; }