/* ═══════════════════════════════════════════════════════════════════════════
   FRBTP Guyane - Direction FRBTP Clair (VAGUE 1A - 2026-07-22)
   Tokens de design approuvés : blanc dominant, bleu de marque, orange accent
   ═══════════════════════════════════════════════════════════════════════════ */

:root {
  /* ── Palette FRBTP Clair (blanc dominant) ──────────────────────────────── */
  --bg:                  #FFFFFF;   /* Fond blanc dominant                     */
  --bg-2:                #F4F6FA;   /* Gris-bleu très clair (sections alt)     */
  --bg-blue-tint:        #E8EEF7;   /* Bleu très clair (encadrés)              */
  --ink:                 #16202E;   /* Texte principal (bleu-ardoise)          */
  --muted:               #5A6675;   /* Légendes, métadonnées                   */

  --blue:                #04449B;   /* Bleu FRBTP : titres, éléments forts     */
  --blue-deep:           #033475;   /* Liens, hover, footer, aplats profonds   */
  --blue-tint-line:      #CFE0F2;   /* Filets bleutés clairs                   */

  --orange:              #F39719;   /* Orange FRBTP : accent visible           */
  --orange-fill:         #B5540A;   /* Orange foncé (blanc dessus)             */
  --orange-text:         #9A4A08;   /* Orange brûlé (texte accent sur blanc)   */

  --green:               #0D7A38;   /* Validation                              */
  --line:                #E4E8EF;   /* Filets, séparateurs                     */

  /* --frbtp-dark était référencée par .frbtp-section--dark (main.css) sans
     jamais être définie -> background invalide (transparent), texte blanc
     sur fond blanc sur 8 templates (CA, CV, adhérent, entreprise, membre,
     barometre, front-page, marché public). Fix VAGUE 4 (2026-07-23) :
     surface sombre = bleu de marque, jamais near-black (TOKENS.md). */
  --frbtp-dark:          var(--blue-deep);

  /* ── Compat (aliases anciens tokens) ───────────────────────────────────── */
  --frbtp-primary:       var(--blue);
  --frbtp-primary-dark:  var(--blue-deep);
  --frbtp-accent:        var(--orange);
  --frbtp-white:         var(--bg);
  --frbtp-text:          var(--ink);
  --frbtp-text-muted:    var(--muted);
  --frbtp-success:       var(--green);
  --accent-orange:       var(--orange);
  --accent-orange-dark:  var(--orange-fill);
  --accent-green:        var(--green);
  --accent-green-dark:   #0A5C2A;

  /* ── Variables historiques jamais definies (T-1A-1, verif globale
     2026-07-23) : elles resolvaient invalide (transparent / heritage).
     Definies avec les valeurs qui PRESERVENT le rendu valide du site :
     - secondary = semantique texte fort (les fonds qui l'utilisaient ont
       ete convertis explicitement en bleus de marque) ;
     - danger/warning/info alignes sur la charte. ──────────────────────── */
  --frbtp-secondary:     var(--ink);
  --frbtp-border:        var(--line);
  --frbtp-danger:        #C0392B;
  --frbtp-warning:       var(--orange-fill);
  --frbtp-info:          var(--blue);

  /* ── CTA ────────────────────────────────────────────────────────────────── */
  --cta-bg:              var(--orange);
  --cta-hover:           var(--orange-fill);

  /* ── Hero overlay (bleu de marque, pas noir) ───────────────────────────── */
  --hero-overlay-start:  rgba(4, 68, 155, 0.85);
  --hero-overlay-end:    rgba(3, 52, 117, 0.90);

  /* ── Typographie (Satoshi sans-serif, Bahnschrift chiffres) ────────────── */
  --font-sans:    'Satoshi', Corbel, 'Segoe UI', system-ui, -apple-system, sans-serif;
  --font-display: var(--font-sans);
  --font-numbers: Bahnschrift, 'Segoe UI', sans-serif;

  /* Échelle typographique */
  --font-size-xs:  0.8125rem;  /* 13px - kickers, labels */
  --font-size-sm:  0.9375rem;  /* 15px - métadonnées     */
  --font-size-md:  1.0625rem;  /* 17px - corps de texte  */
  --font-size-lg:  1.25rem;    /* 20px - lead paragraphs */
  --font-size-xl:  1.5rem;     /* 24px                   */
  --font-size-2xl: 1.625rem;   /* 26px                   */
  --font-size-3xl: 2.125rem;   /* 34px                   */
  --font-size-4xl: 2.875rem;   /* 46px - titres          */
  --font-size-5xl: 3.875rem;   /* 62px - hero            */

  /* ── Spacing (base 8px) ────────────────────────────────────────────────── */
  --space-1:  0.25rem;   /* 4px  */
  --space-2:  0.5rem;    /* 8px  */
  --space-3:  0.75rem;   /* 12px */
  --space-4:  1rem;      /* 16px */
  --space-5:  1.25rem;   /* 20px */
  --space-6:  1.5rem;    /* 24px */
  --space-8:  2rem;      /* 32px */
  --space-10: 2.5rem;    /* 40px */
  --space-12: 3rem;      /* 48px */
  --space-16: 4rem;      /* 64px */
  --space-20: 5rem;      /* 80px */
  --space-24: 6.5rem;    /* 104px */

  /* ── Layout ──────────────────────────────────────────────────────────────── */
  --container-max:    1200px;
  --container-narrow:  740px;
  --sidebar-width:    260px;
  --gutter:           2rem;   /* 32px */

  /* ── Border (chamfer au lieu de radius gadget) ─────────────────────────── */
  --radius-sm:  6px;
  --chamfer-card: 12px;  /* Coin haut-droit coupé sur les cartes     */
  --chamfer-cta:  8px;   /* CTA / boutons                            */
  --chamfer-sm:   6px;   /* Petits éléments (tags, mini-cards)       */
  --radius-full: 9999px; /* Inputs arrondis légers si besoin         */

  /* ── Trace "serpent" au survol (regle bordure transverse, VAGUE 4) ──────── */
  --trace-color-1: var(--blue);
  --trace-color-2: var(--orange);
  --trace-duration: 5.5s;

  /* ── Shadow (légère, propre) ───────────────────────────────────────────── */
  --shadow-card:  0 1px 0 var(--line), 0 22px 40px -30px rgba(22,32,46,.22);
  --shadow-hover: 0 1px 0 var(--line), 0 30px 50px -30px rgba(22,32,46,.28);

  /* ── Transitions ─────────────────────────────────────────────────────────── */
  --ease:          cubic-bezier(.22,.61,.36,1);
  --transition:    0.2s var(--ease);
  --transition-slow: 0.3s var(--ease);

  /* ── Z-index ─────────────────────────────────────────────────────────────── */
  --z-dropdown: 100;
  --z-sticky:   200;
  --z-modal:    300;
  --z-toast:    400;
  --z-fab:      500;
}