/* BatBall11 — Design Tokens (Slate Utility, Technical Grotesk) */
:root {
  /* Palette — Slate Utility */
  --primary: #2457A7;
  --primary-deep: #1A3F7E;
  --primary-soft: #4A77C7;
  --accent: #A044C5;
  --accent-soft: #C57FE0;
  --accent-deep: #7C2FA0;

  --background: #F6F8FC;
  --surface: #FFFFFF;
  --surface-2: #E9EEF7;
  --surface-3: #DCE5F1;
  --surface-ink: #1B2638;

  --ink: #1B2638;
  --ink-2: #2C3E5A;
  --muted: #5A6B80;
  --muted-soft: #8595AC;
  --border: #CDD8E8;
  --border-strong: #9CB1CE;

  --success: #1F8A52;
  --warning: #C77A14;
  --danger: #B73E48;
  --info: #2E7CC9;

  --shadow-sm: 0 1px 2px rgba(27, 38, 56, 0.06);
  --shadow-md: 0 4px 14px rgba(27, 38, 56, 0.08);
  --shadow-lg: 0 12px 36px rgba(27, 38, 56, 0.10);
  --shadow-card: 0 2px 8px rgba(27, 38, 56, 0.06), 0 1px 2px rgba(27, 38, 56, 0.04);

  /* Typography — Roboto + Noto Sans Devanagari */
  --font-display: "Roboto", "Noto Sans Devanagari", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body: "Roboto", "Noto Sans Devanagari", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", "SF Mono", Menlo, Consolas, monospace;

  /* Spacing scale */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;
  --sp-8: 64px;
  --sp-9: 96px;

  /* Radii */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 14px;
  --radius-xl: 20px;
  --radius-pill: 999px;

  /* Layout */
  --maxw: 1240px;
  --maxw-narrow: 880px;
  --header-h: 72px;
  --cta-bar-h: 64px;
}