/* ============================================================
   BRAND COLOURS — CSC Group Australia
   ============================================================ */
:root {
  --color-brand-green: #64BC36;
  /* Exhaust & Emission Control — eco/sustainability */
  --color-brand-green-light: #7ECC56;
  --color-brand-green-dark: #4E9A28;
  --color-brand-gold: #E2A400;
  /* Vehicle Protection & Compliance — safety */
  --color-brand-gold-light: #F0BE3A;
  --color-brand-gold-dark: #C08D00;
  --color-brand-red: #E31B23;
  /* Aftermarket Enhancements — performance */
  --color-brand-red-light: #F04048;
  --color-brand-red-dark: #D21515;
  --color-brand-charcoal: #272626;
  /* CSC primary text / dark neutral */
  --color-brand-white: #FFFFFF;
  /* CSC brand white */

  /* Mapped tokens (used throughout the presentation) */
  --color-primary: #0A0A0A;
  /* Near-black — primary background */
  --color-primary-light: #151515;
  /* Deep charcoal (footer/header tone) */
  --color-secondary: #FFFFFF;
  /* Brand white */
  --color-secondary-light: #F8F9FA;
  --color-accent: #E2A400;
  /* Brand gold as primary accent */
  --color-accent-light: #F0BE3A;

  /* Neutrals */
  --color-white: #FFFFFF;
  --color-off-white: #F0EDE6;
  /* CSC warm cream */
  --color-gray-100: #E9ECEF;
  --color-gray-200: #E1E2E4;
  --color-gray-300: #CED4DA;
  --color-gray-400: #ADB5BD;
  --color-gray-500: #6C757D;
  --color-gray-600: #495057;
  --color-gray-700: #343A40;
  --color-gray-800: #272626;
  /* CSC charcoal */
  --color-black: #0A0A0A;

  /* Semantic */
  --color-success: #64BC36;
  /* CSC brand green */
  --color-warning: #E2A400;
  /* CSC brand gold */
  --color-danger: #E31B23;
  /* CSC brand red */

  /* Division colours (Exhaust / Protection / Aftermarket) */
  --color-tier-good: #64BC36;
  /* Green — Exhaust & Emission */
  --color-tier-better: #E2A400;
  /* Gold — Vehicle Protection */
  --color-tier-best: #E31B23;
  /* Red — Aftermarket / Performance */

  /* ----------------------------------------------------------
     GRADIENTS
     ---------------------------------------------------------- */
  --gradient-primary: linear-gradient(135deg, #0A0A0A 0%, #151515 100%);
  --gradient-accent: linear-gradient(135deg, var(--color-accent) 0%, var(--color-accent-light) 100%);
  --gradient-hero: linear-gradient(160deg, #0A0A0A 0%, #121212 50%, #1A1A1A 100%);

  /* ----------------------------------------------------------
     TYPOGRAPHY
     ---------------------------------------------------------- */
  --font-heading: 'Poppins',
    sans-serif;
  --font-body: 'Maven Pro',
    sans-serif;

  --fs-display: clamp(2.8rem, 5vw, 5rem);
  --fs-h1: clamp(2rem, 3.5vw, 3.5rem);
  --fs-h2: clamp(1.5rem, 2.5vw, 2.5rem);
  --fs-h3: clamp(1.25rem, 2vw, 1.75rem);
  --fs-body: clamp(1rem, 1.2vw, 1.15rem);
  --fs-small: clamp(0.85rem, 1vw, 0.95rem);
  --fs-caption: clamp(0.75rem, 0.9vw, 0.85rem);

  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-extrabold: 800;

  --lh-tight: 1.1;
  --lh-normal: 1.65;
  --lh-relaxed: 1.8;

  /* ----------------------------------------------------------
     SPACING
     ---------------------------------------------------------- */
  --space-xs: 0.25rem;
  --space-sm: 0.5rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
  --space-3xl: 4rem;
  --space-4xl: 6rem;

  /* ----------------------------------------------------------
     BORDERS & RADII
     ---------------------------------------------------------- */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-full: 9999px;

  --border-thin: 1px solid var(--color-gray-200);
  --border-accent: 2px solid var(--color-accent);

  /* ----------------------------------------------------------
     SHADOWS
     ---------------------------------------------------------- */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.12);
  --shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.18);
  --shadow-xl: 0 16px 50px rgba(0, 0, 0, 0.25);
  --shadow-glow: 0 0 30px rgba(226, 164, 0, 0.3);

  /* ----------------------------------------------------------
     ANIMATIONS & TIMINGS
     ---------------------------------------------------------- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --duration-fast: 0.2s;
  --duration-normal: 0.4s;
  --duration-slide: 0.6s;

  /* ----------------------------------------------------------
     LAYERING & Z-INDICES
     ---------------------------------------------------------- */
  --z-progress: 1000;
  --z-nav: 900;
}