/* Scroll reveal — start state only.

   Marked containers ([data-reveal]) hold their children hidden and slightly
   lowered; reveal.js then animates them up with a small stagger. The animation
   itself uses the Web Animations API, so no CSS transition is declared here and
   a card's own hover transition is never overwritten.

   `data-reveal-ready` is set by a synchronous inline script in <head>, so the
   hidden state is active from the very first paint — content never flashes
   before the deferred reveal.js runs. Without JS the attribute is absent and
   everything stays visible. */
html[data-reveal-ready="true"] [data-reveal]:not([data-reveal="shown"]) > * {
  opacity: 0;
  transform: translateY(28px);
}

@media (prefers-reduced-motion: reduce) {
  html[data-reveal-ready="true"] [data-reveal]:not([data-reveal="shown"]) > * {
    opacity: 1;
    transform: none;
  }
}