/* Mise en page : colonne d'étiquettes + colonne de texte, filets francs, comme les rapports Hestia. */
:root{
  --encre:#121417; --graphite:#3A3F45; --gris:#6B7076; --filet:#D9D8D4; --perle:#EDEDEB; --blanc:#FFFFFF;
  --etroit:"Arial Narrow","Hestia Narrow","Liberation Sans Narrow","Helvetica Neue",Arial,sans-serif;
  --serif:Georgia,"Hestia Serif",Gelasio,"Times New Roman",serif;
  --mesure:62ch;
  color-scheme:light;
}
@font-face{font-family:"Hestia Narrow";font-weight:400;font-display:swap;src:url(/fonts/narrow-400.woff2) format("woff2")}
@font-face{font-family:"Hestia Narrow";font-weight:700;font-display:swap;src:url(/fonts/narrow-700.woff2) format("woff2")}
@font-face{font-family:"Hestia Serif";font-weight:400;font-display:swap;src:url(/fonts/gelasio-400.woff2) format("woff2")}
@font-face{font-family:"Hestia Serif";font-weight:400;font-style:italic;font-display:swap;src:url(/fonts/gelasio-400i.woff2) format("woff2")}
@font-face{font-family:"Hestia Serif";font-weight:700;font-display:swap;src:url(/fonts/gelasio-700.woff2) format("woff2")}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--blanc);color:var(--encre);font-family:var(--serif);font-size:1.0625rem;line-height:1.6}
a{color:inherit}
a:focus-visible,button:focus-visible{outline:2px solid var(--encre);outline-offset:3px}
.cadre{max-width:72rem;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.etq{font-family:var(--etroit);font-weight:700;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gris)}
.arche{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:9;stroke-linecap:square;flex:none}

/* En-tête */
.entete{border-bottom:1px solid var(--encre)}
.entete .cadre{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 32px;padding-block:18px}
.marque{display:flex;align-items:center;gap:12px;text-decoration:none}
.marque b{font-family:var(--etroit);font-weight:700;letter-spacing:.32em;font-size:1rem}
.marque span{font-family:var(--etroit);letter-spacing:.14em;font-size:.78rem;text-transform:uppercase;color:var(--graphite)}
nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 22px}
nav a{font-family:var(--etroit);font-size:.86rem;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;display:inline-block;padding-block:10px}
nav a:hover{text-decoration:underline;text-underline-offset:4px}

/* Ouverture */
.ouverture .cadre{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:56px;padding-block:72px 80px;align-items:start}
.ouverture h1{font-family:var(--etroit);font-weight:700;font-size:clamp(2.3rem,5.2vw,3.9rem);line-height:1.02;letter-spacing:-.005em;margin:14px 0 22px;text-wrap:balance}
.chapeau{font-size:1.2rem;color:var(--graphite);max-width:34em;margin:0 0 30px}
.actions{display:flex;flex-wrap:wrap;gap:14px 22px;align-items:center}
.bouton{font-family:var(--etroit);font-weight:700;letter-spacing:.1em;text-transform:uppercase;font-size:.9rem;text-decoration:none;background:var(--encre);color:var(--blanc);padding:15px 22px;display:inline-block;border:1px solid var(--encre)}
.bouton:hover{background:var(--graphite)}
.bouton.clair{background:var(--blanc);color:var(--encre)}
.bouton.clair:hover{background:var(--perle)}
.lien-mail{font-size:1rem;color:var(--graphite);overflow-wrap:anywhere}

/* Extrait de rapport */
.rapport{border:1px solid var(--encre);background:var(--blanc);padding:22px 22px 18px;font-family:var(--etroit);font-variant-numeric:tabular-nums;min-width:0}
.rapport header{display:flex;justify-content:space-between;align-items:baseline;gap:12px;border-bottom:1px solid var(--encre);padding-bottom:10px;margin-bottom:6px}
.rapport header b{letter-spacing:.24em;font-size:.82rem}
.rapport table{width:100%;border-collapse:collapse;font-size:.95rem}
.rapport th{font-weight:400;text-align:left;color:var(--gris);font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;padding:12px 0 4px}
.rapport td{padding:6px 0;border-bottom:1px solid var(--filet);vertical-align:baseline}
.rapport td.n{text-align:right;white-space:nowrap;padding-left:10px}
.rapport td.c{color:var(--gris)}
.rapport .total td{border-bottom:0;border-top:1px solid var(--encre);font-weight:700;padding-top:9px}
.rapport footer{font-family:var(--serif);font-style:italic;font-size:.8rem;color:var(--gris);margin-top:12px}

