/* ============================================================
   HERO — style "uniflow" : colonne CENTREE, proportionnelle
   sur mobile / tablette / ordinateur. Charge APRES pages.css.
   Annule l'ancien layout absolu (bouton qui chevauchait, etc.).
============================================================ */

main > .hero {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

main > .hero .container {
  max-width: 940px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* --- Colonne centree, en flux, pour TOUTES les tailles --- */
main > .hero .hero-inner {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  gap: 0 !important;
  width: 100% !important;
  max-width: 940px !important;
  margin: 0 auto !important;
  padding: clamp(1.75rem, 4vw, 3.25rem) 1.25rem clamp(2.25rem, 5vw, 4rem) !important;
  min-height: 0 !important;
}

main > .hero .hero-text,
main > .hero .hero-btns {
  position: static !important;
  transform: none !important;
  width: 100% !important;
  max-width: 800px !important;
  margin: 0 auto !important;
  text-align: center !important;
  left: auto !important; right: auto !important; top: auto !important; bottom: auto !important;
}

main > .hero .hero-label-pill { margin: 0 auto 1.1rem !important; }
main > .hero .hero-text h1 { margin: 0 auto 1.15rem !important; white-space: normal !important; }
/* on laisse le texte se centrer/replier naturellement (pas de coupures desktop) */
main > .hero .hero-text h1 br,
main > .hero .hero-sub br { display: none !important; }
main > .hero .hero-sub { margin: 0 auto 1.9rem !important; max-width: 700px !important; }

/* Bouton + reassurance : centres */
main > .hero .hero-btns {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 0.65rem !important;
  margin-top: 0 !important;
  max-width: none !important;
}
main > .hero .hero-note-line { text-align: center !important; width: auto !important; }

/* --- Bloc AVIS (facon uniflow) : etoiles + note + "X avis Google" + lien --- */
.hero-reviews {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.4rem;
  margin: 1.7rem auto 0;
  text-decoration: none;
  color: inherit;
}
.hero-reviews__stars { display: inline-flex; gap: 3px; line-height: 0; }
.hero-reviews__stars svg { width: 22px; height: 22px; fill: #FFB400; }
.hero-reviews__text { font-size: 1rem; color: #5B6472; }
.hero-reviews__text strong { color: #0F1B2D; font-weight: 700; }
.hero-reviews__cta { font-size: 0.9rem; font-weight: 600; color: var(--color-blue, #1F4FD8); }
.hero-reviews:hover .hero-reviews__cta { text-decoration: underline; }

/* --- Badge "descendre" (scroll cue) --- */
.hero-scroll-cue {
  display: inline-flex; flex-direction: column; align-items: center; gap: 0.35rem;
  margin: 2.4rem auto 0; text-decoration: none;
  color: #1F4FD8; font-size: 0.82rem; font-weight: 700; letter-spacing: 0.02em;
}
.hero-scroll-cue__pill {
  display: inline-flex; align-items: center; gap: 0.4rem;
  background: #EAF0FF; padding: 0.5rem 1rem; border-radius: 999px;
}
.hero-scroll-cue__chev { width: 16px; height: 16px; animation: heroCueBounce 1.6s ease-in-out infinite; }
@keyframes heroCueBounce { 0%,100%{ transform: translateY(0); } 50%{ transform: translateY(4px); } }
.hero-scroll-cue:hover .hero-scroll-cue__pill { background: #1F4FD8; color: #fff; }

/* --- Visuel (animation orbitale) : MASQUE pour l'instant.
   Le code reste dans les fichiers (HTML/JS/CSS) — pour la reafficher,
   remettre `display: block` ci-dessous. --- */
main > .hero .hero-visual {
  display: none !important;
}