/* ==========================================================================
   TERANGA ÉLECTRO — Variables CSS (Design System)
   Kit de style : Moderne / Tech — Variante A (Bleu électrique)
   ========================================================================== */

:root {
  /* ---- Couleurs principales ---- */
  --color-primary: #0D1B2A;        /* Bleu nuit — fonds sombres, header, footer */
  --color-primary-light: #16283d;  /* Bleu nuit clair — dégradés, hover foncé */
  --color-accent: #2E86FF;         /* Bleu vif — CTA, liens, éléments actifs */
  --color-accent-dark: #1c6fe0;    /* Bleu vif foncé — hover des CTA */
  --color-highlight: #B4FF39;      /* Lime — accent minimal (badges, prix promo) */

  /* ---- Couleurs neutres ---- */
  --color-white: #FFFFFF;
  --color-bg: #F5F7FA;             /* Fond général des sections claires */
  --color-bg-alt: #EDF1F7;         /* Fond alterné des sections */
  --color-border: #E1E6ED;
  --color-text: #16202A;
  --color-text-muted: #5B6774;
  --color-text-inverse: #F5F7FA;

  /* ---- États ---- */
  --color-success: #1E9E5A;
  --color-error: #D93B3B;
  --color-warning: #E0A400;

  /* ---- Typographie ---- */
  --font-heading: 'Poppins', 'Segoe UI', system-ui, sans-serif;
  --font-body: 'Inter', 'Segoe UI', system-ui, sans-serif;

  --fs-xs: 0.8rem;
  --fs-sm: 0.9rem;
  --fs-base: 1rem;
  --fs-md: 1.15rem;
  --fs-lg: 1.4rem;
  --fs-xl: 1.85rem;
  --fs-xxl: 2.5rem;
  --fs-hero: 3rem;

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

  --lh-tight: 1.2;
  --lh-normal: 1.55;

  /* ---- Espacements ---- */
  --space-xxs: 0.25rem;
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1.25rem;
  --space-lg: 2rem;
  --space-xl: 3.25rem;
  --space-xxl: 5rem;

  /* ---- Rayons (radius moyen — Kit Moderne/Tech) ---- */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-pill: 999px;

  /* ---- Ombres ---- */
  --shadow-sm: 0 2px 8px rgba(13, 27, 42, 0.08);
  --shadow-md: 0 8px 24px rgba(13, 27, 42, 0.12);
  --shadow-lg: 0 16px 40px rgba(13, 27, 42, 0.18);

  /* ---- Transitions ---- */
  --transition-fast: 0.18s ease;
  --transition-base: 0.28s ease;

  /* ---- Layout ---- */
  --container-max: 1200px;
  --header-height: 76px;
}