/* ================================================================== PAGE RÉFÉRENCEMENT — vocabulaire de composition « le carnet de suivi » Système graphique identique à l'accueil;en-tête `.phead` commun;toutes les autres structures sont inédites. Motifs:plaque réglementaire sur aubergine dans l'aside d'en-tête · consignes à double filet,titre à gauche centré sur le corps · bande des trois temps à filets verticaux · bande sombre du parler-franc · preuves en rangées capture + texte · FAQ en deux colonnes,tout visible. ================================================================== */:root{--accent-ink:#735B3A}.nav-links a[aria-current="page"]::after{transform:scaleX(1)}.nav-panel a[aria-current="page"]{background:var(--ivoire-2)}/* ---------- EN-TÊTE DE PAGE (gabarit commun aux pages intérieures) -------- */ .phead{padding-top:clamp(7.5rem,15vh,10.5rem);padding-bottom:0}/* Retouche Lucie 25/09 au soir:l'accroche remplace l'encart « Le cadre » à droite. Zones de grille:desktop = titre + actions à gauche,accroche centrée à droite;mobile = H1,accroche,bouton (ordre de lecture). */ .phead__in{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);grid-template-areas:"titre attaque" "acts attaque";gap:0 clamp(2rem,4vw,4.5rem);align-items:center;/* centres verticaux:règle Lucie */ padding-bottom:clamp(2.6rem,5vh,3.6rem);border-bottom:1px solid var(--line-strong)}.phead__titre{grid-area:titre}.phead__acts{grid-area:acts}@media(max-width:900px){.phead__in{grid-template-columns:1fr;grid-template-areas:"titre" "attaque" "acts";align-items:start}}.phead__t{font-size:clamp(2rem,3.9vw,3.4rem);line-height:1.08;margin-top:1.5rem}.phead__t .it{color:var(--accent-deep)}.phead__meta{margin-top:1.7rem;font-size:1.05rem;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-2)}.phead__cta{display:flex;gap:.9rem;flex-wrap:wrap;margin-top:1.9rem}/* ---------- L'ATTAQUE:l'accroche,montée à droite de l'en-tête ---------- */ .attaque{grid-area:attaque;max-width:44ch;margin-left:auto;font-family:var(--serif);font-size:clamp(1.3rem,2vw,1.65rem);line-height:1.55;color:var(--aubergine);border-left:1px solid var(--line-strong);padding-left:clamp(1.2rem,2.2vw,1.9rem)}@media(max-width:900px){.attaque{margin:1.9rem 0 .3rem;max-width:none}}.crumb{display:flex;align-items:center;gap:.6rem;margin-bottom:1.4rem;flex-wrap:wrap;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2)}.crumb a{transition:color .25s}.crumb a:hover{color:var(--accent-deep)}.crumb i{font-style:normal;color:var(--accent)}/* ---------- LES CONSIGNES:double filet,titre centré sur le corps ------- */ .csg{padding-block:clamp(3.4rem,7.5vh,5.6rem);border-top:3px double var(--line-strong)}.csg--tone{background:var(--ivoire-2)}.csg__in{display:grid;grid-template-columns:minmax(0,.62fr) minmax(0,1.38fr);gap:clamp(2rem,5vw,5rem);align-items:center;/* centres verticaux:règle Lucie */}@media(max-width:900px){.csg__in{grid-template-columns:1fr;gap:1.4rem}}.csg__no{font-size:.78rem;font-weight:600;letter-spacing:.18em;color:var(--accent-ink)}.csg__t{font-family:var(--serif);font-size:clamp(1.7rem,2.9vw,2.5rem);line-height:1.15;margin-top:.8rem;color:var(--aubergine)}.csg__t .it{color:var(--accent-deep)}.csg__corps p{color:var(--ink-2);font-size:1.06rem;line-height:1.7;max-width:64ch}.csg__corps p + p{margin-top:1rem}.csg__corps a,.franc__p a,.rep__a a{border-bottom:1px solid var(--accent);transition:color .25s}.csg__corps a:hover,.rep__a a:hover{color:var(--accent-deep)}/* ---------- LES TROIS TEMPS:filets verticaux,options en pied ----------- */ .tempo{background:var(--ivoire-2);padding-block:clamp(3.4rem,7.5vh,5.6rem);border-top:3px double var(--line-strong)}.tempo__no{font-size:.78rem;font-weight:600;letter-spacing:.18em;color:var(--accent-ink)}.tempo__t{font-family:var(--serif);font-size:clamp(1.7rem,2.9vw,2.5rem);line-height:1.15;margin-top:.8rem;color:var(--aubergine)}.tempo__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:2.6rem;border-block:1px solid var(--line-strong)}.tempo__c{padding:1.9rem clamp(1.2rem,2.4vw,2rem);border-left:1px solid var(--line-strong)}.tempo__c:first-child{border-left:0;padding-left:0}.tempo__c:last-child{padding-right:0}@media(max-width:900px){.tempo__grid{grid-template-columns:1fr}.tempo__c{border-left:0;border-top:1px solid var(--line-strong);padding-inline:0}.tempo__c:first-child{border-top:0}}.tempo__q{display:block;font-size:.72rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-ink)}.tempo__ct{font-family:var(--serif);font-size:1.4rem;color:var(--aubergine);margin:.55rem 0 .7rem;line-height:1.2}.tempo__p{color:var(--ink-2);font-size:1rem;line-height:1.65}.tempo__opt{margin-top:1.7rem;color:var(--ink-2);font-size:1rem}.tempo__optl{font-size:.72rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-ink);margin-right:.7rem}/* ---------- LE PARLER-FRANC:la bande sombre ----------------------------- */ .franc{background:var(--aubergine);padding-block:clamp(3.2rem,7vh,5rem)}.franc__t{font-family:var(--serif);color:var(--ivoire);font-size:clamp(1.9rem,3.4vw,2.9rem);line-height:1.12}.franc__t .dot{color:var(--accent)}.franc__p{color:rgba(237,231,221,.82);max-width:68ch;margin-top:1.2rem;font-size:1.08rem;line-height:1.7}.franc__p a{color:var(--accent)}.franc__p a:hover{color:var(--ivoire)}/* ---------- LES PREUVES:rangées capture + texte ------------------------- */ .preu{padding-block:clamp(3.4rem,7.5vh,5.6rem);border-top:3px double var(--line-strong)}.preu__rows{margin-top:1.4rem}.prow{display:grid;grid-template-columns:clamp(220px,28vw,340px) minmax(0,1fr);gap:clamp(1.6rem,4vw,3.2rem);align-items:center;/* centres verticaux:règle Lucie */ padding-block:2.1rem;border-top:1px solid var(--line-strong)}.preu__rows .prow:first-child{border-top:0}@media(max-width:720px){.prow{grid-template-columns:1fr;gap:1.1rem}}.prow__vue{display:block;border:1px solid var(--line-strong);background:var(--ivoire-2);padding:.55rem}.prow__vue img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top;transition:transform .5s}a.prow:hover .prow__vue img{transform:scale(1.02)}.prow__ou{font-size:.7rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--accent-ink)}.prow__nom{display:block;font-family:var(--serif);font-size:clamp(1.3rem,2vw,1.7rem);color:var(--aubergine);line-height:1.2;margin:.35rem 0 .55rem}.prow__txt{display:block;color:var(--ink-2);font-size:1.02rem;line-height:1.65;max-width:58ch}.prow__lien{display:inline-flex;align-items:center;gap:.45rem;margin-top:.75rem;font-size:.95rem;color:var(--accent-ink);transition:color .25s}a.prow:hover .prow__lien{color:var(--aubergine)}.preu__note{margin-top:1.6rem;color:var(--ink-2);font-size:1.02rem}/* ---------- LES RÉPONSES:la FAQ en deux colonnes,tout visible ---------- */ .rep{background:var(--ivoire-2);padding-block:clamp(3.4rem,7.5vh,5.6rem);border-top:3px double var(--line-strong)}.rep__grid{margin-top:1.6rem}.rep__row{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(1.4rem,4vw,3.5rem);align-items:center;/* centres verticaux:règle Lucie */ padding-block:1.7rem;border-top:1px solid var(--line-strong)}.rep__grid .rep__row:first-child{border-top:0}@media(max-width:720px){.rep__row{grid-template-columns:1fr;gap:.5rem}}.rep__q{font-family:var(--serif);font-size:clamp(1.2rem,1.9vw,1.5rem);color:var(--aubergine);line-height:1.3}.rep__a{color:var(--ink-2);font-size:1.02rem;line-height:1.65;max-width:60ch;margin:0}