/* assets/css/motion.css — Pack Quick-Wins dynamisme homepage (hero + cartes situation)
 * Additif uniquement. Respecte prefers-reduced-motion partout (voir bloc en fin de fichier). */

html {
  scroll-behavior: smooth;
}

.motion-zoom {
  animation: motionZoom 22s ease-in-out infinite alternate;
  will-change: transform;
}
@keyframes motionZoom {
  from { transform: scale(1); }
  to { transform: scale(1.035); }
}

/* A. Trait qui se dessine entre les 3 cartes du parcours (déclenché par bd-reveal via .is-in) */
.parcours-connector {
  position: absolute;
  top: 1.9rem;
  left: 0;
  width: 100%;
  height: 2px;
  background: var(--vert, #7FE3C4);
  transform-origin: left center;
  transform: scaleX(0);
  transition: transform 1s ease-out;
  pointer-events: none;
  z-index: 0;
}
.bd-reveal-ready .parcours-connector.is-in {
  transform: scaleX(1);
}
@media (max-width: 980px) {
  /* .parcours-grid passe en 1 colonne (cartes empilées) à ce même breakpoint — le trait n'a plus de sens */
  .parcours-connector { display: none; }
}

/* B. Barre d'accent qui se trace sous la citation signature (déclenché par bd-reveal via .is-in) */
.signature-accent-bar {
  width: 60px;
  height: 3px;
  margin: 1.8rem auto;
  background: var(--vert, #7FE3C4);
  transform-origin: left center;
  transform: scaleX(0);
  transition: transform 1s ease-out;
}
.bd-reveal-ready .signature-accent-bar.is-in {
  transform: scaleX(1);
}

/* C. Pulsation douce sur le point "en ligne" du chat Stephanie (animation continue, non liée au scroll) */
.bd-status-dot {
  animation: bdStatusPulse 2.4s ease-in-out infinite;
}
@keyframes bdStatusPulse {
  0% { box-shadow: 0 0 0 0 rgba(127, 227, 196, 0.55); }
  70% { box-shadow: 0 0 0 5px rgba(127, 227, 196, 0); }
  100% { box-shadow: 0 0 0 0 rgba(127, 227, 196, 0); }
}

/* D. Léger zoom au survol sur la miniature vidéo et les cartes blog
   (.yt-facade__poster a déjà un hover-zoom natif dans style.css — on ne cible ici
   que .blog-card-img qui n'en avait pas ; .blog-card a déjà overflow:hidden). */
.blog-card-img {
  transition: transform 0.3s ease;
}
.blog-card:hover .blog-card-img,
.blog-card-link:hover .blog-card-img {
  transform: scale(1.04);
}

/* E. Barre de progression de scroll (fixe en haut de page, sitewide — injectée par motion.js) */
.bd-scroll-progress {
  position: fixed;
  top: 0;
  left: 0;
  height: 3px;
  width: 0%;
  background: var(--vert, #7FE3C4);
  z-index: 200; /* au-dessus de .site-header (sticky, z-index:100) */
  transition: width 0.1s linear;
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .motion-zoom,
  [data-count-to],
  .parcours-connector,
  .signature-accent-bar,
  .bd-status-dot,
  .blog-card-img {
    animation: none !important;
    transition: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
  .bd-scroll-progress {
    transition: none !important;
  }
}