/* Le même système que l'app et que la page d'accueil : Studio, chambre
   noire, jaune flash. Une page légale n'a pas à ressembler à un formulaire
   administratif — c'est encore le produit qui parle. */
:root {
  --screen: #E7E8F0;
  --night: #101014;
  --paper: #F4F5F9;
  --ink: #111114;
  --ink60: #6E7080;
  --flash: #FFEF46;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  background: var(--screen);
  color: var(--ink);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  line-height: 1.55;
}

header.darkroom {
  background: var(--night);
  color: var(--paper);
  border-radius: 0 0 34px 34px;
  padding: 40px 24px 34px;
  text-align: center;
}
header .perf {
  display: flex; justify-content: center; gap: 8px;
  margin: 0 auto; width: min(160px, 52vw);
}
header .perf span { background: #26262D; border-radius: 3px; height: 9px; flex: 1; }
header .name {
  font-size: 12px; font-weight: 600; letter-spacing: 11px;
  padding-left: 11px; margin: 9px 0 -8px;
}
header .number { font-size: 52px; font-weight: 800; letter-spacing: -2px; line-height: 1.05; }
header h1 { font-size: 19px; font-weight: 700; margin-top: 16px; letter-spacing: -0.2px; }
header .updated { color: #8A8C99; font-size: 12px; margin-top: 8px; }

main { padding: 32px 24px 48px; max-width: 660px; margin: 0 auto; width: 100%; }

/* Le résumé : ce que quelqu'un lit vraiment. Le détail vient après, pour
   ceux qui le cherchent — mais l'essentiel ne doit pas dépendre d'eux. */
.summary {
  background: #fff;
  border-radius: 22px;
  padding: 22px 24px;
  margin-bottom: 34px;
}
.summary h2 { font-size: 15px; margin-bottom: 12px; letter-spacing: -0.2px; }
.summary ul { list-style: none; }
.summary li {
  display: flex; gap: 12px; align-items: baseline;
  margin-bottom: 9px; font-size: 15px; color: var(--ink60);
}
.summary li::before { content: "—"; color: var(--flash); font-weight: 800; }
.summary li b { color: var(--ink); font-weight: 600; }

section { margin-bottom: 30px; }
section h2 {
  font-size: 11px; font-weight: 600; letter-spacing: 1.6px;
  text-transform: uppercase; color: var(--ink60); margin-bottom: 10px;
}
section p, section li { font-size: 15.5px; margin-bottom: 10px; }
section ul { padding-left: 20px; }
section li { margin-bottom: 6px; }
strong { font-weight: 600; }
a { color: var(--ink); text-underline-offset: 3px; }

.address { font-variant-numeric: tabular-nums; }

/* Ce qui reste à compléter avant la mise en ligne publique. Visible
   exprès : une mention légale incomplète doit se voir, pas se deviner. */
.todo {
  background: #FFF6C7;
  border-radius: 12px;
  padding: 12px 16px;
  font-size: 14px;
  color: #6B5B00;
}

footer {
  margin-top: auto;
  padding: 28px 24px 36px;
  text-align: center;
  color: var(--ink60);
  font-size: 12px;
}
footer a { color: var(--ink60); }
footer nav { margin-bottom: 8px; }
footer nav a { margin: 0 8px; }