/* Opt-in module font sizes. Unconfigured modules retain their original responsive rules. */
[data-home-font-eyebrow] .eyebrow {
    font-size: var(--home-font-eyebrow);
}
.hero[data-home-font-title] h1,
.explore-section[data-home-font-title] .section-heading h2,
.applications-section[data-home-font-title] .application-intro h2,
.news-section[data-home-font-title] .news-heading h2,
.support-section[data-home-font-title] .support-intro h2,
.about-section[data-home-font-title] h2 {
    font-size: var(--home-font-title);
    overflow-wrap: anywhere;
}
.explore-section[data-home-font-subtitle] .section-side-note {
    font-size: var(--home-font-subtitle);
    overflow-wrap: anywhere;
}
.hero[data-home-font-body] .hero-description,
.applications-section[data-home-font-body] .application-intro > p:not(.eyebrow),
.news-section[data-home-font-body] .news-description,
.support-section[data-home-font-body] .support-intro > p:not(.eyebrow),
.about-section[data-home-font-body] .about-inner > div > p:not(.eyebrow) {
    font-size: var(--home-font-body);
    overflow-wrap: anywhere;
}
.service-strip[data-home-font-item-title] .service-grid > a > span,
.explore-section[data-home-font-item-title] .feature-heading h3,
.explore-section[data-home-font-item-title] .feature-bottom strong,
.applications-section[data-home-font-item-title] .application-copy h3,
.news-section[data-home-font-item-title] .news-card-copy h3,
.support-section[data-home-font-item-title] .support-list h3 {
    font-size: var(--home-font-item-title);
    overflow-wrap: anywhere;
}
.service-strip[data-home-font-item-body] .service-grid small,
.explore-section[data-home-font-item-body] .feature-heading p,
.applications-section[data-home-font-item-body] .application-copy p,
.news-section[data-home-font-item-body] .news-card-copy > p,
.support-section[data-home-font-item-body] .support-list p {
    font-size: var(--home-font-item-body);
    overflow-wrap: anywhere;
}

/* Keep deliberately large desktop headings readable on narrow phones. */
@media (max-width: 800px) {
    .hero[data-home-font-title] h1,
    .explore-section[data-home-font-title] .section-heading h2,
    .applications-section[data-home-font-title] .application-intro h2,
    .news-section[data-home-font-title] .news-heading h2,
    .support-section[data-home-font-title] .support-intro h2,
    .about-section[data-home-font-title] h2 {
        font-size: min(var(--home-font-title), clamp(28px, 8vw, 48px));
    }
}
