/* B22 : page pivot « Génération de leads » (/generation-de-leads/), 05/10/2026.
   Complète load-refonte-externalise.css ; ne s'applique qu'aux classes b22-* et à cette page. */

/* Ancres sous l'en-tête fixe */
#orientation,#question-1,#question-2,#question-3,#aucune-reponse,#offres,#offre-directeur-marketing,#offre-inbound,#offre-outbound,#comparatif,#autres-offres{scroll-margin-top:96px}

/* Haut de page */
main .hero .b22-surtitre{margin-bottom:var(--e-2)}
main .hero[data-astro-cid-psf2mf6h] .hero__sous+.hero__sous{margin-top:var(--e-2)}
.b22-comparer{margin-top:var(--e-2)}
.b22-comparer a{font-family:var(--f-menu);font-weight:600;color:var(--c-accent)}
.rx-forfait .tarif a.tarif__nom{color:inherit;text-decoration:none}
.rx-forfait .tarif a.tarif__nom:hover,.rx-forfait .tarif a.tarif__nom:focus-visible{color:var(--c-accent);text-decoration:underline}
.rx-forfait .rx-matrice__note{text-align:left}

/* Définition : texte et liste des trois formes */
.b22-texte{max-width:var(--largeur-texte);margin:var(--e-4) auto 0}
.b22-texte .rx-coches{margin-top:var(--e-3)}

/* Orientation en trois questions */
.b22-question__n{display:block;margin-bottom:var(--e-1);font-family:var(--f-menu);font-weight:600;font-size:var(--t-mini);letter-spacing:var(--ls-capitales);text-transform:uppercase;color:#4a5560}
.b22-questions .rx-role h3{font-size:var(--t-chapo)}
.b22-reponses{list-style:none;margin:var(--e-3) 0 0;padding:0;display:grid;gap:var(--e-2);align-content:start}
.b22-reponses li{padding:var(--e-3);border-radius:10px;background:var(--c-blanc);font-size:var(--t-petit)}
.rx-role .b22-reponses p{margin-top:0;text-align:left}
.rx-role .b22-reponses p+p{margin-top:var(--e-2)}
.b22-reponse__offre strong,.b22-reponse__offre a{font-family:var(--f-menu);font-weight:600;color:var(--c-secondaire)}
.b22-reponse__offre a{color:var(--c-accent)}
.b22-reponses .btn{display:inline-block;margin-top:var(--e-2)}
.b22-aucune .b22-sorties{list-style:none;margin:var(--e-3) 0 0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:var(--e-3);text-align:left}
.b22-sorties li{display:flex;flex-direction:column;align-items:flex-start;gap:var(--e-3);padding:var(--e-3) var(--e-4);border-radius:12px;background:var(--c-blanc);font-size:var(--t-petit)}
.b22-sorties .btn{margin-top:auto}

/* Les trois offres : trois cartes */
.rx-formules.b22-formules{grid-template-columns:repeat(3,1fr);max-width:none}
.b22-formules .rx-formule{text-align:left;padding:var(--e-4)}
.b22-formules .rx-formule h3,.b22-formules .rx-formule__pourqui{text-align:center}
.b22-formules .rx-formule__pourqui{color:var(--c-primaire)}
.b22-formule__texte{margin-top:var(--e-3);font-size:var(--t-petit)}
.b22-formules .rx-coches{margin-top:var(--e-3)}
.b22-formules .rx-formule__cta{display:flex;flex-direction:column;align-items:stretch;gap:var(--e-2);text-align:center}
.b22-ou{font-size:var(--t-legende);color:var(--c-texte-doux)}

/* Tableau comparatif */
.b22-tableau{max-width:1140px;margin:var(--e-5) auto 0;overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--c-bordure);border-radius:12px;background:var(--c-blanc)}
.b22-comparatif{width:100%;min-width:760px;border-collapse:collapse;font-size:var(--t-petit)}
.b22-comparatif th,.b22-comparatif td{padding:var(--e-2) var(--e-3);border-bottom:1px solid var(--c-bordure);text-align:left;vertical-align:top;text-wrap:pretty}
.b22-comparatif thead th{background:var(--c-carte-bleu);font-family:var(--f-titre);font-weight:700;color:var(--c-secondaire);vertical-align:bottom}
.b22-comparatif thead a{color:var(--c-secondaire);text-decoration:none}
.b22-comparatif thead a:hover,.b22-comparatif thead a:focus-visible{color:var(--c-accent);text-decoration:underline}
.b22-comparatif tbody th{width:17%;font-family:var(--f-menu);font-weight:600;color:var(--c-secondaire)}
.b22-comparatif tbody tr:last-child>*{border-bottom:0}
.b22-comparatif tbody tr:last-child td{font-weight:600;color:var(--c-primaire)}

/* Bandeau final : coordonnées */
.bandeau-appel .b22-contact a{color:var(--c-blanc)}

/* Écrans moyens et mobiles */
@media (width<=1000px){.rx-formules.b22-formules{grid-template-columns:1fr;max-width:620px}}
@media (width<=760px){
  .b22-aucune .b22-sorties{grid-template-columns:1fr}
  .b22-tableau{overflow:visible;border:0;border-radius:0;background:transparent}
  .b22-comparatif{min-width:0}
  .b22-comparatif thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
  .b22-comparatif,.b22-comparatif tbody,.b22-comparatif tr,.b22-comparatif th,.b22-comparatif td{display:block;width:auto}
  .b22-comparatif tbody tr{margin-top:var(--e-3);border:1px solid var(--c-bordure);border-radius:12px;background:var(--c-blanc);overflow:hidden}
  .b22-comparatif tbody tr:first-child{margin-top:0}
  .b22-comparatif tbody th{width:auto;background:var(--c-carte-bleu)}
  .b22-comparatif tbody tr>*{border-bottom:1px solid var(--c-bordure)}
  .b22-comparatif tbody tr>:last-child{border-bottom:0}
  .b22-comparatif td:before{content:attr(data-label);display:block;margin-bottom:.15rem;font-family:var(--f-menu);font-weight:600;font-size:var(--t-legende);color:var(--c-texte-doux)}
}
@media (width<=560px){.b22-sorties li{padding:var(--e-3)}.b22-sorties .btn,.b22-reponses .btn{width:100%;text-align:center}}
