/*
  tokens.css — palette + typographie du site vitrine.
  Toute couleur ou police du site doit passer par une variable d'ici :
  changer un hex ou une police ici suffit à changer tout le site.
*/

/* --- polices finales de l'artiste (remplacent le trio Google Fonts placeholder) --- */
@font-face {
  font-family: 'Lucidity Psych';
  src: url('../../fonts/lucidy-psych/Lucidity-Psych.woff2') format('woff2'),
       url('../../fonts/lucidy-psych/Lucidity-Psych.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Basteleur';
  src: url('../../fonts/basteleur/Basteleur-Moonlight.woff2') format('woff2'),
       url('../../fonts/basteleur/Basteleur-Moonlight.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Basteleur';
  src: url('../../fonts/basteleur/Basteleur-Bold.woff2') format('woff2'),
       url('../../fonts/basteleur/Basteleur-Bold.woff') format('woff');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  /* --- HERO UNIQUEMENT : ne pas toucher, le hero garde son propre calage
     (fond, halo du logo et bouton .cta y sont ancrés) --- */
  --moutarde: #d9a441;     /* lune, halo du logo, .cta */
  --orange-rouge: #c85a34; /* résiduel, plus utilisé que par référence historique */
  --teal: #4f9d8c;         /* résiduel, le séparateur utilise aztek_texture.png désormais */
  --mauve-nuit: #4a3f6b;   /* .cta:hover */
  --bleu-nuit: #1c1d3a;    /* .cta:hover */
  --moon: #d8dce8;         /* .hero-meta, + réutilisé comme lien clair hors hero */
  --ink: #ece9e0;          /* .hero-content, texte courant hors hero — déjà proche du crème affiche */

  /* --- Palette « affiche », pour tout le site SAUF le hero ---
     Extraite de assets/nuit-philo-affiche.jpg : bleu nuit dominant,
     bordures mauve/magenta, lune jaune, veines orange, sol vert,
     touches cyan, texte crème. Le jaune reste rare (lumière), le rose
     sert à l'interactif, orange/vert/cyan sont des intrusions ponctuelles. */
  --night-950: #080F20;
  --night-900: #0B152B;
  --night-800: #142A47;
  --blue:      #22416B;

  --purple:    #57475D;
  --magenta:   #8E5161;
  --pink:      #C97B87;
  --pink-bright: #D98CA6; /* hover / accents interactifs, un cran plus vif */

  --yellow:    #E8A911;
  --acid:      #8F7F08;
  --orange:    #B74D16;

  --green:     #425C39;
  --cyan:      #1D759A;

  --cream:     #D5CBDF;
  --white:     #EDE8E7;

  /* --- base sombre du site (hors hero), sur la palette affiche --- */
  --bg: var(--night-900);
  --bg-panel: var(--night-800);
  --line: #24365C;
  --line-soft: #182A47;
  --ink-muted: #9C8FAE;

  /* --- couleurs de catégories pour les 4 espaces, extraites directement
     des 4 teintes dominantes de assets/img/aztek_texture.png (le motif du
     séparateur de section), pour que la programmation et le motif
     décoratif partagent la même identité visuelle --- */
  --intellectuel: #047DFF;   /* bleu — Bureau des Curiosités */
  --culturel: #F24405;       /* orange-rouge — Le Village */
  --amphi: #F2B707;          /* jaune — La Scène-Boudoir */
  --murmure: #52498C;        /* violet — La Bulle Onirique */

  /* --- typographie : polices finales de l'artiste --- */
  --font-display: 'Lucidity Psych', 'Cormorant Garamond', Georgia, serif;
  --font-body: 'Basteleur', 'Cormorant Garamond', Georgia, serif;
  --font-label: 'IBM Plex Mono', 'Courier New', monospace;

  /* --- échelle d'espacement --- */
  --space-1: 8px;
  --space-2: 16px;
  --space-3: 32px;
  --space-4: 64px;
  --space-5: 96px;
  --radius: 4px;

  /* --- largeur de lecture --- */
  --content-width: 720px;
  --wide-width: 1100px;
}
