/* ============================================================ HAUS OF SÔS — Motion layer (Lenis smooth scroll + GSAP reveals) Single source of truth for scroll feel across the site. ============================================================ */ /* ---- Lenis recommended base styles ---- */ 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: clip; } .lenis.lenis-smooth iframe { pointer-events: none; } /* ---- Reveal initial states ---- Gated on html.motion-ready, which is added synchronously in ONLY when motion is allowed and JS is running. If the libraries fail to load, motion.js removes this class so nothing stays hidden. */ html.motion-ready [data-reveal] { opacity: 0; } html.motion-ready [data-split] { opacity: 0; } /* Line masks for the type cascade (SplitText wraps lines in .split-line) */ .split-line { overflow: hidden; padding-bottom: 0.06em; } .split-word { display: inline-block; will-change: transform; } /* ---- Accessibility: never hide content when motion is reduced ---- */ @media (prefers-reduced-motion: reduce) { html.motion-ready [data-reveal], html.motion-ready [data-split] { opacity: 1 !important; } } /* ---- Hero entrance deadline (html.hero-shown set by motion.js at +5s) ---- Guarantees the splash chrome is visible even if a throttled embed never advanced the entrance animations. No-op in a live tab (already finished). */ html.hero-shown .splash .top-nav, html.hero-shown .splash .hud, html.hero-shown .splash .contact-strip > div { animation: none !important; opacity: 1 !important; transform: none !important; } html.hero-shown .tagline { animation: none !important; opacity: 1 !important; } html.hero-shown .word { animation: none !important; filter: none !important; transform: translate(-50%, -50%) !important; }