/* ==========================================================================
   MAKE FUTURE MODEL SCHOOL — KEYFRAME ANIMATIONS & MOTION ENGINE
   ========================================================================== */

/* 1. Header Multi-Color Text Blink */
@keyframes blinkMultiColor {
    0%   { color: #ff0000; opacity: 1; }
    12.5%{ opacity: 0; }
    25%  { color: #00cc00; opacity: 1; }
    37.5%{ opacity: 0; }
    50%  { color: #0066ff; opacity: 1; }
    62.5%{ opacity: 0; }
    75%  { color: #FDB913; opacity: 1; }
    87.5%{ opacity: 0; }
    100% { color: #ff0000; opacity: 1; }
}

.blinking-colorful-text {
    animation: blinkMultiColor 6s infinite linear;
    font-weight: 900 !important;
    font-size: 0.95rem;
    letter-spacing: 1px;
}

/* 2. Chatbot Header Icon Multi-Color Blink */
@keyframes chatBotBlink {
    0%   { color: #25D366; transform: scale(1); }    
    25%  { color: #C02026; transform: scale(1.15); } 
    50%  { color: #FDB913; transform: scale(1); }    
    75%  { color: #1A2F6C; transform: scale(1.15); } 
    100% { color: #25D366; transform: scale(1); }
}

/* 3. FAB Speed Dial Multicolor Glow */
@keyframes fabBotBlink {
    0%   { background-color: #25D366; box-shadow: 0 6px 20px rgba(37, 211, 102, 0.4); } 
    25%  { background-color: #007bff; box-shadow: 0 6px 20px rgba(0, 123, 255, 0.4); } 
    50%  { background-color: #ffc107; box-shadow: 0 6px 20px rgba(255, 193, 7, 0.4); }  
    75%  { background-color: #dc3545; box-shadow: 0 6px 20px rgba(220, 53, 69, 0.4); }  
    100% { background-color: #25D366; box-shadow: 0 6px 20px rgba(37, 211, 102, 0.4); }
}

/* 4. Pulsing Dot for Online Status & Live Badges */
@keyframes pulseDot {
    0%   { opacity: 1; transform: scale(1); }
    50%  { opacity: 0.4; transform: scale(0.85); }
    100% { opacity: 1; transform: scale(1); }
}

/* 5. Pop-In Bounce for Success Modals */
@keyframes popIn {
    0%   { transform: scale(0); opacity: 0; }
    80%  { transform: scale(1.1); opacity: 1; }
    100% { transform: scale(1); opacity: 1; }
}

/* 6. Pulse Glow for Gallery & Notification Badges */
@keyframes pulseGlow {
    0%   { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(220, 53, 69, 0.7); }
    70%  { transform: scale(1); box-shadow: 0 0 0 8px rgba(220, 53, 69, 0); }
    100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(220, 53, 69, 0); }
}

.pulse-anim {
    animation: pulseGlow 2s infinite;
}

/* 7. Highlights Slide Caption Multi-Color Text */
@keyframes multiColorCaptionText {
    0%   { color: #ffffff; text-shadow: 0 0 5px rgba(255,255,255,0.4); }
    25%  { color: #ffeb3b; text-shadow: 0 0 5px rgba(255,235,59,0.4); }
    50%  { color: #69f0ae; text-shadow: 0 0 5px rgba(105,240,174,0.4); }
    75%  { color: #40c4ff; text-shadow: 0 0 5px rgba(64,196,255,0.4); }
    100% { color: #ffffff; text-shadow: 0 0 5px rgba(255,255,255,0.4); }
}

@keyframes fadeInDown {
    from { opacity: 0; transform: translateY(-10px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* 8. Subtle Flow for Executive Management Section Gradient */
@keyframes subtleFlow {
    0%   { background-position: 0% 50%; }
    50%  { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* 9. Animated 300% Border Glow */
@keyframes borderGlow {
    0%   { background-position: 0% 50%; }
    50%  { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* 10. Ambient Floating Shapes */
@keyframes float {
    0%   { transform: translateY(0) translateX(0); }
    100% { transform: translateY(40px) translateX(25px); }
}

/* 11. Confetti Fall for Results Section */
@keyframes confettiFall {
    0% {
        transform: translateY(-20px) rotate(0deg);
        opacity: 1;
    }
    100% {
        transform: translateY(350px) rotate(720deg);
        opacity: 0;
    }
}

/* 12. Shimmer Effect for Live Action Badges */
@keyframes liveShimmer {
    0%   { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

.help-desk-anim {
    background: linear-gradient(90deg, #1A2F6C 0%, #C02026 50%, #1A2F6C 100%);
    background-size: 200% 100%;
    animation: liveShimmer 3s infinite linear;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 900;
    letter-spacing: 1.5px;
}
