/* Rapport à l'écran du diagnostic (/diagnostic). Refonte des rapports du 2026-10-15 : la forme validée par Yannis le
   15/10 (design/refonte-2026-10/integration/design/rapports/, prototype outils/generer-ecran.js), transposée dans le
   composant React NewDiagnosticReportScreen de diagnostic.html. Six sections : l'essentiel, le plan, l'appel 1, la
   projection, « Pour aller plus loin » (replis natifs), l'appel 2, puis le pied.

   Comment cette feuille s'articule avec la page :
   - Elle est chargée par une balise du <head> de diagnostic.html, après dt.css, qui reste chargée pendant le rapport
     (seule diagnostic.css, la feuille du formulaire, est coupée) : les jetons --dt-*, --display, --text et --r-panel
     viennent de dt.css. Thème clair seulement : /diagnostic force le clair.
   - Le rapport vit sous <main class="r2-report rp"> ; ses règles sont posées sous `:root .rp` pour l'emporter sur la
     feuille de tête de la page (`.new-diagnostic-report h3`, `ol`) quel que soit l'ordre des feuilles. Les classes r2-*
     encore posées à côté des classes rp-* (r2-action, r2-kpi, r2-bouquet-total...) sont des crochets lus par les tests
     et le suivi : aucune règle ne les dessine plus.
   - La fenêtre de demande, la demande enregistrée et « Préparer l'échange » gardent leur base dans le bloc
     <style id="r2-report-styles"> de la page ; leur peau est ici (partie « Hors du rapport »).
   - Code couleur : pétrole pour la structure, framboise pour les seules données de gain, bleu-vert pour le repère du
     secteur. Registre « sobre » : ni ombre floue, ni dégradé. */

