/* Motion engine - base styles.
   The "hidden until animated" states only apply while html has .m-js (added by
   the inline <head> script in functions-snippet.php). If JS fails, the editor
   is open, or reduced-motion is on, .m-js is removed and everything shows. */

/* Lenis (required for smooth scroll to behave) */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: hidden; }
.lenis.lenis-scrolling iframe { pointer-events: none; }

/* Prevent flash of unanimated content */
.m-js .m-reveal-text,
.m-js .m-scrub-text { visibility: hidden; }

.m-js .m-fade-up,
.m-js .m-fade,
.m-js .m-scale-in,
.m-js .m-slide-left,
.m-js .m-slide-right { opacity: 0; }

.m-js .m-stagger > * { opacity: 0; }

.m-js .m-clip-up { clip-path: inset(100% 0% 0% 0%); }

/* Split text helpers */
.m-line { display: block; }
.m-reveal-text, .m-scrub-text { will-change: auto; }

/* Parallax needs overflow clipping on its wrapper and a little extra height */
.m-parallax { will-change: transform; }
.m-parallax-wrap { overflow: hidden; }
.m-parallax-wrap > .m-parallax { height: 120%; width: 100%; object-fit: cover; }

/* Lottie container sizing */
.m-lottie { width: 100%; max-width: 100%; }
.m-lottie svg { display: block; width: 100% !important; height: auto !important; }

/* Never allow animation to cause horizontal scroll */
html, body { overflow-x: clip; }

@media (prefers-reduced-motion: reduce) {
  .m-js .m-reveal-text, .m-js .m-scrub-text { visibility: visible; }
  .m-js .m-fade-up, .m-js .m-fade, .m-js .m-scale-in,
  .m-js .m-slide-left, .m-js .m-slide-right, .m-js .m-stagger > * { opacity: 1; }
  .m-js .m-clip-up { clip-path: none; }
}
