/* ==========================================================================
   POLYVATECH — jetons de design (refonte 2026-11, étape 1)
   Seule source des polices, tailles, couleurs, espacements et rayons.
   Chargée avant style.css sur toutes les pages. `npm run check` refuse toute
   valeur brute dans home.css et toute nouvelle valeur brute dans style.css.
   ========================================================================== */

:root {
  /* Polices : une famille par écriture, la mono réservée aux données */
  --font-sans: 'IBM Plex Sans', system-ui, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, Consolas, monospace;

  /* Échelle typographique : 6 tailles */
  --text-sm: 0.875rem;   /* 14 px : légendes, mentions */
  --text-md: 1.0625rem;  /* 17 px : paragraphes */
  --text-lg: 1.25rem;    /* 20 px : chapeaux */
  --text-xl: 1.75rem;    /* 28 px : titres de carte */
  --text-2xl: clamp(2rem, 1.4rem + 2vw, 2.5rem);     /* 32 → 40 px : titres de section */
  --text-3xl: clamp(2.5rem, 1.6rem + 3.2vw, 3.75rem); /* 40 → 60 px : titre principal */

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;

  --leading-tight: 1.1;
  --leading-snug: 1.3;
  --leading-body: 1.6;
  --tracking-tight: -0.02em;

  /* Couleurs : encre marine + un accent (bouton principal) */
  --ink: #100937;
  --text: #25233f;
  --muted: #5d5b7a;
  --paper: #ffffff;
  --paper-2: #f4f6fc;
  --rule: #dce1f0;
  --accent: #c63c0d;        /* corail lisible : blanc dessus = 5,0:1 (AA) */
  --accent-hover: #a8320a;
  --on-dark: #ffffff;
  --on-dark-muted: #b9b6d6;
  --rule-dark: #2a2260;

  /* Repères des trois métiers (pastilles et filets uniquement, jamais en fond) */
  --warm: linear-gradient(135deg, #f15a24 0%, #fb6468 50%, #fbb936 100%);
  --cool: linear-gradient(135deg, #1447d4 0%, #006fff 24.1%, #00e7ff 100%);
  --neutral: linear-gradient(135deg, #100937, #5d5b7a);

  /* Espacements (base 4 px) */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-24: 6rem;

  --wrap-narrow: 1200px;   /* largeur de lecture des pages refondues */

  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-pill: 999px;

  --shadow-card: 0 1px 2px rgb(16 9 55 / 0.06), 0 8px 24px rgb(16 9 55 / 0.06);
  --shadow-screen: 0 2px 4px rgb(16 9 55 / 0.08), 0 24px 64px rgb(16 9 55 / 0.16);
}

[dir="rtl"] {
  --font-sans: 'IBM Plex Sans Arabic', 'IBM Plex Sans', system-ui, sans-serif;
  --tracking-tight: 0;
  --leading-tight: 1.3;
}