/* 
 * Animation de la section Enjeux
 * Effet de fondu et glissement décalé (staggered)
 */

/* On étend la transition de base de .enjeux-row définie dans styles.css */
.section-enjeux[data-enjeux-ready="true"] .enjeux-row {
    transition: 
        background-color 0.3s ease, 
        box-shadow 0.3s ease, 
        border-color 0.3s ease,
        opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1),
        transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1),
        filter 0.5s ease;
    will-change: transform, opacity;
}

/* État pendant le changement (sortie et entrée) */
/* L'animation joue lors de l'ajout ET du retrait de la classe is-switching */
.section-enjeux.is-switching .enjeux-row {
    opacity: 0;
    filter: blur(4px);
    transform: translateX(30px);
}

/* Inverser le sens pour les lignes impaires pour un effet de "cisaillement" élégant */
.section-enjeux.is-switching .enjeux-row-right {
    transform: translateX(-30px);
}

/* Délai progressif pour chaque ligne (stagger) */
/* Cela crée un effet de cascade très pro */
.section-enjeux .enjeux-row:nth-child(2) { transition-delay: 0.05s; }
.section-enjeux .enjeux-row:nth-child(3) { transition-delay: 0.1s; }
.section-enjeux .enjeux-row:nth-child(4) { transition-delay: 0.15s; }

/* Styles additionnels pour la fluidité */
.section-enjeux .enjeux-visual {
    overflow: hidden;
}

.section-enjeux .enjeux-img {
    object-fit: cover;
    object-position: center center;
    transition: transform 0.8s cubic-bezier(0.2, 0, 0.2, 1);
}

/* Petit effet de zoom sur l'image au survol de la ligne */
.enjeux-row:hover .enjeux-img {
    transform: scale(1.08);
}

/* Accessibilité : désactiver les animations si l'utilisateur a activé "réduire les animations" */
@media (prefers-reduced-motion: reduce) {
    .section-enjeux[data-enjeux-ready="true"] .enjeux-row {
        transition: opacity 0.3s ease !important;
        transform: none !important;
        transition-delay: 0s !important;
    }
    
    .section-enjeux.is-switching .enjeux-row {
        opacity: 0;
        transform: none;
    }
}