
.legal-card h3 { font-size: 1.02rem; margin: 1.3em 0 0.4em; color: var(--text); }
.legal-card h4 { font-size: 0.95rem; margin: 1.1em 0 0.3em; color: var(--text); }
.legal-card p, .legal-card li { line-height: 1.55; }
.legal-card ul { margin: 0.4em 0 0.8em; padding-left: 1.2em; }
.legal-doc__rev { display: block; font-size: 0.85rem; font-weight: 400; color: var(--text-muted); margin-top: 0.2em; }
.legal-table { width: 100%; border-collapse: collapse; font-size: 0.82rem; margin: 0.6em 0 0.9em; }
.legal-table th, .legal-table td { border: 1px solid var(--line); padding: 0.45em 0.5em; text-align: left; vertical-align: top; }
.legal-table th { background: var(--surface-muted); color: var(--text); }
@media (max-width: 560px) {
    .legal-table { font-size: 0.74rem; }
    .legal-table th, .legal-table td { padding: 0.35em 0.4em; }
}


.legal-card, .legal-card main, main { min-width: 0; }
.legal-card { overflow-wrap: anywhere; }

.legal-table-wrap {
    overflow-x: auto; max-width: 100%; -webkit-overflow-scrolling: touch;
    background-image:
        linear-gradient(to right, var(--card-bg) 50%, transparent),
        linear-gradient(to left, var(--card-bg) 50%, transparent),
        linear-gradient(to right, rgba(0, 0, 0, .15), transparent),
        linear-gradient(to left, rgba(0, 0, 0, .15), transparent);
    background-position: left, right, left, right;
    background-size: 50px 100%, 50px 100%, 14px 100%, 14px 100%;
    background-repeat: no-repeat;
    background-attachment: local, local, scroll, scroll;
}
.legal-table { min-width: 30rem; }


.legal-toc { margin: 0 0 1em; }
.legal-toc ul { display: flex; flex-wrap: wrap; gap: 0.4em 0.9em; margin: 0; padding: 0; list-style: none; font-size: 0.9rem; }
.legal-toc__top { margin: 0 0 1.5em; font-size: 0.9rem; }

.legal-toc__top a { display: inline-flex; align-items: center; min-height: 44px; }
.legal-table-wrap:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }


.legal-toc a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 12px; border: 1px solid var(--line); border-radius: 999px; color: var(--accent); text-decoration: none; }
.legal-toc a:hover, .legal-toc a:focus-visible { color: var(--accent-dark); }
.legal-toc a:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }
.legal-card a { color: var(--accent); }
.legal-card a:hover, .legal-card a:focus-visible { color: var(--accent-dark); }


@media (max-width: 40rem) {
    .legal-toc a { min-height: 44px; }
    .legal-table { min-width: 0; font-size: 0.82rem; }
    .legal-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
    .legal-table tr { display: block; margin: 0 0 0.6em; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
    .legal-table td { display: block; border: 0; border-top: 1px solid var(--line); padding: 0.4em 0.5em; overflow-wrap: normal; }
    .legal-table tr td:first-child { border-top: 0; background: var(--surface-muted); font-weight: 650; }
    .legal-table td:nth-child(2)::before { content: "Основание: "; font-weight: 650; }
    .legal-table td:nth-child(3)::before { content: "Цель: "; font-weight: 650; }
    .legal-table td:nth-child(4)::before { content: "Срок: "; font-weight: 650; }
    .legal-table th { overflow-wrap: normal; }
}
