:root {
  /* Colors */
  --bg-color: #070707;
  /* Near-black background */
  --panel-color: #111111;
  /* Soft charcoal panels */
  --panel-border: rgba(255, 255, 255, 0.08);
  /* Subtle border */
  --text-primary: #F2F2F2;
  /* Subtle white text */
  --text-secondary: #A7A7A7;
  /* Muted gray text */
  --accent-glow: rgba(255, 255, 255, 0.05);
  /* Cursor glow */
  --accent-gray: #B0B0B0;
  /* Premium Gray Accent */
  --accent-blue: #3B9DF8;
  /* Blue Accent for Buttons/Glow */
  --glass-bg: rgba(7, 7, 7, 0.8);
  /* Glass effect background */

  /* Typography */
  --font-main: 'Plus Jakarta Sans', sans-serif;
  --font-scale: 1.0;
  --tracking-tight: -0.02em;
  --tracking-wide: 0.05em;

  /* Spacing */
  --spacing-xs: 0.5rem;
  --spacing-sm: 1rem;
  --spacing-md: 2rem;
  --spacing-lg: 4rem;
  --spacing-xl: 8rem;
  --container-padding: 24px;
  --section-padding: 8rem;

  @media (max-width: 768px) {
    --container-padding: 20px;
    --section-padding: 6rem;
    --spacing-xl: 4rem;
    --spacing-lg: 3rem;
  }

  /* Transitions */
  --transition-fast: 0.2s ease;
  --transition-smooth: 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}