/* Charte Hexagone — generated from tokens.json */
@font-face { font-family: "Bricolage Grotesque"; src: url("fonts/BricolageGrotesque-latin.woff2") format("woff2"); font-weight: 200 800; font-style: normal; font-display: swap; }
:root, [data-theme="light"] {
  --surface: #F2F1EE;
  --surface-raised: #FAF9F7;
  --line: #DEDBD4;
  --ink: #22252B;
  --ink-muted: #5E6168;
  --foyer: #D9D6CF;
  --data-mark: var(--ink);
  --data-zero: var(--ink-muted);
  --focus-ring: var(--ink);
  --persona-ocre: #AC812D;
  --persona-ocre-ink: #896724;
  --persona-ardoise: #4C6A88;
  --persona-ardoise-ink: #4C6A88;
  --persona-sauge: #679372;
  --persona-sauge-ink: #51735A;
  --persona-prune: #8A4F7D;
  --persona-prune-ink: #8A4F7D;
  --persona-argile: #B8674A;
  --persona-argile-ink: #A1593F;
  --persona-lin: #95876D;
  --persona-lin-ink: #766B56;
}
[data-theme="dark"] {
  --surface: #22252B;
  --surface-raised: #2B2F36;
  --line: #3A3E46;
  --ink: #F2F1EE;
  --ink-muted: #A9ACB2;
  --foyer: #4A4E57;
  --data-mark: var(--ink);
  --data-zero: var(--ink-muted);
  --focus-ring: var(--ink);
  --persona-ocre: #C29233;
  --persona-ocre-ink: #C29233;
  --persona-ardoise: #537495;
  --persona-ardoise-ink: #7190B0;
  --persona-sauge: #6F9A7A;
  --persona-sauge-ink: #6F9A7A;
  --persona-prune: #9D5A8F;
  --persona-prune-ink: #B47CA8;
  --persona-argile: #B8674A;
  --persona-argile-ink: #C27D64;
  --persona-lin: #A79C86;
  --persona-lin-ink: #A79C86;
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --v-margin: 72px;
  --v-gap: 44px;
  --v-safe-top: 200px;
  --v-safe-bottom: 320px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-full: 9999px;
  --font-display: "Bricolage Grotesque", system-ui, -apple-system, "Segoe UI", sans-serif;
}
.display { font-family: var(--font-display); font-size: 48px; line-height: 52px; font-weight: 780; letter-spacing: -0.035em; }
.title { font-family: var(--font-display); font-size: 28px; line-height: 34px; font-weight: 750; letter-spacing: -0.02em; }
.heading { font-family: var(--font-display); font-size: 20px; line-height: 28px; font-weight: 700; }
.body { font-family: var(--font-display); font-size: 16px; line-height: 24px; font-weight: 400; }
.figure { font-family: var(--font-display); font-size: 16px; line-height: 24px; font-weight: 650; }
.caption { font-family: var(--font-display); font-size: 13px; line-height: 18px; font-weight: 500; letter-spacing: 0.01em; }
.v-name { font-family: var(--font-display); font-size: 120px; line-height: 126px; font-weight: 800; letter-spacing: -0.035em; }
.v-question { font-family: var(--font-display); font-size: 56px; line-height: 64px; font-weight: 700; }
.v-label { font-family: var(--font-display); font-size: 44px; line-height: 52px; font-weight: 500; }
.v-figure { font-family: var(--font-display); font-size: 50px; line-height: 56px; font-weight: 700; }
.v-legend { font-family: var(--font-display); font-size: 40px; line-height: 50px; font-weight: 500; }
.v-source { font-family: var(--font-display); font-size: 36px; line-height: 44px; font-weight: 500; }