/* ============================================
   8. ANIMATIONS & KEYFRAMES
   ============================================ */

/* Loading Animation */
@keyframes loading {
    0% { 
        width: 0%; 
    }
    100% { 
        width: 100%; 
    }
}

/* Particle Float Animation */
@keyframes float {
    0% {
        transform: translateY(100vh) translateX(0);
        opacity: 0;
    }
    10% {
        opacity: 1;
    }
    90% {
        opacity: 1;
    }
    100% {
        transform: translateY(-100px) translateX(100px);
        opacity: 0;
    }
}

/* Hero Title Reveal Animation (Disabled) */
@keyframes revealLine {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Hero Video Shimmer - Large Bar */
@keyframes shimmer-video {
    0% { 
        left: -120%;
    }
    100% { 
        left: 140%;
    }
}

/* Hero Video Shimmer - Small Bar */
@keyframes shimmer-video-small {
    0% { 
        left: -100%;
    }
    100% { 
        left: 140%;
    }
}

/* Stats Section Shimmer (Disabled) */
@keyframes shimmer {
    0% { 
        transform: translateX(-100%) translateY(-100%) rotate(45deg); 
    }
    100% { 
        transform: translateX(100%) translateY(100%) rotate(45deg); 
    }
}

/* Fade In Float (Hero Floating Elements - Disabled) */
@keyframes fade-in-float {
    0% {
        opacity: 0;
        transform: translateY(30px) scale(0.8);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Float Element Animation (Disabled) */
@keyframes float-element {
    0%, 100% {
        transform: translateY(0px) rotate(0deg);
    }
    25% {
        transform: translateY(-15px) rotate(2deg);
    }
    50% {
        transform: translateY(-25px) rotate(-2deg);
    }
    75% {
        transform: translateY(-15px) rotate(1deg);
    }
}

/* Rotating Decoration Circles (Disabled) */
@keyframes rotate-slow {
    0% { 
        transform: translate(-50%, -50%) rotate(0deg); 
    }
    100% { 
        transform: translate(-50%, -50%) rotate(360deg); 
    }
}

/* ============================================
   FADE-IN UTILITY ANIMATIONS
   ============================================ */

/* Fade In - Default */
.fade-in {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.fade-in.visible {
    opacity: 1;
    transform: translateY(0);
}

/* Fade In - From Left */
.fade-in-left {
    opacity: 1;
    transform: translateX(0);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.fade-in-left.visible {
    opacity: 1;
    transform: translateX(0);
}

/* Fade In - From Right */
.fade-in-right {
    opacity: 1;
    transform: translateX(0);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.fade-in-right.visible {
    opacity: 1;
    transform: translateX(0);
}