/* ==========================================================================
   Utilitaires + animations de scroll (reveal)
   ========================================================================== */

/* Alignements / helpers */
.text-center { text-align: center; }
.mt-0 { margin-top: 0; }
.mt-m { margin-top: var(--space-m); }
.mt-l { margin-top: var(--space-l); }
.mt-xl { margin-top: var(--space-xl); }
.mx-auto { margin-inline: auto; }
.measure { max-width: var(--measure); }
.measure-narrow { max-width: 52ch; }
.flex { display: flex; }
.flex-wrap { flex-wrap: wrap; }
.gap-s { gap: var(--space-s); }
.gap-m { gap: var(--space-m); }
.items-center { align-items: center; }
.justify-center { justify-content: center; }
.full { width: 100%; }

/* ================= Reveal (JS ajoute .is-inview) ================= */
[data-reveal] {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity var(--dur-slow) var(--ease-out), transform var(--dur-slow) var(--ease-out);
  will-change: opacity, transform;
}
[data-reveal].is-inview { opacity: 1; transform: none; }

/* variantes */
[data-reveal="fade"] { transform: none; }
[data-reveal="left"]  { transform: translateX(-28px); }
[data-reveal="right"] { transform: translateX(28px); }
[data-reveal="scale"] { transform: scale(0.96); }
[data-reveal="left"].is-inview,
[data-reveal="right"].is-inview,
[data-reveal="scale"].is-inview { transform: none; }

/* Reveal image : voile qui se lève + léger zoom */
[data-reveal-image] { position: relative; overflow: hidden; }
[data-reveal-image] > img,
[data-reveal-image] > picture > img {
  transform: scale(1.08);
  transition: transform 1.1s var(--ease-out);
}
[data-reveal-image].is-inview > img,
[data-reveal-image].is-inview > picture > img { transform: scale(1); }
[data-reveal-image]::after {
  content: ""; position: absolute; inset: 0; background: var(--teal-900);
  transform-origin: bottom; transform: scaleY(1);
  transition: transform 0.9s var(--ease-in-out);
  z-index: 2;
}
[data-reveal-image].is-inview::after { transform: scaleY(0); }

/* Reveal texte par lignes (JS découpe en .reveal-line) */
[data-reveal-text] .reveal-line { overflow: hidden; }
[data-reveal-text] .reveal-line > span {
  display: inline-block; transform: translateY(110%);
  transition: transform 0.9s var(--ease-out);
  transition-delay: calc(var(--line-i, 0) * 80ms);
}
[data-reveal-text].is-inview .reveal-line > span { transform: none; }

/* Stagger : les enfants apparaissent en cascade */
[data-stagger] > * {
  opacity: 0; transform: translateY(22px);
  transition: opacity var(--dur) var(--ease-out), transform var(--dur) var(--ease-out);
}
[data-stagger].is-inview > * { opacity: 1; transform: none; }
[data-stagger].is-inview > *:nth-child(1) { transition-delay: 0.05s; }
[data-stagger].is-inview > *:nth-child(2) { transition-delay: 0.13s; }
[data-stagger].is-inview > *:nth-child(3) { transition-delay: 0.21s; }
[data-stagger].is-inview > *:nth-child(4) { transition-delay: 0.29s; }
[data-stagger].is-inview > *:nth-child(5) { transition-delay: 0.37s; }
[data-stagger].is-inview > *:nth-child(6) { transition-delay: 0.45s; }

/* Parallax (JS applique --p) */
[data-parallax] { will-change: transform; transform: translate3d(0, var(--p, 0), 0); }

/* ================= prefers-reduced-motion ================= */
@media (prefers-reduced-motion: reduce) {
  [data-reveal], [data-stagger] > *,
  [data-reveal-text] .reveal-line > span { opacity: 1 !important; transform: none !important; transition: none !important; }
  [data-reveal-image] > img { transform: none !important; }
  [data-reveal-image]::after { display: none; }
  .btn::before, .btn__arrow, .link-arrow::after { transition: none; }
  [data-parallax] { transform: none !important; }
}