/* ==========================================================================
   Échelle typographique — classes utilitaires

   Une classe par style nommé du fichier Figma (frame « Typography » 2447:8127).
   Le nom de la classe reprend celui du style, pas son usage : `.pm-text-h2`,
   et non `.pm-text-titre-de-carte`.

   Trois exceptions, où le nom Figma commence déjà par « Texte » et produirait
   un bégaiement (`.pm-text-texte-edito`). La correspondance est alors portée
   par le commentaire de chaque token :

     .pm-text-courant  →  « Texte hors édito »
     .pm-text-h1-xl    →  « Gros titre article » (desktop) / « 📱Titre » (mobile)
     .pm-text-edito    →  « Texte édito »
     .pm-text-serif-s  →  « 📱Texte serif » (mobile uniquement)
     .pm-text-large    →  « Texte_Large (citation) »

   Ces classes s'appliquent à du contenu éditorial, là où le style vient du
   texte lui-même. Les composants d'interface (`.pm-btn`, `.pm-navlist__link`…)
   ne les utilisent PAS : ils déclarent leurs propriétés à partir des mêmes
   tokens, pour rester autonomes sans exiger une classe supplémentaire dans le
   markup — ce qui compte quand Drupal génère ce markup.

   Les six styles à variante mobile changent de taille tout seuls à 1024px :
   la surcharge est portée par les tokens, pas par ces classes.

   Seuls six de ces styles servent dans menu.html. Les autres sont là parce
   qu'ils constituent le système livré par la designer, et que les pages
   suivantes s'appuieront dessus.
   ========================================================================== */

.pm-text-menu {
  font-family: var(--pm-text-menu-family);
  font-size: var(--pm-text-menu-size);
  font-weight: var(--pm-text-menu-weight);
  line-height: var(--pm-text-menu-height);
  letter-spacing: var(--pm-text-menu-spacing);
}

.pm-text-interface {
  font-family: var(--pm-text-interface-family);
  font-size: var(--pm-text-interface-size);
  font-weight: var(--pm-text-interface-weight);
  line-height: var(--pm-text-interface-height);
  letter-spacing: var(--pm-text-interface-spacing);
}

/* Les capitales viennent du style Figma (textCase UPPER) et non du contenu :
   le texte reste saisi normalement, la casse est présentationnelle. */
.pm-text-marketing {
  font-family: var(--pm-text-marketing-family);
  font-size: var(--pm-text-marketing-size);
  font-weight: var(--pm-text-marketing-weight);
  line-height: var(--pm-text-marketing-height);
  letter-spacing: var(--pm-text-marketing-spacing);
  text-transform: uppercase;
}

.pm-text-surtitre {
  font-family: var(--pm-text-surtitre-family);
  font-size: var(--pm-text-surtitre-size);
  font-weight: var(--pm-text-surtitre-weight);
  line-height: var(--pm-text-surtitre-height);
  letter-spacing: var(--pm-text-surtitre-spacing);
  text-transform: uppercase;
}

.pm-text-h1 {
  font-family: var(--pm-text-h1-family);
  font-size: var(--pm-text-h1-size);
  font-weight: var(--pm-text-h1-weight);
  line-height: var(--pm-text-h1-height);
  letter-spacing: var(--pm-text-h1-spacing);
}

.pm-text-h1-xl {
  font-family: var(--pm-text-h1-xl-family);
  font-size: var(--pm-text-h1-xl-size);
  font-weight: var(--pm-text-h1-xl-weight);
  line-height: var(--pm-text-h1-xl-height);
  letter-spacing: var(--pm-text-h1-xl-spacing);
}

.pm-text-h2 {
  font-family: var(--pm-text-h2-family);
  font-size: var(--pm-text-h2-size);
  font-weight: var(--pm-text-h2-weight);
  line-height: var(--pm-text-h2-height);
  letter-spacing: var(--pm-text-h2-spacing);
}

