/* ════════════════════════════════════════
   REVEAL — generic on-scroll fade+blur+lift
   Apply class="reveal" to any element.
════════════════════════════════════════ */

.reveal {
  opacity: 0;
  transform: translateY(28px);
  filter: blur(8px);
  transition:
    opacity   1s var(--ease-expo),
    transform 1s var(--ease-expo),
    filter    1s var(--ease-expo);
  will-change: opacity, transform, filter;
}

.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
  filter: blur(0);
}

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