/* Scroll Reveal Animation Styles */

/* Base reveal state - hidden by default */
.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s cubic-bezier(0.22, 1.28, 0.36, 1),
    transform 0.8s cubic-bezier(0.22, 1.28, 0.36, 1);
}

/* Revealed state - visible when in viewport */
.reveal.in-view {
  opacity: 1;
  transform: translateY(0);
}

/* Staggered animation for children in a group */
.group .reveal {
  transition-delay: calc(var(--i, 0) * 0.15s);
}

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

  .reveal.in-view {
    opacity: 1;
    transform: none;
  }

  .group .reveal {
    transition-delay: 0s;
  }
}