:root {
  /* Colors */
  --color-primary: #21347b; /* Deep Navy - Example CodingHQ Brand Color */
  --color-secondary: #fdc765; /* Teal/Cyan - Example Accent */
  --color-text-main: #333333;
  --color-text-light: #666666;
  --color-text-white: #ffffff;
  --color-bg-light: #f8f9fa;
  --color-bg-white: #ffffff;
  --color-border: #e0e0e0;

  /* Fonts */
  --font-family-main: "Poppins", sans-serif;

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

  /* Border Radius */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;

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