/* Whitehart Design System — generated from tokens.json */
:root, [data-theme="default"] {
  --wh-blue-100: #e9f0ff;
  --wh-blue-200: #c2d6ff;
  --wh-blue-300: #7aa3ff;
  --wh-blue-400: #3d78ff;
  --wh-blue-500: #1a6cff;
  --wh-blue-600: #1450d6;
  --wh-blue-700: #12379f;
  --wh-blue-800: #0f2870;
  --wh-blue-900: #0b1c4d;
  --wh-ink-900: #14132e;
  --wh-ink-800: #1f1a38;
  --wh-ink-700: #2b2750;
  --wh-ink-600: #3a3760;
  --wh-coral-100: #fbe7e7;
  --wh-coral-400: #e0716f;
  --wh-coral-500: #d4494c;
  --wh-coral-600: #b53b3e;
  --wh-sky-400: #4aa6e0;
  --wh-sky-500: #2790d4;
  --wh-sky-600: #1f74ad;
  --wh-white: #ffffff;
  --wh-slate-50: #f5f6f8;
  --wh-slate-100: #eef0f3;
  --wh-slate-200: #dfe2e8;
  --wh-slate-300: #c5cad4;
  --wh-slate-400: #9aa1b2;
  --wh-slate-500: #6c7488;
  --wh-slate-600: #4e5478;
  --wh-slate-700: #3a3f5c;
  --wh-slate-900: #14132e;
  --wh-success: #2f9e6b;
  --wh-warning: #e0913a;
  --wh-danger: #d4494c;
  --color-primary: var(--wh-blue-500);
  --color-primary-hover: var(--wh-blue-600);
  --color-primary-press: var(--wh-blue-700);
  --color-accent: var(--wh-coral-500);
  --color-accent-hover: var(--wh-coral-600);
  --color-secondary: var(--wh-sky-500);
  --surface-page: var(--wh-white);
  --surface-subtle: var(--wh-slate-50);
  --surface-card: var(--wh-white);
  --surface-sunken: var(--wh-slate-100);
  --surface-dark: var(--wh-ink-800);
  --surface-darkest: var(--wh-ink-900);
  --surface-brand: var(--wh-blue-500);
  --text-strong: var(--wh-ink-900);
  --text-body: var(--wh-slate-700);
  --text-muted: var(--wh-slate-500);
  --text-on-dark: var(--wh-white);
  --text-on-dark-muted: rgba(255,255,255,0.72);
  --text-link: var(--wh-sky-600);
  --text-accent: var(--wh-coral-500);
  --border-subtle: var(--wh-slate-200);
  --border-strong: var(--wh-slate-300);
  --border-on-dark: rgba(255,255,255,0.22);
  --focus-ring: var(--wh-blue-400);
  --ring-color: rgba(26, 108, 255, 0.40);
  --shadow-xs: 0 1px 2px rgba(20, 19, 46, 0.06);
  --shadow-sm: 0 2px 8px rgba(20, 19, 46, 0.06);
  --shadow-md: 0 8px 24px rgba(20, 19, 46, 0.08);
  --shadow-lg: 0 18px 48px rgba(20, 19, 46, 0.12);
  --shadow-brand: 0 14px 34px rgba(26, 108, 255, 0.30);
  --shadow-coral: 0 14px 34px rgba(212, 73, 76, 0.28);
}
:root {
  --space-0: 0;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;
  --border-thin: 1px;
  --border-med: 1.5px;
  --border-thick: 2px;
  --ring-width: 3px;
  --container-max: 1200px;
  --container-wide: 1440px;
  --gutter: 32px;
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --radius-xl: 28px;
  --radius-2xl: 40px;
  --radius-pill: 999px;
  --ease-standard: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 120ms;
  --dur-base: 200ms;
  --dur-slow: 320ms;
  --gradient-brand: linear-gradient(135deg, #1a6cff 0%, #1450d6 42%, #12237f 100%);
  --gradient-ink: linear-gradient(160deg, #1f1a38 0%, #14132e 100%);
  --fw-light: 300;
  --fw-regular: 400;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-extrabold: 800;
  --fw-black: 900;
  --text-display-weight: 900;
  --text-heading-weight: 800;
  --text-overline-weight: 600;
  --lh-tight: 1.02;
  --lh-snug: 1.12;
  --lh-heading: 1.18;
  --lh-relaxed: 1.7;
  --ls-heading: -0.01em;
  --ls-label: 0.18em;
  --ls-label-tight: 0.08em;
  --font-sans: "Proxima Nova", "Helvetica Neue", Arial, sans-serif;
  --font-cond: "Proxima Nova Condensed", "Proxima Nova", Arial, sans-serif;
  --text-fs-overline: 400 0.75rem/1.4 var(--font-sans);
  --text-fs-caption: 400 0.8125rem/1.4 var(--font-sans);
  --text-fs-small: 400 0.875rem/1.4 var(--font-sans);
  --text-fs-body: 400 1rem/1.55 var(--font-sans);
  --text-fs-body-lg: 400 1.125rem/1.4 var(--font-sans);
  --text-fs-h6: 400 1.25rem/1.4 var(--font-sans);
  --text-fs-h5: 400 1.5rem/1.4 var(--font-sans);
  --text-fs-h4: 400 1.875rem/1.4 var(--font-sans);
  --text-fs-h3: 400 2.5rem/1.4 var(--font-sans);
  --text-fs-h2: 400 3.25rem/1.4 var(--font-sans);
  --text-fs-h1: 400 4.25rem/1.4 var(--font-sans);
  --text-fs-display: 400 5.5rem/1.4 var(--font-sans);
}
.fs-overline {
  font-family: var(--font-sans);
  font-size: 0.75rem;
  line-height: 1.4;
  font-weight: 400;
  letter-spacing: 0;
}
.fs-caption {
  font-family: var(--font-sans);
  font-size: 0.8125rem;
  line-height: 1.4;
  font-weight: 400;
  letter-spacing: 0;
}
.fs-small {
  font-family: var(--font-sans);
  font-size: 0.875rem;
  line-height: 1.4;
  font-weight: 400;
  letter-spacing: 0;
}
.fs-body {
  font-family: var(--font-sans);
  font-size: 1rem;
  line-height: 1.55;
  font-weight: 400;
  letter-spacing: 0;
}
.fs-body-lg {
  font-family: var(--font-sans);
  font-size: 1.125rem;
  line-height: 1.4;
  font-weight: 400;
  letter-spacing: 0;
}
.fs-h6 {
  font-family: var(--font-sans);
  font-size: 1.25rem;
  line-height: 1.4;
  font-weight: 400;
  letter-spacing: 0;
}
.fs-h5 {
  font-family: var(--font-sans);
  font-size: 1.5rem;
  line-height: 1.4;
  font-weight: 400;
  letter-spacing: 0;
}
.fs-h4 {
  font-family: var(--font-sans);
  font-size: 1.875rem;
  line-height: 1.4;
  font-weight: 400;
  letter-spacing: 0;
}
.fs-h3 {
  font-family: var(--font-sans);
  font-size: 2.5rem;
  line-height: 1.4;
  font-weight: 400;
  letter-spacing: 0;
}
.fs-h2 {
  font-family: var(--font-sans);
  font-size: 3.25rem;
  line-height: 1.4;
  font-weight: 400;
  letter-spacing: 0;
}
.fs-h1 {
  font-family: var(--font-sans);
  font-size: 4.25rem;
  line-height: 1.4;
  font-weight: 400;
  letter-spacing: 0;
}
.fs-display {
  font-family: var(--font-sans);
  font-size: 5.5rem;
  line-height: 1.4;
  font-weight: 400;
  letter-spacing: -0.02em;
}
.body {
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 1.55;
  font-weight: 400;
  letter-spacing: 0;
}
@font-face {
  font-family: "Proxima Nova";
  src: url("assets/fonts/ProximaNova-Light.otf") format("opentype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Proxima Nova";
  src: url("assets/fonts/ProximaNova-Regular.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Proxima Nova";
  src: url("assets/fonts/ProximaNova-RegularItalic.otf") format("opentype");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Proxima Nova";
  src: url("assets/fonts/ProximaNova-Semibold.otf") format("opentype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Proxima Nova";
  src: url("assets/fonts/ProximaNova-Bold.otf") format("opentype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Proxima Nova";
  src: url("assets/fonts/ProximaNova-Extrabold.otf") format("opentype");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Proxima Nova";
  src: url("assets/fonts/ProximaNova-Black.otf") format("opentype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Proxima Nova Condensed";
  src: url("assets/fonts/ProximaNovaCond-Regular.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Proxima Nova Condensed";
  src: url("assets/fonts/ProximaNovaCond-Semibold.otf") format("opentype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}