/* Masquer la scrollbar sur les navigateurs modernes */
.hide-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}
.hide-scrollbar::-webkit-scrollbar {
    display: none;
}

/* Animation pour la section hero */
@keyframes strongBlink {
    0% { opacity: 0; transform: scale(0.5); }
    10% { opacity: 1; transform: scale(1.3); }
    20% { opacity: 0.2; transform: scale(0.8); }
    30% { opacity: 1; transform: scale(1.2); }
    40% { opacity: 0.3; transform: scale(0.9); }
    50% { opacity: 1; transform: scale(1.1); }
    60% { opacity: 0.2; transform: scale(0.7); }
    70% { opacity: 1; transform: scale(1.4); }
    80% { opacity: 0.4; transform: scale(0.8); }
    90% { opacity: 1; transform: scale(1); }
    100% { opacity: 1; transform: scale(1); }
}

.animate-strong-blink {
    animation: strongBlink 2.5s ease-in-out infinite;
    display: inline-block;
    max-width: 100%;
    word-wrap: break-word;
}

/* Animation du bandeau défilant - Version corrigée sans délai */
.marquee {
    display: inline-block;
    white-space: nowrap;
    animation: marquee 60s linear infinite;
    transform: translateX(0);
    will-change: transform;
}

@keyframes marquee {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}

/* Animation de clignotement pour les spans */
@keyframes blinkSpan {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.2; }
}

.blink-span {
    animation: blinkSpan 0.3s ease-in-out 3 !important;
}

/* Responsive pour le bandeau */
@media (max-width: 768px) {
    .marquee {
        animation: marquee 40s linear infinite;
    }
}

/* Assurer l'affichage immédiat du bandeau */
#bandeau {
    opacity: 1;
    visibility: visible;
    transform: none;
}

#marquee {
    opacity: 1;
    visibility: visible;
}