/* ============================================
   GLOBAL SCROLL ANIMATIONS
   Animates inner text/image blocks, not containers
   ============================================ */

/* Base hidden state for animated inner elements */
.anim-hidden {
    opacity: 0;
    will-change: transform, opacity;
}

/* Direction-specific initial states */
.anim-from-left {
    transform: translateX(-60px) scale(0.95);
}

.anim-from-right {
    transform: translateX(60px) scale(0.95);
}

/* Visible state - animate in */
.anim-visible {
    opacity: 1;
    transform: translateX(0) scale(1);
    transition: opacity 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94),
        transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Stagger class for delayed animation (applied to images) */
.anim-stagger.anim-visible {
    transition-delay: 0.1s;
}

/* Exited state - subtle fade when scrolling away (no large translate) */
.anim-exited {
    opacity: 0.85;
    transform: scale(0.98);
    transition: opacity 0.5s ease-out,
        transform 0.5s ease-out;
}

/* Reduced motion support */
.reduced-motion .anim-hidden,
.reduced-motion .anim-from-left,
.reduced-motion .anim-from-right {
    opacity: 1;
    transform: none;
}

.reduced-motion .anim-visible,
.reduced-motion .anim-exited {
    opacity: 1;
    transform: none;
    transition: none;
}