.legal-document {
    width: min(100%, var(--layout-copy-max));
    margin-inline: auto;
}

.legal-hero {
    display: grid;
    gap: var(--space-5);
}

.legal-hero .intro-label {
    justify-self: start;
}

.legal-hero h1 {
    max-width: var(--layout-copy-max);
    font-size: var(--text-display);
    font-weight: var(--weight-bold);
    letter-spacing: var(--tracking-display);
}

.legal-lead {
    color: var(--text-secondary);
    font-size: var(--text-body-lg);
    line-height: var(--line-height-relaxed);
}

.legal-meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3) var(--space-8);
    margin: 0;
}

.legal-meta div {
    display: flex;
    gap: var(--space-2);
}

.legal-meta dt {
    color: var(--text-muted);
    font-size: var(--text-body-sm);
    font-weight: var(--weight-navigation);
}

.legal-meta dd {
    margin: 0;
    color: var(--text-primary);
    font-size: var(--text-body-sm);
    font-weight: var(--weight-emphasis);
}

.legal-notice,
.privacy-summary {
    padding: var(--space-5);
    border: var(--border-width) solid var(--border-strong);
    border-radius: var(--radius-large);
    background: var(--surface-accent);
}

.legal-notice strong,
.privacy-summary strong {
    color: var(--text-primary);
    font-weight: var(--weight-bold);
}

.legal-notice p,
.privacy-summary p {
    margin-block-start: var(--space-2);
    color: var(--text-secondary);
    line-height: var(--line-height-relaxed);
}

.privacy-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(var(--layout-step-min), 100%), 1fr));
    gap: var(--space-4);
    background: var(--surface-primary);
}

.privacy-summary div + div {
    padding-block-start: var(--space-4);
    border-block-start: var(--border-width) solid var(--border-default);
}

.privacy-summary a {
    color: var(--accent-primary);
    font-weight: var(--weight-emphasis);
    overflow-wrap: anywhere;
}

.legal-toc {
    margin-block-start: var(--space-10);
    padding: var(--space-5);
    border: var(--border-width) solid var(--border-default);
    border-radius: var(--radius-large);
    background: var(--surface-primary);
}

.legal-toc h2 {
    font-size: var(--text-h3);
}

.legal-toc ol {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(var(--layout-step-min), 100%), 1fr));
    gap: var(--space-2) var(--space-5);
    margin: var(--space-4) 0 0;
    padding-inline-start: var(--space-5);
}

.legal-toc li {
    color: var(--text-muted);
}

.legal-toc a {
    display: inline-flex;
    min-height: var(--control-navigation-height-mobile);
    align-items: center;
    color: var(--text-secondary);
    font-size: var(--text-body-sm);
    font-weight: var(--weight-navigation);
    text-decoration: none;
}

.legal-toc a:hover {
    color: var(--accent-primary);
    text-decoration: underline;
    text-underline-offset: var(--space-1);
}

.legal-sections {
    display: grid;
    gap: var(--space-6);
    margin-block-start: var(--space-10);
}

.legal-section {
    scroll-margin-block: var(--scroll-offset-section);
    padding: var(--space-6);
    border: var(--border-width) solid var(--border-default);
    border-radius: var(--radius-large);
    background: var(--surface-primary);
}

.legal-section h2 {
    font-size: var(--text-h2);
}

.legal-section h3 {
    font-size: var(--text-h3);
}

.legal-section p,
.legal-section li,
.legal-section dd {
    color: var(--text-secondary);
    line-height: var(--line-height-relaxed);
    word-break: keep-all;
    overflow-wrap: anywhere;
}

.legal-section p,
.legal-section ul,
.legal-data-grid,
.processor-list,
.legal-company-card,
.policy-history {
    margin-block-start: var(--space-4);
}

.legal-section p + p {
    margin-block-start: var(--space-3);
}

.legal-section ul {
    display: grid;
    gap: var(--space-2);
    margin-block-end: 0;
    padding-inline-start: var(--space-5);
}

.legal-section a {
    color: var(--accent-primary);
    font-weight: var(--weight-navigation);
    text-underline-offset: var(--space-1);
}

.legal-data-grid,
.processor-list {
    display: grid;
    gap: var(--space-4);
}

.legal-data-card,
.processor-card {
    padding: var(--space-5);
    border: var(--border-width) solid var(--border-default);
    border-radius: var(--radius-medium);
    background: var(--surface-subtle);
}

.legal-data-card dl,
.processor-card dl,
.legal-company-card,
.policy-history {
    display: grid;
    gap: var(--space-3);
    margin-block-end: 0;
}

.legal-data-card dl,
.processor-card dl {
    margin-block-start: var(--space-4);
}

.legal-data-card dl div,
.processor-card dl div,
.legal-company-card div,
.policy-history div {
    display: grid;
    gap: var(--space-1);
}

.legal-data-card dt,
.processor-card dt,
.legal-company-card dt,
.policy-history dt {
    color: var(--text-primary);
    font-size: var(--text-body-sm);
    font-weight: var(--weight-emphasis);
}

.legal-data-card dd,
.processor-card dd,
.legal-company-card dd,
.policy-history dd {
    margin: 0;
}

.processor-card > a {
    display: inline-flex;
    min-height: var(--control-navigation-height-mobile);
    align-items: center;
    margin-block-start: var(--space-3);
}

.legal-company-card,
.policy-history {
    padding: var(--space-5);
    border-radius: var(--radius-medium);
    background: var(--surface-subtle);
}

@media (width >= 45rem) {
    .privacy-summary div + div {
        padding-block-start: 0;
        padding-inline-start: var(--space-4);
        border-block-start: 0;
        border-inline-start: var(--border-width) solid var(--border-default);
    }

    .legal-section {
        padding: var(--space-8);
    }

    .legal-data-grid,
    .processor-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .legal-data-card:last-child:nth-child(odd) {
        grid-column: 1 / -1;
    }
}