/* Ozvern — design tokens. Source de vérité : BRAND.md */

:root {
  /* Palette */
  --oz-bleu-detroit: #123C5B;
  --oz-opale: #3FA495;
  --oz-opale-claire: #5BC4B4;
  --oz-sable: #E3B368;
  --oz-ardoise: #2C2C2A;
  --oz-brume: #8FB8C9;
  --oz-ecume: #F6F4EF;

  /* Rôles */
  --oz-bg: var(--oz-ecume);
  --oz-text: var(--oz-ardoise);
  --oz-heading: var(--oz-bleu-detroit);
  --oz-accent: var(--oz-opale);
  --oz-accent-hover: #348A7E;

  /* Typographie */
  --oz-font-display: "Manrope", "Inter", system-ui, sans-serif;
  --oz-font-body: "Inter", system-ui, sans-serif;
  --oz-font-mono: "JetBrains Mono", ui-monospace, monospace;

  /* Rythme */
  --oz-radius: 8px;
  --oz-radius-card: 12px;
  --oz-maxwidth: 72rem;
}

@media (prefers-color-scheme: dark) {
  :root {
    --oz-bg: #0E2A40;
    --oz-text: var(--oz-ecume);
    --oz-heading: var(--oz-ecume);
    --oz-accent: var(--oz-opale-claire);
    --oz-accent-hover: #7AD4C6;
  }
}

body {
  background: var(--oz-bg);
  color: var(--oz-text);
  font-family: var(--oz-font-body);
  font-size: 1rem;
  line-height: 1.7;
}

h1, h2, h3 {
  font-family: var(--oz-font-display);
  font-weight: 500;
  letter-spacing: 0.02em;
  color: var(--oz-heading);
}

a { color: var(--oz-accent); }
a:hover { color: var(--oz-accent-hover); }