/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║  pages-v2-20261105.css · les 14 pages au niveau de l'accueil · 04/11/2026 ║
   ╚══════════════════════════════════════════════════════════════════════════╝
   Source : pages-niveau-accueil-2026-11-04/SPEC-PAGES.md (/creative-director). Construit par /builder.
   Chargée EN DERNIER, après gabarit-20261104.css, sur les 14 pages (jamais sur l'accueil, qui garde sa feuille).
   Tout est confiné à main.pv2 : l'en-tête et le pied de page (déjà ceux de l'accueil) ne bougent pas.
   Jetons repris de #contenu.v2 de l'accueil ; échelle des titres SPEC §1.2 (pages = lecture, accueil = vitrine). */

/* 1. JETONS (SPEC §1.1). Les jetons --gab-* du gabarit sont redéfinis dans main.pv2 pour que ses composants suivent. */
main.pv2{
  --p-max:1200px; --p-g:20px; --p-ecart:48px; --p-texte:600px;
  --p-y-h1:40px; --p-y-h2:48px; --p-y-m:56px; --p-y-l:48px; --p-y-a:40px; --p-ligne:24px;
  --p-h1:32px; --p-h2:26px; --p-h2-c:26px; --p-h2-a:26px; --p-h3:19px; --p-chapeau:19px;
  --p-filet:rgb(0 48 53 / .24);
  --gab-g:var(--p-g); --gab-max:var(--p-max);
  --gab-t-h1:var(--p-h1); --gab-lh-h1:35px;
  --gab-t-h2:var(--p-h2); --gab-lh-h2:30px;
  --gab-t-h3:var(--p-h3); --gab-lh-h3:25px;
  --gab-t-chapeau:var(--p-chapeau); --gab-lh-chapeau:28px;
  --gab-t-texte:17px; --gab-lh-texte:26px;
  --gab-section:var(--p-ligne); --gab-lecture:100%; --gab-chapeau:560px; --gab-corps:100%;
  --gab-filet-section:var(--p-filet);
  --gab-bande:var(--p-y-l);
  font-size:17px; line-height:1.5;
}
@media (min-width:768px){main.pv2{--p-g:40px;--p-y-h1:48px;--p-y-h2:64px;--p-y-m:72px;--p-y-l:64px;--p-y-a:48px;--p-ligne:28px;
  --p-h1:40px;--p-h2:28px;--p-h2-c:28px;--p-h2-a:30px;--p-h3:20px;--p-chapeau:20px;
  --gab-lh-h1:43px;--gab-lh-h2:32px;--gab-lh-h3:26px;--gab-lh-chapeau:29px;--gab-t-texte:18px;--gab-lh-texte:27px;font-size:18px}}
@media (min-width:1100px){main.pv2{--p-y-h1:56px;--p-y-h2:72px;--p-y-m:88px;--p-y-l:72px;--p-y-a:56px;
  --p-h1:46px;--p-h2:32px;--p-h2-c:30px;--p-h2-a:32px;--p-h3:21px;--p-chapeau:21px;
  --gab-lh-h1:50px;--gab-lh-h2:37px;--gab-lh-h3:28px;--gab-lh-chapeau:30px}}
@media (min-width:1200px){main.pv2{--p-ecart:72px}}
@media (min-width:1180px){main.pv2{--gab-enonce:470px;--gab-ecart:72px;--gab-corps:640px}}

/* 2. CONTENEUR ET BANDES (SPEC §1.1, §1.3) : 1 200 px centrés, x 120 → 1 320 à 1440. */
main.pv2 .gab-conteneur{inline-size:min(var(--p-max),100% - 2 * var(--p-g));margin-inline:auto}
main.pv2 .gab-bande{padding-block:var(--p-y-l)}
main.pv2 .gab-bande.pv2-heros-bande{padding-block:var(--p-y-h1) var(--p-y-h2)}
main.pv2 .gab-bande.pv2-bande-m{padding-block:var(--p-y-m)}

