/* =========================================================
   Animations premium — logo, hero, texte rotatif
   ========================================================= */

@keyframes letter-in {
    0% { opacity: 0; transform: translateY(40px) rotateX(-90deg) scale(0.6); filter: blur(10px); }
    60% { opacity: 1; filter: blur(2px); }
    100% { opacity: 1; transform: translateY(0) rotateX(0) scale(1); filter: blur(0); }
}

@keyframes logo-float {
    0%, 100% { transform: translateY(0) rotateZ(0deg); }
    50% { transform: translateY(-10px) rotateZ(0.4deg); }
}

@keyframes heroLogoIn {
    0% { opacity: 0; transform: translateY(-30px) scale(0.7); filter: blur(8px); }
    100% { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}

@keyframes logo-spin {
    0% { transform: rotate(0deg) scale(1); }
    50% { transform: rotate(180deg) scale(1.15); }
    100% { transform: rotate(360deg) scale(1); }
}

@keyframes sweep-light {
    0% { background-position: -120% 0; }
    50% { background-position: 220% 0; }
    100% { background-position: 220% 0; }
}

@keyframes pulse-dot {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.4; transform: scale(1.4); }
}

@keyframes blink {
    0%, 45% { opacity: 1; }
    50%, 100% { opacity: 0; }
}

@keyframes scroll-line {
    0% { transform: scaleY(0); transform-origin: top; opacity: 1; }
    50% { transform: scaleY(1); transform-origin: top; }
    51% { transform-origin: bottom; }
    100% { transform: scaleY(0); transform-origin: bottom; opacity: 0.4; }
}

@keyframes fadeGlow {
    0% { opacity: 0; text-shadow: 0 0 0 rgba(10,132,255,0); }
    100% { opacity: 1; text-shadow: 0 0 24px rgba(10,132,255,0.65); }
}

@keyframes slideUpFade {
    0% { opacity: 0; transform: translateY(30px); }
    100% { opacity: 1; transform: translateY(0); }
}

@keyframes zoomInFade {
    0% { opacity: 0; transform: scale(0.7); }
    100% { opacity: 1; transform: scale(1); }
}

@keyframes rotateInFade {
    0% { opacity: 0; transform: rotateX(70deg) translateY(20px); }
    100% { opacity: 1; transform: rotateX(0) translateY(0); }
}

@keyframes motionBlurIn {
    0% { opacity: 0; filter: blur(14px); transform: translateX(-40px); }
    100% { opacity: 1; filter: blur(0); transform: translateX(0); }
}

/* Classes appliquées dynamiquement par hero-animation.js sur chaque slogan */
.slogan-fx-typing { border-right: 2px solid var(--c-primary); white-space: nowrap; overflow: hidden; }
.slogan-fx-fade { animation: fadeGlow 1s ease forwards; }
.slogan-fx-slide { animation: slideUpFade 0.9s cubic-bezier(0.2,0.8,0.2,1) forwards; }
.slogan-fx-zoom { animation: zoomInFade 0.8s ease forwards; }
.slogan-fx-rotate { animation: rotateInFade 0.9s ease forwards; transform-style: preserve-3d; }
.slogan-fx-glow { animation: fadeGlow 1.2s ease forwards; color: #fff; }
.slogan-fx-blur { animation: motionBlurIn 0.9s ease forwards; }

/* Réseau digital / particules du hero (canvas géré en JS, styles d'appui ici) */
.hero-network-lines {
    position: absolute; inset: 0; z-index: 1; opacity: 0.5; pointer-events: none;
    background-image:
        linear-gradient(rgba(var(--c-primary-rgb), 0.08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(var(--c-primary-rgb), 0.08) 1px, transparent 1px);
    background-size: 46px 46px;
    mask-image: radial-gradient(ellipse at center, black 0%, transparent 75%);
}

.hero-wave {
    position: absolute; left: 0; right: 0; bottom: -2px; z-index: 2; line-height: 0;
}
.hero-wave svg { width: 100%; height: 120px; }
.hero-wave path { fill: var(--c-black); }

/* AOS-like fallback classes if AOS CDN is unavailable */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity 0.7s ease, transform 0.7s ease; }
.reveal.in-view { opacity: 1; transform: translateY(0); }

/* Compteurs : léger effet de scale au comptage */
.counter-number.counting { animation: pulse-dot 0.6s ease infinite alternate; }

/* Effet néon sur survol des cartes de service */
@keyframes borderGlow {
    0%, 100% { box-shadow: 0 0 0 rgba(var(--c-primary-rgb), 0); }
    50% { box-shadow: 0 0 25px rgba(var(--c-primary-rgb), 0.35); }
}
.domain-card:focus-within { animation: borderGlow 1.6s ease infinite; }