/* ===== Jetons ===================================================== */
:root{
  --ground:#F2F1EE; --ground-2:#E8E6E1; --surface:#FFFFFF;
  --ink:#14161B; --ink-2:#3A3F48; --muted:#646A74;
  --line:#DCD9D3; --line-soft:#E6E3DE;
  --accent:#1F3FD8; --accent-ink:#F4F6FF; --accent-wash:rgba(31,63,216,.07);
  --invert-ground:#14161B; --invert-ink:#ECEDF1; --invert-muted:#9298A4; --invert-line:#2A2E37;
  --shadow:0 1px 2px rgba(20,22,27,.04), 0 12px 32px -18px rgba(20,22,27,.24);
  --danger:#B3261E;
  --trace:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20300%2014%27%20preserveAspectRatio%3D%27none%27%3E%3Cpath%20d%3D%27M3%209.4C42%204.1%2079%2011.2%20119%206.6%20159%202%20197%2010.4%20237%205.6%20266%202.1%20286%206.2%20297%204.4%27%20fill%3D%27none%27%20stroke%3D%27%231F3FD8%27%20stroke-width%3D%273.4%27%20stroke-linecap%3D%27round%27%2F%3E%3C%2Fsvg%3E");
  --f-display:"Bricolage Grotesque","Helvetica Neue",Arial,sans-serif;
  --f-body:"Newsreader",Georgia,"Times New Roman",serif;
  --f-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --step:clamp(1rem,.6rem + 1.2vw,1.5rem);
  --gutter:clamp(1.25rem,5vw,3rem);
  --rule:1px solid var(--line);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --ground:#0E1014; --ground-2:#14171D; --surface:#171A21;
    --ink:#ECEDF1; --ink-2:#C6CAD3; --muted:#9298A4;
    --line:#272B34; --line-soft:#1E222A;
    --accent:#7B93FF; --accent-ink:#0B1024; --accent-wash:rgba(123,147,255,.11);
    --invert-ground:#0A0C10; --invert-ink:#ECEDF1; --invert-muted:#9298A4; --invert-line:#22262E;
    --shadow:0 1px 2px rgba(0,0,0,.45), 0 16px 40px -22px rgba(0,0,0,.8);
    --danger:#F28B84;
    --trace:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20300%2014%27%20preserveAspectRatio%3D%27none%27%3E%3Cpath%20d%3D%27M3%209.4C42%204.1%2079%2011.2%20119%206.6%20159%202%20197%2010.4%20237%205.6%20266%202.1%20286%206.2%20297%204.4%27%20fill%3D%27none%27%20stroke%3D%27%237B93FF%27%20stroke-width%3D%273.4%27%20stroke-linecap%3D%27round%27%2F%3E%3C%2Fsvg%3E");
  }
}
:root[data-theme="dark"]{
  --ground:#0E1014; --ground-2:#14171D; --surface:#171A21;
  --ink:#ECEDF1; --ink-2:#C6CAD3; --muted:#9298A4;
  --line:#272B34; --line-soft:#1E222A;
  --accent:#7B93FF; --accent-ink:#0B1024; --accent-wash:rgba(123,147,255,.11);
  --invert-ground:#0A0C10; --invert-ink:#ECEDF1; --invert-muted:#9298A4; --invert-line:#22262E;
  --shadow:0 1px 2px rgba(0,0,0,.45), 0 16px 40px -22px rgba(0,0,0,.8);
  --danger:#F28B84;
  --trace:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20300%2014%27%20preserveAspectRatio%3D%27none%27%3E%3Cpath%20d%3D%27M3%209.4C42%204.1%2079%2011.2%20119%206.6%20159%202%20197%2010.4%20237%205.6%20266%202.1%20286%206.2%20297%204.4%27%20fill%3D%27none%27%20stroke%3D%27%237B93FF%27%20stroke-width%3D%273.4%27%20stroke-linecap%3D%27round%27%2F%3E%3C%2Fsvg%3E");
}

/* ===== Base ======================================================= */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--f-body);
  font-size:clamp(1rem,.95rem + .2vw,1.06rem);line-height:1.68;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--f-display);font-weight:600;letter-spacing:-.022em;line-height:1.15;
  text-wrap:balance;margin:0}
p,ul,ol{margin:0}
a{color:var(--accent);text-underline-offset:3px}
a:hover{color:var(--ink)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}
.wrap{width:min(760px,100% - var(--gutter)*2);margin-inline:auto}
.mono{font-family:var(--f-mono);font-size:.7rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase}

/* Entête simplifiée, même pilule que la page d'accueil */
.top{position:sticky;top:0;z-index:50;padding-top:.85rem}
.top-in{display:flex;align-items:center;gap:1rem;height:60px;padding-inline:1.25rem .7rem;
  border:1px solid var(--line);border-radius:999px;
  background:color-mix(in srgb,var(--surface) 82%,transparent);
  backdrop-filter:blur(14px) saturate(150%);-webkit-backdrop-filter:blur(14px) saturate(150%);
  box-shadow:0 1px 2px rgba(20,22,27,.04), 0 14px 34px -22px rgba(20,22,27,.45)}
