/* Global motion infrastructure.
   Reveal-on-scroll is opt-in via [data-animate] and only takes effect once
   site.js has confirmed JS + IntersectionObserver support by adding html.js-anim.
   Without JS the content renders in its final state (no hidden-by-CSS elements). */

html.js-anim [data-animate]{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .7s var(--ease-out),transform .7s var(--ease-out);
  will-change:opacity,transform;
}
html.js-anim [data-animate="fade"]{transform:none}
html.js-anim [data-animate="left"]{transform:translateX(-28px)}
html.js-anim [data-animate="right"]{transform:translateX(28px)}
html.js-anim [data-animate].in{opacity:1;transform:none}

/* Staggered reveals: matches the source's 0.1s incremental transition-delay. */
[data-delay="1"]{transition-delay:.06s}
[data-delay="2"]{transition-delay:.12s}
[data-delay="3"]{transition-delay:.18s}
[data-delay="4"]{transition-delay:.24s}
[data-delay="5"]{transition-delay:.30s}
[data-delay="6"]{transition-delay:.36s}

@media (prefers-reduced-motion: reduce){
  html.js-anim [data-animate]{
    opacity:1 !important;
    transform:none !important;
    transition:none !important;
    transition-delay:0s !important;
  }
}