/*
 * typography.css — Sorgem Theme
 * Classes utilitaires typographiques + hiérarchie h1-h6
 * Dépend de : tokens.css, fonts.css
 *
 * Règle universelle Basier Circle Narrow :
 *   letter-spacing = font-size × 0.02 (2%)
 *   line-height = 125%
 */

/* ─── Titres — Basier Circle Narrow SemiBold ─── */
h1, .h1 {
  font-family: var(--font-narrow);
  font-size: var(--text-3xl);
  font-weight: var(--font-weight-semibold);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-base);
}

h2, .h2 {
  font-family: var(--font-narrow);
  font-size: var(--text-2xl);
  font-weight: var(--font-weight-semibold);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-base);
}

h3, .h3 {
  font-family: var(--font-narrow);
  font-size: var(--text-xl);
  font-weight: var(--font-weight-semibold);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-base);
}

h4, .h4 {
  font-family: var(--font-narrow);
  font-size: var(--text-lg);
  font-weight: var(--font-weight-semibold);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-base);
}

h5, .h5 {
  font-family: var(--font-narrow);
  font-size: var(--text-base);
  font-weight: var(--font-weight-semibold);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-base);
}

h6, .h6 {
  font-family: var(--font-narrow);
  font-size: var(--text-sm);
  font-weight: var(--font-weight-semibold);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-base);
}

/* ─── Échelle de taille — utilitaires ─── */
.text-xs   { font-size: var(--text-xs); }
.text-sm   { font-size: var(--text-sm); }
.text-base { font-size: var(--text-base); font-weight: 300; }
.text-lg   { font-size: var(--text-lg); }
.text-xl   { font-size: var(--text-xl); }
.text-2xl  { font-size: var(--text-2xl); }
.text-3xl  { font-size: var(--text-3xl); }

/* ─── Graisses — utilitaires ─── */
.font-regular  { font-weight: var(--font-weight-regular); }
.font-medium   { font-weight: var(--font-weight-medium); }
.font-semibold { font-weight: var(--font-weight-semibold); }
.font-bold     { font-weight: var(--font-weight-bold); }

/* ─── Familles — utilitaires ─── */
.font-narrow { font-family: var(--font-narrow); }
.font-sans   { font-family: var(--font-sans); }
.font-body   { font-family: var(--font-body); }
.font-mono   { font-family: var(--font-mono); }

/* ─── Couleurs de texte — utilitaires ─── */
.text-brand  { color: var(--color-brand); }
.text-rouge  { color: var(--color-rouge); }
.text-blanc  { color: var(--color-blanc); }
.text-black  { color: var(--color-black); }
.text-gris   { color: var(--color-gris); }
.text-stroke { color: var(--color-stroke); }

/* ─── Alignement ─── */
.text-left   { text-align: left; }
.text-center { text-align: center; }
.text-right  { text-align: right; }

/* ─── Majuscules label ─── */
.label {
  font-size: var(--text-xs);
  font-weight: var(--font-weight-semibold);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}