/* Cartes comparatif « complètes » (rules/CARD_FULL_SPEC.md, structure des pages whitelisting LMC).
   Copiée en /css/emd-cards-full.css et liée UNIQUEMENT sur les pages dont un produit a specs / prices / bentos /
   highlights / why / reviews.text (tools/build.py). Règles reprises de la CSS Webflow LMC
   (le-meilleur-complement.webflow.shared.96b0560ea.min.css), mêmes noms de classes ; ajustements Tims en fin de fichier. */

/* ---- reprises LMC (desktop) ---- */
.wrapper-horizontal._0-25rem { grid-column-gap: .25rem; grid-row-gap: .25rem; }
.template_wrapper-price { grid-column-gap: .25rem; grid-row-gap: .25rem; flex-flow: column; display: flex; }
.template_wrapper-card-bento-top-1 { grid-column-gap: 1rem; grid-row-gap: 1rem; grid-template-rows: auto; grid-template-columns: 1fr 1fr 1fr; grid-auto-columns: 1fr; display: grid; }
.template_card-bento { border-radius: var(--radius-0-5rem); background-color: var(--text--gey); text-align: center; flex-flow: column; justify-content: center; align-items: center; padding: 1.25rem 1rem; display: flex; }
.template_card-bento.is-coup-de-coeur { align-items: stretch; }
.product_wrapper-number { background-color: var(--color--primary); width: 1.5rem; height: 1.5rem; color: var(--text--white); border-radius: 999px; flex-flow: column; flex: none; justify-content: center; align-items: center; display: flex; }
.lmc-why-box { background-color: var(--text--gey); border-radius: 12px; margin: 1rem 0; padding: 1rem 1.25rem; }
.lmc-why-title { margin: 0 0 .5rem; font-size: 1.05rem; font-weight: 700; }
.lmc-why-text { margin: 0; font-size: .95rem; line-height: 1.55; }
.comparator_card .grid-2-col { grid-column-gap: 1rem; grid-row-gap: 1rem; grid-template-rows: auto; grid-template-columns: 1fr 1fr 1fr 1fr; grid-auto-columns: 1fr; display: grid; }
.wrapper-horizontal.is-template { grid-column-gap: .25rem; grid-row-gap: .25rem; }

/* ---- reprises LMC (media queries) ---- */
@media screen and (max-width: 767px) {
  .comparator_card .grid-2-col { grid-template-columns: 1fr 1fr; }
}
@media screen and (max-width: 479px) {
  .template_wrapper-card-bento-top-1 { grid-column-gap: .5rem; grid-row-gap: .5rem; flex-flow: column; display: flex; }
  .comparator_card .grid-2-col { grid-column-gap: .5rem; grid-row-gap: .5rem; }
}