.brand{display:flex;align-items:center;gap:.55rem;text-decoration:none;margin-right:auto;color:var(--ink)}
/* Le bloc Q + mot pivote d'un seul tenant : tour complet, pour que ni le
   monogramme ni le mot ne s'affichent en miroir. Perspective sur le parent. */
.brand{perspective:640px}
.brand .lockup{display:flex;align-items:center;gap:.5rem;transform-style:preserve-3d;
  transition:transform .72s cubic-bezier(0,0,.2,1)}
.brand:hover .lockup,.brand:focus-visible .lockup{transform:rotateY(360deg)}
.brand .mark{display:block;width:21px;height:21px;flex:none;color:var(--accent);
  transition:color .72s ease}
.brand .mark svg{display:block;width:100%;height:100%}
.brand:hover .mark,.brand:focus-visible .mark{color:var(--ink)}
@media (prefers-reduced-motion:reduce){
  .brand .lockup{transition:none}
  .brand:hover .lockup,.brand:focus-visible .lockup{transform:none}
}

.brand:hover{color:var(--ink)}
.brand b{font-family:var(--f-display);font-weight:700;font-size:1.22rem;letter-spacing:-.03em}
.brand .baseline{font-family:var(--f-mono);font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
@media (max-width:560px){.brand .baseline{display:none}}
.theme-toggle{width:38px;height:38px;flex:none;display:grid;place-items:center;cursor:pointer;padding:0;
  background:transparent;border:1px solid var(--line);border-radius:50%;color:var(--muted);
  transition:color .18s,border-color .18s}
.theme-toggle:hover{color:var(--ink);border-color:var(--accent)}
.theme-toggle svg{width:17px;height:17px;display:block}
.theme-toggle .i-moon{display:none}
:root[data-theme="dark"] .theme-toggle .i-moon{display:block}
:root[data-theme="dark"] .theme-toggle .i-sun{display:none}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .theme-toggle .i-moon{display:block}
  :root:not([data-theme="light"]) .theme-toggle .i-sun{display:none}
}
::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}
::view-transition-old(root){z-index:0}::view-transition-new(root){z-index:1}

/* Corps de page légale */
main{padding:clamp(2.75rem,6vw,4.5rem) 0 clamp(3rem,6vw,5rem)}
.page-head{margin-bottom:clamp(2rem,4vw,3rem)}
.page-head .mono{color:var(--accent);display:flex;align-items:center;gap:.6rem}
.page-head .mono::before{content:"";width:26px;height:1px;background:currentColor}
h1{font-size:clamp(1.9rem,1.3rem + 2.4vw,2.9rem);margin:1.2rem 0 .9rem}
.maj{font-family:var(--f-mono);font-size:.72rem;letter-spacing:.08em;color:var(--muted)}
section.bloc{padding:clamp(1.5rem,3vw,2rem) 0;border-top:1px solid var(--line)}
section.bloc h2{font-size:clamp(1.15rem,1rem + .6vw,1.4rem);margin-bottom:.85rem}
section.bloc h3{font-size:1rem;margin:1.25rem 0 .5rem}
section.bloc p + p{margin-top:.8rem}
section.bloc p{color:var(--ink-2);max-width:68ch}
.def{display:grid;grid-template-columns:190px 1fr;gap:.55rem 1.5rem;margin-top:.5rem}
@media (max-width:640px){.def{grid-template-columns:1fr;gap:.15rem}}
.def dt{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--muted);padding-top:.28rem}
.def dd{margin:0;color:var(--ink-2)}
.liste{margin-top:.7rem;display:grid;gap:.45rem}
.liste li{list-style:none;display:flex;gap:.7rem;align-items:baseline;color:var(--ink-2)}
.liste li::before{content:"";flex:none;width:9px;height:9px;border:1px solid var(--accent);
  border-radius:1px;transform:translateY(1px)}
.avert{border-left:2px solid var(--accent);background:var(--accent-wash);padding:.85rem 1rem;
  margin-top:1rem;border-radius:0 3px 3px 0}
.avert p{color:var(--ink);font-size:.94rem;max-width:none}

footer{background:var(--invert-ground);color:var(--invert-muted);margin-top:clamp(2rem,5vw,4rem)}
.foot-in{padding:2.25rem 0;display:flex;flex-wrap:wrap;gap:1rem 2rem;align-items:center;
  justify-content:space-between}
.foot-in a{font-family:var(--f-mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;
  text-decoration:none;color:var(--invert-muted)}
.foot-in a:hover{color:var(--invert-ink)}
.foot-in .marque{font-family:var(--f-display);font-weight:700;font-size:1.05rem;
  letter-spacing:-.03em;color:var(--invert-ink);text-decoration:none}

/* Page 404 */
.erreur{min-height:min(62svh,560px);display:grid;place-content:center;text-align:center;gap:1.1rem}
.erreur .code{font-family:var(--f-mono);font-size:.75rem;letter-spacing:.2em;color:var(--accent)}
.erreur h1{margin:0}
.erreur p{color:var(--ink-2);max-width:48ch;margin-inline:auto}
.erreur .btn{display:inline-flex;align-items:center;gap:.5rem;justify-self:center;margin-top:.6rem;
  font-family:var(--f-display);font-weight:600;font-size:.95rem;text-decoration:none;
  padding:.72rem 1.15rem;border-radius:999px;background:var(--accent);color:var(--accent-ink)}