.pm-text-h2-xl {
  font-family: var(--pm-text-h2-xl-family);
  font-size: var(--pm-text-h2-xl-size);
  font-weight: var(--pm-text-h2-xl-weight);
  line-height: var(--pm-text-h2-xl-height);
  letter-spacing: var(--pm-text-h2-xl-spacing);
}

.pm-text-h3 {
  font-family: var(--pm-text-h3-family);
  font-size: var(--pm-text-h3-size);
  font-weight: var(--pm-text-h3-weight);
  line-height: var(--pm-text-h3-height);
  letter-spacing: var(--pm-text-h3-spacing);
}

.pm-text-h4 {
  font-family: var(--pm-text-h4-family);
  font-size: var(--pm-text-h4-size);
  font-weight: var(--pm-text-h4-weight);
  line-height: var(--pm-text-h4-height);
  letter-spacing: var(--pm-text-h4-spacing);
}

.pm-text-h5 {
  font-family: var(--pm-text-h5-family);
  font-size: var(--pm-text-h5-size);
  font-weight: var(--pm-text-h5-weight);
  line-height: var(--pm-text-h5-height);
  letter-spacing: var(--pm-text-h5-spacing);
}

.pm-text-h6 {
  font-family: var(--pm-text-h6-family);
  font-size: var(--pm-text-h6-size);
  font-weight: var(--pm-text-h6-weight);
  line-height: var(--pm-text-h6-height);
  letter-spacing: var(--pm-text-h6-spacing);
  text-transform: uppercase;
}

.pm-text-chapo {
  font-family: var(--pm-text-chapo-family);
  font-size: var(--pm-text-chapo-size);
  font-weight: var(--pm-text-chapo-weight);
  line-height: var(--pm-text-chapo-height);
  letter-spacing: var(--pm-text-chapo-spacing);
}

.pm-text-exergue {
  font-family: var(--pm-text-exergue-family);
  font-size: var(--pm-text-exergue-size);
  font-weight: var(--pm-text-exergue-weight);
  line-height: var(--pm-text-exergue-height);
  letter-spacing: var(--pm-text-exergue-spacing);
}

.pm-text-large {
  font-family: var(--pm-text-large-family);
  font-size: var(--pm-text-large-size);
  font-weight: var(--pm-text-large-weight);
  line-height: var(--pm-text-large-height);
  letter-spacing: var(--pm-text-large-spacing);
}

.pm-text-edito {
  font-family: var(--pm-text-edito-family);
  font-size: var(--pm-text-edito-size);
  font-weight: var(--pm-text-edito-weight);
  line-height: var(--pm-text-edito-height);
  letter-spacing: var(--pm-text-edito-spacing);
}

.pm-text-serif-s {
  font-family: var(--pm-text-serif-s-family);
  font-size: var(--pm-text-serif-s-size);
  font-weight: var(--pm-text-serif-s-weight);
  line-height: var(--pm-text-serif-s-height);
  letter-spacing: var(--pm-text-serif-s-spacing);
}

.pm-text-courant {
  font-family: var(--pm-text-courant-family);
  font-size: var(--pm-text-courant-size);
  font-weight: var(--pm-text-courant-weight);
  line-height: var(--pm-text-courant-height);
  letter-spacing: var(--pm-text-courant-spacing);
}

.pm-text-note-large {
  font-family: var(--pm-text-note-large-family);
  font-size: var(--pm-text-note-large-size);
  font-weight: var(--pm-text-note-large-weight);
  line-height: var(--pm-text-note-large-height);
  letter-spacing: var(--pm-text-note-large-spacing);
}

.pm-text-note {
  font-family: var(--pm-text-note-family);
  font-size: var(--pm-text-note-size);
  font-weight: var(--pm-text-note-weight);
  line-height: var(--pm-text-note-height);
  letter-spacing: var(--pm-text-note-spacing);
}