/* ==========================================================================
   InSono — Typografie
   Dawn base.css: heading font-family / weight / letter-spacing are
   auskommentiert — Headings erben vom body (custom.css → UI-Stack).
   Size scales follow Dawn (.h1/.h2/…).
   ========================================================================== */

h1,
h2,
h3,
h4,
h5,
h6,
.h0,
.h1,
.h2,
.h3,
.h4,
.h5 {
    /* Wie Dawn: Familie/Gewicht/Tracking NICHT setzen — body erbt */
    line-height: calc(1 + 0.3 / max(1, var(--font-heading-scale)));
    word-break: break-word;
    color: var(--text);
}

h1,
.h1 {
    font-size: calc(var(--font-heading-scale) * 3rem);
}

@media only screen and (min-width: 750px) {
    h1,
    .h1 {
        font-size: calc(var(--font-heading-scale) * 4rem);
    }
}

h2,
.h2 {
    font-size: calc(var(--font-heading-scale) * 2rem);
}

@media only screen and (min-width: 750px) {
    h2,
    .h2 {
        font-size: calc(var(--font-heading-scale) * 2.4rem);
    }
}

h3,
.h3 {
    font-size: calc(var(--font-heading-scale) * 1.7rem);
}

@media only screen and (min-width: 750px) {
    h3,
    .h3 {
        font-size: calc(var(--font-heading-scale) * 1.8rem);
    }
}

h4,
.h4 {
    font-family: var(--font-heading-family);
    font-size: calc(var(--font-heading-scale) * 1.5rem);
}

h5,
.h5 {
    font-size: calc(var(--font-heading-scale) * 1.2rem);
}

@media only screen and (min-width: 750px) {
    h5,
    .h5 {
        font-size: calc(var(--font-heading-scale) * 1.3rem);
    }
}

h6,
.h6 {
    font-size: calc(var(--font-heading-scale) * 1.1rem);
}

.lead {
    color: var(--muted);
    font-size: clamp(16px, 2vw, 19px);
    letter-spacing: -0.02em;
}

.caption {
    color: var(--muted);
    font-size: 13px;
    letter-spacing: -0.005em;
}

.caption--spaced {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.small-label {
    display: inline-block;
    color: var(--header-accent);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.text-muted {
    color: var(--muted);
}

.text-soft {
    color: var(--soft);
}

.text-accent {
    color: var(--accent);
}

h1 em,
h2 em,
h3 em {
    color: var(--header-accent);
    font-style: italic;
}

strong,
b {
    font-weight: var(--font-body-weight-bold);
}

.link-underline {
    color: var(--accent);
    text-decoration: underline;
    text-underline-offset: 4px;
    text-decoration-thickness: 1px;
}

.link-underline:hover {
    color: var(--header-accent);
}