/* ==========================================================================
   Design Tokens - APEX (Industrial Speed)
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Teko:wght@500;700&family=Jura:wght@400;600;700&display=swap');

:root {
  /* Colors */
  --clr-bg: #0B0C10;          /* Asphalt Black */
  --clr-bg-alt: #12141A;      /* Dark Carbon */
  --clr-text: #F3F4F6;        /* Titanium White */
  --clr-text-muted: #66FCF1;  /* Cyber/Telemetry Cyan (instead of boring grey) */
  
  /* Racing Accents */
  --clr-red: #E30A24;         /* Ducati / Brembo Red */
  --clr-steel: #1F2833;       /* Gunmetal Grey */

  /* Typography */
  --font-display: 'Teko', sans-serif; /* Tall, aggressive, compressed */
  --font-tech: 'Jura', sans-serif;    /* Mechanical, angular, technical */
  
  /* Fluid Typography */
  --text-xs: clamp(0.75rem, 0.7rem + 0.25vw, 0.875rem);
  --text-sm: clamp(0.875rem, 0.8rem + 0.375vw, 1rem);
  --text-base: clamp(1rem, 0.95rem + 0.25vw, 1.25rem);
  --text-lg: clamp(1.5rem, 1.25rem + 1.25vw, 2.5rem);
  --text-xl: clamp(2.5rem, 2rem + 2.5vw, 4rem);
  --text-2xl: clamp(4rem, 3.5rem + 5vw, 7rem);
  --text-hero: clamp(6rem, 10vw + 6rem, 18rem);

  /* Spacing */
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 2rem;
  --space-lg: 4rem;
  --space-xl: 8rem;
  --space-2xl: 12rem;
  
  /* Easings (Motion) - Fast, Mechanical, Snappy */
  --ease-snappy: cubic-bezier(0.85, 0, 0.15, 1);
  --ease-elastic: cubic-bezier(0.68, -0.6, 0.32, 1.6);
  --transition-fast: 0.2s var(--ease-snappy);
  --transition-med: 0.4s var(--ease-snappy);
  
  /* UI Elements */
  --clip-slant: polygon(10% 0, 100% 0, 90% 100%, 0% 100%);
  --clip-cut: polygon(0 0, 100% 0, 100% calc(100% - 15px), calc(100% - 15px) 100%, 0 100%);
}