/*
 * Keeps public presentation headings readable without letting long marketing
 * messages dominate the first viewport. Loaded after route-specific styles so
 * every public landing page follows the same typographic scale.
 */
body:not(.route-dashboard):not(.route-recover) main h1,
body:not(.route-dashboard):not(.route-recover) main .hero-copy h1,
body:not(.route-dashboard):not(.route-recover) main [class$="-hero-copy"] h1,
body:not(.route-dashboard):not(.route-recover) main .page-hero h1 {
    max-width: 780px;
    font-size: clamp(2.45rem, 4vw, 4.35rem);
    line-height: 1.04;
    letter-spacing: -.045em;
}

body:not(.route-dashboard):not(.route-recover) main .hero-lead,
body:not(.route-dashboard):not(.route-recover) main [class$="-hero-copy"] .hero-lead,
body:not(.route-dashboard):not(.route-recover) main [class$="-hero-copy"] > p:not(.eyebrow),
body:not(.route-dashboard):not(.route-recover) main .page-hero .hero-lead {
    max-width: 720px;
    font-size: clamp(1.02rem, 1.45vw, 1.18rem);
    line-height: 1.58;
}

@media (max-width: 620px) {
    body:not(.route-dashboard):not(.route-recover) main h1,
    body:not(.route-dashboard):not(.route-recover) main .hero-copy h1,
    body:not(.route-dashboard):not(.route-recover) main [class$="-hero-copy"] h1,
    body:not(.route-dashboard):not(.route-recover) main .page-hero h1 {
        font-size: clamp(2.15rem, 10vw, 3rem);
        letter-spacing: -.04em;
    }

    body:not(.route-dashboard):not(.route-recover) main .hero-lead,
    body:not(.route-dashboard):not(.route-recover) main [class$="-hero-copy"] .hero-lead,
    body:not(.route-dashboard):not(.route-recover) main [class$="-hero-copy"] > p:not(.eyebrow),
    body:not(.route-dashboard):not(.route-recover) main .page-hero .hero-lead {
        font-size: 1rem;
    }
}