/* Design Tokens - Spacing */
:root {
  /* Base spacing unit */
  --spacing-unit: 0.25rem; /* 4px */
  
  /* Spacing scale */
  --spacing-0: 0;
  --spacing-1: calc(var(--spacing-unit) * 1);   /* 4px */
  --spacing-2: calc(var(--spacing-unit) * 2);   /* 8px */
  --spacing-3: calc(var(--spacing-unit) * 3);   /* 12px */
  --spacing-4: calc(var(--spacing-unit) * 4);   /* 16px */
  --spacing-5: calc(var(--spacing-unit) * 5);   /* 20px */
  --spacing-6: calc(var(--spacing-unit) * 6);   /* 24px */
  --spacing-8: calc(var(--spacing-unit) * 8);   /* 32px */
  --spacing-10: calc(var(--spacing-unit) * 10); /* 40px */
  --spacing-12: calc(var(--spacing-unit) * 12);  /* 48px */
  --spacing-16: calc(var(--spacing-unit) * 16);  /* 64px */
  --spacing-20: calc(var(--spacing-unit) * 20);  /* 80px */
  --spacing-24: calc(var(--spacing-unit) * 24);  /* 96px */
  
  /* Container */
  --container-max-width: 1440px;
  --container-padding: var(--spacing-6);
  
  /* Section spacing */
  --section-padding-y: 5rem;
  --section-padding-y-lg: 8rem;
}