.fade-in {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}
.fade-in.appear {
    opacity: 1;
    transform: translateY(0);
}
.stagger-item {
    transition-delay: calc(var(--i) * 0.1s);
}
.scale-in {
    transform: scale(0.95);
    opacity: 0;
    transition: transform 0.5s ease-out, opacity 0.5s ease-out;
}
.scale-in.appear {
    transform: scale(1);
    opacity: 1;
}
.slide-in-right {
    transform: translateX(50px);
    opacity: 0;
    transition: transform 0.6s ease-out, opacity 0.6s ease-out;
}
.slide-in-right.appear {
    transform: translateX(0);
    opacity: 1;
}
.slide-in-left {
    transform: translateX(-50px);
    opacity: 0;
    transition: transform 0.6s ease-out, opacity 0.6s ease-out;
}
.slide-in-left.appear {
    transform: translateX(0);
    opacity: 1;
}