/*
  Reusable scroll-reveal system — shared across pages, opt-in per element.

  Contract:
    data-reveal          mark an element to fade+rise in once when it
                          enters the viewport.
    data-reveal-group     mark a container whose direct children each get
                          data-reveal behavior, staggered left-to-right by
                          DOM order (their natural row/grid order).
    data-reveal-stagger   optional ms override on a data-reveal-group
                          container (default 120ms between children).

  Only opacity + transform are touched — never layout properties — so
  this can never change section heights, positions, or wrapping.
  See js/reveal.js for the IntersectionObserver that drives it.
*/

.reveal-init {
  opacity: 0;
  transform: translateY(28px);
  transition:
    opacity 650ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 650ms cubic-bezier(0.16, 1, 0.3, 1);
  transition-delay: calc(var(--reveal-index, 0) * var(--reveal-stagger, 0ms));
}

.reveal-init.is-revealed {
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  .reveal-init {
    opacity: 1;
    transform: none;
    transition: none;
  }
}