@font-face {
  font-family: "IGC Fraunces";
  src: url("../fonts/fraunces-latin.woff2") format("woff2");
  font-display: swap;
}
@font-face {
  font-family: "IGC Inter";
  src: url("../fonts/inter-latin.woff2") format("woff2");
  font-display: swap;
}
@font-face {
  font-family: "IGC Archivo";
  src: url("../fonts/archivo-black-latin.woff2") format("woff2");
  font-display: swap;
}

:root {
  --void: #080807;
  --graphite: #171613;
  --graphite-raised: #24211c;
  --warm-white: #f3eee3;
  --warm-muted: #bbb3a6;
  --warm-faint: #817a70;
  --brass: #bd934c;
  --brass-bright: #dfbd78;
  --brass-deep: #7b5d2d;
  --brass-hover: #a77f40;
  --success: #618a70;
  --error: #b76864;
  --line: color-mix(in srgb, var(--brass) 38%, transparent);
  --line-faint: color-mix(in srgb, var(--warm-white) 10%, transparent);
  --surface-wash: color-mix(in srgb, var(--warm-white) 3%, transparent);
  --bg: var(--void);
  --bg-warm: var(--void);
  --surface: var(--graphite);
  --surface-2: var(--graphite-raised);
  --raised: var(--graphite-raised);
  --text: var(--warm-white);
  --muted: var(--warm-muted);
  --faint: var(--warm-faint);
  --gold: var(--brass);
  --gold-bright: var(--brass-bright);
  --gold-deep: var(--brass-deep);
  --gold-hover: var(--brass-hover);

  /* type */
  --font-display: "IGC Fraunces", Georgia, serif;
  --font-sans: "IGC Inter", -apple-system, "Segoe UI", system-ui, sans-serif;
  --font-ui: var(--font-sans);
  --font-heavy: "IGC Archivo", var(--font-sans);
  --font-mono: ui-monospace, "SF Mono", Menlo, monospace;
  --fs-hero: clamp(3rem, 2rem + 4.5vw, 7rem);
  --fs-h2: clamp(1.9rem, 1.4rem + 1.8vw, 3.2rem);
  --fs-h3: clamp(1.15rem, 1rem + 0.5vw, 1.5rem);
  --fs-body: clamp(1rem, 0.95rem + 0.2vw, 1.125rem);
  --fs-small: 0.875rem;
  --fs-eyebrow: 0.8125rem;

  /* space (8px scale) */
  --s1: 8px;
  --s2: 16px;
  --s3: 24px;
  --s4: 32px;
  --s5: 40px;
  --s6: 48px;
  --s8: 64px;
  --s10: 80px;
  --s12: 96px;
  --s16: 128px;

  --container: 1240px;
  --radius: 10px;
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --motion-fast: 140ms;
  --border-standard: 1px solid var(--line);
  --border-faint: 1px solid var(--line-faint);
  --control-min: 44px;
  --content-compact: 980px;
}