:root {
  --color-navy: #0a0a0a;
  --color-navy-mid: #111111;
  --color-navy-soft: #222222;
  --color-anthracite: #181818;
  --color-steel: #5b6f86;
  --color-accent: #c89b3c;
  --color-accent-hover: #e0b85a;
  --color-accent-deep: #a87924;
  --color-accent-soft: rgba(200, 155, 60, 0.16);
  --color-accent-rgb: 200, 155, 60;
  --color-ember: #c89b3c;
  --color-ember-soft: rgba(200, 155, 60, 0.16);
  --color-metal: #9bb0c4;
  --color-white: #ffffff;
  --color-off: #f3f6f9;
  --color-gray: #e8eef3;
  --color-line: rgba(15, 28, 48, 0.1);
  --color-text: #121926;
  --color-muted: #536174;
  --color-danger: #b42318;
  --color-ok: #067647;

  --font-sans: "Source Sans 3", "Segoe UI", Roboto, Arial, sans-serif;
  --font-display: "Space Grotesk", var(--font-sans);
  --font-mono: "IBM Plex Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;

  --fs-xs: 0.75rem;
  --fs-sm: 0.875rem;
  --fs-md: 1.0625rem;
  --fs-lg: clamp(1.0625rem, 1.25vw, 1.125rem);
  --fs-h1: clamp(1.95rem, 4.4vw, 3.15rem);
  --fs-h2: clamp(1.45rem, 2.5vw, 2.05rem);
  --fs-h3: clamp(1.08rem, 1.25vw, 1.22rem);
  --lh-tight: 1.1;
  --lh-body: 1.68;

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: clamp(3.5rem, 7vw, 6.5rem);
  --space-9: 6.5rem;

  --container: 1240px;
  --gutter: 1.25rem;
  --header-h: 76px;

  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-full: 999px;

  --shadow-sm: 0 8px 24px rgba(7, 14, 26, 0.06);
  --shadow-md: 0 18px 40px rgba(7, 14, 26, 0.1);
  --shadow-lg: 0 28px 70px rgba(7, 14, 26, 0.16);
  --shadow-glow: 0 10px 30px rgba(200, 155, 60, 0.28);

  --transition-fast: 180ms cubic-bezier(0.22, 1, 0.36, 1);
  --transition-med: 320ms cubic-bezier(0.22, 1, 0.36, 1);

  --z-header: 1000;
  --z-overlay: 1100;
  --z-modal: 1200;
  --z-float: 980;

  --safe-top: env(safe-area-inset-top, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
}

body {
  font-family: var(--font-sans);
  font-size: var(--fs-md);
  font-weight: var(--fw-regular);
  line-height: var(--lh-body);
  color: var(--color-text);
  background: var(--color-white);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1,
h2,
h3,
h4 {
  font-family: var(--font-display);
  font-weight: var(--fw-bold);
  letter-spacing: -0.03em;
  line-height: var(--lh-tight);
  text-wrap: balance;
}