/* 3. TITRES (SPEC §1.2) : Manrope 600, interligne 1,15 (H1 1,08), −0,03 em (H1 −0,035) */
main.pv2 :is(h1,h2,h3){font-weight:600;text-wrap:balance}
main.pv2 h1{font-size:var(--p-h1);line-height:1.08;letter-spacing:-.035em;max-inline-size:var(--p-texte)}
main.pv2 h2{font-size:var(--p-h2);line-height:1.15;letter-spacing:-.03em}
main.pv2 h3{font-size:var(--p-h3);line-height:1.3;letter-spacing:-.01em}

/* 4. HÉROS H (SPEC §1.4) : texte 600 à gauche, illustration 400 à droite ; mobile : illustration 240 sous le bloc d'action */
main.pv2 .pv2-heros{display:grid;grid-template-columns:minmax(0,1fr);row-gap:32px}
main.pv2 .gab-ouverture{padding:0;max-inline-size:var(--p-texte)}
main.pv2 .gab-ouverture > .gab-ariane + h1{margin-block-start:16px}
main.pv2 .gab-ouverture > h1 + .gab-chapeau{margin-block-start:16px}
main.pv2 .gab-chapeau{max-inline-size:560px;font-size:var(--p-chapeau);line-height:1.45;font-weight:500}
main.pv2 .gab-ouverture > .gab-chapeau + .gab-chapeau{margin-block-start:16px}
main.pv2 .gab-ouverture > :is(.gab-chapeau,h1,p) + p:not(.gab-date,.gab-chapeau){margin-block-start:16px}
main.pv2 .gab-ouverture > .encart-parcours{margin-block:24px 0}
main.pv2 .gab-ouverture > :is(.encart-parcours,.gab-chapeau,h1,p) + .gab-date{margin-block-start:20px}
main.pv2 .gab-date{font-size:14px;line-height:20px}
main.pv2 .gab-ariane ol{font-size:14px;line-height:20px}
main.pv2 .encart-parcours{gap:12px}
main.pv2 .encart-parcours :is(.encart-parcours__phrase,.encart-parcours__lien){max-inline-size:470px;font-size:16px;line-height:1.5;font-weight:400}
main.pv2 .pv2-fig{margin:0;position:relative}
main.pv2 .pv2-fig::before{content:"";position:absolute;inset:6%;border-radius:50%;background:var(--pale)}
main.pv2 .gab-bande--pale .pv2-fig::before{background:#ffffffa6}
main.pv2 .pv2-fig img{position:relative;display:block;inline-size:100%;block-size:auto;aspect-ratio:1}
main.pv2 .pv2-fig--heros{justify-self:center;inline-size:240px}
main.pv2 .pv2-portrait{margin:0;inline-size:240px}
main.pv2 .pv2-portrait img{display:block;inline-size:100%;block-size:auto;aspect-ratio:4/5;object-fit:cover;object-position:50% 30%;border-radius:20px}
@media (min-width:900px){
  main.pv2 .pv2-heros--fig{grid-template-columns:minmax(0,var(--p-texte)) 320px;justify-content:space-between;align-items:center;column-gap:var(--p-ecart)}
  main.pv2 .pv2-fig--heros{inline-size:320px;justify-self:end}
  main.pv2 .pv2-heros--portrait{grid-template-columns:minmax(0,var(--p-texte)) 320px;justify-content:space-between;align-items:center;column-gap:var(--p-ecart)}
  main.pv2 .pv2-portrait{inline-size:320px;justify-self:end}
}
@media (min-width:1100px){
  main.pv2 .pv2-heros--fig{grid-template-columns:minmax(0,var(--p-texte)) 400px}
  main.pv2 .pv2-fig--heros{inline-size:400px}
}
/* Faits clés : rangée à filets pleine largeur sous le héros, sans icône (SPEC §1.4, D-5) */
main.pv2 .pv2-faits{margin-block-start:40px}
main.pv2 .pv2-faits .vaso-avantages{margin:0}
main.pv2 .pv2-faits .vaso-avantages__grid{display:grid;grid-template-columns:minmax(0,1fr);gap:0;border-block:1px solid var(--p-filet)}
main.pv2 .pv2-faits .vaso-avantages__item{padding:16px 0;border-block-start:1px solid var(--p-filet)}
main.pv2 .pv2-faits .vaso-avantages__item:first-child{border-block-start:0}
main.pv2 .pv2-faits .vaso-avantages__valeur{font-size:var(--p-h3);line-height:1.3;margin-block-start:6px}
@media (min-width:560px){
  main.pv2 .pv2-faits .vaso-avantages__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  main.pv2 .pv2-faits .vaso-avantages__item{padding:20px 24px;border-block-start:0}
  main.pv2 .pv2-faits .vaso-avantages__item:nth-child(odd){padding-inline-start:0}
  main.pv2 .pv2-faits .vaso-avantages__item:nth-child(even){border-inline-start:1px solid var(--p-filet)}
  main.pv2 .pv2-faits .vaso-avantages__item:nth-child(n+3){border-block-start:1px solid var(--p-filet)}
}
@media (min-width:1100px){
  main.pv2 .pv2-faits .vaso-avantages__grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  main.pv2 .pv2-faits .vaso-avantages__item{border-inline-start:1px solid var(--p-filet);border-block-start:0!important;padding:20px 24px}
  main.pv2 .pv2-faits .vaso-avantages__item:first-child{border-inline-start:0;padding-inline-start:0}
  main.pv2 .pv2-faits .vaso-avantages__item:nth-child(odd):not(:first-child){padding-inline-start:24px}
}
/* Sommaire gardé (Confidentialité) : sans numéros, une seule colonne de libellé */
main.pv2 .gab-navigation{padding-block:32px 0}
main.pv2 .gab-sommaire a{grid-template-columns:minmax(0,1fr)}

/* 5. LISTES À FILETS L (SPEC §1.3, §1.6) : énoncé 470 (rail A x 120), texte 640 (rail B x 662), filet 1 px à 24 % */
main.pv2 .gab-section{padding-block:var(--p-ligne)}
main.pv2 .gab-section + .gab-section{background:none;border-block-start:1px solid var(--p-filet)}
main.pv2 .gab-section__corps{max-inline-size:640px}
main.pv2 .gab-section__corps li,main.pv2 #domaines li{text-wrap:wrap}   /* CD C-1 : pretty coupait les puces de 2 lignes au milieu */
main.pv2 .gab-section__enonce + .gab-section__corps{margin-block-start:16px}
@media (min-width:1180px){
  main.pv2 .gab-section{grid-template-columns:[enonce] 470px [corps] minmax(0,640px) [reste] minmax(0,1fr) [fin];column-gap:72px}
  main.pv2 .gab-section__enonce + .gab-section__corps{margin-block-start:0}
}
main.pv2 .gab-section__enonce h2{font-size:var(--p-h2)}
main.pv2 .gab-section__enonce h3{font-size:var(--p-h3)}
/* Chapitres (Comprendre) : titre de partie H2 en tête, puis les lignes */
main.pv2 .gab-chapitre__entete{padding-block-end:var(--p-ligne)}
main.pv2 .gab-chapitre__entete h2{font-size:var(--p-h2)}
main.pv2 .gab-chapitre__entete + .gab-chapitre__sections > .gab-section:first-child{padding-block-start:0}
main.pv2 .pv2-schema .gab-section__illustration{margin:0;inline-size:100%;max-inline-size:280px}
main.pv2 .pv2-schema .pv2-schema--portrait{max-inline-size:280px}
main.pv2 .pv2-schema .gab-section__illustration :is(picture,img){display:block;inline-size:100%;block-size:auto}
@media (min-width:1180px){main.pv2 .pv2-schema .gab-section__illustration{max-inline-size:400px;grid-column:auto;grid-row:auto}
  main.pv2 .pv2-schema .pv2-schema--portrait{max-inline-size:320px}}
main.pv2 .pv2-schema + .gab-section__corps{margin-block-start:24px}
@media (min-width:1180px){main.pv2 .pv2-schema + .gab-section__corps{margin-block-start:0;align-self:center}}
main.pv2 .gab-filet{border-block-start-color:var(--p-filet);margin-block:var(--p-y-a)}
main.pv2 hr.pv2-ligne{margin:var(--p-ligne) 0;border:0;border-block-start:1px solid var(--p-filet)}
main.pv2 hr.pv2-ligne + .gab-chapitre{margin:0;padding-block-start:var(--p-ligne)}
main.pv2 .gab-chapitre + .gab-chapitre{margin-block-start:0}

/* 6. SECTION M (SPEC §1.3) : dessin d'un côté, texte 600 de l'autre ; mobile : dessin 220 au-dessus du titre */
main.pv2 .pv2-m{display:grid;grid-template-columns:minmax(0,1fr);row-gap:24px}
main.pv2 .pv2-m > .pv2-fig{inline-size:220px}
main.pv2 .pv2-m__texte > :is(.gab-section,.gab-chapitre){display:block;padding:0;border:0;background:none}
main.pv2 .pv2-m__texte > * + *{margin-block-start:32px}
main.pv2 .pv2-m__texte :is(.gab-section__enonce,.gab-chapitre__entete) h2{font-size:var(--p-h2-c)}
main.pv2 .pv2-m__texte .gab-chapitre__entete{padding:0 0 16px}
main.pv2 .pv2-m__texte .gab-chapitre__sections > .gab-section{display:block;padding:0}
main.pv2 .pv2-m__texte .gab-section__corps{max-inline-size:var(--p-texte)}
main.pv2 .pv2-m__texte .gab-section__enonce + .gab-section__corps{margin-block-start:16px}
@media (min-width:1100px){
  main.pv2 .pv2-m{grid-template-columns:var(--pv2-m-fig,320px) minmax(0,1fr);column-gap:48px;align-items:center}
  main.pv2 .pv2-m--280{--pv2-m-fig:280px}
  main.pv2 .pv2-m > .pv2-fig{inline-size:100%}
  main.pv2 .pv2-m--droite{grid-template-columns:minmax(0,1fr) var(--pv2-m-fig,320px)}
  main.pv2 .pv2-m--droite > .pv2-fig{order:2}
  main.pv2 .pv2-m__texte .gab-section__enonce + .gab-section__corps{margin-block-start:20px}
}
@media (min-width:1200px){
  main.pv2 .pv2-m--400{--pv2-m-fig:400px}
  main.pv2 .pv2-m{grid-template-columns:var(--pv2-m-fig) minmax(0,var(--p-texte));justify-content:space-between;column-gap:72px}
  main.pv2 .pv2-m--droite{grid-template-columns:minmax(0,var(--p-texte)) var(--pv2-m-fig)}
}

/* 7. BANDE DE RÉSERVATION R (SPEC §1.5) : composant .v-b de l'accueil, sans son bouton */
main.pv2 .pv2-resa{padding-block:var(--p-y-m);color:var(--blanc,#fff)}
main.pv2 .v2-resa .v-intro{display:flex;align-items:center;margin-bottom:28px}
main.pv2 .v2-resa .v-intro h2{max-width:none;margin:0!important;font-size:var(--p-h2-a);color:var(--ciel,#98d7df);font-weight:600;letter-spacing:-.03em;line-height:1.15}
main.pv2 .v2-resa .v-window{color:var(--encre);border:0;border-radius:12px;box-shadow:none}
main.pv2 .v2-resa .v-choices a{color:var(--encre);text-decoration:none}
main.pv2 .v2-resa .v-question{padding:36px 40px}
main.pv2 .v2-resa .v-question h3{font-size:26px;line-height:1.2;letter-spacing:-.025em;margin:0 0 16px}
main.pv2 .v2-resa__parler{margin:24px 0 0;color:var(--blanc,#fff)}
main.pv2 .v2-resa__parler a,main.pv2 .pv2-resa__lien a{color:var(--ciel,#98d7df);font-weight:700;text-decoration:underline;text-underline-offset:4px}
main.pv2 .v2-resa__parler a{white-space:nowrap}
main.pv2 .pv2-resa__lien{margin:8px 0 0}
@media (min-width:900px){main.pv2 .v2-resa .v-window{grid-template-columns:360px minmax(0,1fr)}}
@media (max-width:767px){
  main.pv2 .v2-resa .v-intro{display:block;margin-bottom:24px}
  main.pv2 .v2-resa .v-question{padding:24px 20px}
  main.pv2 .v2-resa .v-question h3{font-size:22px}
  main.pv2 .v2-resa__parler a,main.pv2 .pv2-resa__lien a{display:inline-flex;align-items:center;min-block-size:44px;vertical-align:middle}
  main.pv2 .v2-resa .v-choices a{min-height:52px}
}

/* 8. PAGE DU MÉDECIN : lieux en 3 colonnes (comme le pied de page), motifs en 2 colonnes, bouton contour encre */
main.pv2 .pv2-lieux{display:block;padding:0}
main.pv2 .pv2-lieux .gab-section__corps{max-inline-size:none;margin-block-start:16px}
main.pv2 .pv2-lieux .gab-section__corps > p{max-inline-size:640px}
main.pv2 .pv2-lieux .lieux{display:grid;grid-template-columns:minmax(0,1fr);margin-block-start:24px;border-block-start:1px solid var(--p-filet)}
main.pv2 .pv2-lieux .lieu, main.pv2 .pv2-lieux .lieu + .lieu{padding:20px 0;border:0}
main.pv2 .pv2-lieux .lieu + .lieu{border-block-start:1px solid var(--p-filet)}
@media (min-width:1100px){
  main.pv2 .pv2-lieux .lieux{grid-template-columns:repeat(3,minmax(0,1fr))}
  main.pv2 .pv2-lieux .lieu, main.pv2 .pv2-lieux .lieu + .lieu{padding:24px 24px 0;border:0}
  main.pv2 .pv2-lieux .lieu + .lieu{border-inline-start:1px solid var(--p-filet)}
  main.pv2 .pv2-lieux .lieu:first-child{padding-inline-start:0}
}
@media (min-width:768px){
  main.pv2 #domaines ul{columns:2;column-gap:40px}
  main.pv2 #domaines li{break-inside:avoid}
}
main.pv2 #domaines .profil-rendez-vous{margin-block-start:20px}
main.pv2 .other-consultations__action{display:inline-flex;align-items:center;justify-content:center;min-block-size:44px;padding:10px 18px;border:1px solid var(--encre);border-radius:var(--rayon-cta,5px);color:var(--encre);background:transparent;font-size:15px;font-weight:600;text-decoration:none;text-align:center}
main.pv2 .other-consultations__action:hover{background:var(--encre);color:var(--blanc,#fff)}

/* 9. /questions/ : groupes en liste à filets (titre à gauche, guides à droite), plus de cartes */
main.pv2 .gab-groupe{padding-block:var(--p-ligne)}
main.pv2 .gab-groupe:first-child{padding-block-start:0}
main.pv2 .gab-groupe:last-child{padding-block-end:0}
main.pv2 .gab-groupe + .gab-groupe{margin:0;border-block-start:1px solid var(--p-filet)}
main.pv2 .gab-groupe > h2{margin:0 0 16px}
main.pv2 .guides-index{grid-template-columns:minmax(0,1fr)!important}
main.pv2 .guides-index__item{border:0}
main.pv2 .guides-index__item + .guides-index__item{border-block-start:1px solid var(--p-filet)}
main.pv2 .guides-index__item a{padding:16px 0}
main.pv2 .guides-index__item:first-child a{padding-block-start:0}
main.pv2 .guides-index__item h3{font-size:19px;line-height:1.3;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;margin:0 0 6px}
main.pv2 .guides-index__item a:hover h3{text-decoration-thickness:2px}
main.pv2 .guides-index__item p{font-size:16px;line-height:1.5;margin:0}
main.pv2 .guides-index__lire{display:none}
@media (min-width:1180px){
  main.pv2 .gab-groupe{display:grid;grid-template-columns:470px minmax(0,640px);column-gap:72px;align-items:start}
  main.pv2 .gab-groupe > h2{margin:0}
}

/* 10. BANDE DE FIN A (SPEC §1.7) : une ligne, titre 32 à gauche (max 640), bouton à droite */
main.pv2 .fermeture-commune{min-block-size:0;padding-block:var(--p-y-a);background:var(--pale);margin:0}
main.pv2 .fermeture-commune .prochaine-etape__ligne{inline-size:min(var(--p-max),100% - 2 * var(--p-g));max-inline-size:none;margin-inline:auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 40px}
main.pv2 .fermeture-commune #prochaine-etape-titre{max-inline-size:640px;margin:0;font-size:var(--p-h2-a);line-height:1.15;letter-spacing:-.03em}
main.pv2 .fermeture-commune .encart-parcours{margin:0;flex:0 1 auto}
main.pv2 .gab-bande--pale + .fermeture-commune{padding-block-start:0}
main.pv2 .gab-bande--pale + .fermeture-commune::before{inline-size:min(var(--p-max),100% - 2 * var(--p-g));margin:0 auto var(--p-y-a);border-block-start-color:var(--p-filet)}
@media (max-width:767.98px){
  main.pv2 .fermeture-commune .prochaine-etape__ligne{flex-direction:column;align-items:stretch;gap:20px}
  main.pv2 .fermeture-commune .encart-parcours{align-items:stretch}
}

/* 11. Pages légales : lien de retour en fin de liste */
main.pv2 .gab-conteneur > .gab-retour{padding-block-start:var(--p-ligne);border-block-start:1px solid var(--p-filet)}

/* 12. CORRECTIFS APRÈS RELECTURES DU 04/11 (CD-RENDU-PAGES.md, VISUAL-QC-PAGES.md) */
/* Mot seul en fin de paragraphe : pretty sur les paragraphes, balance sur les phrases courtes (2-3 lignes) */
main.pv2 p{text-wrap:pretty}
main.pv2 :is(.encart-parcours__phrase,.encart-parcours__lien,.guides-index__item p,.gab-date){text-wrap:balance}
@media (max-width:1179.98px){main.pv2 .gab-ouverture .gab-chapeau:not(.gab-chapeau--long){text-wrap:balance}}
/* CD CH-1 : chapeau long (> 280 signes) */
main.pv2 .gab-chapeau.gab-chapeau--long{font-size:18px;line-height:1.5;font-weight:400;max-inline-size:600px}
/* CD C-2 : bande de fin « Appeler » : bloc et bouton calés à droite */
@media (min-width:768px){main.pv2 .fermeture-commune .encart-parcours{align-items:flex-end;text-align:end}}
/* CD C-3 : filets internes jusqu'au rail de droite (x 1 320) */
@media (min-width:1180px){main.pv2 .gab-groupe{grid-template-columns:470px minmax(0,1fr)}}
/* CD CO-1 : « Les premiers jours » et « Le contrôle à trois mois » : titre et texte sur la même ligne */
@media (min-width:1180px){
  main.pv2 :is(#apres,#spermogramme).gab-chapitre{display:grid;grid-template-columns:470px minmax(0,640px);column-gap:72px;align-items:start}
  main.pv2 :is(#apres,#spermogramme) .gab-chapitre__entete{padding:0}
  main.pv2 :is(#apres,#spermogramme) .gab-chapitre__sections > .gab-section{display:block;padding:0}
}
/* CD DR-1 : nom du médecin sur une ligne dès 900 px */
@media (min-width:900px){main.pv2 .pv2-heros--portrait h1 br{display:none}}
/* QC : portrait du Dr à 768 : deux colonnes (texte + portrait 240) au lieu d'un portrait seul */
@media (min-width:768px) and (max-width:899.98px){
  main.pv2 .pv2-heros--portrait{grid-template-columns:minmax(0,1fr) 240px;column-gap:40px;align-items:start}
  main.pv2 .pv2-portrait{justify-self:end}
}
/* CD DR-2 : ligne « Publications » : filet jusqu'au rail de droite, « + » aligné sur le titre */
main.pv2 #publications .gab-section__corps{max-inline-size:none}
@media (min-width:1180px){main.pv2 #publications .gab-section__corps{grid-column:corps / fin}}
main.pv2 #publications .publications summary{align-items:start}
main.pv2 #publications .publications summary::after{align-self:start;line-height:var(--gab-lh-texte)}
/* CD PC-1 : Première consultation : la phrase sous le bouton répète le chapeau */
main.pv2--premiere-consultation .pv2-heros .encart-parcours__phrase{display:none}
/* CD Hormones / Cancer : bas du héros 72 → 56 à 1 440 */
@media (min-width:1100px){main.pv2:is(.pv2--hormones-et-ejaculation,.pv2--cancer-de-la-prostate) .pv2-heros-bande{padding-block-end:56px}}
/* CD QA-1 option B : Questions avant de décider : dessin limité à 240 px */
main.pv2--questions-avant-de-decider .pv2-fig--heros{inline-size:240px}
@media (min-width:900px){main.pv2--questions-avant-de-decider .pv2-heros--fig{grid-template-columns:minmax(0,var(--p-texte)) 240px}}
/* CD AV-1 : Avant 30 ans : la bande de fin répète le héros (même bouton, même phrase, même lien) */
main.pv2--avant-30-ans-sans-enfant .fermeture-commune{display:none}
/* QC : sous-navigation de Comprendre coupée à droite sous 1 180 px : fondu à droite tant qu'il reste des chapitres à
   faire défiler (il disparaît en fin de défilement). Hors <main> : la barre n'existe que sur Comprendre. */
@property --pv2-fondu{syntax:'<length>';inherits:false;initial-value:56px}
@keyframes pv2-fondu{to{--pv2-fondu:0px}}
@media (max-width:1179.98px){
  .sous-entete__liens{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - var(--pv2-fondu)),transparent);mask-image:linear-gradient(to right,#000 calc(100% - var(--pv2-fondu)),transparent);
    animation:pv2-fondu linear both;animation-timeline:scroll(self inline)}
}

/* « En bref » sur téléphone (< 768 px) : choix de Gary du 05/11/2026 (planche _Deliverables/apercu-pages-2026-11-04/en-bref-mobile.html).
   Ordinateur et tablette ≥ 768 px inchangés. Textes inchangés. Source : _Admin/plans/en-bref-mobile-2026-11-05/.
   Déroulement = option C (encart clair, valeur au-dessus du libellé ; l'ordre du code reste libellé puis valeur pour les lecteurs d'écran). */
@media (max-width:767px){
  main.pv2--deroulement-de-l-operation .pv2-faits .vaso-avantages__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:0;border:0;background:#ffffffa6;border-radius:12px;padding:2px 14px}
  main.pv2--deroulement-de-l-operation .pv2-faits .vaso-avantages__item{display:flex;flex-direction:column-reverse;justify-content:flex-end;padding:14px 0 14px 12px;border-block-start:0;border-inline-start:0}
  main.pv2--deroulement-de-l-operation .pv2-faits .vaso-avantages__item:nth-child(odd){padding-inline:0 12px}
  main.pv2--deroulement-de-l-operation .pv2-faits .vaso-avantages__item:nth-child(even){border-inline-start:1px solid var(--p-filet)}
  main.pv2--deroulement-de-l-operation .pv2-faits .vaso-avantages__item:nth-child(n+3){border-block-start:1px solid var(--p-filet)}
  main.pv2--deroulement-de-l-operation .pv2-faits .vaso-avantages__valeur{font-size:18px;line-height:23px;margin:0}
  main.pv2--deroulement-de-l-operation .pv2-faits .vaso-avantages__precision{display:inline;font-size:16px;line-height:23px}
  main.pv2--deroulement-de-l-operation .pv2-faits .vaso-avantages__libelle{font-size:15px;line-height:21px;font-weight:400;margin-block-start:4px}
}
@media (max-width:359px){
  main.pv2--deroulement-de-l-operation .pv2-faits .vaso-avantages__valeur{font-size:16px;line-height:21px}
  main.pv2--deroulement-de-l-operation .pv2-faits .vaso-avantages__grid{padding-inline:12px}
}
/* Après l'intervention = option A (grille 2×2, filets en croix, libellé au-dessus de la valeur). Gary : « on comprend moins bien le C pour après l'intervention ». */
@media (max-width:767px){
  main.pv2--apres-l-intervention .pv2-faits .vaso-avantages__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  main.pv2--apres-l-intervention .pv2-faits .vaso-avantages__item{padding:14px 0 16px 16px;border-block-start:0;border-inline-start:0}
  main.pv2--apres-l-intervention .pv2-faits .vaso-avantages__item:nth-child(odd){padding-inline:0 16px}
  main.pv2--apres-l-intervention .pv2-faits .vaso-avantages__item:nth-child(even){border-inline-start:1px solid var(--p-filet)}
  main.pv2--apres-l-intervention .pv2-faits .vaso-avantages__item:nth-child(n+3){border-block-start:1px solid var(--p-filet)}
  main.pv2--apres-l-intervention .pv2-faits .vaso-avantages__valeur{font-size:18px;line-height:24px;margin-block-start:4px}
  main.pv2--apres-l-intervention .pv2-faits .vaso-avantages__precision{font-size:15px;line-height:21px}
}

/* Dessins plus grands sur ordinateur (≥ 1 200 px) : demande de Gary du 05/11/2026 (« trop d'espace entre le texte et
   l'illustration », « il ne faut pas que la section soit plus grande »). Le dessin grandit dans le vide, la marge négative
   rend exactement le surplus pour que la bande garde sa hauteur. Plafond 480 px : les fichiers font 960 px, donc nets en x2.
   Téléphone et tablette inchangés. Questions avant de décider garde son dessin de 240 px (choix CD QA-1). */
@media (min-width:1200px){
  /* Héros texte + dessin : 400 → 480 px */
  main.pv2:not(.pv2--questions-avant-de-decider) .pv2-heros--fig{grid-template-columns:minmax(0,var(--p-texte)) 480px}
  main.pv2:not(.pv2--questions-avant-de-decider) .pv2-fig--heros{inline-size:480px;margin-block:-40px}
  /* Section M : 400 → 480 px et 280 → 400 px */
  main.pv2 .pv2-m--400{--pv2-m-fig:480px}
  main.pv2 .pv2-m--400 > .pv2-fig{margin-block:-40px}
  main.pv2 .pv2-m--280{--pv2-m-fig:400px}
  main.pv2 .pv2-m--280 > .pv2-fig{margin-block:-60px}
  /* Schéma « Qu'est-ce qu'une vasectomie ? » : centré dans sa colonne et un peu plus grand (320 → 340 px, +30 px de haut) */
  main.pv2 .pv2-schema .pv2-schema--portrait{max-inline-size:340px;margin-inline:auto}
}