/* ============================================================
   Lumina Design Tokens
   Source: DESIGN.md + 01-design-system-and-landing.html
   ============================================================ */

/* --- Font faces --- */
@font-face {
  font-family: 'FK Grotesk';
  src: url('../fonts/FKGrotesk-Thin.ttf') format('truetype');
  font-weight: 300;
  font-display: swap;
}
@font-face {
  font-family: 'FK Grotesk';
  src: url('../fonts/FKGrotesk-Regular.ttf') format('truetype');
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: 'FK Grotesk';
  src: url('../fonts/FKGrotesk-Medium.ttf') format('truetype');
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: 'FK Grotesk Mono';
  src: url('../fonts/FKGroteskMono-Regular.ttf') format('truetype');
  font-weight: 400;
  font-display: swap;
}

:root {
  /* --- Blue family --- */
  --blue-primary: #1E5BA8;
  --blue-ink: #091E42;
  --blue-deep: #0747A6;
  --blue-mid: #2684FF;
  --blue-sky: #DEEBFF;
  --blue-mist: #E6F0FF;
  --blue-paper: #EBF2FF;

  /* --- Warm accents (secondary only) --- */
  --cream: #F6F1E6;
  --terracotta: #C4704B;
  --terracotta-soft: #E5C3B0;
  --amber: #D4A53F;
  --sage: #8BA888;
  --coral: #E87461;

  /* --- Neutrals --- */
  --surface: #F8F9FD;
  --surface-container: #EEF1F8;
  --surface-high: #D8DCE8;
  --surface-bright: #FFFFFF;
  --ink: #1A1D24;
  --ink-2: #555D6E;
  --ink-3: #808899;
  --border: #E0E4ED;
  --border-subtle: #EEF1F8;

  /* --- Semantic --- */
  --success: #2D9F6F;
  --warning: #D4952B;
  --error: #C93B3B;

  /* --- Radii --- */
  --r-sm: 6px;
  --r-md: 8px;
  --r-lg: 12px;
  --r-xl: 16px;
  --r-2xl: 24px;

  /* --- Typography --- */
  --font-display: 'FK Grotesk', 'Inter Tight', system-ui, sans-serif;
  --font-ui: 'Inter', system-ui, sans-serif;
  --font-mono: 'FK Grotesk Mono', 'JetBrains Mono', ui-monospace, monospace;

  /* --- Content widths --- */
  --width-reading: 720px;
  --width-content: 1080px;
  --width-wide: 1280px;
}

/* --- Dark mode token overrides --- */
html.dark {
  --blue-primary: #81ecff;
  --blue-ink: #091E42;
  --blue-deep: #0747A6;
  --blue-mid: #81ecff;
  --blue-sky: #0A2E33;
  --blue-mist: #0A2E33;
  --blue-paper: #1A1D24;

  --cream: #1E1D1A;
  --terracotta: #D4816B;
  --terracotta-soft: #3D2A1F;

  --surface: #181A1F;
  --surface-container: #21242A;
  --surface-high: #2A2E35;
  --surface-bright: #31353D;
  --ink: #EEF0F5;
  --ink-2: #9DA3B0;
  --ink-3: #6C7385;
  --border: #353840;
  --border-subtle: #2A2E35;
}