/* AMB Auto — adaptations mobile uniquement.
   Le design de base reste en styles inline ; ce fichier n'ajoute que des surcharges
   sous 860px (carrousels, échelle typographique, CTA pleine largeur). */

/* Titres fluides à toutes les largeurs */
h1 { font-size: clamp(30px, 5vw, 58px) !important; letter-spacing: clamp(-2.4px, -0.22vw, -1.2px) !important; }
h2 { font-size: clamp(25px, 3.3vw, 40px) !important; letter-spacing: clamp(-1.7px, -0.14vw, -0.9px) !important; }

@media (max-width: 900px) {
  body { padding-bottom: 76px !important; }

  section { padding-left: 18px !important; padding-right: 18px !important; }

  h1 { line-height: 1.08 !important; }
  h2 { line-height: 1.14 !important; }
  h3 { font-size: 16.5px !important; }

  /* Suites de cartes -> carrousel horizontal au doigt, bord à bord (la carte suivante dépasse) */
  .amb-rail {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    grid-template-columns: none !important;
    align-items: stretch !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    gap: 12px !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    margin-left: -18px !important;
    margin-right: -18px !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
    scroll-padding-left: 18px;
    scrollbar-width: none;
  }
  section.amb-rail { margin-left: auto !important; margin-right: auto !important; }
  .amb-rail::-webkit-scrollbar { display: none; }
  .amb-rail > * { flex: 0 0 85% !important; min-width: 0; scroll-snap-align: start; }
  .amb-rail-sm > * { flex-basis: 72% !important; }
  /* Petits chiffres : restent en grille de 2 */
  .amb-rail-xs {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    overflow: visible !important;
    margin-left: 0 !important; margin-right: 0 !important;
    padding-left: 0 !important; padding-right: 0 !important;
  }
  .amb-rail-xs > * { flex: none !important; }

  /* Bandeau d'essai en bas : caché tant qu'on n'a pas parcouru 25 % de la page */
  .amb-mobile-cta { transform: translateY(110%); transition: transform .3s ease; }
  html.amb-cta-on .amb-mobile-cta { transform: none; }
  .amb-carded > * { border: 1px solid #E2E0D9 !important; border-radius: 14px !important; }

  /* Boutons empilés, pleine largeur : cible tactile nette */
  .amb-btnrow { flex-direction: column !important; align-items: stretch !important; }
  .amb-btnrow > a,
  .amb-btnrow > button { width: 100% !important; justify-content: center !important; height: 52px !important; }

  .amb-hide-mobile { display: none !important; }
  .amb-show-mobile { display: flex !important; }

  .amb-pad { padding: 26px 20px !important; }
  .amb-annonce { gap: 8px !important; padding: 8px 14px !important; }
  .amb-annonce span { font-size: 11.5px !important; }
  .amb-annonce-badge { font-size: 9.5px !important; }
  .amb-nowrap-scroll { flex-wrap: nowrap !important; overflow-x: auto; scrollbar-width: none; margin-right: -18px; padding-right: 18px; }
  .amb-nowrap-scroll::-webkit-scrollbar { display: none; }
}

@media (max-width: 900px) {
  /* Grilles 2 colonnes à ratio fixe -> empilées, et colonnes collantes désactivées */
  .amb-2col { grid-template-columns: 1fr !important; gap: 26px !important; }
  .amb-2col > * { position: static !important; top: auto !important; }

  /* Rangées CTA à deux lignes : pleine largeur, sans écrasement de hauteur */
  .amb-ctarow { flex-direction: column !important; align-items: stretch !important; }
  .amb-ctarow > a { width: 100% !important; justify-content: space-between !important; }

  /* Tableau avant/après : colonnes compactes */
  .amb-kpi-row { grid-template-columns: minmax(0, 1.45fr) repeat(3, minmax(44px, auto)) !important; gap: 7px !important; padding-left: 14px !important; padding-right: 14px !important; }
  .amb-kpi-row > * { font-size: 12px !important; }
}

/* Tablettes : deux cartes et demie visibles */
@media (min-width: 600px) and (max-width: 900px) {
  .amb-rail > * { flex-basis: 44% !important; }
  .amb-rail-xs { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}

/* Vidéos des pages métier : 3 côte à côte sur ordinateur, carrousel au doigt sur mobile */
.amb-carousel { scrollbar-width: none; }
.amb-carousel::-webkit-scrollbar { display: none; }
@media (max-width: 900px) {
  .amb-carousel { display: flex !important; overflow-x: auto; scroll-snap-type: x mandatory; width: 100%; max-width: 360px; margin: 0 auto; }
  .amb-carousel > * { flex: 0 0 100%; scroll-snap-align: center; }
}

/* Correctifs mobile : colonnes qui ne s'élargissent plus, badges sur deux lignes, carrousel aligné */
@media (max-width: 900px) {
  .amb-2col { grid-template-columns: minmax(0, 1fr) !important; }
  .amb-2col > * { min-width: 0; }
  .amb-pill { height: auto !important; min-height: 28px; padding: 5px 12px !important; border-radius: 14px !important; }
  .amb-carousel { justify-content: flex-start !important; }
}