@layer components {
    /* The same air under the masthead as the summit book; one reading column, no boxes or rules
       between the sections (Broadsheet) — the headings carry the structure. */
    .legal-page {
        display: flex;
        flex-direction: column;
        gap: var(--space-4);
        padding-block: var(--space-4) var(--space-8);
    }

    .legal-page__back {
        align-self: flex-start;
        margin-inline-start: calc(-1 * var(--space-1));
    }

    .legal-page__head {
        display: flex;
        flex-direction: column;
        gap: var(--space-1);

        & > * {
            margin: 0;
        }
    }

    .legal-page__title {
        font-size: var(--text-h1);
        line-height: 1.1;
    }

    .legal-page__valid {
        color: var(--color-text-muted);
        font-size: var(--text-s);
    }

    .legal-page__text {
        max-inline-size: var(--measure);
        font-size: var(--text-m);
        line-height: 1.6;
        overflow-wrap: anywhere;

        & h2 {
            margin-block: var(--space-6) var(--space-2);
            font-size: var(--text-h3);
            line-height: 1.2;
        }

        & h3 {
            margin-block: var(--space-4) var(--space-1);
            font-size: var(--text-h5);
        }

        & p,
        & ul,
        & dl {
            margin-block: 0 var(--space-3);
        }

        & ul {
            padding-inline-start: 1.25em;
        }

        & li + li {
            margin-block-start: var(--space-1);
        }

        & dt {
            font-weight: 600;
        }

        & dd {
            margin: 0 0 var(--space-2);
        }
    }

    .legal-page__foot {
        display: flex;
        flex-wrap: wrap;
        column-gap: var(--space-4);

        & a {
            display: inline-flex;
            align-items: center;
            min-block-size: 44px;
        }
    }
}