/* Complement au CSS repris de LMC, pour les pages comparatif uniquement.

   1. Les courbes decoratives (.curve-circle) font 4970 px de large et debordent
      volontairement : LMC les contient avec overflow:clip sur .page-wrapper,
      regle absente du bundle IM8. Sans elle, la page defile de 2 788 px a droite.
   2. webflow.js pose un style inline height:0px sur .accordion-item-content
      (interaction IX2 globale) : il faut !important pour le neutraliser.
   3. Trois classes existent dans les deux bundles, mais IM8 leur donne des valeurs
      que LMC ne redefinit pas : la version LMC ne peut donc pas gagner par l'ordre
      de chargement. On retablit ici la valeur du gabarit d'origine. */

.page-wrapper { overflow: clip; }

/* 3a. Le bundle IM8 garde trois combo-classes Webflow de son propre gabarit
   comparatif (reste du brouillon comparatif.html). LMC ne les definit pas, donc
   elles ne peuvent pas etre ecrasees par l'ordre de chargement : leur specificite
   (0,2,0) impose de les neutraliser avec le meme selecteur. */
.comparateur_card-wrapper-content.top-10 { justify-content: normal; align-items: normal; }
.comparator_card-footer.top-87 { justify-content: space-between; }

/* 3c. .section.is-grey-bg est un conteneur flex centre : sans largeur explicite,
   la chaine de la FAQ se calcule en shrink-to-fit et tombe a 456 px au lieu de 680. */
.padding-global-comparatif { width: 100%; }

/* 4. Le bundle IM8 force `.button, .button.is-dot { width: 100% }` sous 991 px.
   Utile sur ses pages d'article, mais sur le comparatif cela etire le CTA du hero
   sur toute la largeur et casse le bouton du pied de carte sur deux lignes.
   On retablit une largeur naturelle entre 480 et 991 px ; sous 480 px la pleine
   largeur reste voulue (LMC passe lui aussi .template_wrapper-btn en colonne). */
@media screen and (min-width: 480px) and (max-width: 991px) {
  .template_hero-text .button,
  .comparator_card-footer .button,
  .comparator_card-footer .button.is-dot {
    width: auto;
  }
  .comparator_card-footer .button.is-close-modal { white-space: nowrap; }
}

/* 5. Alignement du pied de carte.
   LMC met line-height:1 sur ses boutons ; le bundle IM8 ne le definit pas et herite
   du 1.5 du corps de page. Le CTA gagnait donc 5 px de hauteur (44 au lieu de 38)
   pendant que le chip du code restait a 37 : les deux ne s'alignaient plus.
   On remet un interlignage de bouton et on laisse le chip s'etirer sur la hauteur du CTA. */
.comparator_card-footer .button { line-height: 1.2; }
/* Au-dessus de 480 px le pied est sur une ligne : le chip doit suivre la hauteur du CTA.
   Il porte une hauteur fixe via un selecteur LMC a cinq classes (0,5,0), il faut donc
   au moins autant de specificite. Sous 480 px le pied passe en colonne et le chip
   garde sa hauteur propre. */
@media screen and (min-width: 480px) {
  .comparator_card-footer .template_wrapper-btn { align-items: center; }
  .comparator_card-footer .button.is-small.is-secondary.is-dot.is-100--height {
    height: auto;
    align-self: stretch;
  }
}
