/* Scroll-reveal system: elements start hidden/offset and ease into place once
   they cross into the viewport. Direction varies per element (set via modifier
   class) so sections don't all animate the same way. JS toggles .is-visible;
   see js/reveal.js. */
.reveal {
  opacity: 0;
  transition: opacity 0.8s cubic-bezier(.16,.84,.44,1), transform 0.8s cubic-bezier(.16,.84,.44,1);
  will-change: opacity, transform;
}
.reveal-up { transform: translateY(48px); }
.reveal-down { transform: translateY(-32px); }
.reveal-left { transform: translateX(-56px); }
.reveal-right { transform: translateX(56px); }
.reveal-scale { transform: scale(0.94); }

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

@media (prefers-reduced-motion: reduce) {
  .reveal, .reveal-up, .reveal-down, .reveal-left, .reveal-right, .reveal-scale {
    opacity: 1 !important; transform: none !important; transition: none !important;
  }
}