@font-face {
  font-family: Archivo;
  src: url("../fonts/archivo-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
}
@font-face {
  font-family: Inter;
  src: url("../fonts/inter-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}
@font-face {
  font-family: "JetBrains Mono";
  src: url("../fonts/jetbrains-mono-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}
:root {
  --font-display: Archivo, "Arial Narrow", sans-serif;
  --font-body: Inter, system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --color-bg: #f8fafc;
  --color-bg-elevated: #fff;
  --color-surface: #eef1f6;
  --color-surface-hover: #e3e9f3;
  --color-text: #121319;
  --color-text-muted: #525b6c;
  --color-border: #d2d9e3;
  --color-accent: #3b82f6;
  --color-accent-hover: #2563eb;
  --color-link: #1d59bb;
  --color-on-accent: #fff;
  --color-button: #215fcb;
  --color-button-hover: #1d53b2;
  --color-focus: #1759c5;
  --color-grid: #dfe4ed;
  --color-success: #16704f;
  --color-danger: #b82738;
  --color-accent-soft: #e8efff;
  --color-glass-bg: rgba(255, 255, 255, 0.55);
  --color-glass-border: rgba(18, 19, 25, 0.12);
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-24: 6rem;
  --space-32: 8rem;
  --radius-sm: 8px;
  --radius: 16px;
  --radius-lg: 24px;
  --content-width: 1280px;
  --wide-width: 1440px;
  --gutter: clamp(20px, 4vw, 48px);
  --text-display: clamp(3rem, 5.4vw, 5.4rem);
  --text-h1: clamp(2.8rem, 5vw, 5rem);
  --text-h2: clamp(2.1rem, 3.5vw, 3.5rem);
  --text-h3: clamp(1.35rem, 2vw, 1.8rem);
  --text-lg: clamp(1.05rem, 1.25vw, 1.2rem);
  --text-sm: 0.8125rem;
  --shadow: 0 20px 60px #1213190a;
  color-scheme: light;
}
[data-theme="dark"] {
  --color-bg: #121319;
  --color-bg-elevated: #171920;
  --color-surface: #1b1d25;
  --color-surface-hover: #242833;
  --color-text: #f8fafc;
  --color-text-muted: #a7afbf;
  --color-border: #30343f;
  --color-accent: #3b82f6;
  --color-accent-hover: #548ff8;
  --color-link: #84b3ff;
  --color-button: #2866d1;
  --color-button-hover: #316fda;
  --color-focus: #8bb8ff;
  --color-grid: #242731;
  --color-success: #77d5ac;
  --color-danger: #ff9aa4;
  --color-accent-soft: #1d2b43;
  --color-glass-bg: rgba(255, 255, 255, 0.06);
  --color-glass-border: rgba(255, 255, 255, 0.14);
  --shadow: 0 20px 60px #0000001a;
  color-scheme: dark;
}
