/* Scroll-reveal animation */

/* ═══ SCROLL REVEAL ANIMATION ═══ */
/* Cards fade-in + slight translateY when they enter viewport.
   Applied via JS (Intersection Observer) — adds .reveal-in class. */
.reveal{
  opacity:0;
  transform:translateY(18px);
  transition:opacity .5s cubic-bezier(.22,.9,.3,1), transform .5s cubic-bezier(.22,.9,.3,1);
  will-change:opacity, transform;
}
.reveal.reveal-in{
  opacity:1;
  transform:translateY(0);
}
/* Small cascade within a grid — up to 8 items offset, rest join the last */
.reveal:nth-child(1){transition-delay:0ms}
.reveal:nth-child(2){transition-delay:40ms}
.reveal:nth-child(3){transition-delay:80ms}
.reveal:nth-child(4){transition-delay:120ms}
.reveal:nth-child(5){transition-delay:160ms}
.reveal:nth-child(6){transition-delay:200ms}
.reveal:nth-child(7){transition-delay:240ms}
.reveal:nth-child(8){transition-delay:280ms}

/* Respect user's motion preferences */
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1;transform:none;transition:none}
}