/* ------------------------------------------------------------------
   Design tokens — Janus
   Palette sémantique : la dualité du modèle est encodée dans la couleur.
   · or / ambre  = masse positive, notre feuillet, énergie positive
   · violet      = masse négative, le feuillet jumeau, énergie négative
   · cyan        = géométrie, topologie, objets mathématiques
   ------------------------------------------------------------------ */

:root {
  /* — Fonds — */
  --bg: #07080d;
  --bg-deep: #05060a;
  --bg-raise: #0d0f17;
  --surface: rgba(255, 255, 255, 0.032);
  --surface-2: rgba(255, 255, 255, 0.055);
  --surface-solid: #11131c;
  --line: rgba(255, 255, 255, 0.09);
  --line-strong: rgba(255, 255, 255, 0.16);

  /* — Texte — */
  --ink: #eceef6;
  --ink-2: #b6bcd0;
  --ink-3: #8188a0;
  --ink-4: #5b6178;

  /* — Accents sémantiques — */
  --pos: #ffb454;
  --pos-soft: #ffd29b;
  --pos-deep: #b96f18;
  --pos-glow: rgba(255, 180, 84, 0.16);

  --neg: #9d8cff;
  --neg-soft: #c6bcff;
  --neg-deep: #5b45c4;
  --neg-glow: rgba(157, 140, 255, 0.16);

  --geo: #4fe3d0;
  --geo-soft: #a5f3e8;
  --geo-glow: rgba(79, 227, 208, 0.14);

  --warn: #ff7a6b;

  /* — Typographie — */
  --font-display: 'Space Grotesk', 'Segoe UI Variable Display', ui-sans-serif,
    system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-body: 'Inter', 'Segoe UI Variable Text', ui-sans-serif, system-ui,
    -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-mono: ui-monospace, 'JetBrains Mono', 'SFMono-Regular', 'Cascadia Mono',
    Menlo, Consolas, monospace;

  --step--2: clamp(0.72rem, 0.70rem + 0.10vw, 0.78rem);
  --step--1: clamp(0.83rem, 0.80rem + 0.14vw, 0.92rem);
  --step-0: clamp(0.97rem, 0.93rem + 0.20vw, 1.09rem);
  --step-1: clamp(1.15rem, 1.07rem + 0.38vw, 1.38rem);
  --step-2: clamp(1.4rem, 1.24rem + 0.76vw, 1.9rem);
  --step-3: clamp(1.75rem, 1.45rem + 1.45vw, 2.7rem);
  --step-4: clamp(2.15rem, 1.6rem + 2.7vw, 4rem);
  --step-5: clamp(2.6rem, 1.6rem + 4.7vw, 5.6rem);

  /* — Espacement / rythme — */
  --gutter: clamp(1.15rem, 0.7rem + 2.2vw, 2.75rem);
  --measure: 68ch;
  --shell: 1240px;
  --shell-wide: 1460px;

  /* — Formes — */
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 18px;
  --r-xl: 26px;

  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.5), 0 8px 26px -12px rgba(0, 0, 0, 0.8);
  --shadow-2: 0 2px 6px rgba(0, 0, 0, 0.55), 0 28px 60px -28px rgba(0, 0, 0, 0.9);

  /* — Mouvement — */
  --ease: cubic-bezier(0.22, 0.68, 0.32, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-1: 160ms;
  --dur-2: 320ms;
  --dur-3: 620ms;

  color-scheme: dark;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-1: 1ms;
    --dur-2: 1ms;
    --dur-3: 1ms;
  }
}