/* Scroll reveal — minimal, no-FOUC, prefers-reduced-motion aware
   Add `data-reveal` to any element. Optional: data-reveal-delay="120" (ms),
   data-reveal-stagger on a parent (auto-staggers direct [data-reveal] children).

   The init script flips html[data-reveal-ready] AFTER tagging items as hidden,
   so the CSS only hides things once we're ready to animate. */

html[data-reveal-ready] [data-reveal]:not([data-reveal-shown]) {
  opacity: 0;
  transform: translate3d(0, 18px, 0);
  filter: blur(2px);
}

html[data-reveal-ready] [data-reveal][data-reveal-shown] {
  opacity: 1;
  transform: none;
  filter: none;
  transition:
    opacity 0.7s cubic-bezier(0.22, 0.61, 0.36, 1),
    transform 0.7s cubic-bezier(0.22, 0.61, 0.36, 1),
    filter 0.5s ease-out;
  transition-delay: var(--reveal-delay, 0ms);
}

/* Instant path — used by the fallback so frozen-timeline iframes still show content */
html[data-reveal-ready] [data-reveal][data-reveal-instant] {
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
  transition: none !important;
}

/* Variants */
html[data-reveal-ready] [data-reveal="up"]:not([data-reveal-shown])    { transform: translate3d(0, 32px, 0); }
html[data-reveal-ready] [data-reveal="down"]:not([data-reveal-shown])  { transform: translate3d(0, -24px, 0); }
html[data-reveal-ready] [data-reveal="left"]:not([data-reveal-shown])  { transform: translate3d(-32px, 0, 0); }
html[data-reveal-ready] [data-reveal="right"]:not([data-reveal-shown]) { transform: translate3d(32px, 0, 0); }
html[data-reveal-ready] [data-reveal="fade"]:not([data-reveal-shown])  { transform: none; filter: none; }
html[data-reveal-ready] [data-reveal="rise"]:not([data-reveal-shown])  { transform: translate3d(0, 48px, 0) scale(0.98); }

/* Honor user pref */
@media (prefers-reduced-motion: reduce) {
  html[data-reveal-ready] [data-reveal] {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
  }
}
