/* ============================================================
   DealFabric Design System — 02 · Typographie
   ------------------------------------------------------------
   MODE ALB : une classe posée sur un Text Block habille tout son
   contenu. Chaque règle vise donc à la fois l élément lui-même et
   le <p> qu Enfold génère à l intérieur — sans quoi la règle
   générique « #top .df p » reprendrait la main.

   Deux familles : Instrument Sans (interface, titres),
   Inter Tight (texte courant). Titres en graisse 400 — la
   hiérarchie passe par la taille et le crénage, pas le gras.
   ============================================================ */


/* ------------------------------------------------------------
   Sur-titre
   Text Block > Custom CSS Class : df-eyebrow
   ------------------------------------------------------------ */

#top .df .df-eyebrow,
#top .df .df-eyebrow p{
  font-family:var(--df-font-ui);
  font-size:var(--df-eyebrow);
  font-weight:400;
  letter-spacing:var(--df-ls-eyebrow);
  text-transform:uppercase;
  color:var(--df-grey);
  line-height:1.4;
  margin:0 0 16px;
}
#top .df .df-eyebrow-gold,
#top .df .df-eyebrow-gold p{ color:var(--df-gold-ink); }

/* Sur le degrade bleu, sur-titre en gris clair : l or y perdrait
   son contraste, le haut du degrade etant deja clair. */
#top .df-gradient .df-eyebrow,
#top .df-gradient .df-eyebrow p{ color:#DFE4E8; }

/* Sur fond sombre, l or clair est le seul lisible */
#top .df-night .df-eyebrow,
#top .df-night .df-eyebrow p,
#top .df-panel .df-eyebrow,
#top .df-panel .df-eyebrow p{ color:var(--df-gold-soft); }
/* ------------------------------------------------------------
   Chapô
   ------------------------------------------------------------ */

#top .df .df-lead,
#top .df .df-lead p{
  font-size:var(--df-body-lg);
  line-height:1.6;
  color:var(--df-ink-2);
}

#top .df .df-small,
#top .df .df-small p{
  font-size:var(--df-small);
  line-height:1.5;
}

#top .df .df-meta,
#top .df .df-meta p{
  font-size:var(--df-xs);
  line-height:1.5;
  color:var(--df-grey);
}

/* Texte affirmatif : passe du gris secondaire à l ink */
#top .df .df-text-ink,
#top .df .df-text-ink p{ color:var(--df-ink); }


/* ------------------------------------------------------------
   Accent or dans un titre
   ------------------------------------------------------------
   Le gras dans un titre devient un accent or. Regle generale du
   systeme : le hero l appliquait deja, elle vaut partout.

   #8A6C32 et non #C8A45E : l or de la charte tombe a 2,1:1 sur
   fond blanc, ce que le memo couleurs interdit. L or lisible
   passe a 4,9:1 pour un rendu tres proche.

   df-h2-split reste prioritaire — ses strong y valent « partie
   forte », pas « accent », et sortent en ink ou en blanc.
   ------------------------------------------------------------ */

#top #wrap_all .df h1 strong, #top #wrap_all .df h1 b,
#top #wrap_all .df h2 strong, #top #wrap_all .df h2 b,
#top #wrap_all .df h3 strong, #top #wrap_all .df h3 b{
  color:var(--df-gold-ink);
  font-weight:400;
}

/* Sur fond sombre ou sur le degrade, l or clair reprend la main */
#top #wrap_all .df-night h1 strong, #top #wrap_all .df-night h2 strong,
#top #wrap_all .df-gradient h1 strong, #top #wrap_all .df-gradient h2 strong{
  color:var(--df-gold-soft);
}


/* ------------------------------------------------------------
   Titre à deux valeurs
   La partie forte en <strong> dans l éditeur, le reste en gris.
   ------------------------------------------------------------ */

/* Deux id : cette classe se pose sur un <h2>, elle doit donc passer
   devant le renfort « #top #wrap_all .df h2 » de 01-enfold-reset.

   Couleurs UNIQUEMENT : pas de max-width. La largeur de ligne est
   de la mise en page, pas de la typographie — un role typographique
   qui impose une mesure devient impossible a reutiliser ailleurs.
   Pour resserrer un titre, poser df-measure sur sa colonne. */
/* La classe atterrit sur le .avia_textblock, pas sur le <h2> :
   Enfold pose les classes de Text Block sur son conteneur. Colorer
   le conteneur ne suffit donc pas, le titre gardant la regle des
   contextes sombres. On vise les deux. */
#top #wrap_all .df .df-h2-split,
#top #wrap_all .df .df-h2-split h1,
#top #wrap_all .df .df-h2-split h2,
#top #wrap_all .df .df-h2-split h3{
  color:var(--df-ink-2);
}
#top #wrap_all .df .df-h2-split strong,
#top #wrap_all .df .df-h2-split b,
#top #wrap_all .df .df-h2-split h1 strong, #top #wrap_all .df .df-h2-split h1 b,
#top #wrap_all .df .df-h2-split h2 strong, #top #wrap_all .df .df-h2-split h2 b,
#top #wrap_all .df .df-h2-split h3 strong, #top #wrap_all .df .df-h2-split h3 b{
  color:var(--df-ink);
  font-weight:400;
}


/* ------------------------------------------------------------
   Étiquette courte — numéro d étape, palier, catégorie
   Text Block > Custom CSS Class : df-label
   ------------------------------------------------------------ */

#top .df .df-label,
#top .df .df-label p{
  font-family:var(--df-font-ui);
  font-size:var(--df-eyebrow);
  font-style:normal;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--df-grey);
  margin:0 0 16px;
}
#top .df .df-label-gold,
#top .df .df-label-gold p{ color:var(--df-gold-ink); }


/* ------------------------------------------------------------
   Citation
   ------------------------------------------------------------ */

#top .df .df-quote,
#top .df .df-quote p{
  font-size:18px;
  line-height:1.55;
  color:var(--df-ink);
}
#top .df .df-quote{
  border-left:2px solid var(--df-gold);
  padding-left:24px;
}
#top .df .df-quote cite,
#top .df .df-quote .df-quote-author{
  display:block;
  margin-top:14px;
  font-style:normal;
  font-size:var(--df-xs);
  letter-spacing:.13em;
  text-transform:uppercase;
  color:var(--df-grey);
}


/* ------------------------------------------------------------
   Chiffre de mise en avant
   ------------------------------------------------------------ */

#top .df .df-figure,
#top .df .df-figure p:first-child{
  font-family:var(--df-font-ui);
  font-size:clamp(34px, 3.6vw, 46px);
  line-height:1;
  letter-spacing:-.03em;
  color:var(--df-ink);
  margin:0 0 10px;
}