/* ===========================================================================
   Page motion: section reveals.
   Owned by brand-ui, loaded after site.css. Separate from hero-eye.css because
   that is part of the hero; this is the page.

   CSS scroll-driven animation - `view()` - so there is no scroll listener, nothing
   runs on the main thread per event, and where the feature is unsupported (Safari
   at time of writing) it degrades to the static page with nothing missing.

   A scroll-travelling chameleon sprite used to live here and was removed on
   request: it read as a decal stuck beside the scrollbar rather than as the mark
   walking down the page. Do not reinstate it as a fixed sprite - see git history
   for the geometry if a real walk cycle is ever attempted.

   Nothing here touches a layout property. Only `transform` and `opacity`, so CLS
   stays 0 at every scroll offset.
   =========================================================================== */

/* --- Section reveals ---------------------------------------------------- */

/* `view()` rather than an IntersectionObserver: no JS, and the browser runs it
   off the main thread. Gated on `no-preference` so that under `reduce` the rule
   never applies at all and every section is simply visible - the fill-forwards
   `opacity: 0` must never be able to hide content. */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .section, .band {
      animation: section-rise linear both;
      animation-timeline: view();
      animation-range: entry 0% entry 55%;
    }
  }
}
@keyframes section-rise {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: none; }
}

/* --- Reduced motion ----------------------------------------------------- */