@layer components {
    /* On cible UNIQUEMENT les éléments enfants de .stats-section */
    .stats-section .reveal-content, 
    .stats-section .stat-card {
        opacity: 0;
        transition: all 0.8s cubic-bezier(0.16, 1, 0.3, 1);
        will-change: transform, opacity;
    }

    .stats-section .reveal-content { transform: translateY(20px); }
    .stats-section .stat-card { transform: translateY(40px); }

    /* L'animation ne se déclenche que si la section parente a la classe .is-visible */
    .stats-section.is-visible .reveal-content, 
    .stats-section.is-visible .stat-card {
        opacity: 1; 
        transform: translateY(0);
    }

    /* Délais pour l'effet de cascade sur les cartes */
    .stats-section.is-visible .stat-card:nth-child(1) { transition-delay: 0.1s; }
    .stats-section.is-visible .stat-card:nth-child(2) { transition-delay: 0.2s; }
    .stats-section.is-visible .stat-card:nth-child(3) { transition-delay: 0.3s; }
    .stats-section.is-visible .stat-card:nth-child(4) { transition-delay: 0.4s; }
}