/* FindMeGPT design tokens — from the Figma design system (file uXmtZjklhAiRz0vb4qZfAn, node 2:2).
   The site is light-dominant with dark accent surfaces (hero chat card, ROI card, final CTA, footer).
   Type system is single-family: Google Sans Flex (Medium 500 = display/headings, Regular 400 = body/labels/pills).
   Geist Mono is reserved for code only. Exact secondary hexes are refined per-section during the build. */

:root {
  /* Brand */
  --brand-primary: #10A37F;   /* emerald */
  --brand-dark:    #0B8F6E;
  --brand-deeper:  #0B5F46;
  --brand-subtle:  #C8F2E2;   /* light mint */
  --accent-cyan:   #0EA5E9;
  --accent-blue:   #4F5CE1;
  --grad-brand:    linear-gradient(90deg, #10A37F, #0EA5E9);

  /* Light surfaces (page default) */
  --bg-page:    #FFFFFF;
  --bg-white:   #FFFFFF;
  --bg-tint:    #F4FBF8;       /* faint green tint blocks */
  --bg-soft:    #F6F8FA;

  /* Dark surfaces (accent cards, CTA, footer) */
  --bg-dark-base:    #0A0A0A;
  --bg-dark-surface: #141414;
  --bg-dark-raised:  #1D1D1D;

  /* Text on light */
  --text-primary:   #0C0C0C;
  --text-secondary: #5A5A5A;
  --text-tertiary:  #8A8A8A;

  /* Text on dark */
  --text-on-dark:        #FFFFFF;
  --text-on-dark-muted:  #A3A3A3;

  /* Status */
  --success: #10A37F;
  --error:   #EF4444;
  --warning: #F5C518;

  /* Borders */
  --border-light:   #E6E6E6;
  --border-soft:    #EDEDED;
  --border-dark:    #1F1F1F;

  /* Spacing (base-8) */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-6: 24px; --sp-8: 32px; --sp-10: 40px; --sp-12: 48px; --sp-16: 64px;
  --sp-20: 80px; --sp-24: 96px;

  /* Radii */
  --radius-sm: 4px; --radius-md: 8px; --radius-lg: 12px;
  --radius-xl: 16px; --radius-2xl: 24px; --radius-full: 9999px;

  /* Typography (per the design system) */
  --font-display: "Google Sans Flex", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --font-body:    "Google Sans Flex", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --font-mono:    "Geist Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* Layout */
  --container: 1200px;
  --container-narrow: 880px;

  /* Elevation */
  --shadow-sm: 0 1px 2px rgba(0,0,0,.04), 0 1px 3px rgba(0,0,0,.06);
  --shadow-md: 0 4px 12px rgba(0,0,0,.06), 0 2px 4px rgba(0,0,0,.04);
  --shadow-lg: 0 12px 32px rgba(0,0,0,.08), 0 4px 8px rgba(0,0,0,.04);
}
