:root {
  /* ─── Colour ─────────────────────────────────────── */
  --gobi-green:   #8BBF00;
  --charcoal:     #1A1A2E;
  --off-white:    #F8F9FA;
  --slate:        #4A5568;
  --light-grey:   #E2E8F0;
  --dark-green:   #4A7C00;
  --signal-red:   #C0392B;
  --navy:         #2D3561;
  --white:        #FFFFFF;

  --gradient-hero: linear-gradient(135deg, #1A1A2E 0%, #2D3561 100%);

  /* ─── Typography ─────────────────────────────────── */
  --font-base: 'Inter', system-ui, -apple-system, sans-serif;

  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-lg:   1.125rem;
  --text-xl:   1.25rem;
  --text-2xl:  1.5rem;
  --text-3xl:  1.875rem;
  --text-4xl:  2.25rem;
  --text-5xl:  3rem;
  --text-6xl:  3.75rem;
  --text-hero: 4.5rem;

  --leading-tight: 1.15;
  --leading-body:  1.7;

  /* ─── Spacing ────────────────────────────────────── */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;

  --section-pad-y:     clamp(4rem, 8vw, 7.5rem);
  --container-max:     1200px;
  --container-pad:     clamp(1.25rem, 4vw, 2.5rem);

  /* ─── Radius ─────────────────────────────────────── */
  --radius-btn:   6px;
  --radius-card:  12px;
  --radius-panel: 16px;
  --radius-pill:  999px;

  /* ─── Shadows ────────────────────────────────────── */
  --shadow-card:       0 1px 3px rgba(0,0,0,.06), 0 4px 16px rgba(0,0,0,.04);
  --shadow-card-hover: 0 8px 32px rgba(0,0,0,.10);
  --shadow-nav:        0 2px 12px rgba(0,0,0,.15);

  /* ─── Transitions ────────────────────────────────── */
  --ease-std: 0.2s ease;
  --ease-reveal: 0.4s ease-out;
}