/**
 * GSAP Block Animations - Frontend Styles v1.5.1
 */

/* État initial des éléments animés */
.gsap-animated:not(.gsap-initialized) {
    opacity: 0;
}

/* Assurer que les éléments peuvent être transformés */
.gsap-animated,
.gsap-parallax,
.gsap-pin {
    will-change: transform, opacity;
}

/* Éviter le flash de contenu non animé */
[data-gsap-animation]:not([data-gsap-animation="none"]):not(.gsap-initialized) {
    visibility: hidden;
}

[data-gsap-animation].gsap-initialized {
    visibility: visible;
}

/* Fallback si GSAP/ScrollTrigger ne peut pas être chargé. */
.gsap-animation-fallback .gsap-animated,
.gsap-animation-fallback .gsap-stagger-container > *,
.gsap-animation-fallback [data-gsap-animation],
.gsap-animation-fallback [data-gsap-parallax],
.gsap-animation-fallback [data-gsap-pin] {
    opacity: 1 !important;
    transform: none !important;
    visibility: visible !important;
}

/* Stagger container - enfants cachés initialement */
.gsap-stagger-container:not(.gsap-initialized) > * {
    opacity: 0;
}

/* Pin - Assurer un bon fonctionnement */
.gsap-pin {
    position: relative;
}

/* Parallax - Overflow visible pour les effets qui dépassent */
.gsap-parallax {
    overflow: visible;
}

/* Container pour les éléments parallax avec overflow caché */
.gsap-parallax-wrapper {
    overflow: hidden;
}

/* Pin spacer généré par ScrollTrigger */
.pin-spacer {
    /* Aucun style spécifique nécessaire, géré par GSAP */
}

/* Optimisation des performances */
@media (prefers-reduced-motion: reduce) {
    .gsap-animated,
    .gsap-parallax,
    .gsap-pin,
    [data-gsap-animation],
    [data-gsap-parallax],
    [data-gsap-pin] {
        animation: none !important;
        transition: none !important;
        opacity: 1 !important;
        transform: none !important;
        visibility: visible !important;
    }
    
    /* Désactiver le pin en mode reduced motion */
    .pin-spacer {
        display: contents !important;
    }
}

/* Fallback pour les navigateurs sans JS */
.no-js .gsap-animated,
.no-js .gsap-parallax,
.no-js .gsap-pin,
.no-js [data-gsap-animation],
.no-js [data-gsap-parallax],
.no-js [data-gsap-pin] {
    opacity: 1 !important;
    transform: none !important;
    visibility: visible !important;
}

/* Style pour les marqueurs ScrollTrigger (mode debug) */
.gsap-marker-start,
.gsap-marker-end,
.gsap-marker-scroller-start,
.gsap-marker-scroller-end {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-size: 12px;
    font-weight: bold;
    z-index: 9999;
}

/* Flip animations - perspective */
[data-gsap-animation="flip-x"],
[data-gsap-animation="flip-y"] {
    perspective: 1000px;
    transform-style: preserve-3d;
}

/* Smooth scrolling hint */
html.has-gsap-pin {
    scroll-behavior: auto; /* Désactiver smooth scroll natif qui peut interférer avec pin */
}

/* Responsive adjustments */
@media (max-width: 768px) {
    /* Réduire les distances de parallax sur mobile */
    .gsap-parallax {
        --gsap-parallax-mobile-reduction: 0.5;
    }
}

/* Éviter les problèmes de z-index pendant les animations */
.gsap-animated.gsap-initialized,
.gsap-parallax.gsap-parallax-initialized,
.gsap-pin.gsap-pin-initialized {
    position: relative;
    z-index: 1;
}

/* Fix pour les images dans les conteneurs parallax */
.gsap-parallax img {
    max-width: none;
}

/* Support pour les conteneurs flex et grid avec stagger */
.gsap-stagger-container {
    /* Préserver le layout */
}

.gsap-stagger-container.gsap-initialized > * {
    opacity: 1;
}