/* Scroll Reveal Animation Styles */

/* 初始状态 - 隐藏元素 */
.scroll-reveal {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.8s ease, transform 0.8s ease, visibility 0.8s;
}

/* 淡入动画 */
.scroll-reveal.fade-in {
    transform: none;
}

/* 从下方滑入 */
.scroll-reveal.slide-up {
    transform: translateY(50px);
}

/* 从上方滑入 */
.scroll-reveal.slide-down {
    transform: translateY(-50px);
}

/* 从左侧滑入 */
.scroll-reveal.slide-left {
    transform: translateX(-50px);
}

/* 从右侧滑入 */
.scroll-reveal.slide-right {
    transform: translateX(50px);
}

/* 缩放淡入 */
.scroll-reveal.scale-in {
    transform: scale(0.8);
}

/* 缩放淡出 */
.scroll-reveal.scale-out {
    transform: scale(1.2);
}

/* 旋转淡入 */
.scroll-reveal.rotate-in {
    transform: rotate(-5deg) scale(0.9);
}

/* 显示状态 - 当元素进入视口时添加此状态 */
.scroll-reveal.revealed,
.scroll-reveal.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translate(0, 0) scale(1) rotate(0deg) !important;
}

/* 延迟动画类 */
.scroll-reveal.delay-100 {
    transition-delay: 0.1s;
}

.scroll-reveal.delay-200 {
    transition-delay: 0.2s;
}

.scroll-reveal.delay-300 {
    transition-delay: 0.3s;
}

.scroll-reveal.delay-400 {
    transition-delay: 0.4s;
}

.scroll-reveal.delay-500 {
    transition-delay: 0.5s;
}

.scroll-reveal.delay-600 {
    transition-delay: 0.6s;
}

.scroll-reveal.delay-700 {
    transition-delay: 0.7s;
}

.scroll-reveal.delay-800 {
    transition-delay: 0.8s;
}

/* 慢速动画 */
.scroll-reveal.slow {
    transition-duration: 1.2s;
}

/* 快速动画 */
.scroll-reveal.fast {
    transition-duration: 0.5s;
}

/* 响应式 - 在移动设备上减少动画延迟 */
@media (max-width: 768px) {
    .scroll-reveal {
        transition-duration: 0.6s;
    }
    
    .scroll-reveal.delay-200 {
        transition-delay: 0.1s;
    }
    
    .scroll-reveal.delay-300 {
        transition-delay: 0.15s;
    }
    
    .scroll-reveal.delay-400 {
        transition-delay: 0.2s;
    }
    
    .scroll-reveal.delay-500 {
        transition-delay: 0.25s;
    }
    
    .scroll-reveal.delay-600 {
        transition-delay: 0.3s;
    }
}

/* 禁用动画的用户偏好 */
@media (prefers-reduced-motion: reduce) {
    .scroll-reveal {
        transition: none !important;
        opacity: 1 !important;
        transform: none !important;
    }
}
