:root {
  --ink: #111;
  --muted: #6b6b6b;
  --line: #ececec;
  --card: #ffffff;
  --bg: #fafafa;
  --accent: #e53935;
  --accent-link: #d32f2f;
  --radius: 16px;
  --shadow: 0 1px 2px rgba(0,0,0,.04), 0 10px 30px rgba(0,0,0,.06);
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }

body {
  font-family: 'Manrope', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  color: var(--ink);
  background: var(--bg);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

.container { max-width: 1200px; margin: 0 auto; }

.title { padding-bottom: .25rem; }
.title h1 { font-size: 2rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.15; }
.title .eff { margin-top: .6rem; color: #cfcfcf; font-size: .92rem; }

/* main сам является контейнером, поэтому его поля надо компенсировать: иначе
   текст встал бы на 24px правее логотипа в шапке (border-box режет ширину). */
main.container { max-width: calc(1200px + 3rem); padding: 0 1.5rem 3rem; }

.toc {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 1.4rem 1.6rem;
  margin-top: -1.75rem;
  margin-bottom: 2.5rem;
}
.legal .toc h2 { font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); margin-bottom: .8rem; border-bottom: none; padding-bottom: 0; }
.legal .toc ol { margin: 0; padding-left: 1.2rem; columns: 2; column-gap: 2rem; }
.legal .toc li { margin-bottom: .3rem; font-size: .92rem; break-inside: avoid; }
.legal .toc a { color: var(--ink); font-weight: 400; text-decoration: none; }
.legal .toc a:hover { color: var(--accent-link); text-decoration: underline; }
.legal .toc .toc-appendix { margin: .55rem 0 0; font-size: .92rem; }

.legal section { margin-bottom: 2.25rem; scroll-margin-top: 1.5rem; }
.legal h2 {
  font-size: 1.22rem;
  font-weight: 800;
  letter-spacing: -.01em;
  margin-bottom: .7rem;
  padding-bottom: .4rem;
  border-bottom: 1px solid var(--line);
}
.legal h3 { font-size: 1rem; font-weight: 700; margin: 1.1rem 0 .4rem; }
.legal p { margin-bottom: .85rem; }
.legal ul { margin: 0 0 .95rem 1.2rem; }
.legal ol { margin: 0 0 .95rem; padding-left: 1.2rem; }
.legal li { margin-bottom: .4rem; }
.legal a { color: var(--accent-link); font-weight: 600; text-decoration: none; }
.legal a:hover { text-decoration: underline; }
.legal strong { font-weight: 700; }
.legal .lede {
  background: var(--card);
  border: 1px solid var(--line);
  border-left: 3px solid var(--accent);
  border-radius: 12px;
  padding: 1.1rem 1.3rem;
}
.legal .lede ul { margin-bottom: 0; }
.legal address {
  font-style: normal;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 1rem 1.2rem;
}

.appendix {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 1.5rem 1.6rem;
  scroll-margin-top: 1.5rem;
}
.appendix h2 { border-bottom: none; padding-bottom: 0; }
.appendix dl { margin: 0; }
.appendix dt { font-weight: 700; margin-top: .9rem; font-size: .95rem; }
.appendix dd { margin: .15rem 0 0; color: var(--muted); font-size: .95rem; }
.appendix code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: .86rem;
  background: #f4f4f4;
  border: 1px solid var(--line);
  border-radius: 5px;
  padding: .06rem .35rem;
  color: var(--ink);
}


@media (max-width: 620px) {
  .legal .toc ol { columns: 1; }
  .title h1 { font-size: 1.65rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}