/*
 * Lightweight CSS-only animations.
 * Elements marked "wow" already animate on scroll via WOW.js + animate.css
 * (bundled in plugin.min.css) - left untouched here.
 * Everything below plays once on page load, no JS required.
 */
@media (prefers-reduced-motion: no-preference) {

    /* Section titles / text that use bare fadeInUp|fadeInLeft|fadeInRight
       (no "wow" class) never got animated before - give them the missing
       animation-duration/fill-mode so the keyframes already defined in
       plugin.min.css actually play. */
    .fadeInUp:not(.wow),
    .fadeInLeft:not(.wow),
    .fadeInRight:not(.wow),
    .zoomIn:not(.wow),
    .zoomOut:not(.wow),
    .bounceIn:not(.wow) {
        animation-duration: 1s;
        animation-fill-mode: both;
    }

    /* Heading reveal (replaces the old GSAP SplitText effect) */
    .split-content {
        animation: atf-fade-up .8s ease-out both;
    }
    .split-content.up { animation-name: atf-fade-up; }
    .split-content.down { animation-name: atf-fade-down; }
    .split-content.start { animation-name: atf-fade-start; }
    .split-content.end { animation-name: atf-fade-end; }

    /* Image reveal (replaces the old GSAP image-spread effect) */
    .spread img {
        animation: atf-spread-in 1s ease-out both;
    }
    .spread.zoom-out img { animation-name: atf-zoom-out; }
    .spread.up img { animation-name: atf-fade-up; }
    .spread.down img { animation-name: atf-fade-down; }
    .spread.start img { animation-name: atf-fade-start; }
    .spread.end img { animation-name: atf-fade-end; }

    @keyframes atf-fade-up {
        from { opacity: 0; transform: translateY(40px); }
        to   { opacity: 1; transform: translateY(0); }
    }
    @keyframes atf-fade-down {
        from { opacity: 0; transform: translateY(-40px); }
        to   { opacity: 1; transform: translateY(0); }
    }
    @keyframes atf-fade-start {
        from { opacity: 0; transform: translateX(-40px); }
        to   { opacity: 1; transform: translateX(0); }
    }
    @keyframes atf-fade-end {
        from { opacity: 0; transform: translateX(40px); }
        to   { opacity: 1; transform: translateX(0); }
    }
    @keyframes atf-spread-in {
        from { opacity: 0; transform: scale(1.15); }
        to   { opacity: 1; transform: scale(1); }
    }
    @keyframes atf-zoom-out {
        from { opacity: 0; transform: scale(1.4); }
        to   { opacity: 1; transform: scale(1); }
    }
}