@layer ds.block {
    .block-main-footer {
        background: var(--color-surface-strong);
        color: var(--brand-sage-pale);
    }

    .main-footer__grid {
        display: grid;
        grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
        gap: var(--space-8);
        padding-block: var(--space-9) var(--space-7);
    }

    .main-footer__col { display: flex; flex-direction: column; gap: var(--space-3); }

    .main-footer__brand {
        font-family: var(--font-display);
        font-size: var(--text-h4);
        font-weight: var(--font-weight-bold);
        color: var(--color-text-invert);
    }

    .main-footer__tagline {
        margin: 0;
        max-width: 32ch;
        font-size: var(--text-small);
        line-height: var(--line-height-base);
        color: var(--brand-sage-muted);
    }

    .main-footer__social {
        position: relative;
        display: inline-flex;
        align-items: center;
        gap: var(--space-3);
        margin-top: var(--space-2);
        color: var(--brand-sage-pale);
        font-size: var(--text-small);
        font-weight: var(--font-weight-medium);
    }

    .main-footer__social-hit { position: absolute; inset: 0; color: transparent; text-decoration: none; }

    .main-footer__social .ds-ico { width: 1.25rem; height: 1.25rem; color: inherit; }
    .main-footer__social .ds-ico:has(use[href="#i-facebook"]) { fill: currentColor; stroke: none; }
    .main-footer__social:hover { color: var(--brand-apricot); }

    .main-footer__heading {
        font-size: var(--text-xs);
        font-weight: var(--font-weight-bold);
        letter-spacing: var(--tracking-wide);
        text-transform: uppercase;
        color: var(--brand-sage);
    }

    .main-footer__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-3); }

    .main-footer__link {
        color: var(--brand-sage-pale);
        text-decoration: none;
        font-size: var(--text-body);
    }

    .main-footer__link:hover { color: var(--brand-apricot); }

    .main-footer__meta {
        margin: 0;
        font-size: var(--text-small);
        line-height: var(--line-height-base);
        color: var(--brand-sage-muted);
    }

    .main-footer__bottom {
        display: flex;
        justify-content: space-between;
        gap: var(--space-5);
        padding-block: var(--space-5);
        border-top: 1px solid color-mix(in srgb, var(--brand-sage-pale) 14%, transparent);
        font-size: var(--text-xs);
        color: var(--brand-sage);
        flex-wrap: wrap;
    }

    .main-footer__credit a {
        color: var(--brand-sage);
        text-decoration: none;
        text-transform: uppercase;
        font-weight: var(--font-weight-bold);
        letter-spacing: 0.04em;
    }

    .main-footer__credit a:hover { color: var(--brand-apricot); }

    @media (max-width: 64rem) {
        .main-footer__grid { grid-template-columns: repeat(2, 1fr); gap: var(--space-7); }
    }

    @media (max-width: 48rem) {
        .main-footer__grid { grid-template-columns: 1fr; }
        .main-footer__bottom { flex-direction: column; gap: var(--space-2); }
    }
}
