/* ─── Font Faces ─── */

@font-face {
  font-family: 'Science Gothic';
  src: url('/assets/fonts/ScienceGothic-Variable.ttf') format('truetype');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Exo 2';
  src: url('/assets/fonts/Exo2-Variable.ttf') format('truetype');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Exo 2';
  src: url('/assets/fonts/Exo2-Italic-Variable.ttf') format('truetype');
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: '0xProto';
  src: url('/assets/fonts/0xProto-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: '0xProto';
  src: url('/assets/fonts/0xProto-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: '0xProto';
  src: url('/assets/fonts/0xProto-Italic.woff2') format('woff2');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

/* ─── Design Tokens ─── */

:root {
  /* Colors
     Originals:
       --color-bg: #0b0b0f;
       --color-surface: #12121a;
       --color-border: #1e2a36;
       --color-text: #e6e6e6;
       --color-text-muted: #8a8a8a;
       --color-accent: #003c64;
       --color-accent-hover: #005a96;
  */
  --color-bg: #0b0b0f;
  --color-surface: #12121a;
  --color-border: #1e2a36;
  --color-text: #e6e6e6;
  --color-text-muted: #888888;
  --color-accent: #003c64;
  --color-accent-text: #004370;
  --color-accent-hover: #005a96;
  --color-accent-tagline: #ec8313; /* prev: #e68319, #f2830d, #ff8400 */

  /* Typography */
  --font-heading: 'Science Gothic', 'Exo 2', sans-serif;
  --font-body: 'Exo 2', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono: '0xProto', 'Fira Code', 'Cascadia Code', 'Consolas', monospace;

  /* Spacing */
  --space-xs: 0.25rem;
  --space-sm: 0.5rem;
  --space-md: 1rem;
  --space-lg: 2rem;
  --space-xl: 4rem;
  --space-2xl: 8rem;

  /* Sizes */
  --max-width: 64rem;
}
