/* Mentions légales de la v5 : même polices et mêmes couleurs que le site, en page de texte simple */
@font-face { font-family: "Host Grotesk"; src: url("fonts/host-grotesk-latin-wght-normal.woff2") format("woff2"); font-weight: 300 800; font-display: swap; }
@font-face { font-family: "Barlow Condensed"; src: url("fonts/barlow-condensed-latin-700-normal.woff2") format("woff2"); font-weight: 700; font-display: swap; }
:root { --fond: #121212; --texte: #ffffff; --gris: #8d8d8d; --trait: rgba(255, 255, 255, .16); --marge: clamp(20px, 4vw, 64px); }
:root[data-theme="clair"] { --fond: #eef1f3; --texte: #2b2b2b; --gris: #6c7179; --trait: rgba(43, 43, 43, .16); }
* { box-sizing: border-box; }
html, body { background: var(--fond); }
body { margin: 0; color: var(--texte); font-family: "Host Grotesk", Arial, sans-serif; line-height: 1.55; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-underline-offset: 3px; }
.tete { display: flex; justify-content: space-between; align-items: center; padding: 22px var(--marge); font-size: 13px; font-weight: 600; letter-spacing: .02em; }
.tete a { text-decoration: none; }
.retour { color: var(--gris); }
.page { max-width: 760px; margin: 0 auto; padding: clamp(40px, 7vw, 90px) var(--marge) 80px; }
h1 { margin: 0; font-family: "Barlow Condensed", "Arial Narrow", sans-serif; font-weight: 700; font-size: clamp(48px, 8vw, 96px); line-height: .9; text-transform: uppercase; }
.date { margin: 14px 0 0; color: var(--gris); font-size: 14px; }
section { margin-top: 48px; padding-top: 22px; border-top: 1px solid var(--trait); }
h2 { margin: 0 0 14px; font-size: 13px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--gris); }
p, ul { margin: 0 0 12px; font-size: 17px; }
ul { padding-left: 1.2em; }
dl { margin: 0; display: grid; gap: 8px; }
dl div { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 16px; font-size: 17px; }
dt { color: var(--gris); }
dd { margin: 0; }
.pied { padding: 30px var(--marge) 40px; border-top: 1px solid var(--trait); font-size: 13px; color: var(--gris); }
@media (max-width: 560px) { dl div { grid-template-columns: minmax(0, 1fr); gap: 0; } dl div + div { margin-top: 8px; } }
