/* ============================================================
   SIMSURVEYS DESIGN TOKENS
   Light-but-bold system — white base, navy accent, product colors
   ============================================================ */

:root {
  /* ── Surfaces ── */
  --white: #ffffff;
  --off-white: #fafaf8;
  --bg: #ffffff;

  /* ── Ink / Text ── */
  --ink: #111113;
  --ink-2: #40444c;
  --muted: #71767e;

  /* ── Brand Accent: Navy ── */
  --accent: #1E3A5F;
  --accent-light: #2B5A8C;
  --accent-bg: #EDF2F8;
  --accent-border: #B4C8DE;

  /* ── Product Accents ── */
  --platform-blue: #1E40AF;
  --platform-blue-rgb: 30, 64, 175;
  --oracle-amber: #B45309;
  --oracle-amber-rgb: 180, 83, 9;
  --voices-teal: #0D9488;
  --voices-teal-rgb: 13, 148, 136;

  /* ── Functional ── */
  --line: #E5E5E3;
  --line-strong: #D4D4D2;
  --link: #1E3A5F;

  /* ── Shadows ── */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.04);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.06);
  --shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.08);
  --shadow-xl: 0 24px 60px rgba(0, 0, 0, 0.10);
  --shadow-accent: 0 4px 20px rgba(30, 58, 95, 0.15);

  /* ── Radii ── */
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-full: 9999px;

  /* ── Layout ── */
  --container-max: 1200px;
  --container-narrow: 800px;
  --header-height: 72px;

  /* ── Typography ── */
  --font-display: 'DM Serif Display', Georgia, serif;
  --font-body: 'Outfit', system-ui, -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;

  /* ── Type Scale (fluid) ── */
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-md: 1.125rem;
  --text-lg: clamp(1.25rem, 1.1rem + 0.5vw, 1.5rem);
  --text-xl: clamp(1.5rem, 1.2rem + 1vw, 2rem);
  --text-2xl: clamp(2rem, 1.5rem + 1.5vw, 2.75rem);
  --text-3xl: clamp(2.5rem, 1.8rem + 2.2vw, 3.75rem);
}
