/* Couleurs et typographie communes à tout le site (couleurs de la diapo 5 de la présentation). */
:root{
  --bg:#F7FAFB; --surface:#FFFFFF; --ink:#13304A; --muted:#5B7083; --line:#D5E2E8;
  --c1:#F06B6A; --c2:#169FD6; --c3:#36B39B; --c4:#E9AE3B; --c5:#2B9B67;
  --good:#2B9B67; --bad:#D2433F;
  --font:"Lexend", system-ui, -apple-system, "Segoe UI", sans-serif;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--bg:#0E1D2B;--surface:#162A3C;--ink:#EAF2F7;--muted:#9DB2C3;--line:#2A4256;color-scheme:dark}}
:root[data-theme="dark"]{--bg:#0E1D2B;--surface:#162A3C;--ink:#EAF2F7;--muted:#9DB2C3;--line:#2A4256;color-scheme:dark}
html,body{background:var(--bg);color:var(--ink)}
body{margin:0;font:16px/1.45 var(--font);padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:16px 40px}
main{max-width:980px;margin:0 auto;display:grid;gap:22px}
h1{font-size:clamp(1.5rem,4.5vw,2.3rem);font-weight:800;margin:0;line-height:1.15;text-wrap:balance}
.sub{margin:6px 0 0;color:var(--muted)}
*{box-sizing:border-box}
a{color:inherit}
.site-nav{max-width:980px;margin:0 auto 8px;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;font-size:.9rem}
.site-nav a{text-decoration:none;font-weight:700;color:var(--muted)}
.site-nav a:hover{color:var(--ink)}
.site-footer{max-width:980px;margin:32px auto 0;color:var(--muted);font-size:.85rem}
a:focus-visible,button:focus-visible{outline:3px solid var(--c2);outline-offset:3px}