:root {
  /* Octopus Energy Brand Colors */
  --hemocyanin: #180048;
  --ice: #f0ffff;
  --plum: #600e6b;
  --purpleHaze: #a49fc8;
  --siphon: #100030;
  --sohoLights: #f050f8;

  /* Semantic Color Tokens */
  --color-primary: var(--sohoLights);
  --color-background: var(--hemocyanin);
  --color-surface: var(--ice);
  --color-text: var(--ice);
  --color-text-muted: var(--purpleHaze);
  --color-border: var(--plum);

  /* Spacing */
  --spacing-xs: 0.25rem;
  --spacing-sm: 0.5rem;
  --spacing-md: 1rem;
  --spacing-lg: 1.5rem;
  --spacing-xl: 2rem;

  /* Border Radius */
  --radius-sm: 0.5rem;
  --radius-md: 1rem;
  --radius-lg: 1.5rem;
  --radius-full: 50%;

  /* Transitions */
  --transition-fast: 0.2s;
  --transition-normal: 0.3s;
}
