/* =============== SCROLL REVEAL =============== */

/* Base state: hidden & slightly shifted */
.reveal {
  opacity: 0;
  transform: translate3d(0, 24px, 0) scale(0.98);
  transition:
    opacity 0.8s ease-out,
    transform 0.8s cubic-bezier(0.16, 0.84, 0.44, 1);
  will-change: opacity, transform;
}

/* When in view */
.reveal.in-view {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}

/* Directions */
.reveal-left {
  transform: translate3d(-40px, 0, 0);
}
.reveal-right {
  transform: translate3d(40px, 0, 0);
}
.reveal-up {
  transform: translate3d(0, 40px, 0);
}
.reveal-down {
  transform: translate3d(0, -40px, 0);
}

/* Direction + in-view override */
.reveal-left.in-view,
.reveal-right.in-view,
.reveal-up.in-view,
.reveal-down.in-view {
  transform: translate3d(0, 0, 0) scale(1);
}

/* Optional stagger delays (for cards in a row) */
.reveal.delay-1 { transition-delay: 0.1s; }
.reveal.delay-2 { transition-delay: 0.2s; }
.reveal.delay-3 { transition-delay: 0.3s; }
.reveal.delay-4 { transition-delay: 0.4s; }