/**
 * D360X Animations System
 * Professional & Immersive scroll-triggered animations
 */

/* Baseline state for reveal elements */
/* Baseline state: VISIBLE by default (Break Visible Strategy) */
[data-d360x-anim] {
    /* opacity: 0; REMOVED - Elements start visible */
    transition: none;
    will-change: transform, opacity, filter;
}

/* JS-applied hidden state - Only hide if JS is running */
.d360x-init-hidden {
    opacity: 0;
}

/* Force visibility in Editor (Still good to have as extra safety) */
body.elementor-editor-active [data-d360x-anim],
body.elementor-edit-mode [data-d360x-anim],
.elementor-editor-active [data-d360x-anim] {
    opacity: 1 !important;
    visibility: visible !important;
}

/* Stagger Children Support */
.d360x-init-hidden.d360x-stagger-container>* {
    opacity: 0;
}

/* Fallback: If JS fails or takes too long, ensure content eventually shows up 
   (Optional: can be problematic if you want strict control, but good for stability)
*/
@media (prefers-reduced-motion: reduce) {
    [data-d360x-anim] {
        opacity: 1 !important;
        transform: none !important;
    }
}


/* --- Keyframes --- */

/* Smooth Fade In */
@keyframes d360x-fade-in {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Slide Up */
@keyframes d360x-slide-up {
    from {
        opacity: 0;
        transform: translateY(40px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Slide Down */
@keyframes d360x-slide-down {
    from {
        opacity: 0;
        transform: translateY(-40px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Slide Left (Enter from right) */
@keyframes d360x-slide-left {
    from {
        opacity: 0;
        transform: translateX(40px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* Slide Right (Enter from left) */
@keyframes d360x-slide-right {
    from {
        opacity: 0;
        transform: translateX(-40px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* Scale Up */
@keyframes d360x-scale-up {
    from {
        opacity: 0;
        transform: scale(0.9);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

/* Immersive Blur In */
@keyframes d360x-blur-in {
    from {
        opacity: 0;
        filter: blur(15px);
        transform: scale(1.05);
    }

    to {
        opacity: 1;
        filter: blur(0);
        transform: scale(1);
    }
}

/* --- Trigger Classes (applied by JS) --- */

.d360x-anim-visible {
    opacity: 1;
    animation-fill-mode: both;
    animation-duration: var(--d360x-anim-duration, 1s);
    animation-delay: var(--d360x-anim-delay, 0s);
    animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
    /* Professional Ease Out */
}

.d360x-anim-fade-in.d360x-anim-visible {
    animation-name: d360x-fade-in;
}

.d360x-anim-slide-up.d360x-anim-visible {
    animation-name: d360x-slide-up;
}

.d360x-anim-slide-down.d360x-anim-visible {
    animation-name: d360x-slide-down;
}

.d360x-anim-slide-left.d360x-anim-visible {
    animation-name: d360x-slide-left;
}

.d360x-anim-slide-right.d360x-anim-visible {
    animation-name: d360x-slide-right;
}

.d360x-anim-scale-up.d360x-anim-visible {
    animation-name: d360x-scale-up;
}

.d360x-anim-blur-in.d360x-anim-visible {
    animation-name: d360x-blur-in;
}

/* Stagger Children Support - Only hide if animation is active */
[data-d360x-anim].d360x-stagger-container>* {
    opacity: 0;
}

.d360x-stagger-container.d360x-anim-visible>* {
    opacity: 1;
    animation-fill-mode: both;
    animation-duration: var(--d360x-anim-duration, 0.8s);
    animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
}