/* Lot 2 (CMO, 06/10/2026) : gabarit des 4 pages de conversion.
   Pages : /site-vitrine/, /generation-de-leads/inbound-marketing/,
   /generation-de-leads/directeur-marketing-temps-partage/, /generation-de-leads/prospection-b2b/.
   Liée depuis ces 4 pages seulement, après toutes les autres feuilles. Ne modifie aucune feuille partagée. */

/* 1. Typographie : 16 px minimum pour le texte courant, 14 px pour les aides */
main{--t-petit:1rem;--t-legende:.875rem;--t-mini:.8125rem;--mesure:66ch}
main .fbrevo__champ[data-astro-cid-uiflwvrb] label[data-astro-cid-uiflwvrb],main .fbrevo__optin[data-astro-cid-uiflwvrb] label[data-astro-cid-uiflwvrb]{font-size:1rem}
main .fbrevo__champ input,main .fbrevo__champ select,main .fbrevo__champ textarea{font-size:16px;min-height:48px}
main .fbrevo__aide{font-size:.875rem}

/* 2. Plus aucun texte justifié */
main p,main li,main dd,main dt,main td,main th,main summary,main blockquote,main figcaption,
main .definition,main .rx-definition,main details p,main .rx-faq__reponse p{text-align:left!important;hyphens:manual!important;-webkit-hyphens:manual!important}
/* Exceptions centrées : boutons, mentions courtes, encadrés de fin */
main p.actions,main p.rx-cta,main p.hero__cta,main .final p,main .final h2,main .cadre__invite p,
main .fbrevo__mention,main .b22-form__mention,main .lot2-centre{text-align:center!important}

/* 3. Longueur de ligne raisonnable */
main .conteneur>p:not(.actions):not(.rx-cta):not(.hero__surtitre),main .bloc>p:not(.actions):not(.rx-cta),
main .definition,main .rx-definition,main .rx-intro,main p.intro,main .b22-texte{max-width:var(--mesure);margin-inline:auto}
main .conteneur>ul.liste,main .bloc>ul.liste,main .conteneur>ul.rx-coches,main .conteneur>ul.rx-constats{max-width:var(--mesure);margin-inline:auto}
main .rx-role p,main .rx-lecture p,main .lecture p,main .parcours__etape p,main .etapes p{text-align:left!important}

/* 4. Montants : signature visuelle */
.lot2-prix{font-family:var(--f-titre);font-weight:700;color:var(--c-primaire);white-space:nowrap}

