/* ==========================================================================
   TYPOGRAPHIE — fontes + échelle (H1..caption), responsive via clamp tokens
   ========================================================================== */

/* --- Fontes — STRICTEMENT CHARTE ------------------------------------
   PRIMARY   : Poppins      (titres, textes, UI) — police dominante.
   SECONDARY : Josefin Slab (accents ponctuels)  — var(--font-accent).
   Chargées via Google Fonts (voir enqueue.php). Aucune autre police.
   IMPORTANT : Poppins n'est PAS une fonte variable — n'utiliser que les
   poids réels de la charte (100/200/300/400/500/600/700/800/900). */

/* ==========================================================================
   HIÉRARCHIE TYPOGRAPHIQUE — CHARTE
   H1/H2/H3 + .display : SECONDARY (Josefin Slab)  -> titres principaux
   H4/H5/H6 + corps    : PRIMARY   (Poppins)       -> police du site
   ========================================================================== */

/* --- Titres principaux : SECONDARY ---------------------------------- */
.display, h1, h2, h3,
.h1, .h2, .h3 {
  font-family: var(--font-secondary);
  color: var(--c-ink);
  letter-spacing: var(--ls-display);
  text-wrap: balance;
}

.display { font-size: var(--fs-display); font-weight: var(--fw-bold); line-height: var(--lh-tight); }
h1, .h1  { font-size: var(--fs-h1);      font-weight: var(--fw-bold);     line-height: var(--lh-tight); }
h2, .h2  { font-size: var(--fs-h2);      font-weight: var(--fw-bold);     line-height: var(--lh-snug); }
h3, .h3  { font-size: var(--fs-h3);      font-weight: var(--fw-semibold); line-height: var(--lh-snug); }

/* --- Titres secondaires : PRIMARY ----------------------------------- */
h4, h5, h6,
.h4, .h5, .h6 {
  font-family: var(--font-primary);
  color: var(--c-ink);
  letter-spacing: 0;
  text-wrap: balance;
}

h4, .h4 { font-size: var(--fs-h4); font-weight: var(--fw-bold);     line-height: 1.3; }
h5, .h5 { font-size: var(--fs-h5); font-weight: var(--fw-semibold); line-height: 1.35; }
h6, .h6 { font-size: var(--fs-h6); font-weight: var(--fw-medium);   line-height: 1.4; }

/* --- Corps de texte : PRIMARY Regular ------------------------------- */
p {
  font-family: var(--font-primary);
  font-size: var(--fs-body);
  font-weight: var(--fw-regular);
  line-height: var(--lh-normal);    /* 1.7 — cible lisibilité 1.6–1.8 */
  max-width: 68ch;
}
.lead {
  font-family: var(--font-primary);
  font-size: var(--fs-lead);
  font-weight: var(--fw-regular);
  line-height: 1.75;
  color: var(--c-ink-soft);
  max-width: 680px;
}
.small { font-size: var(--fs-small); }

/* --- Labels & formulaires : PRIMARY Regular ------------------------- */
label,
input, textarea, select,
.ff-el-input--label label {
  font-family: var(--font-primary);
  font-weight: var(--fw-regular);
}

/* --- Surtitre / eyebrow (majuscules espacées, filet or) ------------- */
.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-sm);
  font-family: var(--font-body);
  font-size: var(--fs-caption);
  font-weight: 500;
  letter-spacing: var(--ls-caption);
  text-transform: uppercase;
  color: var(--c-gold-dark);
}
.eyebrow::before {
  content: "";
  width: 48px; height: 1px;
  background: var(--c-gold);
  opacity: .85;
}

/* --- Caption / légende ---------------------------------------------- */
.caption {
  font-size: var(--fs-caption);
  letter-spacing: .04em;
  color: var(--c-ink-soft);
}

/* --- Liens texte ---------------------------------------------------- */
.link-underline {
  position: relative;
  color: var(--c-ink);
  font-weight: 500;
}
.link-underline::after {
  content: ""; position: absolute; left: 0; bottom: -2px;
  width: 100%; height: 1px; background: var(--c-gold);
  transform: scaleX(0); transform-origin: right;
  transition: transform var(--dur-base) var(--ease-out);
}
.link-underline:hover::after { transform: scaleX(1); transform-origin: left; }

/* Accent sur un mot dans un titre : la charte accentue par la COULEUR
   (terracotta), pas par un changement de graisse. */
.accent-gold { color: var(--c-gold-dark); font-style: normal; font-weight: inherit; }

/* Chiffres tabulaires pour prix / surfaces alignés */
.tnum { font-variant-numeric: tabular-nums; }

/* --- SECONDARY TYPEFACE — ÉLÉMENTS DE MISE EN AVANT -----------------
   Josefin Slab est réservée aux titres principaux (H1/H2/H3, gérés
   plus haut) et aux mises en avant ci-dessous : chiffres clés, prix.
   Elle ne doit jamais servir au texte courant ni à l'UI. */
.stat__num,
.figure > strong,
.loctime strong,
.card__price {
  font-family: var(--font-secondary);
  font-weight: var(--fw-bold);
}
blockquote {
  font-family: var(--font-secondary);
  font-weight: var(--fw-semibold);
  font-size: var(--fs-h4);
  line-height: 1.4;
  color: var(--c-ink);
}