/* Page « Déroulement de la vasectomie », 20/10/2026.
   Gabarit = page Prix validée par Gary (archive prix-et-remboursement-2026-10-19, prix-b-20261009.css), mêmes valeurs,
   classes renommées prix- vers deroule-. Seul écart : la taille du chiffre d'ouverture (« Environ 15 minutes » est plus long que « 173 € »).
   Encart du questionnaire : composant v-* de prix-quiz-b-20261009.css (déjà en ligne), chargé avant cette feuille.
   Passe 2 (20/10/2026) : corrections 1 à 5 du directeur artistique (CD-VERDICT.md), sources retirées (Gary), encart après « La technique sans scalpel ». */
.deroule-page{color:var(--encre);padding-top:56px}
.deroule-page>article{width:min(1240px,calc(100% - 2 * var(--gouttiere)));margin:auto}
.deroule-heading h1{font-size:clamp(34px,4.4vw,64px);line-height:1.1;letter-spacing:-.045em;font-weight:600;margin:0 0 56px}
.deroule-ouverture{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;padding:0 0 64px;border-bottom:1px solid var(--encre)}
.deroule-page h2{font-size:28px;line-height:1.25;letter-spacing:-.025em;font-weight:500;margin:0 0 24px}
.deroule-chiffre{font-size:clamp(40px,3.7vw,56px);font-weight:600;line-height:1.05;letter-spacing:-.05em;margin:0;white-space:nowrap}
.deroule-perimetre>p:first-child{font-size:27px;line-height:1.35;max-width:none;text-wrap:balance;margin:0 0 24px}
.deroule-precision{font-size:17px;line-height:1.6;max-width:43ch}
.deroule-perimetre .guide__date{margin-top:24px}
.deroule-quiz{border-top:1px solid var(--encre);border-bottom:1px solid var(--encre);padding:52px 0;scroll-margin-top:125px}
.deroule-quiz .v-intro h2{font-size:36px;line-height:1.18;max-width:26ch}
.deroule-details{max-width:860px;margin:72px auto 80px}
.deroule-details--avant{margin-bottom:72px}
.deroule-details--avant section:last-child{border-bottom:0;padding-bottom:0}
.deroule-details section{position:relative;padding:36px 0;border-bottom:1px solid #00303544;scroll-margin-top:140px}
.deroule-details section:first-child{padding-top:0}
.deroule-details p{font-size:18px;line-height:1.65;margin:0 0 20px;text-wrap:pretty}
.deroule-details ul{font-size:18px;line-height:1.65;margin:0 0 20px;padding-left:24px;list-style:disc}
.deroule-details li{margin:0 0 8px;text-wrap:pretty}
.deroule-details .guide-internal-link{margin-top:0}
/* Numéro d’étape : grammaire du rail de /comprendre/ (taille et graisse « appui », chiffres tabulaires), décoratif. */
.deroule-etape{display:block;font-size:var(--t-appui);font-weight:var(--w-appui);font-variant-numeric:tabular-nums;line-height:1.2;margin:0 0 var(--e6)}
@media(min-width:1180px){.deroule-etape{position:absolute;left:-110px;top:calc(36px + .45rem);margin:0}.deroule-details section:first-child .deroule-etape{top:.45rem}}
.deroule-page a{color:inherit;text-underline-offset:4px}
.deroule-page a:focus-visible{outline:3px solid var(--encre);outline-offset:5px}
.deroule-page .fermeture-commune{margin:0}
.deroule-page .prochaine-etape__ligne{row-gap:24px}
@media(max-width:767px){
 .deroule-page{padding-top:36px}
 .deroule-heading h1{font-size:36px;margin-bottom:38px}
 .deroule-ouverture{grid-template-columns:1fr;gap:28px;padding-bottom:40px}
 .deroule-page h2{font-size:24px;margin-bottom:20px}
 .deroule-chiffre{font-size:min(40px,10.5vw)}
 .deroule-perimetre>p:first-child{font-size:23px;max-width:none;margin-bottom:16px}
 .deroule-quiz .v-intro h2{font-size:28px;max-width:22ch}
 .deroule-details--avant{margin-bottom:48px}
 .deroule-precision{font-size:17px}
 .deroule-perimetre .guide__date{margin-top:16px}
 .deroule-quiz{padding:32px 0}
 .deroule-details{margin:44px auto 48px}
 .deroule-details section{padding:28px 0}
 .deroule-details p,.deroule-details ul{font-size:17px}
 .deroule-page .fermeture-commune #prochaine-etape-titre{font-size:28px}
 /* Réserver le bord droit au bouton flottant du chat, comme sur la page Prix. */
 .deroule-page .v-intro .action{width:calc(100% - 64px);max-width:calc(100% - 64px)}
 .deroule-page .v-choices a{width:calc(100% - 44px)}
}