/* =========================================================
   À propos — états initiaux & overrides Motion
   Couplé à initAboutPage() dans refonte-motion.js
   (desktop uniquement — le motion bundle n'est pas chargé sur mobile)
   ========================================================= */

@media (min-width: 721px) and (prefers-reduced-motion: no-preference) {
  /* Hero — masqué avant le runtime Motion */
  body.page-about:not(.motion-about-ready) .content-hero--about .eyebrow,
  body.page-about:not(.motion-about-ready) .content-hero--about .content-hero-title,
  body.page-about:not(.motion-about-ready) .content-hero--about .content-hero-lede {
    opacity: 0;
  }

  /* Timeline — états initiaux */
  body.page-about:not(.motion-about-ready) .about-step-marker,
  body.page-about:not(.motion-about-ready) .about-step-body {
    opacity: 0;
  }

  html.motion-about .about-step-marker,
  html.motion-about .about-step-body {
    will-change: transform, opacity;
  }

  html.motion-about .about-step.is-revealed .about-step-marker,
  html.motion-about .about-step.is-revealed .about-step-body {
    will-change: auto;
  }

  /* Bannières */
  body.page-about:not(.motion-about-ready) .about-banner-frame img {
    transform: scale(1.08);
    opacity: 0.6;
  }

  html.motion-about .about-banner.is-revealed .about-banner-frame img {
    transform: scale(1);
    opacity: 1;
    transition: transform 1.2s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.9s ease;
  }

  html.motion-about:not(.motion-about-ready) .about-globe-frame {
    opacity: 0;
    transform: scale(0.92);
  }

  /* Reveal Motion remplace les transitions CSS sur la page about */
  html.motion-about [data-reveal]:not(.motion-revealed):not(.is-visible) {
    opacity: 0;
    transform: translate3d(0, 40px, 0);
    transition: none;
  }
}

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

  html.motion-about .about-banner-frame img {
    transform: none !important;
    opacity: 1 !important;
  }
}