/* =============================================================================
   Échelle typographique — charte SMB
   Titres : all-round-gothic (graisse 400, la seule fournie par le kit avec 700)
   Courant : Poppins
   ============================================================================= */

h1,
.h1_like,
h2,
.h2_like {
    font-family: var(--font-display);
    font-weight: var(--regular);
    font-size: var(--fs-4xl);
    line-height: var(--lh-heading);
    letter-spacing: var(--tracking-tight);
    margin-top: 0;
    text-wrap: balance;
}

@media (min-width: 576px) {

    h1,
    .h1_like,
    h2,
    .h2_like {
        font-size: var(--fs-5xl);
    }
}

@media (min-width: 992px) {

    h1,
    .h1_like,
    h2,
    .h2_like {
        font-size: var(--fs-6xl);
    }
}

h3,
.h3_like {
    font-family: var(--font-display);
    font-size: var(--fs-2xl);
    line-height: var(--lh-snug);
    letter-spacing: var(--tracking-tight);
    font-weight: var(--regular);
    margin-top: 0;
}

@media (min-width: 992px) {

    h3,
    .h3_like {
        font-size: var(--fs-3xl);
    }
}

h4,
.h4_like {
    font-family: var(--font-body);
    font-size: var(--fs-lg);
    line-height: var(--lh-snug);
    font-weight: var(--semibold);
    margin-top: 0;
}

@media (min-width: 992px) {

    h4,
    .h4_like {
        font-size: var(--fs-xl);
    }
}

p,
li:not(.menu-item),
button {
    font-family: var(--font-body);
    font-size: var(--fs-base);
    line-height: var(--lh-normal);
    font-weight: var(--regular);
    margin-top: 0;
}

/* Chapô / introduction de section */
.lead,
.section__title p {
    font-size: var(--fs-lg);
    line-height: var(--lh-relaxed);
}

@media (min-width: 576px) {

    .lead,
    .section__title p {
        font-size: var(--fs-xl);
    }
}

/* =============================================================================
   Highlight manuscrit (Swarsh Daisy)
   Posé dans le WYSIWYG via <span class="text-highlight">…</span>
   ============================================================================= */
.text-highlight {
    font-family: var(--font-highlight);
    font-style: italic;
    color: var(--color-accent);
}

/* Dans les gros titres, on compense la hauteur d'œil plus faible de la fonte
   script pour l'aligner visuellement sur all-round-gothic. */
h1 .text-highlight,
h2 .text-highlight,
.h1_like .text-highlight,
.h2_like .text-highlight {
    font-size: 1.2em;
    line-height: 0.8;
    letter-spacing: -0.01em;
}