/* Mecanique Less — Design Tokens */
/* Brand: Rouge & Noir — Garage automobile Saint-Apollinaire */

:root {
  /* Brand Colors */
  --brand-primary: #d42020;
  --brand-primary-light: #ef4444;
  --brand-primary-dark: #a01616;
  --brand-black: #111111;
  --brand-dark: #1a1a1a;
  --brand-surface: #222222;
  --brand-white: #f5f5f5;
  --brand-grey: #888888;
  --brand-grey-light: #cccccc;

  /* Semantic */
  --bg: var(--brand-black);
  --bg-surface: var(--brand-dark);
  --bg-card: var(--brand-surface);
  --text: var(--brand-white);
  --text-muted: var(--brand-grey);
  --accent: var(--brand-primary);
  --accent-hover: var(--brand-primary-light);

  /* Typography — Utopia fluid scale */
  --step--2: clamp(0.69rem, 0.66rem + 0.18vw, 0.80rem);
  --step--1: clamp(0.83rem, 0.78rem + 0.29vw, 1.00rem);
  --step-0: clamp(1.00rem, 0.91rem + 0.43vw, 1.25rem);
  --step-1: clamp(1.20rem, 1.07rem + 0.63vw, 1.56rem);
  --step-2: clamp(1.44rem, 1.26rem + 0.89vw, 1.95rem);
  --step-3: clamp(1.73rem, 1.48rem + 1.24vw, 2.44rem);
  --step-4: clamp(2.07rem, 1.73rem + 1.70vw, 3.05rem);
  --step-5: clamp(2.49rem, 2.03rem + 2.31vw, 3.82rem);

  /* Fonts */
  --font-heading: 'Oswald', sans-serif;
  --font-body: 'DM Sans', sans-serif;

  /* Spacing */
  --space-xs: clamp(0.25rem, 0.2rem + 0.25vw, 0.5rem);
  --space-s: clamp(0.5rem, 0.4rem + 0.5vw, 1rem);
  --space-m: clamp(1rem, 0.8rem + 1vw, 2rem);
  --space-l: clamp(2rem, 1.6rem + 2vw, 4rem);
  --space-xl: clamp(3rem, 2.4rem + 3vw, 6rem);

  /* Layout */
  --max-width: 1200px;
  --radius: 12px;
  --radius-sm: 8px;
}