/* =============================================================
   LEONIDA RP — JETONS DE DESIGN
   =============================================================
   Les couleurs ne sont pas choisies a l'oeil : elles sont extraites
   des pixels du logo rond et du badge, puis verifiees au contraste.

   DEUX FAMILLES, ET C'EST VOLONTAIRE :

   --brand-*   fideles au logo, tres saturees. DECORATIF UNIQUEMENT
               (filets, bordures, halos). Elles ne passent pas AA :
               jamais de texte dans ces couleurs.
   --accent-*  memes teintes, luminosite relevee jusqu'a passer AA
               sur le fond. Des qu'un humain doit LIRE, c'est celles-ci.

   Ratios mesures sur le fond #0B0D14 :
     texte      #F2EADF  16.28  AAA
     secondaire #A9B0C0   8.93  AAA
     magenta    #EE048A   4.64  AA
     violet     #B78CF7   7.49  AAA
     orange     #F5563B   5.80  AA
   ============================================================= */

:root {
  /* ---------- fond et surfaces ---------- */
  --bg:            #0B0D14;   /* presque noir, legerement bleute */
  --bg-elev:       #101420;   /* bandeaux, zones dediees */
  --surface:       #141824;   /* cartes */
  --surface-hi:    #1A1F2E;   /* carte survolee */
  --line:          #232A3A;   /* filets discrets */
  --line-hi:       #2F3849;   /* filets un peu plus lisibles */

  /* ---------- texte ---------- */
  --text:          #F2EADF;   /* blanc casse, derive du creme du logo */
  --text-soft:     #C9CEDA;
  --text-muted:    #A9B0C0;

  /* ---------- accents LISIBLES (texte, liens, boutons) ---------- */
  --accent-magenta: #EE048A;
  --accent-violet:  #B78CF7;
  --accent-orange:  #F5563B;

  /* ---------- couleurs du logo, DECORATIF SEULEMENT ---------- */
  --brand-magenta: #E40484;
  --brand-violet:  #9C11AF;
  --brand-orange:  #F5563B;
  --brand-deep:    #520352;   /* violet profond du fond du logo */

  /* ---------- roles ---------- */
  --link:          var(--accent-violet);
  --link-hover:    var(--accent-magenta);
  --focus:         var(--accent-violet);

  /* ---------- typographie ---------- */
  /* Titres : Archivo Narrow, EMBARQUEE avec le site (voir fonts.css), donc
     identique partout. Les condensees systeme restent en repli le temps du
     chargement, puis une pile generique pour les cas extremes.
     Corps : pile systeme, aucun fichier a charger pour le texte courant. */
  --font-titre: 'Archivo Narrow', 'Roboto Condensed', 'Liberation Sans Narrow',
                'Helvetica Neue Condensed', 'Arial Narrow', system-ui, sans-serif;
  --font-corps: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue',
                Arial, sans-serif;

  /* echelle typographique fluide : lisible a 360px comme a 1920px */
  --t-xs:   0.8125rem;
  --t-sm:   0.9375rem;
  --t-base: clamp(1rem, 0.97rem + 0.15vw, 1.0625rem);
  --t-lg:   clamp(1.125rem, 1.06rem + 0.3vw, 1.25rem);
  --t-xl:   clamp(1.375rem, 1.2rem + 0.8vw, 1.75rem);
  --t-2xl:  clamp(1.75rem, 1.45rem + 1.4vw, 2.5rem);
  --t-3xl:  clamp(2.25rem, 1.7rem + 2.6vw, 4rem);

  --lh-titre: 1.08;
  --lh-corps: 1.65;

  /* ---------- rythme vertical et largeurs ---------- */
  --sp-1: 0.25rem;  --sp-2: 0.5rem;   --sp-3: 0.75rem;  --sp-4: 1rem;
  --sp-5: 1.5rem;   --sp-6: 2rem;     --sp-7: 3rem;     --sp-8: 4rem;
  --sp-9: 6rem;

  --section-y: clamp(3.5rem, 2rem + 7vw, 7rem);   /* respiration entre sections */
  --largeur:   72rem;                              /* largeur max du contenu */
  --largeur-texte: 40rem;                          /* ~65 caracteres par ligne */

  --radius:    6px;   /* sobre : pas de gros arrondis */
  --radius-lg: 10px;

  --ombre: 0 1px 2px rgb(0 0 0 / 0.4), 0 8px 24px rgb(0 0 0 / 0.28);
  --ombre-haute: 0 2px 4px rgb(0 0 0 / 0.45), 0 18px 48px rgb(0 0 0 / 0.5);

  /* Le filet aux trois couleurs du logo : LA signature graphique du site.
     Reserve aux lignes fines (progression, separations, lisere des cartes) :
     jamais en fond de bloc. */
  --filet-marque: linear-gradient(90deg,
      var(--brand-magenta), var(--brand-violet) 52%, var(--brand-orange));

  --transition: 160ms ease;
  --transition-lente: 340ms cubic-bezier(0.25, 0.1, 0.25, 1);
}

/* Le site est sombre par nature (identite synthwave nocturne). On l'annonce
   au navigateur pour que les widgets natifs (scrollbars, champs) suivent. */
:root { color-scheme: dark; }