/* Block: section-heading */
.section-heading {
    max-width: calc(1447 * var(--tgc-u));
    margin: 0 auto;
    padding: 0 var(--tgc-gutter);
    text-align: center;
}

.section-heading__title {
    font-family: var(--tgc-font-display);
    font-weight: 300;
    color: var(--tgc-ink);
    text-wrap: balance;
}

/* Figma: the homepage sets its section statements at 60/70 Regular and its
   run-of-page titles at 36/46. The service pages go bigger — see below. */
.section-heading--lg .section-heading__title {
    font-size: var(--tgc-text-display);
    font-weight: 400;
    line-height: 1.167;
}

.section-heading--md .section-heading__title {
    font-size: var(--tgc-text-h2);
    font-weight: 400;
    line-height: 1.28;
}

.section-heading__intro {
    margin: calc(18 * var(--tgc-u)) auto 0;
    max-width: calc(928 * var(--tgc-u));
    font-size: var(--tgc-text-body);
    line-height: 1.5;
    color: var(--tgc-ink-muted);
}

@media (max-width: 768px) {
    .section-heading {
        padding: 0 20px;
    }

    .section-heading--lg .section-heading__title {
        font-size: var(--tgc-text-h2);
    }

    .section-heading--md .section-heading__title {
        font-size: var(--tgc-text-h2);
    }
}

/* Service pages state it larger and lighter: 80/90 at -2.4px tracking. */
.service-page .section-heading--lg .section-heading__title,
.single-service .section-heading--lg .section-heading__title {
    font-size: var(--tgc-text-statement);
    font-weight: 300;
    line-height: 1.125;
    letter-spacing: -0.03em;
}