/* ---- ajustements gabarit Tims (le markup Tims n'a pas la grille .is-template de LMC) ---- */
/* lignes de spécifications : libellé gris + valeur grasse qui passe à la ligne au lieu de déborder */
.comparator_info-bullet-wrapper.is-full .wrapper-horizontal.is-comparatif,
.comparator_info-bullet-wrapper.is-full .card_wrapper-category { flex-wrap: nowrap; align-items: flex-start; grid-column-gap: .35rem; }
.comparator_info-bullet-wrapper.is-full .icon-1x1-small.is-template { flex: none; margin-top: .05rem; }
.comparator_info-bullet-wrapper.is-full .text-size-tiny.text-color-grey { flex: none; white-space: nowrap; }
.comparator_info-bullet-wrapper.is-full .text-color-primary { min-width: 0; overflow-wrap: anywhere; }
.comparator_info-bullet-wrapper.is-full .card_wrapper-category .wrapper-horizontal.is-comparatif { min-width: 0; align-items: flex-start; }
.comparator_info-bullet-wrapper.is-full .flag { flex: none; margin-top: .1rem; }
/* deux lignes de prix : base de prix en petit après le montant */
.template_wrapper-price .card_wrapper-price { align-items: baseline; flex-wrap: wrap; grid-column-gap: .35rem; }
.template_wrapper-price .price-text + .price-text { font-size: .95rem; }
/* bentos + 4 points forts + why : espace avec l'en-tête beige, comme LMC */
.comparator_card .template_wrapper-card-bento-top-1 { margin-top: 1rem; }
.template_card-bento .wrapper-horizontal { justify-content: center; align-items: center; grid-column-gap: .4rem; }
.template_card-bento .icon-1x1-small.is-template { flex: none; }
.template_card-bento.is-coup-de-coeur .profil_wrapper-badge.is-template { display: flex; flex-flow: row; }
.template_card-bento.is-coup-de-coeur .text-weight-semibold { text-align: center; }
.lmc-highlights .template_card-bento { padding: 1rem .75rem; }
.lmc-highlights .text-color-primary { text-align: center; }
.comparator_padding-mob .lmc-why-box { margin: 0; }
/* pied de carte complet : note + prix à gauche, avis au centre, code + CTA à droite */
.comparator_card-footer.is-full { grid-column-gap: 1rem; padding-top: .75rem; padding-bottom: .75rem; }
.comparator_card-footer.is-full .wrapper-vertical.is-template { flex: none; display: flex; flex-flow: column; grid-row-gap: .1rem; }
.comparator_card-footer.is-full .wrapper-horizontal.is-template { display: flex; flex-flow: row; align-items: center; justify-content: flex-start; }
.comparator_card-footer.is-full .wrapper-horizontal.is-template .product_wrapper-note { margin: 0; }
.comparator_card-footer.is-full .is-template-wrapper-price { display: flex; flex-wrap: wrap; grid-column-gap: .4rem; }
.comparator_card-footer.is-full .template_wrapper-btn { align-items: center; flex-wrap: nowrap; justify-content: flex-end; }
.comparator_card-footer.is-full .wrapper-note.is-template { margin-right: .25rem; max-width: 12.5rem; text-align: right; }
.comparator_card-footer.is-full .wrapper-note.is-template .text-size-small { white-space: normal; line-height: 1.3; }
.comparator_card-footer.is-full .button { flex: none; }
/* pied de carte : jamais de chevauchement quand la carte est étroite (~780 px) */
.comparator_card-footer.is-full { flex-wrap: wrap; row-gap: .6rem; }
.comparator_card-footer.is-full .template_wrapper-btn { flex: 1 1 auto; min-width: 0; grid-column-gap: .75rem; }
.comparator_card-footer.is-full .button.is-dot { flex: none; white-space: nowrap; }
.comparator_card-footer.is-full .wrapper-note.is-template { flex: 0 1 auto; min-width: 0; max-width: none; }
.comparator_card-footer.is-full .wrapper-note.is-template .wrapper-horizontal { flex-wrap: nowrap; align-items: center; }
.comparator_card-footer.is-full .wrapper-note.is-template .text-size-small { white-space: nowrap; }
.comparator_card-footer.is-full .wrapper-note.is-template .product_logo-trust-pilot { flex: none; }
@media screen and (min-width: 768px) and (max-width: 1100px) {
  .comparator_card-footer.is-full .wrapper-note.is-template { display: none; }
}
@media screen and (max-width: 767px) {
  .comparator_card-footer.is-full { flex-flow: column; align-items: stretch; grid-row-gap: .75rem; }
  .comparator_card-footer.is-full .wrapper-vertical.is-template { align-items: center; }
  .comparator_card-footer.is-full .wrapper-horizontal.is-template { justify-content: center; }
  .comparator_card-footer.is-full .is-template-wrapper-price { justify-content: center; }
  .comparator_card-footer.is-full .template_wrapper-btn { justify-content: center; flex-wrap: wrap; }
  .comparator_card-footer.is-full .wrapper-note.is-template { width: 100%; max-width: none; justify-content: center; text-align: center; margin-right: 0; }
}
@media screen and (max-width: 479px) {
  .comparator_card .template_wrapper-card-bento-top-1 { padding-left: 1rem; padding-right: 1rem; }
  .comparator_card-footer.is-full .template_wrapper-btn { flex-flow: column; align-items: stretch; }
}

/* Ruban de rang des cartes complètes (Elias 11/11) : Top 1 orange + trophée, Top 2..N gris, sans icône */
.comparator_collection-itel.top-1 { position: relative; }
.lmc-rank { position: absolute; z-index: 3; top: 1.25rem; left: -.5rem; }
.lmc-rank_body { display: inline-flex; align-items: center; gap: .3rem; height: 1.75rem; padding: 0 1.1rem 0 .7rem;
  background: #6f6f6f; color: #fff; font-size: .8rem; font-weight: 600; line-height: 1; letter-spacing: .02em;
  clip-path: polygon(0 0, 100% 0, calc(100% - .55rem) 50%, 100% 100%, 0 100%); }
.lmc-rank::after { content: ""; position: absolute; left: 0; top: 100%; width: 0; height: 0;
  border-top: .4rem solid #3f3f3f; border-left: .5rem solid transparent; }
.lmc-rank.is-first .lmc-rank_body { background: #ef7a1a; }
.lmc-rank.is-first::after { border-top-color: #a84f08; }
.lmc-rank_icon { display: inline-flex; width: .9rem; height: .9rem; }
.lmc-rank_icon svg { width: 100%; height: 100%; }
.lmc-rank_text { white-space: nowrap; }
/* nom + note sur une ligne, specs sur une ligne */
.comparator_wrapper-content-promo .wrapper-horizontal.is-full-width.space-between { flex-wrap: nowrap; align-items: flex-start; }
.comparator_wrapper-content-promo .heading-style-h4.top-17 { min-width: 0; flex: 1 1 auto; }
.comparator_wrapper-content-promo .wrapper-horizontal.is-full-width.space-between > .wrapper-horizontal { flex: none; }
.comparator_info-bullet-wrapper.is-full { grid-row-gap: .55rem; }