/* Example slide-in animation for Index page cards */
@keyframes slideInFade {
    from {
        opacity: 0;
        transform: translateY(40px) scale(0.98);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.index-card-animate {
    opacity: 0;
    animation: slideInFade 0.9s cubic-bezier(0.23, 1, 0.32, 1) forwards;
    will-change: opacity, transform;
}

.index-card-animate.delay-1 { animation-delay: 0.2s; }
.index-card-animate.delay-2 { animation-delay: 0.4s; }
.index-card-animate.delay-3 { animation-delay: 0.6s; }
.index-card-animate.delay-4 { animation-delay: 0.8s; }
.index-card-animate.delay-5 { animation-delay: 1.0s; }
.index-card-animate.delay-6 { animation-delay: 1.2s; }

@media (prefers-reduced-motion: reduce) {
    .index-card-animate,
    .index-card-animate.delay-1,
    .index-card-animate.delay-2,
    .index-card-animate.delay-3,
    .index-card-animate.delay-4,
    .index-card-animate.delay-5,
    .index-card-animate.delay-6 {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }
}