/* Shared typography roles. Loaded after layout styles; no per-title splitting. */
.page main .editorial-title,
.page main .editorial-heading {
    font-family: var(--font-title);
    font-weight: 700;
    font-style: normal;
    font-size: var(--title-size, 40px);
    line-height: var(--article-title-line-height);
    letter-spacing: var(--article-title-spacing);
    text-transform: none;
    text-wrap: balance;
    overflow-wrap: anywhere;
    font-synthesis: none;
}

.page main .editorial-heading {
    font-size: var(--heading-size, 32px);
    line-height: 1.15;
}

.page main .editorial-deck {
    font: 400 var(--deck-size, 18px)/1.55 var(--font-summary);
    letter-spacing: normal;
    text-transform: none;
}

/* Scale follows placement; family, weight and casing follow the shared role. */
.hero { --title-size: clamp(40px, 4vw, 52px); --deck-size: 18px; }
.article-header { --title-size: var(--article-title-size); --deck-size: 20px; }
.archive-feature { --title-size: clamp(32px, 3vw, 40px); --deck-size: 17px; }
.archive-card { --title-size: 30px; --deck-size: 15px; }
.compact-row { --title-size: 28px; }
.category-heading { --title-size: clamp(56px, 7vw, 96px); --deck-size: 18px; }
.about-title, .contact-copy { --title-size: clamp(64px, 7vw, 96px); }
.contact-copy { --deck-size: 22px; }
.work-section { --heading-size: 24px; }

.page .article-body,
.page .bio-text {
    font: 400 var(--article-reading-size)/var(--article-reading-line-height) var(--font-reading);
}

.page .entry-content h2, .page .bio-text h2,
.page .entry-content h3, .page .bio-text h3 {
    font-family: var(--font-title);
    font-weight: 700;
    line-height: var(--article-heading-line-height);
    text-transform: none;
}
.page .entry-content h2, .page .bio-text h2 { font-size: var(--article-h2-size); }
.page .entry-content h3, .page .bio-text h3 { font-size: var(--article-h3-size); }

@media (max-width: 650px) {
    .hero { --title-size: 38px; --deck-size: 17px; }
    .article-header { --deck-size: 18px; }
    .archive-feature { --title-size: 32px; --deck-size: 16px; }
    .archive-card { --title-size: 28px; }
    .compact-row { --title-size: 26px; }
    .category-heading { --title-size: 56px; --deck-size: 17px; }
    .about-title, .contact-copy { --title-size: 64px; }
    .page main .editorial-heading { --heading-size: 28px; }
    .page main .work-section .editorial-heading { --heading-size: 24px; }
}
