/* ============================================================
   GigaBizZone — Design Tokens (PRD §2.3–2.6, §7.5)
   Colour, typography, spacing. Single source of truth.
   ============================================================ */

:root {
  /* --- Foundation: Warm Neutrals --- */
  --cream:        #FAF6F0;  /* Primary background */
  --cream-deep:   #F2EBDC;  /* Subtle section backgrounds */
  --paper:        #FFFFFF;  /* Elevated surfaces, used sparingly */

  /* --- Brand: Teal Family (from logo) --- */
  --teal-deep:    #00606D;  /* Primary brand — text, headlines, primary actions */
  --teal-mid:     #0A8595;  /* Hover states, mid-emphasis */
  --teal-light:   #5BC0BE;  /* Secondary accents, highlights */
  --teal-pale:    #C9E8E7;  /* Very subtle backgrounds, badges */

  /* --- Accent: Single Sharp Contrast --- */
  --coral:        #D85A2E;  /* CTAs, outcome numbers, critical attention */
  --coral-deep:   #B8451E;  /* Hover states for CTAs */

  /* --- Text --- */
  --ink:          #1A2B30;  /* Body text — near-black with warmth */
  --ink-muted:    #4A5A60;  /* Secondary text */
  --ink-light:    #8A9499;  /* Tertiary text, captions */

  /* --- Borders & Lines --- */
  --line:         #E5DDD0;  /* Subtle separators */
  --line-strong:  #C5BDB0;  /* Stronger borders, important divisions */

  /* --- Typefaces --- */
  --font-display: 'Fraunces', 'Source Serif Pro', Georgia, serif;
  --font-body:    'Geist', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-deva:    'Mukta', var(--font-body);
  --font-mono:    'JetBrains Mono', ui-monospace, 'Courier New', monospace;

  /* --- Type scale (1rem = 16px) --- */
  --text-xs:    0.75rem;   /* 12px — captions, labels */
  --text-sm:    0.875rem;  /* 14px — small UI */
  --text-base:  1rem;      /* 16px — body */
  --text-lg:    1.125rem;  /* 18px — emphasized body */
  --text-xl:    1.5rem;    /* 24px — small headings */
  --text-2xl:   2rem;      /* 32px — section headings */
  --text-3xl:   2.75rem;   /* 44px — major section headings */
  --text-4xl:   4rem;      /* 64px — page headlines */
  --text-5xl:   5.5rem;    /* 88px — hero headline (desktop) */
  --text-6xl:   7rem;      /* 112px — display moments */

  /* --- Spacing scale (4px base unit) --- */
  --space-1:   4px;
  --space-2:   8px;
  --space-3:   16px;
  --space-4:   24px;
  --space-5:   32px;
  --space-6:   48px;
  --space-7:   64px;
  --space-8:   96px;
  --space-9:   128px;
  --space-10:  192px;
  --space-11:  256px;

  /* --- Layout --- */
  --content-max: 1280px;
  --gutter:      32px;
  --pad-desktop: 32px;
  --pad-tablet:  48px;
  --pad-mobile:  24px;

  /* --- Motion --- */
  --ease:       cubic-bezier(0.22, 0.61, 0.36, 1);
  --dur-fast:   200ms;
  --dur-mid:    250ms;
  --dur-slow:   600ms;
}