@font-face { font-family: "Bricolage Grotesque"; src: url("/fonts/bricolage-var.woff2") format("woff2"); font-weight: 200 800; font-display: swap; }
@font-face { font-family: "Onest"; src: url("/fonts/onest-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Onest"; src: url("/fonts/onest-latin-600-normal.woff2") format("woff2"); font-weight: 600; font-display: swap; }

/* ========== Jetons ========== */
:root {
  --dr-surface: var(--dt-surface, #E4EDF0);
  --dr-surface-alt: var(--dt-surface-alt, #D3E1E6);
  --dr-surface-alt-2: var(--dt-surface-alt-2, #BDD2D9);
  --dr-paper: var(--dt-paper, #FFFFFF);
  --dr-ink: var(--dt-ink, #0E3A47);
  --dr-ink-2: var(--dt-ink-2, #3B5B64);
  --dr-ink-3: var(--dt-ink-3, #4F666D);
  --dr-gain: var(--dt-you, #C2265D);
  --dr-accent: var(--dt-accent, #C2265D);
  --dr-repere: var(--dt-il-cadre, #1F6F82);
  --dr-encart: var(--dt-encart, #D3E1E6);
  --dr-band: var(--dt-band, #0E3A47);
  --dr-on-band: var(--dt-on-band, #FFFFFF);
  --dr-on-band-2: var(--dt-on-band-2, #C9DCE2);
  --dr-erreur: var(--dt-erreur, #B3261E);
  --dr-dedans: var(--dt-il-dedans, #0B2A33);
  --dr-teinte: color-mix(in srgb, var(--dr-repere) 6%, var(--dr-paper));
  --dr-encre-pale: color-mix(in srgb, var(--dr-ink) 9%, var(--dr-paper));
  --dr-gain-pale: color-mix(in srgb, var(--dr-gain) 9%, var(--dr-paper));
  --dr-erreur-pale: color-mix(in srgb, var(--dr-erreur) 8%, var(--dr-paper));
  --dr-display: "Bricolage Grotesque", "Onest", system-ui, sans-serif;
  --dr-text: "Onest", system-ui, -apple-system, "Segoe UI", sans-serif;
  --dr-r-control: 12px;
  --dr-r-panel: 22px;
  --dr-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --dr-feuille: clamp(24px, 3.6vw, 48px);
  /* Échelle énergie : réglementaire (dt.css) */
  --dr-dpe-a: var(--dt-dpe-a, #00A06D); --dr-dpe-b: var(--dt-dpe-b, #4FB948); --dr-dpe-c: var(--dt-dpe-c, #C9D200);
  --dr-dpe-d: var(--dt-dpe-d, #FFCB05); --dr-dpe-e: var(--dt-dpe-e, #F39200); --dr-dpe-f: var(--dt-dpe-f, #E84E0F);
  --dr-dpe-g: var(--dt-dpe-g, #C9220A); --dr-dpe-on: var(--dt-dpe-on, #0A1628); --dr-dpe-on-g: var(--dt-dpe-on-g, #FFFFFF);
}

/* Teintes propres au rapport (retours de Yannis, phase 4) : pastille de gain, texte #9C1747 sur #FBE9EF (6,85:1) ; jauge
   du secteur, trois aplats pâles (encre dessus de 9,46 à 10,71:1) et vert foncé #1B6B3A (6,54:1 sur blanc). */
:root { --rp-gain-pale: #FBE9EF; --rp-gain-fonce: #9C1747; --rp-vert-pale: #DCEFE1; --rp-jaune-pale: #FAF0C8; --rp-rouge-pale: #F8DCD8; --rp-vert-fonce: #1B6B3A; }

/* Première passe : les variables de la feuille d'origine (r2-report-styles) sur les jetons. html:root l'emporte sur son :root. */
html:root {
  --r2-bleu-nuit: var(--dr-ink);
  --r2-bleu-premium: var(--dr-ink);
  --r2-bleu-hover: var(--dr-dedans);
  --r2-bleu-clair: var(--dr-surface);
  --r2-ambre: var(--dr-repere);
  --r2-ambre-soft: var(--dr-teinte);
  --r2-ambre-dark: var(--dr-ink);
  --r2-vert: var(--dr-gain);
  --r2-vert-soft: var(--dr-gain-pale);
  --r2-vert-dark: var(--dr-gain);
  --r2-rouge: var(--dr-erreur);
  --r2-texte: var(--dr-ink);
  --r2-texte-sec: var(--dr-ink-2);
  --r2-texte-doux: var(--dr-ink-2);
  --r2-bordure: var(--dr-surface-alt);
  --r2-shadow-lg: none;
}

/* ========== Page ========== */
:root body:has(.new-diagnostic-report) { background: var(--dr-surface); }
:root .new-diagnostic-report { padding: 0 0 48px; font-family: var(--dr-text); font-size: 17px; line-height: 1.55; letter-spacing: 0; color: var(--dr-ink); }
/* Une periode d'annees (« 2020-2025 ») ne se coupe pas au tiret (newDiagnosticPeriodesInsecables) */
:root .r2-insecable { white-space: nowrap; }

/* ========== dt.css sous le rapport ==========
   diagnostic.html garde dt.css pendant le rapport, pour l'en-tête, le pied et le bandeau des cookies du site. Ses règles de
   classe ne touchent pas le rapport (aucune classe commune) ; ses règles d'élément, si : défilement et toucher de la page,
   police du corps (lue aussi par Recharts pour mesurer ses étiquettes), anneau du focus, titres h1 à h3, marges de
   défilement, groupes de champs. Elles sont reprises ici avec les valeurs qu'elles avaient avant (feuille de tête de
   diagnostic.html, Tailwind, navigateur), à la spécificité de dt.css et après elle, sur l'écran du rapport seulement, hors
   de l'en-tête et du pied (.dr-site), des cookies (#dt-cb, #dt-panel-bg) et du lien d'évitement (.skip de dt.css), qui
   gardent le dessin des pages. Contrôle :
   styles calculés du rapport et de ses fenêtres avant et après, 0 écart. Les valeurs de h1 à h3 et du focus recopient les
   règles d'élément de la tête de diagnostic.html : à retirer avec elles (backlog, bloc #r2-report-styles). */
:root:has(.new-diagnostic-report) { scroll-behavior: auto; touch-action: auto; color-scheme: normal; }
:root body:has(.new-diagnostic-report) { font-family: var(--font-body); font-size: 16px; }
:focus-visible:where(body:has(.new-diagnostic-report) :not(.dr-site *, #dt-cb, #dt-cb *, #dt-panel-bg, #dt-panel-bg *, .skip)) {
  outline: 2px solid rgba(29, 78, 216, 0.45); outline-offset: 2px; border-radius: 0;
}
h1:where(body:has(.new-diagnostic-report) :not(.dr-site *, #dt-cb, #dt-cb *, #dt-panel-bg, #dt-panel-bg *)) { font-family: var(--font-display); letter-spacing: -0.5px; }
h2:where(body:has(.new-diagnostic-report) :not(.dr-site *, #dt-cb, #dt-cb *, #dt-panel-bg, #dt-panel-bg *)) { font-family: var(--font-display); letter-spacing: -0.3px; }
h3:where(body:has(.new-diagnostic-report) :not(.dr-site *, #dt-cb, #dt-cb *, #dt-panel-bg, #dt-panel-bg *)) { font-family: inherit; letter-spacing: -0.3px; }
@media (max-width: 768px) {
  h1:where(body:has(.new-diagnostic-report) :not(.dr-site *, #dt-cb, #dt-cb *, #dt-panel-bg, #dt-panel-bg *)) { letter-spacing: -0.3px; }
}
:is(h2, h3):where(body:has(.new-diagnostic-report) :not(.dr-site *, #dt-cb, #dt-cb *, #dt-panel-bg, #dt-panel-bg *)),
main [id]:where(body:has(.new-diagnostic-report) *) { scroll-margin-top: 0; }
fieldset:where(body:has(.new-diagnostic-report) :not(.dr-site *, #dt-cb, #dt-cb *, #dt-panel-bg, #dt-panel-bg *)) { border-style: solid; border-color: #E5E7EB; min-width: min-content; }
fieldset > legend:where(body:has(.new-diagnostic-report) :not(.dr-site *, #dt-cb, #dt-cb *, #dt-panel-bg, #dt-panel-bg *)) {
  margin-bottom: 0; font: inherit; letter-spacing: inherit; color: inherit;
}

/* ========== En-tête et pied du site autour du rapport ==========
   Le balisage des pages (site-source/partials/, assemblé dans assets/site/dessins-diagnostic.js, composant
   NewDiagnosticPieceDuSite), le dessin de dt.css. .dr-site les enveloppe sans boîte (display: contents) et leur rend ce
   que le corps des pages leur donne (police, taille, couleur, approche), que le corps de cette page n'a pas ; de même pour
   le bandeau et le panneau des cookies, posés sur <body> par cookie-consent.js (dt.css fixe le reste). Puis deux règles de
   la tête de diagnostic.html qui les toucheraient sont annulées à leur force : l'interligne des paragraphes, et l'effet
   d'apparition au défilement pris par le texte « Menu » du bouton (classe .sr, homonyme de celle de dt.css). */
:root .dr-site { display: contents; }
:root .dr-site, :is(#dt-cb, #dt-panel-bg):where(body:has(.new-diagnostic-report) > *) {
  color: var(--dt-ink); font: 400 17px/1.55 var(--text); letter-spacing: normal;
}
:where(.dr-site) p { font-weight: inherit; line-height: inherit; }
:where(.dr-site) .sr { opacity: 1; transform: none; transition: initial; }
/* Boutons. Principal : la pilule pétrole à ombre framboise de la maquette (.btn), pour la fenêtre de demande ; secondaire : le contour (.btn-2). */
:root .r2-gate-cta {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px; width: auto; min-height: 52px; padding: 12px 26px;
  border: 0; border-radius: 999px; background: var(--dr-ink); color: var(--dr-paper); box-shadow: 0 4px 0 var(--dr-gain);
  font: 700 17px/1.15 var(--dr-display); letter-spacing: -0.005em; text-align: center; text-decoration: none; white-space: normal;
  cursor: pointer; transform: none; transition: transform 140ms var(--dr-ease), box-shadow 140ms var(--dr-ease);
}
:root .r2-gate-cta:hover:not(:disabled) { background: var(--dr-ink); transform: translateY(-2px); box-shadow: 0 6px 0 var(--dr-gain); }
:root .r2-demande-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px; width: auto; min-height: 48px; padding: 10px 22px;
  border: 2px solid var(--dr-ink); border-radius: 999px; background: transparent; color: var(--dr-ink); box-shadow: none;
  font: 700 16px/1.15 var(--dr-display); letter-spacing: -0.005em; text-align: center; white-space: normal; cursor: pointer; transform: none;
  transition: background 140ms var(--dr-ease);
}
:root .r2-demande-btn:hover:not(:disabled) { background: var(--dr-surface-alt); transform: none; box-shadow: none; }
:root .r2-demande-btn:disabled { border-color: var(--dr-surface-alt-2); background: var(--dr-surface); color: var(--dr-ink-2); cursor: default; }
:root .r2-demande-btn svg { width: 20px; height: 20px; font-size: 20px; }
:root .r2-demande-lien {
  min-height: 44px; padding: 10px 2px; background: none; border: 0; color: var(--dr-ink); font: 600 15px/1.3 var(--dr-text);
  text-decoration: underline; text-decoration-color: var(--dr-accent); text-decoration-thickness: 2px; text-underline-offset: 4px; cursor: pointer;
}
:root .r2-cta-microtrust { display: block; margin-top: 10px; font-size: 14px; font-weight: 400; line-height: 1.45; letter-spacing: 0; color: var(--dr-ink-2); }
:root .r2-cta-microtrust strong { color: var(--dr-ink); }
/* La demande enregistrée, et « Préparer l'échange » */
:root .r2-demande-faite { gap: 8px; }
:root .r2-demande-faite-ligne { font-size: 16px; color: var(--dr-ink); }
:root .r2-demande-faite-ligne svg { color: var(--dr-repere); }
:root .r2-demande-faite-fin { margin: 0 0 18px; padding: 14px 16px; border: 0; border-radius: 14px; background: var(--dr-teinte); }
:root .r2-demande-erreur { font-size: 15px; color: var(--dr-erreur); }
:root .r2-demande-preparer { max-width: none; font-size: 15px; color: var(--dr-ink-2); }
:root .r2-preparer { max-width: none; }
:root .r2-preparer-form legend { font: 700 15px/1.3 var(--dr-display); color: var(--dr-ink); }
:root .r2-preparer-option { min-height: 36px; font-size: 15px; color: var(--dr-ink-2); }
:root .r2-preparer-option input { accent-color: var(--dr-ink); }
:root .r2-preparer-ok { font-size: 15px; color: var(--dr-ink); }
:root .r2-preparer-ok svg { color: var(--dr-repere); }
:root .rp *{box-sizing:border-box}
:root .rp{max-width:1280px;margin:0 auto;padding:12px 16px 32px;display:grid;gap:10px;min-width:0}
:root .rp>*{min-width:0}
:root .rp :focus-visible{outline:3px solid var(--dt-accent);outline-offset:3px;border-radius:6px}
:root .rp .rp-sombre :focus-visible{outline-color:var(--dt-on-band)}
:root .rp h1,:root .rp h2,:root .rp h3,:root .rp h4{margin:0;font-family:var(--display);color:inherit}
:root .rp p,:root .rp dl,:root .rp dd,:root .rp figure{margin:0}
:root .rp ul,:root .rp ol{margin:0;padding:0;list-style:none}
:root .rp .rp-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
:root .rp .rp-feuille{background:var(--dt-paper);border-top:4px solid var(--dt-ink);border-radius:0 0 var(--r-panel) var(--r-panel);padding:18px 16px 20px}
:root .rp .rp-sur{font:700 15px/1.3 var(--display);font-variation-settings:"opsz" 24;color:var(--dt-ink-2);margin-bottom:8px}
:root .rp .rp-h2{font-weight:800;font-variation-settings:"opsz" 72;font-size:28px;line-height:1.06;letter-spacing:-.022em}
:root .rp .rp-h3{font:800 19px/1.2 var(--display);font-variation-settings:"opsz" 24;margin-top:18px}
:root .rp .rp-chapo{margin-top:10px;font-size:16px;line-height:1.45;color:var(--dt-ink-2)}
:root .rp .rp-note{margin-top:12px;font-size:14px;line-height:1.45;color:var(--dt-ink-2)}
:root .rp .rp-source{font-size:14px;color:var(--dt-ink-2)}
:root .rp .rp-encart{margin-top:16px;padding:12px 16px;border-radius:12px;box-shadow:inset 0 0 0 2px var(--dt-ink);font-size:15px}
:root .rp .rp-pastille{display:inline-block;vertical-align:2px;margin-left:4px;padding:2px 9px;border-radius:999px;background:var(--dt-ink);color:var(--dt-surface);font:600 14px/1.3 var(--text);white-space:nowrap}
:root .rp .rp-btn{display:inline-flex;align-items:center;justify-content:center;min-height:62px;padding:12px 26px;border:0;border-radius:999px;background:var(--dt-action);color:var(--dt-on-action);box-shadow:0 4px 0 var(--dt-action-shadow);font:700 19px/1.2 var(--display);font-variation-settings:"opsz" 24;text-align:center;cursor:pointer;width:100%}
:root .rp .rp-btn:hover{box-shadow:0 6px 0 var(--dt-action-shadow);transform:translateY(-2px)}
:root .rp .rp-btn-clair{background:var(--dt-band-action);color:var(--dt-on-band-action);box-shadow:0 4px 0 var(--dt-band-action-shadow)}
:root .rp .rp-btn-2{min-height:44px;padding:0 16px;border:2px solid var(--dt-ink);border-radius:999px;background:var(--dt-paper);color:var(--dt-ink);font:600 15px/1 var(--text);cursor:pointer}
:root .rp .rp-lien,:root .rp .rp-ancre{display:inline-flex;align-items:center;min-height:44px;padding:0;border:0;background:none;color:var(--dt-ink);font:600 17px/1.3 var(--text);text-decoration:underline;text-decoration-color:var(--dt-accent);text-decoration-thickness:2px;text-underline-offset:4px;cursor:pointer;text-align:left}
:root .rp .rp-lien:hover,:root .rp .rp-ancre:hover{text-decoration-thickness:3px}
:root .rp .rp-lien-discret{margin-top:8px;font-size:15px;color:var(--dt-ink-2)}
:root .rp .rp-lien-discret .rp-lien{font-size:16px}
:root .rp .rp-chevron{width:22px;height:22px;display:grid;place-items:center;justify-self:end;align-self:center}
:root .rp .rp-chevron::before{content:"";width:9px;height:9px;border-right:2.5px solid currentColor;border-bottom:2.5px solid currentColor;transform:translateY(-3px) rotate(45deg)}
:root .rp details[open]>summary .rp-chevron::before{transform:translateY(2px) rotate(225deg)}
:root .rp summary{cursor:pointer;list-style:none}
:root .rp summary::-webkit-details-marker{display:none}
/* 1. Essentiel */
:root .rp .rp-barre{display:flex;flex-wrap:wrap;gap:0 16px;align-items:flex-end;justify-content:space-between;padding-bottom:4px;margin-bottom:14px;border-bottom:2px dashed var(--dt-surface-alt-2)}
:root .rp .rp-barre .rp-sur{margin-bottom:2px}
:root .rp .rp-local{font:600 16px/1.35 var(--text)}
:root .rp .rp-outils{display:flex;flex-wrap:wrap;gap:0 20px}
:root .rp .rp-outils .rp-lien{font-size:15px}
:root .rp .rp-h1{font-weight:800;font-variation-settings:"opsz" 96;line-height:.95;letter-spacing:-.032em}
:root .rp .rp-roi-chiffre{display:block;font-size:clamp(40px,12.5vw,128px);color:var(--dt-you);white-space:nowrap}
:root .rp .rp-roi-an{font-size:.8em;letter-spacing:-.02em}
:root .rp .rp-h1-suite{display:block;margin-top:6px;font-size:clamp(26px,3.6vw,44px);letter-spacing:-.02em}
:root .rp .rp-duo{display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:16px}
:root .rp .rp-duo-item{display:flex;align-items:baseline;flex-wrap:wrap;gap:0 8px}
:root .rp .rp-duo-val{font:800 30px/1.1 var(--display);font-variation-settings:"opsz" 72;letter-spacing:-.02em}
:root .rp .rp-duo-lib{font:600 17px/1.3 var(--text);color:var(--dt-ink-2)}
:root .rp .rp-comprend{margin-top:22px;padding:16px;border-radius:var(--r-panel);box-shadow:inset 0 0 0 2px var(--dt-ink)}
:root .rp .rp-bloc-titre{font:800 22px/1.15 var(--display);font-variation-settings:"opsz" 24}
:root .rp .rp-comprend-grille{display:grid;gap:16px;margin-top:12px}
:root .rp .rp-liste-titre{font:700 17px/1.25 var(--display);font-variation-settings:"opsz" 24;padding:6px 10px;border-radius:10px;background:var(--dt-surface-alt)}
:root .rp .rp-liste-actions{list-style:none;display:grid;gap:8px;margin-top:10px}
:root .rp .rp-liste-actions li{display:grid;grid-template-columns:30px minmax(0,1fr);column-gap:10px;align-items:start;font:600 16px/1.35 var(--text)}
:root .rp .rp-num-pastille,:root .rp .rp-a-num{display:grid;place-items:center;width:28px;height:28px;border-radius:999px;background:var(--dt-ink);color:var(--dt-on-band);font:800 15px/1 var(--display)}
:root .rp .rp-pastille-premier{background:var(--dt-accent);color:var(--dt-on-action)}
:root .rp .rp-comprend-lien{margin-top:6px}
:root .rp .rp-conseil{margin-top:18px}
:root .rp .rp-conseil-titre{font:800 19px/1.2 var(--display);font-variation-settings:"opsz" 24}
:root .rp .rp-secteur{margin-top:18px;padding-top:14px;border-top:2px dashed var(--dt-surface-alt-2)}
:root .rp .rp-secteur-phrase{margin-top:2px;font:700 17px/1.35 var(--text)}
:root .rp .rp-jauge{margin-top:12px}
:root .rp .rp-jg-m-zone,:root .rp .rp-jg-r-zone{position:relative}
:root .rp .rp-jg-etiq{position:absolute;bottom:0;display:grid;justify-items:center;width:max-content;transform:translateX(-50%);padding-bottom:6px;line-height:1.15}
:root .rp .rp-jg-etiq strong{font:800 18px/1.1 var(--display);font-variation-settings:"opsz" 24;color:var(--dt-ink)}
:root .rp .rp-jg-lib{font:700 14px/1.2 var(--text)}
:root .rp .rp-jg-vous .rp-jg-lib{color:var(--dt-erreur)}
:root .rp .rp-jg-apres .rp-jg-lib{color:var(--rp-vert-fonce)}
:root .rp .rp-jg-barre{position:relative;height:22px;border-radius:999px;box-shadow:inset 0 0 0 1.5px var(--dt-ink);overflow:visible}
:root .rp .rp-jg-seg{position:absolute;top:1.5px;bottom:1.5px}
:root .rp .rp-jg-vert{left:1.5px;border-radius:999px 0 0 999px;background:var(--rp-vert-pale)}
:root .rp .rp-jg-jaune{background:var(--rp-jaune-pale)}
:root .rp .rp-jg-rouge{border-radius:0 999px 999px 0;background:var(--rp-rouge-pale);margin-right:1.5px}
:root .rp .rp-jg-trait{position:absolute;top:100%;width:1.5px;height:10px;margin-left:-.75px;background:var(--dt-ink-2)}
:root .rp .rp-jg-point{position:absolute;top:50%;width:20px;height:20px;margin:-10px 0 0 -10px;border-radius:50%}
:root .rp .rp-jg-point-vous{background:var(--dt-erreur);box-shadow:0 0 0 2.5px var(--dt-paper),0 0 0 4px var(--dt-ink)}
:root .rp .rp-jg-point-apres{background:var(--dt-paper);border:5px solid var(--rp-vert-fonce);box-shadow:0 0 0 1.5px var(--dt-ink)}
:root .rp .rp-jg-r-zone{margin-top:12px}
:root .rp .rp-jg-rep{position:absolute;top:0;width:max-content;transform:translateX(-50%);font-size:14px;line-height:20px;color:var(--dt-ink-2)}
:root .rp .rp-ancre{font-size:16px}
:root .rp .rp-reperes{display:grid;gap:12px;margin-top:16px;padding-top:14px;border-top:2px dashed var(--dt-surface-alt-2)}
:root .rp .rp-repere-lib{font:600 15px/1.3 var(--text);color:var(--dt-ink-2)}
:root .rp .rp-repere-val{margin-top:0;font:800 24px/1.1 var(--display);font-variation-settings:"opsz" 24}
:root .rp .rp-repere-txt{margin-top:4px;font-size:14px;line-height:1.45;color:var(--dt-ink-2)}
:root .rp .rp-dpe-a{background:var(--dt-dpe-a);fill:var(--dt-dpe-a)}
:root .rp .rp-dpe-b{background:var(--dt-dpe-b);fill:var(--dt-dpe-b)}
:root .rp .rp-dpe-c{background:var(--dt-dpe-c);fill:var(--dt-dpe-c)}
:root .rp .rp-dpe-d{background:var(--dt-dpe-d);fill:var(--dt-dpe-d)}
:root .rp .rp-dpe-e{background:var(--dt-dpe-e);fill:var(--dt-dpe-e)}
:root .rp .rp-dpe-f{background:var(--dt-dpe-f);fill:var(--dt-dpe-f)}
:root .rp .rp-dpe-g{background:var(--dt-dpe-g);fill:var(--dt-dpe-g)}
/* Étiquette énergie (ETIQUETTE-SPEC.md, refonte du 16/10) : la compacte de l'essentiel, l'échelle complète du repli.
   Papier découpé : contour encre, ombre décalée sans flou, aucun dégradé ; la lettre est toujours écrite (lisible en gris). */
:root .rp .rp-tag{display:block;height:auto;max-width:100%}
:root .rp .rp-tag-ombre{fill:var(--dt-ink)}
:root .rp .rp-tag-forme{stroke:var(--dt-ink);stroke-width:2;stroke-linejoin:round}
:root .rp .rp-tag-lettre{font-family:var(--display);font-weight:800;fill:var(--dt-dpe-on)}
:root .rp .rp-tag-lettre-g{fill:var(--dt-dpe-on-g)}
:root .rp .rp-etq2{display:flex;align-items:flex-start;gap:8px;margin-top:8px}
:root .rp .rp-etq2-bloc{display:grid;justify-items:start;gap:4px;min-width:0}
:root .rp .rp-etq2-lib{font:600 14px/1.2 var(--text);color:var(--dt-ink-2)}
:root .rp .rp-etq2-val{font-size:14px;line-height:1.25;color:var(--dt-ink-2)}
:root .rp .rp-etq2-unite{white-space:nowrap}
:root .rp .rp-etq2-val strong{font:800 18px/1.1 var(--display);font-variation-settings:"opsz" 24;color:var(--dt-ink)}
:root .rp .rp-etq2-fleche{flex:none;width:28px;height:20px;margin-top:40px}
:root .rp .rp-etq2-fleche path{fill:none;stroke:var(--dt-ink);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
:root .rp .rp-etq2-noms{margin-top:6px;font-size:14px;line-height:1.35;color:var(--dt-ink-2)}
:root .rp .rp-etq2-gain{margin-top:8px}
:root .rp .rp-pastille-gain{margin-left:0;background:var(--rp-vert-fonce);color:var(--dt-paper)}
:root .rp .rp-cl-mini{display:inline-grid;place-items:center;min-width:28px;height:26px;padding:0 6px;margin:0 2px;vertical-align:middle;border-radius:6px;box-shadow:inset 0 0 0 1.5px var(--dt-ink);font:800 16px/1 var(--display);color:var(--dt-dpe-on)}
:root .rp .rp-cl-mini.rp-dpe-g{color:var(--dt-dpe-on-g)}
:root .rp .rp-ech2{position:relative;display:grid;grid-template-columns:minmax(0,58fr) minmax(0,42fr);column-gap:8px;margin-top:4px;min-height:var(--rp-ech2-h,0)}
:root .rp .rp-ech2-bandes{display:grid;gap:4px;align-content:start}
:root .rp .rp-ech2-mqs{position:relative}
:root .rp .rp-ech2-bande{background:var(--dt-ink);padding:1.5px;clip-path:polygon(0 0,calc(100% - 15px) 0,100% 50%,calc(100% - 15px) 100%,0 100%);border-radius:6px 0 0 6px}
:root .rp .rp-ech2-fond{display:grid;align-content:center;min-height:53px;padding:4px 22px 4px 10px;clip-path:polygon(0 0,calc(100% - 14px) 0,100% 50%,calc(100% - 14px) 100%,0 100%);border-radius:5px 0 0 5px;color:var(--dt-dpe-on)}
:root .rp .rp-ech2-fond.rp-dpe-g{color:var(--dt-dpe-on-g)}
/* La lettre suit la couleur de sa bande (encre fonce, blanc sur G) : selecteur plus fort que
   « .rp-pli-corps strong » (encre), qui la rendait encre sur G (2,17:1, controle L6). */
:root .rp .rp-ech2-fond .rp-ech2-lettre{font:800 21px/1.05 var(--display);color:inherit}
:root .rp .rp-ech2-seuil{font:600 14px/1.2 var(--text);white-space:nowrap}
:root .rp .rp-ech2-b0{width:104px}
:root .rp .rp-ech2-b1{width:calc(104px + 1 * (100% - 104px) / 6)}
:root .rp .rp-ech2-b2{width:calc(104px + 2 * (100% - 104px) / 6)}
:root .rp .rp-ech2-b3{width:calc(104px + 3 * (100% - 104px) / 6)}
:root .rp .rp-ech2-b4{width:calc(104px + 4 * (100% - 104px) / 6)}
:root .rp .rp-ech2-b5{width:calc(104px + 5 * (100% - 104px) / 6)}
:root .rp .rp-ech2-b6{width:100%}
:root .rp .rp-mq{position:absolute;top:var(--rp-mq-top,0);left:0;right:0;display:grid;gap:4px;justify-items:start}
:root .rp .rp-mq-tag{display:grid;place-items:center;min-width:48px;height:40px;padding:0 12px 0 20px;clip-path:polygon(14px 0,100% 0,100% 100%,14px 100%,0 50%);font:800 24px/1 var(--display);color:var(--dt-paper)}
:root .rp .rp-mq-auj .rp-mq-tag{background:var(--dt-ink)}
:root .rp .rp-mq-apres .rp-mq-tag{background:var(--dt-accent)}
:root .rp .rp-mq-dpe .rp-mq-tag{background:var(--dt-ink-2)}
:root .rp .rp-mq-txt{display:grid;gap:4px;font-size:14px;line-height:1.3;color:var(--dt-ink-2)}
:root .rp .rp-mq-moment{display:grid}
:root .rp .rp-mq-lib{font-weight:700;color:var(--dt-ink)}
:root .rp .rp-mq-apres .rp-mq-lib{color:var(--rp-gain-fonce)}
:root .rp .rp-mq-val strong{font:800 17px/1.2 var(--display);color:var(--dt-ink)}
:root .rp .rp-ech2-generale{margin-top:4px;padding:12px 14px;border-radius:12px;box-shadow:inset 0 0 0 2px var(--dt-ink);line-height:1.9}
/* 2. Plan */
:root .rp .rp-cols{display:none}
:root .rp .rp-groupe{margin-top:18px;padding:12px 14px;border-radius:12px;background:var(--dt-surface-alt)}
:root .rp .rp-groupe-titre{font:800 21px/1.2 var(--display);font-variation-settings:"opsz" 24}
:root .rp .rp-groupe-meta{margin-top:2px;font-size:15px;color:var(--dt-ink-2)}
:root .rp .rp-locataire{margin-top:4px;font-size:14px;line-height:1.4;color:var(--dt-ink-2)}
:root .rp .rp-legende-cols{margin-top:6px;font-size:14px;line-height:1.35;color:var(--dt-ink-2)}
:root .rp .rp-actions{list-style:none;margin-top:4px}
:root .rp .rp-action+.rp-action{border-top:1px solid var(--dt-surface-alt-2)}
:root .rp .rp-a-ligne{display:grid;grid-template-columns:28px minmax(0,1fr) 22px;grid-template-areas:"num titre chev" ". chif chif";column-gap:10px;row-gap:2px;padding:9px 0;min-height:56px;align-items:start}
:root .rp .rp-a-num{grid-area:num}
:root .rp .rp-a-titre{grid-area:titre;font:600 16px/1.3 var(--text)}
:root .rp .rp-a-chiffres{grid-area:chif;font-size:15px;color:var(--dt-ink-2);font-variant-numeric:tabular-nums}
:root .rp .rp-a-cout,:root .rp .rp-a-roi{white-space:nowrap}
:root .rp .rp-a-gain{white-space:nowrap}
:root .rp .rp-gain-ligne{display:inline-block;padding:2px 9px;border-radius:999px;background:var(--rp-gain-pale);color:var(--rp-gain-fonce);font:700 16px/1.3 var(--display);font-variation-settings:"opsz" 24;white-space:nowrap}
:root .rp .rp-a-mesurer{font-weight:600;color:var(--dt-ink-2)}
:root .rp .rp-action .rp-chevron{grid-area:chev}
:root .rp .rp-a-vide{grid-area:chev}
:root .rp .rp-action summary:hover .rp-a-titre{text-decoration:underline;text-decoration-color:var(--dt-accent);text-decoration-thickness:2px;text-underline-offset:3px}
:root .rp .rp-a-detail{padding:0 0 14px 38px;font-size:15px;line-height:1.5;color:var(--dt-ink-2);display:grid;gap:6px}
:root .rp .rp-total{margin:20px 6px 6px 0;padding:18px 16px;border-radius:var(--r-panel);background:var(--dt-band);color:var(--dt-on-band);border:2px solid var(--dt-ink);box-shadow:6px 6px 0 var(--dt-accent)}
:root .rp .rp-total-titre{font:800 21px/1.2 var(--display);font-variation-settings:"opsz" 24}
:root .rp .rp-total-eco{margin-top:6px;display:flex;flex-wrap:wrap;align-items:baseline;gap:0 10px}
:root .rp .rp-total-eco-val{font:800 clamp(40px,7vw,64px)/1 var(--display);font-variation-settings:"opsz" 96;letter-spacing:-.03em;white-space:nowrap}
:root .rp .rp-total-eco-lib{font:600 17px/1.3 var(--text);color:var(--dt-on-band-2)}
:root .rp .rp-tuiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:14px}
:root .rp .rp-tuile{padding:10px 12px;border-radius:12px;box-shadow:inset 0 0 0 1.5px var(--dt-on-band-2)}
:root .rp .rp-tuile dt{font:600 14px/1.25 var(--text);color:var(--dt-on-band-2);overflow-wrap:anywhere}
:root .rp .rp-tuile dd{margin-top:4px;font:800 22px/1.05 var(--display);font-variation-settings:"opsz" 24}
:root .rp .rp-total-ligne{margin-top:12px;font-size:15px;color:var(--dt-on-band-2)}
:root .rp .rp-total .rp-lien{color:var(--dt-on-band);text-decoration-color:var(--dt-on-band)}
/* 3. Appel 1 */
:root .rp .rp-appel{background:var(--dt-paper);border-radius:var(--r-panel);box-shadow:inset 0 0 0 3px var(--dt-ink);padding:20px 16px;display:grid;gap:14px}
:root .rp .rp-etapes{list-style:none;display:grid;gap:10px;margin-top:10px}
:root .rp .rp-etapes li{display:grid;grid-template-columns:36px minmax(0,1fr);column-gap:12px;font-size:15px;line-height:1.45}
:root .rp .rp-etape-num{display:grid;place-items:center;width:36px;height:36px;border-radius:10px 12px 9px 12px;background:var(--dt-surface-alt);color:var(--dt-ink);font:800 17px/1 var(--display)}
:root .rp .rp-micro{margin-top:10px;font-size:14px;line-height:1.4;color:var(--dt-ink-2)}
:root .rp .rp-qui-paie{margin-top:10px;font-size:14px;line-height:1.45;color:var(--dt-ink-2)}
/* 4. Projection */
:root .rp .rp-figure{margin-top:16px;margin-left:-16px;margin-right:-16px}
:root .rp .rp-svg{display:block;width:100%;height:auto;font-family:var(--text)}
:root .rp .rp-fmt-tel .rp-svg{max-width:440px;margin:0 auto}
:root .rp .rp-svg-secteur{max-width:440px}
:root .rp .rp-axe-titre{padding:0 16px 6px;font:600 14px/1.35 var(--text);color:var(--dt-ink-2)}
:root .rp .rp-svg-large text{font-size:17px}
:root .rp .rp-svg-large .rp-t-gain{font-size:20px}
:root .rp .rp-svg-large .rp-t-fin-val{font-size:19px}
:root .rp .rp-svg-tel text{font-size:17.5px}
:root .rp .rp-fmt-large{display:none}
:root .rp .rp-leg{list-style:none;display:grid;gap:2px;padding:0 16px 8px}
:root .rp .rp-leg li{display:grid;grid-template-columns:30px minmax(0,1fr) auto;column-gap:8px;align-items:center;font-size:14px;color:var(--dt-ink-2)}
:root .rp .rp-leg strong{color:var(--dt-ink);font-weight:600;white-space:nowrap}
:root .rp .rp-leg .rp-leg-gain{color:var(--dt-you);font-weight:700}
:root .rp .rp-grille{stroke:var(--dt-surface-alt);stroke-width:1}
:root .rp .rp-axe{stroke:var(--dt-ink);stroke-width:1.5}
:root .rp .rp-t-grad{fill:var(--dt-ink-3);font-variant-numeric:tabular-nums}
:root .rp .rp-c-rien{fill:none;stroke:var(--dt-ink);stroke-width:2.5;stroke-dasharray:9 6;stroke-linejoin:round}
:root .rp .rp-c-leger{fill:none;stroke:var(--dt-il-cadre);stroke-width:2.5;stroke-dasharray:1 5;stroke-linecap:round;stroke-linejoin:round}
:root .rp .rp-c-plan{fill:none;stroke:var(--dt-you);stroke-width:4;stroke-linecap:round;stroke-linejoin:round}
:root .rp .rp-c-point{fill:var(--dt-paper);stroke:var(--dt-il-cadre);stroke-width:2}
:root .rp .rp-aplat{stroke:none}
:root .rp .rp-aplat-fond{fill:#F6E3EA}
:root .rp .rp-aplat-trait{stroke:var(--dt-accent);stroke-width:1.1;opacity:.55}
:root .rp .rp-svg .rp-repere{stroke:var(--dt-accent);stroke-width:2;stroke-dasharray:5 4}
:root .rp .rp-svg .rp-repere-point{fill:var(--dt-accent);stroke:var(--dt-paper);stroke-width:2.5}
:root .rp .rp-t-repere{font-weight:700;fill:var(--dt-accent)}
:root .rp .rp-t-gain{font-family:var(--display);font-weight:800;fill:var(--dt-you)}
:root .rp .rp-t-gain-2{fill:var(--dt-ink-2)}
:root .rp .rp-filet{stroke:var(--dt-ink-2);stroke-width:1.25}
:root .rp .rp-filet-point{fill:var(--dt-ink)}
:root .rp .rp-t-fin{font-weight:600;fill:var(--dt-ink)}
:root .rp .rp-t-fin-nom{fill:var(--dt-ink-2)}
:root .rp .rp-t-fin-val{font-family:var(--display);font-weight:800;fill:var(--dt-ink);font-variant-numeric:tabular-nums}
:root .rp .rp-t-fin-2{fill:var(--dt-ink-2);font-variant-numeric:tabular-nums}
:root .rp .rp-b-fond{fill:var(--dt-paper)}
:root .rp .rp-b-trait{stroke:var(--dt-ink-3);stroke-width:1.4}
:root .rp .rp-b-creux{stroke:var(--dt-ink);stroke-width:1.25}
:root .rp .rp-b-plein{fill:var(--dt-ink)}
:root .rp .rp-b-leger{fill:none;stroke:var(--dt-il-cadre);stroke-width:2;stroke-linejoin:round}
:root .rp .rp-b-leger-pt{fill:var(--dt-il-cadre);stroke:var(--dt-paper);stroke-width:1.5}
:root .rp .rp-proj-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-top:12px;position:relative}
:root .rp .rp-proj-stats>div{padding:10px;border-radius:12px;background:var(--dt-surface)}
:root .rp .rp-proj-stats dt{font:600 14px/1.25 var(--text);color:var(--dt-ink-2)}
:root .rp .rp-proj-stats dd{margin-top:4px;font:800 20px/1.1 var(--display);font-variation-settings:"opsz" 24}
:root .rp .rp-stat-gain dd{color:var(--dt-you)}
:root .rp .rp-stat-annee dd{font-size:18px}
:root .rp .rp-donnees{margin-top:8px;border-radius:12px;background:var(--dt-surface)}
:root .rp .rp-donnees>summary{display:grid;grid-template-columns:minmax(0,1fr) 22px;align-items:center;gap:8px;min-height:48px;padding:8px 14px;font:600 15px/1.3 var(--text)}
:root .rp .rp-donnees[open]{background:var(--dt-paper);box-shadow:inset 0 0 0 2px var(--dt-ink)}
:root .rp .rp-donnees .rp-table-boite,:root .rp .rp-donnees .rp-pli-corps{padding:0 14px 14px}
:root .rp .rp-pli-corps{display:grid;gap:10px;font-size:15px;line-height:1.5;color:var(--dt-ink-2)}
:root .rp .rp-pli-corps strong{color:var(--dt-ink)}
:root .rp .rp-table{width:100%;border-collapse:collapse;font-size:15px;font-variant-numeric:tabular-nums}
:root .rp .rp-table th,:root .rp .rp-table td{padding:7px 8px;text-align:right;border-bottom:1px solid var(--dt-surface-alt-2);white-space:nowrap}
:root .rp .rp-table th:first-child{text-align:left}
:root .rp .rp-table thead th{font-weight:600;color:var(--dt-ink-2);white-space:normal;vertical-align:bottom}
:root .rp .rp-table tbody th{font-weight:600;white-space:normal}
:root .rp .rp-table-2 td{width:1%}
/* 5. Plus loin */
:root .rp .rp-plis{display:grid;gap:6px;margin-top:16px}
:root .rp .rp-pli{border-radius:12px;background:var(--dt-surface)}
:root .rp .rp-pli>summary{display:grid;grid-template-columns:minmax(0,1fr) 22px;grid-template-areas:"titre chev" "rep chev";column-gap:10px;row-gap:0;align-items:center;min-height:52px;padding:8px 14px}
:root .rp .rp-pli-titre{grid-area:titre;font:700 16px/1.25 var(--display);font-variation-settings:"opsz" 24}
:root .rp .rp-pli-rep{grid-area:rep;font-size:14px;line-height:1.35;color:var(--dt-ink-2)}
:root .rp .rp-pli .rp-chevron{grid-area:chev}
:root .rp .rp-pli[open]{background:var(--dt-paper);box-shadow:inset 0 0 0 2px var(--dt-ink)}
:root .rp .rp-pli .rp-pli-corps{padding:4px 16px 18px}
:root .rp .rp-pli-intro{color:var(--dt-ink-2)}
:root .rp .rp-pli-grille{display:grid;gap:14px}
:root .rp .rp-figure-pli{display:grid;gap:8px}
:root .rp .rp-pli-lecture{font-size:14px;color:var(--dt-ink-2)}
:root .rp .rp-barres{list-style:none;display:grid;gap:10px;margin-top:4px}
:root .rp .rp-barres li{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"lib mont" "piste piste";column-gap:12px;row-gap:4px;align-items:center}
:root .rp .rp-barre-lib{grid-area:lib;color:var(--dt-ink)}
:root .rp .rp-barre-1 .rp-barre-lib{font-weight:600}
:root .rp .rp-barre-mont{grid-area:mont;font-weight:600;color:var(--dt-ink);white-space:nowrap;font-variant-numeric:tabular-nums}
:root .rp .rp-barre-piste{grid-area:piste;display:block;height:14px;border-radius:0 4px 4px 0;background:var(--dt-surface)}
:root .rp .rp-barre-val{display:block;height:14px;border-radius:0 4px 4px 0;background:var(--dt-il-cadre)}
:root .rp .rp-barre-1 .rp-barre-val{background:var(--dt-ink)}
:root .rp .rp-pli[open] .rp-barre-piste{background:var(--dt-surface)}
:root .rp .rp-bande{fill:var(--dt-surface-alt);stroke:var(--dt-ink-3);stroke-width:1}
:root .rp .rp-mediane{stroke:var(--dt-ink-2);stroke-width:2.5}
:root .rp .rp-vous{fill:var(--dt-ink);stroke:var(--dt-paper);stroke-width:2}
:root .rp .rp-apres{fill:var(--dt-paper);stroke:var(--dt-ink);stroke-width:2.5}
:root .rp .rp-fleche-trait{stroke:var(--dt-ink);stroke-width:2}
:root .rp .rp-fleche-tete{fill:var(--dt-ink)}
:root .rp .rp-fiche{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 16px}
:root .rp .rp-fiche dt{font-size:14px;color:var(--dt-ink-2)}
:root .rp .rp-fiche dd{font-weight:600;color:var(--dt-ink)}
:root .rp .rp-faq-q{margin-top:6px;font:700 16px/1.3 var(--text);color:var(--dt-ink)}
:root .rp .rp-liste{padding-left:20px!important;display:grid;gap:4px}
/* 6. Appel 2 */
:root .rp .rp-appel-fin{background:var(--dt-band);color:var(--dt-on-band);border-radius:var(--r-panel);padding:22px 16px}
:root .rp .rp-appel-fin .rp-sur,:root .rp .rp-appel-fin .rp-chapo,:root .rp .rp-appel-fin .rp-micro,:root .rp .rp-appel-fin .rp-qui-paie,:root .rp .rp-fin-ligne{color:var(--dt-on-band-2)}
:root .rp .rp-appel-fin .rp-h2{font-size:clamp(28px,4.4vw,52px);font-variation-settings:"opsz" 96;line-height:1;letter-spacing:-.03em}
:root .rp .rp-fin-action{margin-top:18px}
:root .rp .rp-fin-ligne{margin-top:8px;font-size:14px;line-height:1.45}
:root .rp .rp-donnees-sombre{background:rgba(255,255,255,.08);margin-top:14px}
:root .rp .rp-donnees-sombre[open]{background:transparent;box-shadow:inset 0 0 0 2px var(--dt-on-band-2)}
:root .rp .rp-donnees-sombre .rp-pli-corps,:root .rp .rp-donnees-sombre .rp-etapes li{color:var(--dt-on-band-2)}
:root .rp .rp-donnees-sombre .rp-etape-num{background:var(--dt-paper)}
/* 7. Pied */
:root .rp .rp-pied{padding:12px 4px 0;border-top:2px dotted var(--dt-surface-alt-2);font-size:14px;line-height:1.5;color:var(--dt-ink-2);display:grid;gap:2px}
/* Apparition : une seule entrée par section, coupée en mouvement réduit */
@media (prefers-reduced-motion:no-preference){
  :root .rp>section{animation:rp-entree .5s cubic-bezier(.2,.7,.2,1) both}
  :root .rp>section:nth-child(2){animation-delay:.06s}
  :root .rp>section:nth-child(n+3){animation-delay:.1s}
  :root .rp .rp-c-rien,:root .rp .rp-c-leger{stroke-dashoffset:0}
}
@keyframes rp-entree{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (max-width:519px){
  :root .rp .rp-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  :root .rp .rp-table:not(.rp-table-2) tr{display:grid;grid-template-columns:minmax(0,1fr) auto;padding:8px 0;border-bottom:1px solid var(--dt-surface-alt-2)}
  :root .rp .rp-table:not(.rp-table-2) th,:root .rp .rp-table:not(.rp-table-2) td{border:0;padding:2px 0}
  :root .rp .rp-table:not(.rp-table-2) tbody th{grid-column:1/-1}
  :root .rp .rp-table:not(.rp-table-2) td{display:contents}
  :root .rp .rp-table:not(.rp-table-2) td::before{content:attr(data-col) / "";text-align:left;color:var(--dt-ink-2);padding:2px 0}
}
@media (min-width:520px){
  :root .rp .rp-tuile dd{font-size:26px}
}
@media (min-width:760px){
  :root .rp{padding:24px 24px 64px;gap:20px}
  :root .rp .rp-feuille{padding:40px 48px 44px}
  :root .rp .rp-chapo{font-size:17px;line-height:1.5}
  :root .rp .rp-a-titre{font-size:17px}
  :root .rp .rp-h2{font-size:clamp(30px,3.4vw,44px)}
  :root .rp .rp-figure{margin-left:0;margin-right:0}
  :root .rp .rp-cols{display:grid;grid-template-columns:28px minmax(0,1fr) 150px 170px 112px 22px;column-gap:12px;margin-top:24px;font-size:14px;color:var(--dt-ink-2);font-weight:600}
  :root .rp .rp-cols span:nth-child(n+3){text-align:right}
  :root .rp .rp-legende-cols{display:none}
  :root .rp .rp-a-ligne{grid-template-columns:28px minmax(0,1fr) 150px 170px 112px 22px;grid-template-areas:none;column-gap:12px;align-items:center}
  :root .rp .rp-a-num{grid-area:auto}
  :root .rp .rp-a-titre{grid-area:auto}
  :root .rp .rp-a-chiffres{display:contents}
  :root .rp .rp-a-sep{display:none}
  :root .rp .rp-a-cout,:root .rp .rp-a-gain,:root .rp .rp-a-roi{text-align:right;font-size:16px}
  :root .rp .rp-action .rp-chevron,:root .rp .rp-a-vide{grid-area:auto}
  :root .rp .rp-total{padding:28px 32px}
  :root .rp .rp-comprend{padding:22px 24px}
  :root .rp .rp-appel{padding:40px 44px;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:48px;align-items:center}
  :root .rp .rp-appel-action{padding:24px;border-radius:16px;background:var(--dt-surface)}
  :root .rp .rp-btn{width:auto}
  :root .rp .rp-appel .rp-btn{width:100%}
  :root .rp .rp-appel-fin{padding:56px 48px}
  :root .rp .rp-appel-fin>*{max-width:760px}
  :root .rp .rp-reperes{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}
  :root .rp .rp-pli>summary{grid-template-columns:minmax(0,1fr) auto 22px;grid-template-areas:"titre rep chev";column-gap:20px}
  :root .rp .rp-pli-rep{text-align:right}
  :root .rp .rp-pli-grille{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:32px;align-items:start}
  :root .rp .rp-proj-stats{grid-template-columns:repeat(2,minmax(0,1fr));max-width:620px}
  :root .rp .rp-stat-annee dd{font-size:20px}
}
@media (min-width:600px){
  :root .rp .rp-ech2{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:16px;min-height:var(--rp-ech2-h-l,0)}
  :root .rp .rp-ech2-fond{display:flex;align-items:baseline;gap:8px;min-height:40px}
  :root .rp .rp-mq{top:var(--rp-mq-top-l,0);grid-template-columns:auto minmax(0,1fr);align-items:start;column-gap:10px}
  :root .rp .rp-comprend-grille{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
}
@media (min-width:1060px){
  :root .rp .rp-fmt-large{display:block}
  :root .rp .rp-fmt-tel{display:none}
  :root .rp .rp-leg{display:none}
}
@media print{
  :root .rp details>:not(summary){display:block}
  :root .rp details::details-content{content-visibility:visible;display:block}
  :root .rp .rp-fmt-large{display:block}
  :root .rp .rp-fmt-tel,:root .rp .rp-leg{display:none}
}
/* ========== Ajouts de l'intégration : cas que le prototype ne montrait pas ========== */
:root .rp ul.rp-liste, :root .rp ol.rp-liste { list-style: disc; }
:root .rp .rp-h1-texte { font: 800 clamp(28px, 4.4vw, 48px)/1.08 var(--display); font-variation-settings: "opsz" 72; letter-spacing: -0.02em; }
:root .rp .rp-bloc-titre-petit { font: 700 16px/1.3 var(--display); }
:root .rp .rp-encart-doux { margin-top: 14px; padding: 12px 16px; border-radius: 12px; background: var(--dt-surface); font-size: 15px; line-height: 1.5; }
:root .rp .rp-encart-petit { margin-top: 10px; padding: 10px 12px; font-size: 14px; line-height: 1.45; }
:root .rp .rp-agence { margin-top: 4px; font-size: 14px; line-height: 1.4; color: var(--dt-ink-2); display: flex; flex-wrap: wrap; gap: 0 12px; }
:root .rp .rp-agence a { color: var(--dt-ink); text-decoration-color: var(--dt-accent); text-underline-offset: 3px; }
:root .rp .r2-hero-agence-par { font-weight: 600; color: var(--dt-ink); }
:root .rp .r2-hero-agence-par { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
/* Logo de l'agence (co-marquage actif) : aplati sur blanc, donc sur une etiquette blanche. 28 px de haut. */
:root .rp .rp-agence-logo { display: block; box-sizing: content-box; height: 28px; width: auto; max-width: 100%; padding: 3px 6px; border-radius: 6px; background: #FFFFFF; }
:root .rp .rp-courtier { background: var(--dt-paper); border-radius: var(--r-panel); box-shadow: inset 0 0 0 2px var(--dt-ink); padding: 18px 16px; }
:root .rp .rp-plan .rp-courtier { margin-top: 18px; }
:root .rp .rp-courtier-texte { margin-top: 8px; font-size: 15px; line-height: 1.5; color: var(--dt-ink-2); }
:root .rp .rp-courtier-voies { display: grid; gap: 8px 24px; margin-top: 12px; align-items: start; }
:root .rp .rp-courtier .r2-courtier-reperes { margin-top: 4px; padding-left: 18px; list-style: disc; font-size: 15px; line-height: 1.5; color: var(--dt-ink-2); }
:root .rp .rp-courtier .r2-courtier-reperes strong { color: var(--dt-ink); }
:root .rp .rp-btn-2 { display: inline-flex; align-items: center; justify-content: center; gap: 8px; text-decoration: none; }
:root .rp .rp-btn-2 svg { width: 18px; height: 18px; }
:root .rp .rp-btn-2:disabled { opacity: .7; cursor: default; }
:root .rp .rp-lien-discret p { margin: 0; }
:root .rp .rp-lien-discret .r2-demande-faite { margin-top: 6px; }
:root .rp .rp-total .rp-lien-discret { color: var(--dt-on-band-2); }
:root .rp .rp-pdf { margin-top: 12px; }
:root .rp .rp-pdf-ligne { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; }
:root .rp .rp-pdf-ligne .rp-micro { margin-top: 0; }
/* Choix du niveau du PDF (L4) : la couleur du texte vient du fond (clair ou bande sombre). L'anneau de focus des
   radios est celui de tout le rapport (regle F2 : 3 px framboise, blanc dans .rp-sombre, plus haut). */
:root .rp .rp-pdf-niveaux { margin: 0 0 12px; padding: 0; border: 0; min-width: 0; display: grid; gap: 2px; color: inherit; }
:root .rp .rp-pdf-legende { padding: 0; margin-bottom: 4px; font-size: 14px; font-weight: 600; }
:root .rp .rp-pdf-niveau { display: flex; align-items: flex-start; gap: 10px; min-height: 44px; padding: 8px 0; font-size: 15px; line-height: 1.4; cursor: pointer; }
:root .rp .rp-pdf-niveau input { flex: none; width: 20px; height: 20px; margin: 1px 0 0; accent-color: currentColor; }
:root .rp .rp-pdf-niveau strong { font-weight: 600; }
:root .rp .rp-appel-fin .rp-btn-2 { background: transparent; color: var(--dt-on-band); border-color: var(--dt-on-band); }
:root .rp .rp-appel-fin .r2-demande-faite-ligne, :root .rp .rp-appel-fin .r2-demande-lien { color: var(--dt-on-band); }
:root .rp .rp-appel-fin .r2-demande-btn { color: var(--dt-on-band); border-color: var(--dt-on-band); }
:root .rp .rp-appel-fin .r2-demande-btn:hover:not(:disabled) { background: rgba(255, 255, 255, .1); }
:root .rp .rp-appel-suite { grid-column: 1 / -1; }
:root .rp .rp-stat-seule { grid-column: 1 / -1; }
:root .rp .rp-a-h3 { display: inline; font: inherit; color: inherit; }
:root .rp .rp-paliers { display: grid; gap: 6px; margin: 4px 0; }
:root .rp .rp-paliers li { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 12px; padding: 8px 12px; border-radius: 10px; background: var(--dt-surface); }
:root .rp .rp-palier-lib { font-weight: 600; color: var(--dt-ink); }
:root .rp .rp-palier-val { font: 800 18px/1.2 var(--display); color: var(--dt-ink); text-align: right; }
:root .rp .r2-decret-palier-sub { grid-column: 1 / -1; font-size: 14px; color: var(--dt-ink-2); }
:root .rp .rp-site-liste { display: grid; gap: 6px; }
:root .rp .rp-site-item { padding: 8px 12px; border-radius: 10px; background: var(--dt-surface); }
:root .rp .rp-site-item.is-watch { box-shadow: inset 0 0 0 2px var(--dt-ink); background: var(--dt-paper); }
:root .rp .rp-site-item strong { color: var(--dt-ink); }
:root .rp .r2-method-col { margin-top: 4px; }
@media (min-width: 760px) {
  :root .rp .rp-courtier { padding: 28px 32px; }
  :root .rp .rp-courtier-voies { grid-template-columns: auto minmax(0, 1fr); }
}
/* ========== Hors du rapport, portées sur <body> : la fenêtre de demande ========== */
:root .r2-gate-overlay { background: color-mix(in srgb, var(--dr-ink) 55%, transparent); backdrop-filter: none; font-family: var(--dr-text); }
:root .r2-gate-card {
  max-width: 600px; padding: clamp(22px, 4vw, 36px); border-radius: var(--dr-r-panel); background: var(--dr-paper); color: var(--dr-ink);
  box-shadow: 0 0 0 2px var(--dr-ink), 6px 6px 0 var(--dr-ink); font-family: var(--dr-text); font-size: 16px; line-height: 1.55;
}
:root .r2-gate-close { width: 48px; height: 48px; top: 12px; right: 12px; border-radius: 12px; background: var(--dr-surface-alt); color: var(--dr-ink); font-size: 24px; }
:root .r2-gate-close:hover { background: var(--dr-surface-alt-2); color: var(--dr-ink); }
:root .r2-gate-surtitre { margin: 0 56px 8px 0; font: 700 14px/1.3 var(--dr-display); letter-spacing: 0.01em; text-transform: none; color: var(--dr-ink-2); }
:root .r2-gate-title { margin: 0 0 10px; font: 800 clamp(24px, 3vw, 32px)/1.05 var(--dr-display); letter-spacing: -0.03em; color: var(--dr-ink); }
:root .r2-gate-title:focus-visible { outline: 3px solid var(--dr-accent); }
:root .r2-gate-text { margin: 0 0 18px; font-size: 17px; line-height: 1.5; color: var(--dr-ink-2); }
:root .r2-gate-ensuite { margin: 0 0 16px; padding: 14px 0 0; border: 0; border-top: 2px dashed var(--dr-surface-alt-2); border-radius: 0; background: none; font-size: 15px; color: var(--dr-ink-2); }
:root .r2-gate-ensuite .r2-gate-ensuite-titre { margin-bottom: 4px; font: 700 16px/1.3 var(--dr-display); letter-spacing: 0; text-transform: none; color: var(--dr-ink); }
:root .r2-gate-trust-strip { margin-bottom: 18px; padding: 14px 16px; border: 0; border-radius: 14px; background: var(--dr-encart); font-size: 15px; color: var(--dr-ink); }
:root .r2-gate-trust-strip svg { color: var(--dr-repere); font-size: 20px; }
:root .r2-gate-field-label { margin-bottom: 8px; font: 700 15px/1.3 var(--dr-display); letter-spacing: 0; text-transform: none; color: var(--dr-ink); }
:root .r2-gate-field-label svg { color: var(--dr-repere); font-size: 18px; }
:root .r2-gate-phone-input { min-height: 52px; padding: 12px 14px; border: 2px solid var(--dr-ink-3); border-radius: var(--dr-r-control); background: var(--dr-paper); color: var(--dr-ink); font: 400 17px/1.3 var(--dr-text); }
:root .r2-gate-phone-input:focus { border-color: var(--dr-ink); box-shadow: 0 0 0 3px color-mix(in srgb, var(--dr-accent) 30%, transparent); }
:root .r2-gate-phone-input.error { border-color: var(--dr-erreur); box-shadow: none; }
:root .r2-gate-phone-error { font-size: 14px; color: var(--dr-erreur); }
:root .r2-gate-stage-btn { min-height: 48px; padding: 10px 12px; border: 2px solid var(--dr-surface-alt-2); border-radius: var(--dr-r-control); background: var(--dr-paper); }
:root .r2-gate-stage-btn:hover { border-color: var(--dr-ink-3); background: var(--dr-paper); }
:root .r2-gate-stage-btn.selected { border-color: var(--dr-ink); background: var(--dr-surface); box-shadow: inset 0 0 0 1px var(--dr-ink); }
:root .r2-gate-stage-btn:has(input:focus-visible) { outline: 3px solid var(--dr-accent); }
:root .r2-gate-stage-l, :root .r2-gate-stage-btn.selected .r2-gate-stage-l { font: 600 15px/1.3 var(--dr-text); color: var(--dr-ink); }
:root .r2-gate-checkbox-wrap { margin: 14px 0 18px; padding: 14px 16px; border: 2px solid transparent; border-radius: 14px; background: var(--dr-surface); }
:root .r2-gate-checkbox-wrap:hover { border-color: var(--dr-ink-3); }
:root .r2-gate-checkbox-wrap.checked { border-color: var(--dr-ink); background: var(--dr-paper); }
:root .r2-gate-checkbox-wrap input[type=checkbox] { width: 22px; height: 22px; accent-color: var(--dr-ink); }
:root .r2-gate-checkbox-label { font-size: 15px; color: var(--dr-ink); }
:root .r2-gate-checkbox-mention { font-size: 13px; color: var(--dr-ink-2); }
:root .r2-gate-cta { display: flex; width: 100%; min-height: 54px; }
:root .r2-gate-cta:disabled { background: var(--dr-surface-alt-2); color: var(--dr-ink-2); box-shadow: none; transform: none; cursor: not-allowed; }
:root .r2-gate-erreur { padding: 12px 14px; border: 0; border-radius: var(--dr-r-control); background: var(--dr-erreur-pale); box-shadow: inset 0 0 0 2px var(--dr-erreur); font-size: 15px; color: var(--dr-erreur); }
:root .r2-gate-bonus { margin: 14px 0 0; font-size: 14px; color: var(--dr-ink-2); }
:root .r2-gate-secondary-exit { min-height: 44px; margin-top: 6px; font-size: 15px; color: var(--dr-ink-2); text-decoration-color: var(--dr-accent); text-underline-offset: 3px; }
:root .r2-gate-secondary-exit:hover { color: var(--dr-ink); }
:root .r2-gate-preparer { margin-top: 14px; padding-top: 12px; border-top: 2px dashed var(--dr-surface-alt-2); font-size: 14px; color: var(--dr-ink-2); }
:root .r2-gate-rgpd { margin-top: 14px; font-size: 13px; line-height: 1.5; color: var(--dr-ink-2); }
:root .r2-gate-rgpd a { color: var(--dr-ink); text-decoration-color: var(--dr-accent); }
/* La prise de rendez-vous en ligne (lot L8, 16/10) : un encadre sous la confirmation, et un lien discret sous chaque appel. */
:root .r2-gate-rdv { margin: 16px 0 14px; padding: 14px 16px; border-radius: 14px; background: var(--dr-surface); }
:root .r2-gate-rdv-titre { margin: 0; font: 700 17px/1.3 var(--dr-text); color: var(--dr-ink); }
:root .r2-gate-rdv-texte { margin: 4px 0 0; font-size: 15px; color: var(--dr-ink-2); }
:root .r2-gate-rdv-lien { display: inline-flex; align-items: center; min-height: 44px; font: 600 16px/1.3 var(--dr-text); color: var(--dr-ink); text-decoration: underline; text-decoration-color: var(--dr-accent); text-decoration-thickness: 2px; text-underline-offset: 4px; }
:root .r2-gate-rdv-lien:hover { text-decoration-thickness: 3px; }
:root .rp .rp-rdv a, :root .rp .rp-lien-micro a { color: inherit; font-weight: 600; text-decoration: underline; text-decoration-color: var(--dt-accent); text-underline-offset: 3px; }
@media (max-width: 640px) {
  :root .r2-gate-stage-grid { grid-template-columns: minmax(0, 1fr); }
  :root .r2-gate-card { padding: 24px 18px; }
}
@media (prefers-reduced-motion: reduce) {
  :root .r2-gate-cta { transition: none; }
}
@media (forced-colors: active) {
  :root .rp .rp-feuille, :root .rp .rp-appel, :root .rp .rp-appel-fin, :root .rp .rp-total, :root .rp .rp-pli, :root .r2-gate-card { border: 2px solid CanvasText; }
}
/* À l'impression : le rapport sur fond blanc, sans l'en-tête ni le pied du site. */
@media print {
  :root body:has(.new-diagnostic-report) { background: #FFFFFF; }
  :root .new-diagnostic-report { padding: 0; }
  :root .rp .rp-action, :root .rp .rp-proj-stats > div { break-inside: avoid; }
  :root .dr-site { display: none; }
}