/* Shared introduction page spacing. Values stay consistent on wide desktops. */
:root {
    --page-heading-top: 48px;
    --page-heading-bottom: 56px;
    --subnav-y: 24px;
    --intro-top: 80px;
    --intro-bottom: 48px;
    --profile-top: 32px;
    --profile-bottom: 80px;
    --section-y: 80px;
    --cta-y: 64px;
    --footer-top: 48px;
    --footer-bottom: 32px;
    --eyebrow-gap: 16px;
    --heading-gap: 24px;
    --paragraph-gap: 16px;
    --heading-list-gap: 40px;
    --button-gap: 32px;
    --content-gap: 64px;
    --card-gap: 32px;
}
.section-shell.subpage-section {
    padding-top: var(--section-y);
    padding-bottom: var(--section-y);
}
.section-shell.subpage-section--intro {
    padding-top: var(--intro-top);
    padding-bottom: var(--intro-bottom);
}
.section-shell.subpage-section--profile {
    padding-top: var(--profile-top);
    padding-bottom: var(--profile-bottom);
}
.section-shell.subpage-section--cta {
    padding-top: var(--cta-y);
    padding-bottom: var(--cta-y);
}
.content-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--content-gap);
    align-items: center;
}
.content-stack > .section-kicker {
    margin: 0 0 var(--eyebrow-gap);
}
.content-stack > h2 {
    margin: 0 0 var(--heading-gap);
}
.content-stack > p:not(.section-kicker) {
    margin: 0 0 var(--paragraph-gap);
}
.content-stack > p:last-child {
    margin-bottom: 0;
}
.content-stack > .button {
    margin-top: calc(var(--button-gap) - var(--paragraph-gap));
}
.content-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--card-gap);
}
.subpage-section .section-heading {
    margin-bottom: var(--heading-list-gap);
}
.subpage-section .section-heading .section-kicker {
    margin: 0 0 var(--eyebrow-gap);
}
.subpage-section .section-heading h2 {
    margin: 0;
}
.page-heading .section-shell {
    padding-top: var(--page-heading-top);
    padding-bottom: var(--page-heading-bottom);
}
.subnav > a,
.subnav > span {
    padding-top: var(--subnav-y);
    padding-bottom: var(--subnav-y);
}
.sub-page .site-footer {
    padding-top: var(--footer-top);
    padding-bottom: var(--footer-bottom);
}
@media (max-width: 768px) {
    :root {
        --page-heading-top: 32px;
        --page-heading-bottom: 40px;
        --subnav-y: 16px;
        --intro-top: 48px;
        --intro-bottom: 32px;
        --profile-top: 24px;
        --profile-bottom: 48px;
        --section-y: 48px;
        --cta-y: 48px;
        --footer-top: 40px;
        --footer-bottom: 24px;
        --eyebrow-gap: 12px;
        --heading-gap: 20px;
        --heading-list-gap: 32px;
        --button-gap: 24px;
        --content-gap: 32px;
        --card-gap: 24px;
    }
    .content-split,
    .content-cards {
        grid-template-columns: 1fr;
    }
}