/* ==========================================================================
   URBAN KART'IN — DESIGN TOKENS
   Source unique de vérité de la charte graphique.
   Dans la version WordPress, ces valeurs sont pilotées depuis
   Elementor > Réglages du site > Couleurs/Typographies (le client peut
   changer toute la charte sans toucher au code).
   ========================================================================== */

:root {
  /* --- Couleurs de marque (reprises de l'actuel kit Elementor) --- */
  --uk-green: #00c85a;
  --uk-green-dark: #009a45;
  --uk-green-glow: rgba(0, 200, 90, 0.35);
  --uk-yellow: #fff401;
  --uk-orange: #ff8800;
  --uk-red: #f62b2b;
  --uk-blue: #3f84f2;

  /* --- Neutres "paddock" --- */
  --uk-black: #000000;
  --uk-carbon: #0b0d0e;
  --uk-carbon-2: #121517;
  --uk-graphite: #1c2023;
  --uk-grey: #3c3c3c;
  --uk-grey-light: #969696;
  --uk-white: #ffffff;

  /* --- Rôles sémantiques --- */
  --bg: var(--uk-carbon);
  --bg-alt: var(--uk-carbon-2);
  --surface: var(--uk-graphite);
  --surface-hi: #262b2f;
  --text: #eef2f4;
  --text-muted: #9aa4aa;
  --line: rgba(255, 255, 255, 0.09);
  --line-strong: rgba(255, 255, 255, 0.18);
  --accent: var(--uk-green);
  --on-accent: #001a0b;

  /* --- Typographie ---
     Prod : proxima-soft-condensed (Adobe Fonts) pilotée par le kit.
     Proto : Barlow Condensed / Barlow (métriques très proches). */
  --font-display: "Barlow Condensed", "proxima-soft-condensed", "Arial Narrow", sans-serif;
  --font-body: "Barlow", "proxima-soft", system-ui, -apple-system, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", monospace;

  /* Échelle fluide : tout est responsive par construction */
  --fs-xs: clamp(0.72rem, 0.68rem + 0.2vw, 0.8rem);
  --fs-sm: clamp(0.84rem, 0.8rem + 0.2vw, 0.94rem);
  --fs-base: clamp(0.98rem, 0.94rem + 0.25vw, 1.08rem);
  --fs-lg: clamp(1.12rem, 1rem + 0.6vw, 1.35rem);
  --fs-xl: clamp(1.45rem, 1.2rem + 1.2vw, 2rem);
  --fs-2xl: clamp(2rem, 1.4rem + 2.6vw, 3.4rem);
  --fs-3xl: clamp(2.8rem, 1.6rem + 5.4vw, 6.5rem);
  --fs-hero: clamp(3.2rem, 1.4rem + 8.5vw, 9rem);

  /* --- Espacements fluides --- */
  --sp-1: 0.375rem;
  --sp-2: 0.75rem;
  --sp-3: 1.125rem;
  --sp-4: 1.75rem;
  --sp-5: clamp(2rem, 1.4rem + 2.4vw, 3.5rem);
  --sp-6: clamp(3rem, 2rem + 4.5vw, 6rem);
  --sp-7: clamp(4rem, 2.5rem + 6.5vw, 8.5rem);

  /* --- Layout --- */
  --container: 1280px;
  --container-narrow: 880px;
  --gutter: clamp(1rem, 0.5rem + 2.4vw, 2.75rem);
  --header-h: 72px;
  --radius: 4px;
  --radius-lg: 10px;

  /* --- Effets --- */
  --cut: 18px; /* taille du coin coupé "livery" */
  --shadow: 0 18px 45px -18px rgba(0, 0, 0, 0.9);
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dur: 0.45s;

  /* --- Damier réutilisable --- */
  --checker: repeating-conic-gradient(#fff 0% 25%, #000 0% 50%) 0 0 / 16px 16px;
}

/* Variante claire (optionnelle, sections "jour de course") */
[data-theme="light"] {
  --bg: #f4f6f7;
  --bg-alt: #ffffff;
  --surface: #ffffff;
  --surface-hi: #eef1f3;
  --text: #0b0d0e;
  --text-muted: #5a656b;
  --line: rgba(0, 0, 0, 0.1);
  --line-strong: rgba(0, 0, 0, 0.2);
}