/* Global keyframes */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translate3d(0, 20px, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translate3d(0, -20px, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes zoomIn {
    from {
        opacity: 0;
        transform: scale3d(0.95, 0.95, 0.95);
    }
    to {
        opacity: 1;
        transform: scale3d(1, 1, 1);
    }
}

@keyframes slideInLeft {
    from {
        opacity: 0;
        transform: translate3d(-20px, 0, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes slideInRight {
    from {
        opacity: 0;
        transform: translate3d(20px, 0, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes slideInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes scaleIn {
    from {
        opacity: 0;
        transform: scale(0.8);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        transform: translateY(0);
    }
    40% {
        transform: translateY(-20px);
    }
    60% {
        transform: translateY(-10px);
    }
}

@keyframes shine {
    0% {
        left: -75%;
    }
    20% {
        left: 125%;
    }
    100% {
        left: 125%;
    }
}

@keyframes shimmer {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

@keyframes float {
    0%, 100% {
        transform: translateY(0) scale(1);
    }
    50% {
        transform: translateY(-25px) scale(1.05);
    }
}

/* Global animation classes */
.animate {
    animation-duration: 0.8s !important;
    animation-fill-mode: both !important;
}

.animate-fade-in { animation-name: fadeIn !important; }
.animate-fade-in-up { animation-name: fadeInUp !important; }
.animate-fade-in-down { animation-name: fadeInDown !important; }
.animate-zoom-in { animation-name: zoomIn !important; }
.animate-slide-in-left { animation-name: slideInLeft !important; }
.animate-slide-in-right { animation-name: slideInRight !important; }

/* Delays */
.delay-100 { animation-delay: 100ms !important; }
.delay-200 { animation-delay: 200ms !important; }
.delay-300 { animation-delay: 300ms !important; }
.delay-400 { animation-delay: 400ms !important; }
.delay-500 { animation-delay: 500ms !important; }
.delay-600 { animation-delay: 600ms !important; }
.delay-700 { animation-delay: 700ms !important; }
.delay-800 { animation-delay: 800ms !important; }
.delay-900 { animation-delay: 900ms !important; }
.delay-1000 { animation-delay: 1000ms !important; }

/* Optional: Paused state for JavaScript intersection observer if we want to trigger on scroll later */
.paused {
    animation-play-state: paused !important;
}