/* ============================================
   ZORE GLOBAL — DESIGN TOKENS
   ============================================ */

:root {
  /* ---- Colors: Base Palette ---- */
  --color-black:   #0D0D0D;
  --color-black-2: #141414;
  --color-black-3: #1C1C1C;

  --color-cream:      #E4DCD1;
  --color-cream-dark: #D3C9BC;
  --color-cream-muted: #B8AFA4;

  --color-orange:       #CB592D;
  --color-orange-dark:  #B44E27;
  --color-orange-light: #D96E42;

  /* ---- Colors: Semantic ---- */
  --color-bg-primary:     var(--color-black);
  --color-bg-surface:     var(--color-black-2);
  --color-bg-raised:      var(--color-black-3);
  --color-bg-light:       var(--color-cream);
  --color-bg-light-alt:   var(--color-cream-dark);

  --color-text-primary:    var(--color-cream);
  --color-text-secondary:  rgba(228, 220, 209, 0.65);
  --color-text-muted:      rgba(228, 220, 209, 0.38);
  --color-text-dark:       var(--color-black);
  --color-text-dark-muted: #4A4440;

  --color-accent:       var(--color-orange);
  --color-accent-hover: var(--color-orange-dark);
  --color-accent-warm:  var(--color-orange-light);

  --color-border:        rgba(228, 220, 209, 0.10);
  --color-border-hover:  rgba(228, 220, 209, 0.22);
  --color-border-light:  rgba(203, 89, 45, 0.18);
  --color-border-accent: rgba(203, 89, 45, 0.40);

  /* ---- Shadows ---- */
  --shadow-sm:        0 1px 3px rgba(0, 0, 0, 0.18);
  --shadow-card:      0 1px 3px rgba(0, 0, 0, 0.20), 0 4px 20px rgba(0, 0, 0, 0.12);
  --shadow-elevated:  0 8px 32px rgba(0, 0, 0, 0.28), 0 2px 8px rgba(0, 0, 0, 0.14);
  --shadow-glow-accent: 0 0 40px rgba(203, 89, 45, 0.22);

  /* ---- Typography ---- */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'JetBrains Mono', 'Fira Code', monospace;

  --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;

  --weight-light:     300;
  --weight-regular:   400;
  --weight-medium:    500;
  --weight-semibold:  600;
  --weight-bold:      700;
  --weight-extrabold: 800;

  --leading-tight:  1.15;
  --leading-snug:   1.3;
  --leading-normal: 1.6;
  --leading-loose:  1.8;

  --tracking-tight:  -0.03em;
  --tracking-normal: -0.01em;
  --tracking-wide:   0.08em;

  /* ---- Spacing (8px base) ---- */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-32: 8rem;

  /* ---- Layout ---- */
  --container-sm:  640px;
  --container-md:  768px;
  --container-lg:  1024px;
  --container-xl:  1280px;
  --container-2xl: 1440px;

  --section-py: clamp(4rem, 8vw, 7rem);
  --nav-height: 72px;

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

  /* ---- Transitions ---- */
  --transition-fast:   150ms ease;
  --transition-base:   250ms ease;
  --transition-slow:   400ms ease;
  --transition-spring: 350ms cubic-bezier(0.34, 1.56, 0.64, 1);
}