/* ==========================================================================
   Prix du Nord — design tokens
   Palette provisoire : à valider avec le client avant d'être figée.
   ========================================================================== */

:root {
  /* Bleu marine — couleur d'identité principale, accordée au bleu foncé du logo définitif (#083858).
     Mêmes luminosités que l'ancien « pétrole » (contrastes inchangés), teinte déplacée du vert-bleu vers le bleu du logo. */
  --petrol-950: #071c2b;
  --petrol-900: #0a2840;
  --petrol-800: #0f3552;
  --petrol-700: #164666;
  --petrol-500: #2d6a8f;

  /* Bleu ciel — second bleu du logo (#28a8d8) : petits détails graphiques, états sélectionnés, filets.
     Jamais pour un texte sur fond clair (contraste insuffisant) ; --sky-700 pour un texte ou un lien bleu. */
  --sky-500: #28a8d8;
  --sky-700: #156f99;
  --sky-100: #e2f1f8;

  /* Ardoise bleutée — neutre froid */
  --slate-500: #5f7883;
  --slate-400: #7f96a1;
  --slate-300: #a9bac1;
  --mist-200: #d5dee0;   /* bande claire bleutée */
  --mist-100: #e4eaeb;

  /* Écru — fond chaud, papier technique */
  --ecru-200: #e4dccb;
  --ecru-100: #efe9dc;
  --ecru-50:  #f7f3ea;

  /* Cuivre — accent, action */
  --copper-800: #7e3f16;
  --copper-700: #8f4a1c;
  --copper-600: #a8561f;
  --copper-400: #d08a4e;

  --ink: #12262d;
  --ink-soft: #3d5159;

  /* Rôles */
  --bg: var(--ecru-100);
  --text: var(--ink);
  --text-muted: var(--ink-soft);
  --action: var(--copper-600);
  --action-hover: var(--copper-700);
  --on-action: #fbf6ee;
  --on-dark: var(--ecru-50);
  --on-dark-muted: #a9bccb;
  --rule: rgba(18, 38, 45, 0.16);
  --rule-dark: rgba(239, 233, 220, 0.18);

  /* Typographie */
  --font-sans: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --font-display: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --wdth-display: 116;
  --wdth-heading: 108;

  --fs-display: clamp(2.5rem, 1.15rem + 4.1vw, 5rem);
  --fs-h2: clamp(1.9rem, 1.25rem + 2.2vw, 3.25rem);
  --fs-h3: clamp(1.25rem, 1.05rem + 0.7vw, 1.7rem);
  --fs-lead: clamp(1.075rem, 1rem + 0.35vw, 1.3rem);
  --fs-body: 1.0625rem;
  --fs-small: 0.9375rem;
  --fs-xs: 0.8125rem;

  /* Géométrie — le chanfrein vient de la coupe à 45° du monogramme */
  --cut-lg: clamp(36px, 5vw, 76px);
  --cut-md: clamp(22px, 2.6vw, 36px);
  --cut-sm: 10px;

  /* Espacements */
  --gutter: clamp(20px, 4vw, 56px);
  --maxw: 1320px;
  --section-y: clamp(72px, 9vw, 144px);
  --header-h: 76px;

  --ease: cubic-bezier(0.2, 0.7, 0.1, 1);
}

/* Arabe : familles dédiées, pas d'élargissement (non pertinent pour ces fontes) */
:root:lang(ar) {
  --font-sans: "IBM Plex Sans Arabic", "Archivo", sans-serif;
  --font-display: "Noto Kufi Arabic", "IBM Plex Sans Arabic", sans-serif;
  --wdth-display: 100;
  --wdth-heading: 100;
  --fs-display: clamp(2.2rem, 1.1rem + 3.4vw, 4.2rem);
}

@media (max-width: 719px) {
  :root { --header-h: 64px; }
}