/* 5. Tableaux comparatifs : une carte par critère sous 768 px */
@media (max-width:767px){
  main .defilement:has(.tableau-cartes){border:0;background:none;overflow:visible}
  main .defilement:has(.tableau-cartes)+.note--defiler{display:none}
  main .tableau-cartes{min-width:0!important;width:100%;border:0}
  main .tableau-cartes thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  main .tableau-cartes,main .tableau-cartes tbody,main .tableau-cartes tr,main .tableau-cartes th,main .tableau-cartes td{display:block;width:100%}
  main .tableau-cartes tr{display:flex;flex-direction:column;background:#fff;border:1px solid var(--c-bordure);border-radius:var(--rayon);padding:var(--e-3);margin-bottom:var(--e-3)}
  main .tableau-cartes th[scope=row]{order:-2;padding:0 0 .35rem;border:0;background:none;font-family:var(--f-titre);font-weight:700;font-size:var(--t-base);color:var(--c-primaire)}
  main .tableau-cartes td{padding:.35rem 0;border:0;background:none;font-size:1rem}
  main .tableau-cartes td.comparatif__nous{order:-1;font-weight:700;color:var(--c-primaire)}
  main .tableau-cartes td{padding:.2rem 0;line-height:1.45}
  main .tableau-cartes td::before{content:attr(data-label) "\00a0: ";font-weight:700;color:var(--c-texte-doux)}
  main .tableau-cartes tr{gap:0}
  /* Prospection : sur téléphone, on compare l'agence au forfait et LOAD (variante de l'audit « offres ») */
  main .tableau-cartes td[data-label="Faire soi-même"]{display:none}
}

/* 6. Bouton collant sur téléphone : l'action principale de la page */
.barre-action{position:fixed;inset:auto 0 0 0;z-index:150;padding:8px 16px calc(8px + env(safe-area-inset-bottom));background:#fff;box-shadow:0 -2px 12px #1f1f2226;transform:translateY(110%);visibility:hidden;transition:transform .2s,visibility .2s}
.barre-action.est-visible{transform:none;visibility:visible}
.barre-action .btn{display:flex;justify-content:center;align-items:center;width:100%;min-height:48px;margin:0}
@media (min-width:768px){.barre-action{display:none}}
@media (max-width:767px){body{padding-bottom:72px}}
@media (prefers-reduced-motion:reduce){.barre-action{transition:none}}

/* 7. Ancres sous l'en-tête collant */
#RDV,#maquette,#mini-audit,#mini-audit-complet,#compris,#tarif,#prix,#exemple,#rendez-vous-qualifie,#deroulement{scroll-margin-top:88px}

/* 8. Bloc rendez-vous (agenda) : styles du composant, pour les pages qui ne les avaient pas */
.cadre[data-astro-cid-exddsyit]{border:1px solid var(--c-bordure);border-radius:var(--rayon);background:var(--c-gris-clair);overflow:hidden}
.cadre__invite[data-astro-cid-exddsyit]{padding:var(--e-5) var(--e-4);text-align:center;max-width:56ch;margin-inline:auto}
.cadre__service[data-astro-cid-exddsyit]{font-family:var(--f-titre);font-weight:700;font-size:var(--t-chapo);color:var(--c-primaire)}
.cadre__desc[data-astro-cid-exddsyit]{margin-top:var(--e-2)}
.cadre__note[data-astro-cid-exddsyit]{margin-top:var(--e-3);font-size:var(--t-legende);color:var(--c-texte-doux)}
.cadre__invite[data-astro-cid-exddsyit] .btn[data-astro-cid-exddsyit]{margin-top:var(--e-4);cursor:pointer;border:0}
.cadre__repli[data-astro-cid-exddsyit]{margin-top:var(--e-3);font-size:var(--t-legende);color:var(--c-texte-doux)}
.cadre[data-astro-cid-exddsyit] iframe{border:0;width:100%;display:block}
.section--gris .cadre[data-astro-cid-exddsyit]{background:var(--c-blanc)}
.lot2-rdv .final{max-width:var(--largeur-texte);margin-inline:auto;text-align:center}
.lot2-rdv .final p{margin-top:var(--e-3);text-wrap:balance}
.lot2-rdv .agenda{max-width:860px;margin:var(--e-4) auto 0}
.lot2-rdv__lien{margin-top:var(--e-3);text-align:center;font-size:var(--t-legende)}

/* 9. Haut de page : ligne de preuve et lien secondaire */
main .hero .lot2-preuve{margin-top:var(--e-3);font-size:.9375rem;color:var(--c-texte-doux);max-width:60ch}
main .hero h1{text-wrap:balance}

/* 10. Accordéons de détail (prospection) */
main .lot2-details{max-width:var(--mesure);margin:var(--e-4) auto 0}
main .lot2-details details{border:1px solid var(--c-bordure);border-radius:var(--rayon);background:#fff;padding:0 var(--e-3);margin-top:var(--e-2)}
main .lot2-details summary{min-height:48px;display:flex;align-items:center;cursor:pointer;font-family:var(--f-menu);font-weight:600;color:var(--c-primaire)}
main .lot2-details details[open]{padding-bottom:var(--e-3)}
main .lot2-details ul{margin-top:var(--e-2)}

/* 11. FAQ : zone de clic de 48 px */
main details>summary{min-height:48px}

/* 12. Bandeau d'une ligne, liste à puces simple */
main .lot2-bandeau{max-width:var(--mesure);margin:var(--e-4) auto 0;padding:var(--e-3);border-radius:var(--rayon);background:var(--c-carte-vert);text-align:left!important}
main .lot2-liste{max-width:var(--mesure);margin:var(--e-4) auto 0}
main .lot2-liste li+li{margin-top:var(--e-2)}

/* 13. Site vitrine : illustration dans le haut de page, formulaire maquette en deux colonnes */
main .hero .lot2-illus{margin:0;min-width:0}
main .hero .lot2-illus .rx-avant-apres{margin:0;grid-template-columns:1fr 1fr;gap:var(--e-3)}
main .hero .lot2-illus .vx-site__image{display:none}
main .hero .hero__duo:has(.lot2-illus){align-items:start}
main .hero .lot2-illus figcaption{margin-top:var(--e-2);text-align:center!important}
main .lot2-maquette .rx-titre{margin-bottom:var(--e-2)}
main .lot2-maquette__rappel{max-width:var(--mesure);margin:0 auto var(--e-2);padding:.5rem .9rem;border-radius:var(--rayon);background:var(--c-carte-vert);color:var(--c-primaire)}
main .lot2-maquette__intro,main .lot2-maquette__plus{max-width:var(--mesure);margin:var(--e-2) auto 0}
main .lot2-maquette .b22-form{margin-top:var(--e-3)}
@media (min-width:900px){
  main .lot2-maquette{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--e-3) var(--e-5);align-items:start}
  main .lot2-maquette .rx-titre{text-align:left}
  main .lot2-maquette__rappel,main .lot2-maquette__intro,main .lot2-maquette__plus{margin-inline:0}
  main .lot2-maquette .b22-form{margin:0;max-width:none}
  main .lot2-maquette .lot2-bandeau{grid-column:1/-1}
}
@media (max-width:899px){
  main .lot2-maquette__plus{display:none}
  main .lot2-maquette .b22-form .fbrevo[data-astro-cid-uiflwvrb]{padding:var(--e-3)}
}
@media (max-width:767px){
  /* Téléphone : l'avant / après réduit à l'essentiel (titre et constats), l'un sous l'autre */
  main .hero .lot2-illus .rx-avant-apres{grid-template-columns:1fr 1fr;gap:var(--e-2)}
  main .hero .lot2-illus .vx-nav__corps{padding:var(--e-2)}
  main .hero .lot2-illus :is(.vx-site__menu,.vx-site__texte,.vx-site__image,.vx-site__bouton,.vx-nav__barre){display:none}
  main .lot2-maquette__intro,main .lot2-maquette .fbrevo__aide:not([role=alert]){display:none}
  main .lot2-maquette .fbrevo__form[data-astro-cid-uiflwvrb]{gap:12px}
  /* Le bouton collant porte déjà la maquette : pas de bandeau final en plus sur téléphone */
  .bandeau-appel{display:none}
  main .parcours__etape,main .etapes>li{padding:var(--e-3)}
  .cadre__invite[data-astro-cid-exddsyit]{padding:var(--e-4) var(--e-3)}
}

/* 14. Inbound : déroulé en 6 étapes (3 + 3), formulaire court */
@media (width>900px){main #deroulement .lot2-etapes-3[data-astro-cid-lsmuecis] li[data-astro-cid-lsmuecis]{flex:0 0 calc((100% - 2 * var(--e-3)) / 3)}}
main .lot2-court h2{text-align:center}
main .lot2-form-court{max-width:680px;margin-top:var(--e-4)}
main .lot2-form-court .fbrevo__form[data-astro-cid-uiflwvrb]{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
main .lot2-court .lot2-centre{margin-top:var(--e-3)}
main .b22-bref .tarif__prix strong{font-family:var(--f-titre);font-size:1.125rem}
@media (width<=480px){main .b22-bref .tarif{grid-template-columns:6.5rem 1fr;gap:var(--e-2);padding:.45rem 0}}

/* 15. Téléphone : sections plus serrées */
@media (max-width:767px){
  main>section.section{padding-block:var(--e-5)}
  main .hero .hero__duo{gap:var(--e-4)}
}
