:root {
  /* NAIKE BRAND PALETTE - LIGHT WARM EDITORIAL TONE */
  /* Logo Core Hues */
  --brand-orange-600: #c2410c;
  --brand-orange-500: #ea580c;
  --brand-orange-400: #f97316;
  --brand-orange-100: #ffedd5;
  --brand-orange-50:  #fff7ed;

  --brand-blue-700:   #1d4ed8;
  --brand-blue-600:   #0284c7;
  --brand-blue-500:   #0ea5e9;
  --brand-blue-50:    #f0f9ff;

  --brand-gold-600:   #b45309;
  --brand-gold-500:   #d97706;
  --brand-gold-400:   #f59e0b;
  --brand-gold-50:    #fffbeb;

  --brand-green-600:  #059669;
  --brand-green-500:  #10b981;
  --brand-green-50:   #ecfdf5;

  /* Warm Neutral Foundation */
  --warm-bg-base:     #fcfbf9;  /* Soft Warm Alabaster */
  --warm-bg-subtle:   #f7f4ee;  /* Warm Sand Tint for alternate rows & panels */
  --warm-bg-muted:    #efebe3;  /* Deeper Warm Stone */
  --warm-bg-card:     #ffffff;  /* Pure Crisp White Card Surface */
  --warm-bg-card-hover: #ffffff;

  --warm-border:      #e6e0d5;  /* Subtle Warm Border */
  --warm-border-strong: #d5cbbe;
  --warm-border-gold: #fde68a;

  /* Typography Colors */
  --text-primary:     #1c1917;  /* Warm Deep Charcoal (not pitch black) */
  --text-secondary:   #57534e;  /* Warm Medium Slate */
  --text-muted:       #8a837b;  /* Warm Muted Gray */
  --text-on-primary:  #ffffff;

  /* Semantic Aliases */
  --brand-primary:    var(--brand-orange-500);
  --brand-primary-hover: var(--brand-orange-600);
  --brand-accent:     var(--brand-blue-600);
  --brand-surface:    var(--warm-bg-base);
  --brand-surface-card: var(--warm-bg-card);
  --brand-border:     var(--warm-border);

  /* Fonts */
  --font-display: "Cabinet Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Scale */
  --text-display: clamp(2.25rem, 1.8rem + 2.5vw, 3.75rem);
  --text-section: clamp(1.75rem, 1.4rem + 1.2vw, 2.5rem);
  --text-small: 0.875rem;
  --text-body: 1rem;

  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2rem;
  --space-6: 3rem;
  --space-8: 4rem;
  --section-space: clamp(3rem, 6vw, 6rem);
  --content-width: 82rem;

  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-full: 9999px;

  /* Light Warm Shadows */
  --shadow-card: 0 2px 10px rgba(44, 30, 15, 0.05), 0 0 0 1px var(--warm-border);
  --shadow-hover: 0 14px 30px -4px rgba(234, 88, 12, 0.12), 0 4px 12px rgba(44, 30, 15, 0.06), 0 0 0 1px var(--brand-orange-400);
  --shadow-glow-warm: 0 0 20px rgba(234, 88, 12, 0.2);
}