/* ======================================================
   ALISIOS EXPERIENCES — Animations & états initiaux
   Ce fichier gère uniquement les états de départ des
   éléments animés (avant que GSAP ne prenne la main) et
   les transitions purement CSS (preloader, flèche...).
   La logique de scroll vit dans js/animations.js.
   ====================================================== */

/* ---------- Préchargement terminé ---------- */
.preloader.is-done {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.8s var(--ease-doux),
        visibility 0.8s var(--ease-doux);
}

/* ---------- États initiaux (cachés avant reveal) ---------- */
/* Les lignes du titre hero démarrent en bas, masquées. */
.hero__title .line span,
.hero__title .line {
    display: block;
}

.js-ready .hero__eyebrow,
.js-ready .hero__subtitle {
    opacity: 0;
}

/* Éléments révélés au scroll (offres, articles, contact) */
.js-ready [data-reveal] {
    opacity: 0;
    transform: translateY(40px);
}

/* ---------- Flèche de scroll (hero) ---------- */
.hero__arrow {
    animation: scrollPulse 2.2s var(--ease-doux) infinite;
    transform-origin: top center;
}

@keyframes scrollPulse {
    0% {
        transform: scaleY(0.4);
        opacity: 0.3;
    }
    50% {
        transform: scaleY(1);
        opacity: 1;
    }
    100% {
        transform: scaleY(0.4);
        opacity: 0.3;
    }
}

/* ---------- Lenis (smooth scroll) ---------- */
html.lenis,
html.lenis body {
    height: auto;
}

.lenis.lenis-smooth {
    scroll-behavior: auto !important;
}

.lenis.lenis-stopped {
    overflow: hidden;
}

/* ======================================================
   ACCESSIBILITÉ — Respect de prefers-reduced-motion
   On neutralise les animations et on rend tout visible.
   ====================================================== */
@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
    }

    .js-ready .hero__eyebrow,
    .js-ready .hero__subtitle,
    .js-ready [data-reveal] {
        opacity: 1;
        transform: none;
    }

    .paysage,
    .promesse {
        opacity: 1;
    }
}