title-05-hyphen-break — Titre display soudé par un trait d'union
============================================================

Souder une locution de deux mots en un composé unique de deux lignes, en remplaçant son ESPACE par un trait d'union frappé : « Business Proposal » devient `Business-` / `Proposal`. Le retour n'est pas calculé par la mesure, il est écrit — donc il ne bouge jamais — et le trait d'union, posé en encre la plus à droite du bloc, termine la silhouette au lieu de signaler une coupure oubliée.

EMPLOYER QUAND
  Une couverture, une slide de clôture, un hero : partout où un display de deux mots doit faire MASSE plutôt que ligne, sur une charte qui n'a pas d'accent coloré à dépenser sur son titre. Le trait d'union est alors le seul signe graphique du bloc, et il coûte zéro couleur. Sert aussi à ancrer un titre au fer à gauche d'une colonne dont le bas porte autre chose : les deux lignes serrées font un bloc franc, pas un texte qui coule.

ÉVITER QUAND
  La locution ne tient pas en deux mots, ou le second mot est plus long que le premier plus son trait : le trait d'union retombe alors À L'INTÉRIEUR de la silhouette et se lit comme une césure ratée — c'est la seule contrainte dure du pattern. Écarter aussi en capitales (le trait se centre sur une hauteur d'x absente et devient un tiret de séparation), et pour un nom de marque d'un seul mot qu'on veut régler à la largeur — c'est title-04-name-fills-measure.

COMMENT S'EN SERVIR
  1. Collez le contenu de tokens.css dans votre page. Il porte deux choses : la règle
     box-sizing que le fragment SUPPOSE (sans elle la composition grossit et déborde),
     et les jetons --vl-* de la charte, à fusionner avec les vôtres.
  2. Collez fragment.html là où la composition doit apparaître. Son CSS voyage avec
     lui, dans son <style> : rien à importer, rien à installer.
  3. Remplacez les textes. Les emplacements prévus : title.

POLICES
  Le rendu de référence utilise les polices du dépôt (OFL) : https://github.com/lbachelotcapitalb/visual-lab/tree/main/fonts

Cadre de référence : 905 × 225 px. Charte : ref-05-proposal-acid-yellow.
Licence MIT — https://visual.capitalb.fr/p/title-05-hyphen-break.html
