/* Hatch design system: Inter body, Castoro display, neutral surfaces, red CTA, pill buttons. */
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('../fonts/inter-latin.woff2') format('woff2'); }
@font-face { font-family: 'Castoro'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/castoro-latin-400.woff2') format('woff2'); }

:root {
  --font-display: 'Castoro', Georgia, 'Times New Roman', serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --font-deva: "Noto Sans Devanagari", "Kohinoor Devanagari", "Nirmala UI", sans-serif;

  --brand: #FB001A;
  --brand-hover: #D3000E;
  --brand-2: #5A5EF7;          /* indigo tagline accent */
  --brand-2-hover: #4A4DE0;
  --orange: #FB001A;
  --on-brand: #FFFFFF;
  --volt: #5A5EF7;
  --volt-text: #FFFFFF;
  --grad-hero: linear-gradient(180deg, #F0F0FF 0%, #FFFFFF 100%);
  --grad-card: linear-gradient(180deg, #F9F9F9 45%, rgba(249,249,249,0) 103%);

  --bg: #FFFFFF;
  --surface: #FFFFFF;
  --surface-2: #F5F5F5;
  --border: #E7E8EA;
  --border-strong: #171717;
  --border-focus: #100F12;

  --text: #171717;
  --text-muted: #5C5C5C;
  --text-subtle: #6B6B6B;

  --ok: #0F8F7A;
  --ok-bg: #E4F7F3;
  --warn: #9A5B00;
  --warn-bg: #FFF3D9;
  --bad: #D91E2B;
  --bad-bg: #FDE9EC;

  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 12px;
  --radius-xl: 20px;
  --radius-pill: 9999px;

  --shadow-sm: 0 2px 4px 0 rgba(13, 13, 18, 0.04);
  --shadow-md: 0 2px 4px 0 rgba(13, 13, 18, 0.15);
  --shadow-lg: 0 18px 40px rgba(13, 13, 18, 0.10);

  --z-sticky: 100;
  --z-drawer: 200;
  --z-modal: 500;
  --z-toast: 1000;
}

/* Dark theme (system preference) */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --brand: #FF4E47; --brand-hover: #FF6A64; --brand-2: #8A9BFF; --brand-2-hover: #A6B3FF;
    --orange: #FF4E47; --on-brand: #0D1014; --volt: #8A9BFF; --volt-text: #0D1014;
    --grad-hero: linear-gradient(180deg, #1C1F24 0%, #0D1014 100%);
    --grad-card: linear-gradient(180deg, rgba(255,255,255,.06) 45%, rgba(255,255,255,0) 103%);
    --bg: #0D1014; --surface: #13161B; --surface-2: #1C1F24;
    --border: #2B2E33; --border-strong: #EEF2F9; --border-focus: #CDD1D8;
    --text: #EEF2F9; --text-muted: #B4B8BE; --text-subtle: #9AA0A8;
    --ok: #3AC3AD; --ok-bg: rgba(58,195,173,.14);
    --warn: #FFC043; --warn-bg: rgba(255,192,67,.14);
    --bad: #F53E39; --bad-bg: rgba(245,62,57,.16);
    --shadow-sm: 0 2px 4px 0 rgba(0,0,0,.45); --shadow-md: 0 2px 10px -2px rgba(0,0,0,.5); --shadow-lg: 0 18px 44px rgba(0,0,0,.6);
  }
}
[data-theme="dark"] {
  --brand: #FF4E47; --brand-hover: #FF6A64; --brand-2: #8A9BFF; --brand-2-hover: #A6B3FF;
  --orange: #FF4E47; --on-brand: #0D1014; --volt: #8A9BFF; --volt-text: #0D1014;
  --grad-hero: linear-gradient(180deg, #1C1F24 0%, #0D1014 100%);
  --grad-card: linear-gradient(180deg, rgba(255,255,255,.06) 45%, rgba(255,255,255,0) 103%);
  --bg: #0D1014; --surface: #13161B; --surface-2: #1C1F24;
  --border: #2B2E33; --border-strong: #EEF2F9; --border-focus: #CDD1D8;
  --text: #EEF2F9; --text-muted: #B4B8BE; --text-subtle: #9AA0A8;
  --ok: #3AC3AD; --ok-bg: rgba(58,195,173,.14);
  --warn: #FFC043; --warn-bg: rgba(255,192,67,.14);
  --bad: #F53E39; --bad-bg: rgba(245,62,57,.16);
  --shadow-sm: 0 2px 4px 0 rgba(0,0,0,.45); --shadow-md: 0 2px 10px -2px rgba(0,0,0,.5); --shadow-lg: 0 18px 44px rgba(0,0,0,.6);
}
[data-theme="light"] {
  --brand: #FB001A; --brand-hover: #D3000E; --brand-2: #5A5EF7; --brand-2-hover: #4A4DE0;
  --orange: #FB001A; --on-brand: #FFFFFF; --volt: #5A5EF7; --volt-text: #FFFFFF;
  --grad-hero: linear-gradient(180deg, #F0F0FF 0%, #FFFFFF 100%);
  --grad-card: linear-gradient(180deg, #F9F9F9 45%, rgba(249,249,249,0) 103%);
  --bg: #FFFFFF; --surface: #FFFFFF; --surface-2: #F5F5F5;
  --border: #E7E8EA; --border-strong: #171717; --border-focus: #100F12;
  --text: #171717; --text-muted: #5C5C5C; --text-subtle: #6B6B6B;
  --ok: #0F8F7A; --ok-bg: #E4F7F3; --warn: #9A5B00; --warn-bg: #FFF3D9; --bad: #D91E2B; --bad-bg: #FDE9EC;
}

/* High Contrast Range Mode */
[data-high-contrast="true"] {
  --bg: #000000; --surface: #111111; --surface-2: #222222;
  --border: #FFFFFF; --border-strong: #FFFFFF;
  --text: #FFFFFF; --text-muted: #E0E0E0; --text-subtle: #CCCCCC;
  --brand: #FFFF00; --on-brand: #000000; --brand-2: #00FFFF; --orange: #00FFFF; --volt: #00FF00;
  --grad-hero: linear-gradient(0deg, #FFFF00, #FFFF00);
}