/*
 * CBB procedure-page typography
 *
 * Canonical type rules shared by the procedure landing-page family.
 * Keep page-specific display treatments scoped to their component classes.
 */

:root {
    --text-caption: 0.8125rem;
    --text-small: 0.9375rem;
    --text-body: 1.125rem;
    --text-lead: 1.25rem;
}

body {
    font-size: var(--text-body);
    line-height: 1.7;
}

h1,
h2,
h3,
h4 {
    font-kerning: normal;
}

h1 {
    font-size: clamp(2.75rem, 5vw, 4.25rem);
    font-weight: 400;
    line-height: 1.08;
}

h2 {
    font-size: clamp(2rem, 3.5vw, 2.75rem);
    font-weight: 500;
    line-height: 1.12;
}

h3 {
    font-size: clamp(1.4rem, 2.5vw, 1.9rem);
    font-weight: 600;
    line-height: 1.2;
}

h4 {
    font-size: 1.2rem;
    font-weight: 600;
    line-height: 1.3;
}

/* Keep long-form conversion copy at a comfortable reading measure. */
.pain-point-body p,
.solution-content > p,
.sizing-education > .container > p,
.included-section > .container > p,
.faq-answer p {
    max-width: 68ch;
}

/* Component body copy follows the same base size without flattening its layout. */
.cbb-whynp__intro,
.cbb-whynp__body {
    font-size: var(--text-body);
}

.hero__body {
    font-size: var(--text-body);
    line-height: 1.7;
    max-width: 36rem;
}

@media (max-width: 768px) {
    body,
    .cbb-whynp__intro,
    .cbb-whynp__body {
        font-size: 1.0625rem;
    }

    .hero__body {
        font-size: 1rem;
        line-height: 1.65;
    }
}