/* Podcast Agency — jetons de la charte v1 (28/09/2026). Source unique pour le site podcastagency.fr.
   Polices (Google Fonts, SIL OFL 1.1) :
   https://fonts.googleapis.com/css2?family=Big+Shoulders+Display:wght@700;900&family=Host+Grotesk:wght@400;500;600&family=Martian+Mono:wght@400;600&display=swap */
:root {
  /* Couleurs de marque */
  --alu: #E7E6E2;        /* fond, façade de console — 60 % */
  --encre: #121212;      /* texte, formes — 28 % */
  --grille: #C9C8C2;     /* filets, séparateurs — 6 % */
  --rec: #FF3B1F;        /* voyants uniquement, jamais en texte sur alu (2,85:1) — 4 % */
  --vu: #FFB000;         /* niveaux, surlignages — 2 % */
  /* Couleurs de fonction */
  --gris: #55544F;       /* texte secondaire sur alu (6,08:1) */
  --rec-texte: #C22710;  /* rouge lisible sur alu (4,68:1) */
  --panneau: #F2F1EE;    /* panneaux clairs */
  --gris-nuit: #9A9994;  /* texte secondaire sur encre (6,56:1) */
  --filet-nuit: #2E2E2C;
  --panneau-nuit: #1B1B1A;

  /* Typographie */
  --f-titre: 'Big Shoulders Display', Impact, 'Arial Narrow', sans-serif; /* 900, capitales */
  --f-texte: 'Host Grotesk', 'Helvetica Neue', Arial, sans-serif;
  --f-mono: 'Martian Mono', ui-monospace, Menlo, Consolas, monospace;    /* minutages, étiquettes */
  --t-mega: clamp(96px, 18vw, 260px);   /* interligne .8 */
  --t-h1: clamp(56px, 8vw, 120px);      /* .88 */
  --t-h2: clamp(36px, 4.5vw, 64px);     /* .95 */
  --t-h3: 28px;                         /* 1.05 */
  --t-chapo: clamp(20px, 2vw, 26px);    /* 1.35, graisse 500 */
  --t-texte: 18px;                      /* 1.55 */
  --t-petit: 14px;                      /* 1.5 */
  --t-etiquette: 11px;                  /* 1.3, mono, capitales, +0.08em */

  /* Mouvement */
  --dur-coupe: 0ms;                     /* transition signature : la coupe franche */
  --dur-ui: 120ms;
  --dur-vu: 450ms;                      /* montée vu-mètre d'un titre */
  --pas-lettre: 30ms;
  --dur-voyant: 1.6s;                   /* clignotement ON AIR, en deux états */
  --ease-vu: cubic-bezier(.3, 0, .2, 1);

  /* Formes */
  --rayon: 4px;
  --rayon-pilule: 999px;
}