/* static/css/scroll_animations.css */

.animate-on-scroll {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94), transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    will-change: opacity, transform;
}

.animate-on-scroll.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Staggered delay for elements within the same container if needed */
.delay-100 {
    transition-delay: 100ms;
}

.delay-200 {
    transition-delay: 200ms;
}

.delay-300 {
    transition-delay: 300ms;
}

.delay-400 {
    transition-delay: 400ms;
}

/* Handle users who prefer reduced motion */
@media screen and (prefers-reduced-motion: reduce) {
    .animate-on-scroll {
        transition: none !important;
        transform: none !important;
        opacity: 1 !important;
    }
}

/* Fallback if JS is disabled */
noscript .animate-on-scroll {
    opacity: 1;
    transform: translateY(0);
}