.slide-in-left {
    opacity: 0;
    transform: translateX(-100px);
    transition: all 0.8s ease-out;
}

.slide-in-right {
    opacity: 0;
    transform: translateX(100px);
    transition: all 0.8s ease-out;
}

.slide-in-left.animate,
.slide-in-right.animate {
    opacity: 1;
    transform: translateX(0);
}

/* 使用您提供的动画类 */
.fadeInLeft, .fadeInRight {
    opacity: 0;
}

.fadeInLeft.animate {
    animation: fadeInLeft 1s ease-out forwards;
}

.fadeInRight.animate {
    animation: fadeInRight 1s ease-out forwards;
}

/* 延迟动画 */
.delay-1 { animation-delay: 0.2s; }
.delay-2 { animation-delay: 0.4s; }
.delay-3 { animation-delay: 0.6s; }