/* =========================================================================
   MAXAUTO · variables.css · Design tokens
   Palette dérivée du logo MAXAUTO : bleu profond + anthracite.
   Accent orange industriel pour CTAs et éléments dynamiques.
   ========================================================================= */

:root {
  /* --- Couleurs de marque (logo MAXAUTO) --- */
  --blue-400: #3a7cc6;
  --blue-500: #2a69b2;   /* bleu du logo, éléments secondaires */
  --blue-600: #1e4795;
  --blue-700: #263f8b;   /* bleu profond du logo */
  --blue-800: #25346f;
  --blue-900: #1a2550;

  /* --- Accent industriel (CTA, highlights) --- */
  --orange-400: #ffa04d;
  --orange-500: #f47920;  /* accent principal */
  --orange-600: #e8642c;
  --orange-700: #d4521e;

  /* --- Anthracite (base sombre) --- */
  --ink-900: #111318;    /* fond sombre principal */
  --ink-800: #1a1d24;
  --ink-700: #2b2f34;    /* anthracite du wordmark */
  --ink-600: #363a42;

  /* --- Neutres --- */
  --white:    #ffffff;
  --off-white:#f2f3f5;   /* section claire alternée */
  --grey-100: #e8eaed;
  --grey-200: #d5d8de;
  --grey-300: #bec3cc;
  --grey-500: #6e7585;   /* texte secondaire */
  --grey-700: #3d4350;
  --ink:      #13161c;   /* texte principal */

  /* --- Sémantique --- */
  --bg:        var(--white);
  --bg-dark:   var(--ink-900);
  --text:      var(--ink);
  --text-muted:var(--grey-500);
  --text-on-dark: #c9cdd6;
  --border:    var(--grey-200);
  --accent:    var(--orange-500);
  --accent-hover: var(--orange-600);
  --accent-ink:var(--blue-700);

  /* --- Dégradés signature --- */
  --grad-orange: linear-gradient(135deg, var(--orange-500) 0%, var(--orange-700) 100%);
  --grad-dark:   linear-gradient(135deg, var(--ink-800) 0%, #1c2438 100%);
  --grad-blue:   linear-gradient(135deg, var(--blue-500) 0%, var(--blue-700) 100%);

  /* --- Typographie ---
     Titres : Space Grotesk (géométrique, industrielle).
     Texte : Inter (neutre, très lisible). */
  --font-display: "Space Grotesk", "Arial Narrow", system-ui, sans-serif;
  --font-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

  --fs-hero: clamp(2.4rem, 5.8vw, 4.4rem);
  --fs-h2:   clamp(1.7rem, 3.2vw, 2.6rem);
  --fs-h3:   clamp(1.15rem, 1.8vw, 1.45rem);
  --fs-lead: clamp(1rem, 1.3vw, 1.15rem);
  --fs-body: 1rem;
  --fs-small:0.85rem;

  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;

  /* --- Espacements --- */
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 1.75rem;
  --space-lg: 3rem;
  --space-xl: 5rem;
  --space-2xl: 7.5rem;

  --container: 1280px;
  --container-narrow: 1020px;
  --gutter: 2rem;

  /* --- Rayons & ombres (plus anguleux que Zauto) --- */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-pill: 999px;
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 12px 32px rgba(0, 0, 0, 0.10);
  --shadow-lg: 0 24px 56px rgba(0, 0, 0, 0.16);
  --shadow-accent: 0 12px 28px rgba(244, 121, 32, 0.30);

  /* --- Transitions --- */
  --ease: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --dur: 0.3s;

  --header-h: 72px;
}