/* Icon Animations CSS for BBF Website
 * This file contains animation effects for icons
 */

/* Base animation classes */
.icon-animated {
    opacity: 0;
    transform: translateY(20px) scale(0.9);
    transition: opacity 0.6s ease, transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.icon-visible {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.icon-hover {
    animation: iconPulse 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* Feature icon animations */
.feature-icon.icon-animated {
    transition-delay: 0.1s;
}

.feature-icon.icon-hover i {
    animation: iconSpin 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* Program icon animations */
.program-icon.icon-animated {
    transition-delay: 0.2s;
}

.program-icon.icon-hover i {
    animation: iconBounce 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* Award icon animations */
.award-icon.icon-animated {
    transition-delay: 0.15s;
}

.award-icon.icon-hover i {
    animation: iconShine 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* Contact icon animations */
.contact-item i.icon-animated {
    transition-delay: 0.25s;
}

.contact-item i.icon-hover {
    animation: iconWiggle 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* Social icon animations */
.social-links a.icon-animated {
    transition-delay: 0.1s;
}

.social-links a.icon-hover i {
    animation: iconPop 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* Animation keyframes */
@keyframes iconPulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.2); }
    100% { transform: scale(1); }
}

@keyframes iconSpin {
    0% { transform: rotate(0deg); }
    25% { transform: rotate(15deg); }
    75% { transform: rotate(-15deg); }
    100% { transform: rotate(0deg); }
}

@keyframes iconBounce {
    0% { transform: translateY(0); }
    40% { transform: translateY(-10px); }
    60% { transform: translateY(-5px); }
    80% { transform: translateY(-2px); }
    100% { transform: translateY(0); }
}

@keyframes iconShine {
    0% { filter: brightness(1); }
    50% { filter: brightness(1.3) drop-shadow(0 0 5px rgba(235, 181, 64, 0.8)); }
    100% { filter: brightness(1); }
}

@keyframes iconWiggle {
    0% { transform: rotate(0deg); }
    25% { transform: rotate(10deg); }
    50% { transform: rotate(-10deg); }
    75% { transform: rotate(5deg); }
    100% { transform: rotate(0deg); }
}

@keyframes iconPop {
    0% { transform: scale(1); }
    40% { transform: scale(1.3); }
    100% { transform: scale(1); }
}

/* Staggered animations for groups of icons */
.features-grid .feature-card:nth-child(1) .feature-icon { transition-delay: 0.1s; }
.features-grid .feature-card:nth-child(2) .feature-icon { transition-delay: 0.2s; }
.features-grid .feature-card:nth-child(3) .feature-icon { transition-delay: 0.3s; }
.features-grid .feature-card:nth-child(4) .feature-icon { transition-delay: 0.4s; }

.programs-list .program-item:nth-child(1) .program-icon { transition-delay: 0.1s; }
.programs-list .program-item:nth-child(2) .program-icon { transition-delay: 0.2s; }
.programs-list .program-item:nth-child(3) .program-icon { transition-delay: 0.3s; }
.programs-list .program-item:nth-child(4) .program-icon { transition-delay: 0.4s; }

.awards-grid .award-card:nth-child(1) .award-icon { transition-delay: 0.1s; }
.awards-grid .award-card:nth-child(2) .award-icon { transition-delay: 0.2s; }
.awards-grid .award-card:nth-child(3) .award-icon { transition-delay: 0.3s; }
.awards-grid .award-card:nth-child(4) .award-icon { transition-delay: 0.4s; }

.contact-info .contact-item:nth-child(1) i { transition-delay: 0.1s; }
.contact-info .contact-item:nth-child(2) i { transition-delay: 0.2s; }
.contact-info .contact-item:nth-child(3) i { transition-delay: 0.3s; }

.social-links a:nth-child(1) { transition-delay: 0.1s; }
.social-links a:nth-child(2) { transition-delay: 0.15s; }
.social-links a:nth-child(3) { transition-delay: 0.2s; }
.social-links a:nth-child(4) { transition-delay: 0.25s; }

/* Responsive adjustments */
@media (max-width: 768px) {
    .icon-animated {
        transform: translateY(15px) scale(0.9);
    }
}

@media (prefers-reduced-motion: reduce) {
    .icon-animated {
        transition: opacity 0.3s ease;
        transform: none;
    }
    
    .icon-hover,
    .feature-icon.icon-hover i,
    .program-icon.icon-hover i,
    .award-icon.icon-hover i,
    .contact-item i.icon-hover,
    .social-links a.icon-hover i {
        animation: none;
    }
}