/* Bonne App - Optimisation mobile de l'accueil / Etape 1 : navigation + hero.
   Ce fichier ne contient AUCUNE regle pour les ecrans > 700px.
   Ne modifie ni le JS, ni les formulaires, ni les autres pages. */
@media screen and (max-width: 700px) {
  body.home-mobile-v1 .header-inner { min-height: 68px; }
  body.home-mobile-v1 .menu-toggle { min-width: 44px; min-height: 44px; touch-action: manipulation; }
  body.home-mobile-v1 .nav.open { max-height: calc(100dvh - 74px); overflow-y: auto; overscroll-behavior: contain; }
  body.home-mobile-v1 .nav.open a { min-height: 44px; display: flex; align-items: center; }
  body.home-mobile-v1 .nav.open .button { justify-content: center; text-align: center; }

  body.home-mobile-v1 .ba6-hero { padding: 43px 0 54px; }
  body.home-mobile-v1 .ba6-hero-layout { display: flex; flex-direction: column; align-items: stretch; gap: 27px; }
  body.home-mobile-v1 .ba6-hero-layout > div:first-child { min-width: 0; }
  body.home-mobile-v1 .ba42-home-eyebrow { font-size: 10px !important; line-height: 1.55 !important; letter-spacing: .115em !important; margin-bottom: 21px !important; }
  body.home-mobile-v1 .ba6-hero h1 { font-size: clamp(2.35rem, 9.4vw, 3.7rem); line-height: 1.085; letter-spacing: -.052em; overflow-wrap: normal; hyphens: none; max-width: 15ch; margin-bottom: 21px; }
  body.home-mobile-v1 .ba6-hero h1 em { display: block; }
  body.home-mobile-v1 .ba6-lead { font-size: clamp(15px, 3.85vw, 17px); line-height: 1.62; max-width: 40ch; }
  body.home-mobile-v1 .ba6-actions { display: flex; flex-direction: column; align-items: stretch; gap: 12px; margin-top: 27px; }
  body.home-mobile-v1 .ba6-actions .ba6-button { width: 100%; min-height: 54px; padding: 13px 17px; justify-content: space-between; text-align: left; font-size: 14px; }
  body.home-mobile-v1 .ba6-actions .ba6-textlink { min-height: 46px; width: 100%; display: flex; align-items: center; justify-content: center; text-align: center; font-size: 13px; }
  body.home-mobile-v1 .ba6-hero .stage { display: block; width: min(73vw, 290px); max-width: 290px; height: clamp(205px, 56vw, 250px); margin: 0 auto; flex: none; }
  body.home-mobile-v1 .ba6-hero .stage .block { font-size: clamp(10px, 2.75vw, 12px); }
}
@media screen and (max-width: 360px) {
  body.home-mobile-v1 .ba6-hero h1 { font-size: clamp(2.15rem, 9.1vw, 2.45rem); }
  body.home-mobile-v1 .ba6-hero { padding-top: 34px; }
  body.home-mobile-v1 .ba6-actions .ba6-button { font-size: 13px; }
}