/* Base Animations */
@keyframes float {
    0% { transform: translateY(0px) !important; }
    50% { transform: translateY(-20px) !important; }
    100% { transform: translateY(0px) !important; }
}

@keyframes pulse {
    0% { transform: scale(1) !important; }
    50% { transform: scale(1.05) !important; }
    100% { transform: scale(1) !important; }
}

@keyframes slideInLeft {
    0% { 
        opacity: 0;
        transform: translateX(-50px);
    }
    100% { 
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes slideInRight {
    0% { 
        opacity: 0;
        transform: translateX(50px);
    }
    100% { 
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes fadeIn {
    0% { 
        opacity: 0;
        transform: translateY(20px);
    }
    100% { 
        opacity: 1;
        transform: scale(1) !important;
        opacity: 1 !important;
    }
}

@keyframes bounce {
    0%, 100% { transform: translateY(0) !important; }
    50% { transform: translateY(-10px) !important; }
}

@keyframes shimmer {
    0% { background-position: -1000px 0 !important; }
    100% { background-position: 1000px 0 !important; }
}

@keyframes rotate {
    from { transform: rotate(0deg) !important; }
    to { transform: rotate(360deg) !important; }
}

@keyframes gradientBG {
    0% { background-position: 0% 50% !important; }
    50% { background-position: 100% 50% !important; }
    100% { background-position: 0% 50% !important; }
}

/* Animation Classes */
.animate-float {
    animation: float 6s ease-in-out infinite !important;
}

.animate-pulse-slow {
    animation: pulse 3s ease-in-out infinite !important;
}

.animate-slide-left {
    animation: slideInLeft 0.6s ease-out forwards !important;
}

.animate-slide-right {
    animation: slideInRight 0.6s ease-out forwards !important;
}

.animate-fade-in {
    animation: fadeIn 0.6s ease-out forwards !important;
}

.animate-scale-in {
    animation: scaleIn 0.6s ease-out forwards !important;
}

.animate-bounce-slow {
    animation: bounce 2s ease-in-out infinite !important;
}

.animate-rotate {
    animation: rotate 20s linear infinite !important;
}

/* Gradient Animation */
.animate-gradient {
    background: linear-gradient(270deg, var(--primary), var(--primary-dark), #4f46e5) !important;
    background-size: 200% 200% !important;
    animation: gradientBG 6s ease infinite !important;
}

/* Shimmer Effect */
.animate-shimmer {
    background: linear-gradient(
        90deg,
        rgba(255,255,255,0) 0%,
        rgba(255,255,255,0.2) 50%,
        rgba(255,255,255,0) 100%
    ) !important;
    background-size: 1000px 100% !important;
    animation: shimmer 2s infinite !important;
}

/* Scroll Reveal Classes */
.reveal-on-scroll {
    opacity: 0 !important;
    transform: translateY(30px) !important;
    transition: all 0.6s ease-out !important;
}

.reveal-on-scroll.revealed {
    opacity: 1 !important;
    transform: translateY(0) !important;
}

/* Hover Animations */
.hover-scale {
    transition: transform 0.2s ease-out !important;
}

.hover-scale:hover {
    transform: scale(1.05) !important;
}

.hover-float {
    transition: transform 0.2s ease-out !important;
}

.hover-float:hover {
    transform: translateY(-5px) !important;
}

/* Loading Animations */
.loading-dots:after {
    content: '.' !important;
    animation: dots 1.5s steps(5, end) infinite !important;
}

@keyframes dots {
    0%, 20% { content: '.' !important; }
    40% { content: '..' !important; }
    60% { content: '...' !important; }
    80%, 100% { content: '' !important; }
}

/* Card Hover Effects */
.card-hover {
    transition: all 0.3s ease !important;
}

.card-hover:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.1) !important;
}

/* Button Animations */
.btn-pulse {
    position: relative !important;
}

.btn-pulse::after {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    border-radius: inherit !important;
    border: 2px solid currentColor !important;
    animation: buttonPulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite !important;
}

@keyframes buttonPulse {
    0% {
        opacity: 1 !important;
        transform: scale(1) !important;
    }
    100% {
        opacity: 0 !important;
        transform: scale(1.5) !important;
    }
}

/* Intersection Observer Animation Classes */
.fade-up {
    opacity: 0 !important;
    transform: translateY(20px) !important;
    transition: opacity 0.6s ease-out, transform 0.6s ease-out !important;
}

.fade-up.visible {
    opacity: 1 !important;
    transform: translateY(0) !important;
}

.fade-in-delay-1 { animation-delay: 0.2s !important; }
.fade-in-delay-2 { animation-delay: 0.4s !important; }
.fade-in-delay-3 { animation-delay: 0.6s !important; }
.fade-in-delay-4 { animation-delay: 0.8s !important; }
.fade-in-delay-5 { animation-delay: 1s !important; }