/* ENGENDRE par construire-theme.py depuis 04-contenu/etudes-breeam-hqe.src.html. */
/* --- propre à la page ---
   Sous-page de Conception, 17/09/2026 : option C de l'atelier BREEAM (« une
   page dédiée et un résumé sur Conception »), titre de 58 caractères choisi
   par Alexandre. « On va garder une page principale en Conception et on fera
   une genre de page ressource, ou une sous-page vraiment certif. » Conception
   garde le résumé ; ici, le détail enjeu par enjeu. Il réalise lui-même les
   sept études (réponse du 17/09 : la matrice breeam-v7 est corrigée).
   Tout nombre vient du registre : breeam-v7-poids-25-very-good,
   breeam-v7-points-enjeux, breeam-v7-poids-etudes, breeam-v7-credits-etudes,
   breeam-v7-seuils, breeam-inuse-v6-enjeux. Pas de photo pour l'instant
   (atelier photos-pages). Haut de page en texte seul, comme Contact. */
.page{--ecart:clamp(20px,2.4vw,44px)}

/* le haut de page, en texte seul */
.tete-page{padding-block:calc(var(--respire) * 1.6) 0}
.tete-page h1{font-size:clamp(2rem,3.6vw,3.6rem);line-height:1;letter-spacing:-.045em;margin:0;max-width:16ch;text-wrap:balance}
.tete-page .accroche{margin:clamp(16px,1.8vw,28px) 0 0;max-width:60ch;font-size:clamp(1.1875rem,1.4vw,1.45rem);line-height:1.5;text-wrap:pretty}

/* le chiffre, comme sur Conception */
.certif{display:grid;gap:clamp(20px,2.4vw,40px)}
.certif__chiffre{margin:0}
.certif__n{display:block;font-family:var(--f-display);font-weight:700;font-size:clamp(3.4rem,7vw,7.2rem);line-height:.95;letter-spacing:-.05em}
.certif__n small{font-size:.45em;letter-spacing:-.02em;margin-left:.08em}
.certif__l{display:block;margin-top:var(--s4);font-family:var(--f-display);font-weight:600;font-size:clamp(1.2rem,1.1rem + .45vw,1.6rem);line-height:1.2;letter-spacing:-.02em;max-width:24ch;text-wrap:balance}
.certif__texte{margin:0;max-width:56ch;text-wrap:pretty}
.certif__texte a,.section-note a,.enjeux-note a{color:inherit;text-underline-offset:3px}
@media (min-width:1100px){
  .certif{grid-template-columns:calc((2 * 100% - 3 * var(--ecart)) / 5) minmax(0,1fr);column-gap:var(--ecart);align-items:start}
}

/* les enjeux : le code, la méthode, le poids dans la note */
.enjeux{list-style:none;margin:clamp(28px,3vw,48px) 0 0;padding:0}
.enjeu{display:grid;grid-template-columns:5.2em minmax(0,1fr);column-gap:var(--s4);row-gap:var(--s2);align-items:baseline;padding-block:var(--s5);border-top:1px solid var(--ink)}
.enjeu__code{font-family:var(--f-display);font-weight:700;letter-spacing:-.01em}
.enjeu h3{font-size:clamp(1.05rem,1rem + .25vw,1.25rem);line-height:1.2;letter-spacing:-.015em;margin:0 0 var(--s2);text-wrap:balance}
.enjeu p{margin:0;text-wrap:pretty}
.enjeu h3 a{color:inherit;text-underline-offset:4px;text-decoration-thickness:1px}
.enjeu p + p{margin-top:var(--s2)}
.enjeu__credits{font-size:var(--t-mention)}
.enjeu__poids{grid-column:2;display:grid;grid-template-columns:minmax(0,1fr) 5.5em;column-gap:var(--s3);align-items:center}
.enjeu__barre{display:block;height:10px;background:var(--ink)}
/* la longueur de chaque barre : les points de l'enjeu, rapportés à Mat 01 (7,75) */
.enjeu__barre--100{width:100%}.enjeu__barre--54{width:53.8%}.enjeu__barre--53{width:53.3%}
.enjeu__barre--40{width:40.4%}.enjeu__barre--32{width:32%}.enjeu__barre--23{width:22.5%}.enjeu__barre--20{width:20.3%}
.enjeu__valeur{justify-self:end;font-family:var(--f-display);font-weight:600;font-size:var(--t-mention);font-variant-numeric:tabular-nums;white-space:nowrap}
@media (max-width:560px){.enjeu{grid-template-columns:1fr}.enjeu__poids{grid-column:1}}
@media (min-width:900px){
  .enjeu{grid-template-columns:5.2em minmax(0,1fr) calc((2 * 100% - 3 * var(--ecart)) / 5);column-gap:var(--ecart)}
  .enjeu__poids{grid-column:3}
}
.enjeux-note{margin:var(--s4) 0 0;font-size:var(--t-mention);max-width:74ch}

/* les seuils de notation, du plus bas au plus haut */
.seuils{list-style:none;margin:clamp(24px,2.6vw,40px) 0 0;padding:0;display:grid;grid-template-columns:1fr;border-top:1px solid var(--ink)}
.seuil{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s4);padding-block:var(--s3);border-bottom:1px solid var(--ink)}
.seuil__n{font-family:var(--f-display);font-weight:700;font-size:clamp(1.6rem,2.4vw,2.6rem);line-height:1;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.seuil__nom{font-family:var(--f-display);font-weight:600}
@media (min-width:761px){
  .seuils{grid-template-columns:repeat(5,minmax(0,1fr));column-gap:var(--ecart);border-top:0}
  .seuil{flex-direction:column-reverse;justify-content:flex-end;gap:var(--s2);border-bottom:0;border-top:1px solid var(--ink);padding-block:var(--s4) 0}
}
.section-note{margin:var(--s5) 0 0;max-width:68ch;text-wrap:pretty}

/* In-Use et HQE : deux colonnes de texte */
.deux{display:grid;gap:clamp(28px,3vw,56px);margin-top:clamp(28px,3vw,48px)}
.deux h2{margin:0 0 var(--s4)}
.deux p{margin:0;max-width:62ch;text-wrap:pretty}
.deux p + p{margin-top:var(--s3)}
@media (min-width:1100px){.deux{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(28px,4vw,72px)}}
.certif__note{margin:clamp(28px,3vw,48px) 0 0;font-size:var(--t-mention);max-width:74ch}
