/* =========================================================
   Animations à l'apparition au défilement.
   Le contenu est visible PAR DÉFAUT : le fondu n'est activé que
   lorsque scroll-animations.js a démarré (classe .js-anim-ready
   sur <html>). Sans JavaScript, ou en cas d'erreur ailleurs sur
   la page, le visiteur voit le contenu tout de suite.
   ========================================================= */

/* État par défaut : toujours visible (sécurité) */
.anim-section,
.anim-section .anim-card {
    opacity: 1;
    transform: none;
}

/* L'animation ne s'active que si le JS a démarré avec succès */
html.js-anim-ready .anim-section {
    opacity: 0;
    transform: translateY(36px);
    transition: opacity 0.9s cubic-bezier(0.2, 0.8, 0.2, 1),
                transform 0.9s cubic-bezier(0.2, 0.8, 0.2, 1);
    will-change: transform, opacity;
}

/* Une fois visible : « none » (et non translateY(0)) et plus de
   will-change. Un transform, même nul, ou un will-change: transform
   isolent la section dans sa propre couche : les menus déroulants
   (filtres des pages Documents et Recherche) passaient alors SOUS la
   section suivante au lieu de la recouvrir. Rendu identique. */
html.js-anim-ready .anim-section.is-visible {
    opacity: 1;
    transform: none;
    will-change: auto;
}

/* Delays between sections on the same viewport entry */
html.js-anim-ready .anim-section:nth-child(1) { transition-delay: 0ms; }
html.js-anim-ready .anim-section:nth-child(2) { transition-delay: 90ms; }
html.js-anim-ready .anim-section:nth-child(3) { transition-delay: 180ms; }
html.js-anim-ready .anim-section:nth-child(4) { transition-delay: 270ms; }
html.js-anim-ready .anim-section:nth-child(5) { transition-delay: 360ms; }

/* Internal stagger for cards inside animated sections */
html.js-anim-ready .anim-section .anim-card {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.8s cubic-bezier(0.2, 0.8, 0.2, 1),
                transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
    will-change: transform, opacity;
}

html.js-anim-ready .anim-section.is-visible .anim-card {
    opacity: 1;
    transform: translateY(0);
}

html.js-anim-ready .anim-section.is-visible .anim-card:nth-child(1) { transition-delay: 60ms; }
html.js-anim-ready .anim-section.is-visible .anim-card:nth-child(2) { transition-delay: 130ms; }
html.js-anim-ready .anim-section.is-visible .anim-card:nth-child(3) { transition-delay: 200ms; }
html.js-anim-ready .anim-section.is-visible .anim-card:nth-child(4) { transition-delay: 270ms; }
html.js-anim-ready .anim-section.is-visible .anim-card:nth-child(5) { transition-delay: 340ms; }
html.js-anim-ready .anim-section.is-visible .anim-card:nth-child(6) { transition-delay: 410ms; }

/* Respect users who prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
    html.js-anim-ready .anim-section,
    html.js-anim-ready .anim-section .anim-card {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}