/* ==========================================================================
   VAGABON — ANIMATIONS.CSS
   Animations légères de la phase 1 uniquement : apparitions simples,
   survols, ouverture de menu, changement de thème. Les attributs
   data-reveal / data-parallax / data-animation-group sont déjà posés dans
   le HTML pour préparer la phase 2 (GSAP / ScrollTrigger / Lenis), mais ne
   sont pilotés ici que par des transitions CSS simples + IntersectionObserver
   (voir js/animations.js). Aucune dépendance externe n'est requise.
   ========================================================================== */

@keyframes vg-spin {
  to { transform: rotate(360deg); }
}

@keyframes vg-loader-bar {
  from { width: 0%; }
  to { width: 100%; }
}

@keyframes vg-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* Apparition simple au scroll : l'état initial est neutre pour que le
   contenu reste visible si JS est désactivé (progressive enhancement). */
[data-reveal] {
  opacity: 1;
  transform: none;
}

html.js [data-reveal] {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity var(--duration-slow) var(--ease-standard),
              transform var(--duration-slow) var(--ease-standard);
}

html.js [data-reveal].is-visible {
  opacity: 1;
  transform: translateY(0);
}

html.js [data-reveal][data-reveal-delay="1"] { transition-delay: 80ms; }
html.js [data-reveal][data-reveal-delay="2"] { transition-delay: 160ms; }
html.js [data-reveal][data-reveal-delay="3"] { transition-delay: 240ms; }
html.js [data-reveal][data-reveal-delay="4"] { transition-delay: 320ms; }
html.js [data-reveal][data-reveal-delay="5"] { transition-delay: 400ms; }
html.js [data-reveal][data-reveal-delay="6"] { transition-delay: 480ms; }

@media (prefers-reduced-motion: reduce) {
  html.js [data-reveal] {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* Emplacement réservé phase 2 : data-parallax ne fait rien en phase 1. */
[data-parallax] {
  will-change: auto;
}