/* ==========================================================================
   MARIDADI — Animation Styles
   --------------------------------------------------------------------------
   CSS side of the motion system. GSAP choreography lives in
   assets/js/animations.js — this file holds:

   1. Reduced-motion kill switch (accessibility, non-negotiable)
   2. Pre-animation states for JS-driven reveals
   3. CSS-only motion (hovers, marquee) — added in Phases 2–5

   Motion language (mirror of tokens in variables.css):
   - Easing:  --ease-out for entrances, --ease-in-out for movement
   - Nothing animates except transform & opacity (image-heavy site:
     layout/paint properties would jank)
   - Every effect must read as "settling", never "bouncing"
   ========================================================================== */


/* --------------------------------------------------------------------------
   1. REDUCED MOTION
   JS checks the same media query and skips GSAP/Lenis entirely, so users
   who opt out get an instant, fully readable page — not a broken one.
   -------------------------------------------------------------------------- */

@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;
  }
}


/* --------------------------------------------------------------------------
   2. REVEAL PRE-STATES
   Elements tagged for JS reveals are hidden by JS itself (gsap.set), NOT
   by CSS — so if JavaScript or the CDN fails, the page renders complete.
   The only CSS here is the clip container for masked text reveals.
   -------------------------------------------------------------------------- */

/* SplitText masked line reveals: lines animate up from behind this clip */
[data-split] .line-mask {
  overflow: clip;
}


/* --------------------------------------------------------------------------
   3. CSS-ONLY MOTION
   (Populated in Phase 2+ — hover transitions, services marquee, etc.)
   -------------------------------------------------------------------------- */