/* Prevenir scrollbar horizontal por desplazamientos laterales */
html, body {
    overflow-x: hidden;
}

/* --- Base Fade In --- */
.fade-in {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), 
                transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
    will-change: opacity, transform;
}

.fade-in.visible {
    opacity: 1;
    transform: translateY(0);
}

/* --- Slide from Left --- */
.slide-left {
    opacity: 0;
    transform: translateX(-40px);
    transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), 
                transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
    will-change: opacity, transform;
}

.slide-left.visible {
    opacity: 1;
    transform: translateX(0);
}

/* --- Slide from Right --- */
.slide-right {
    opacity: 0;
    transform: translateX(40px);
    transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), 
                transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
    will-change: opacity, transform;
}

.slide-right.visible {
    opacity: 1;
    transform: translateX(0);
}

/* --- Zoom In --- */
.zoom-in {
    opacity: 0;
    transform: scale(0.92) translateY(20px);
    transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), 
                transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
    will-change: opacity, transform;
}

.zoom-in.visible {
    opacity: 1;
    transform: scale(1) translateY(0);
}

/* --- Stagger Delays --- */
.stagger-item:nth-child(1) { transition-delay: 0.05s; }
.stagger-item:nth-child(2) { transition-delay: 0.12s; }
.stagger-item:nth-child(3) { transition-delay: 0.19s; }
.stagger-item:nth-child(4) { transition-delay: 0.26s; }
.stagger-item:nth-child(5) { transition-delay: 0.33s; }
.stagger-item:nth-child(6) { transition-delay: 0.40s; }

@media (prefers-reduced-motion: reduce) {
    .fade-in, .slide-left, .slide-right, .zoom-in {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}