/**
 * Lightweight Scroll Animations (AOS Replacement)
 * Zero dependencies, pure CSS + Intersection Observer
 * Performance: <1KB, no reflow issues
 */

/* Base animation state - hidden until visible */
[data-animate] {
    opacity: 0;
    transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Visible state - triggered by Intersection Observer */
[data-animate].visible {
    opacity: 1;
    transform: translate(0, 0) !important;
}

/* Direction variants */
[data-animate="fade-up"] {
    transform: translateY(20px);
}

[data-animate="fade-down"] {
    transform: translateY(-20px);
}

[data-animate="fade-left"] {
    transform: translateX(-20px);
}

[data-animate="fade-right"] {
    transform: translateX(20px);
}

[data-animate="fade"] {
    transform: none;
}

[data-animate="zoom-in"] {
    transform: scale(0.95);
}

/* Delay variants for staggered animations */
[data-delay="100"].visible {
    transition-delay: 0.1s;
}

[data-delay="200"].visible {
    transition-delay: 0.2s;
}

[data-delay="300"].visible {
    transition-delay: 0.3s;
}

[data-delay="400"].visible {
    transition-delay: 0.4s;
}

[data-delay="500"].visible {
    transition-delay: 0.5s;
}

[data-delay="600"].visible {
    transition-delay: 0.6s;
}

/* Duration variants */
[data-duration="fast"] {
    transition-duration: 0.3s;
}

[data-duration="slow"] {
    transition-duration: 1s;
}

/* Easing variants */
[data-easing="ease-in"] {
    transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
}

[data-easing="ease-out"] {
    transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
}

[data-easing="ease-in-out"] {
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

/* Disable animations for users who prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
    [data-animate] {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}