/* Sections à étiquette */
.bloc{border-top:1px solid var(--encre)}
.bloc>.cadre{display:grid;grid-template-columns:13rem minmax(0,1fr);gap:32px;padding-block:56px 64px}
.bloc h2{font-family:var(--etroit);font-weight:700;font-size:clamp(1.7rem,3.2vw,2.3rem);line-height:1.08;margin:0 0 18px;text-wrap:balance;max-width:24em}
.bloc p{max-width:var(--mesure);margin:0 0 14px}
.lignes{display:grid;gap:0;margin-top:8px}
.ligne{display:grid;grid-template-columns:12rem minmax(0,1fr);gap:24px;padding-block:22px;border-top:1px solid var(--filet)}
.ligne:first-child{border-top:0;padding-top:4px}
.ligne h3{font-family:var(--etroit);font-weight:700;font-size:1.35rem;line-height:1.15;margin:0}
.ligne h3 small{display:block;font-weight:400;font-size:.82rem;letter-spacing:.06em;color:var(--gris);margin-top:6px;line-height:1.35}
.ligne p{margin:0 0 8px}
.ligne p.detail{font-size:.95rem;color:var(--graphite);margin:0}
.refs .ligne{grid-template-columns:minmax(0,1fr)}
.note{font-size:.95rem;color:var(--graphite);border-top:1px solid var(--filet);padding-top:16px;margin-top:8px}

/* Diagnostic (bande sombre) */
.sombre{background:var(--encre);color:var(--blanc);border-top:0}
.sombre .etq{color:#A9ADB2}
.sombre p{color:#E4E4E1}
.sombre .bouton{background:var(--blanc);color:var(--encre);border-color:var(--blanc)}
.sombre .bouton:hover{background:var(--perle)}
.sombre .lien-mail{color:#C9CBCE}

/* Étapes */
.etapes{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;counter-reset:e}
.etapes li{border-top:2px solid var(--encre);padding-top:14px;counter-increment:e}
.etapes li::before{content:counter(e);font-family:var(--etroit);font-weight:700;font-size:.85rem;color:var(--gris);display:block;margin-bottom:6px}
.etapes h3{font-family:var(--etroit);font-weight:700;font-size:1.15rem;margin:0 0 6px}
.etapes p{font-size:.98rem;color:var(--graphite);margin:0}

/* Engagements */
.engagements{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 40px;margin:0}
.engagements div{border-top:1px solid var(--filet);padding-block:16px}
.engagements dt{font-family:var(--etroit);font-weight:700;font-size:1.05rem;margin-bottom:4px}
.engagements dd{margin:0;color:var(--graphite);font-size:.98rem}

/* Contact */
.coord{display:grid;grid-template-columns:10rem minmax(0,1fr);margin:6px 0 24px;max-width:40rem}
.coord dt,.coord dd{border-top:1px solid var(--filet);padding-block:11px;margin:0}
.coord dt{font-family:var(--etroit);font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gris);padding-top:14px}
.coord dd{overflow-wrap:anywhere}

/* Pied */
.pied{border-top:1px solid var(--encre)}
.pied .cadre{display:flex;flex-wrap:wrap;gap:10px 28px;justify-content:space-between;align-items:center;padding-block:22px;font-family:var(--etroit);font-size:.85rem;letter-spacing:.06em;color:var(--gris)}
.pied ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 22px}
.pied a{text-decoration:none;display:inline-block;padding-block:8px}
.pied a:hover{text-decoration:underline}

/* Politique */
.texte h1{font-family:var(--etroit);font-weight:700;font-size:clamp(2rem,4vw,2.8rem);line-height:1.05;margin:8px 0 10px}
.texte h2{font-family:var(--etroit);font-weight:700;font-size:1.3rem;margin:34px 0 8px}
.texte p,.texte li{max-width:var(--mesure)}
.texte .cadre{padding-block:56px 72px}
.texte ul{padding-left:1.2em}

@media (max-width:900px){
  .ouverture .cadre{grid-template-columns:minmax(0,1fr);gap:40px;padding-block:48px 56px}
  .bloc>.cadre{grid-template-columns:minmax(0,1fr);gap:10px;padding-block:44px 48px}
  .etapes{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:600px){
  .ligne{grid-template-columns:minmax(0,1fr);gap:8px}
  .etapes,.engagements{grid-template-columns:minmax(0,1fr)}
  .coord{grid-template-columns:minmax(0,1fr)}
  .coord dd{border-top:0;padding-top:0}
  .marque span{display:none}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}