/* Rechtliche Seiten (Impressum, Datenschutz) mit Sprungnavigation.
   Zweispaltig: links das mitlaufende Inhaltsverzeichnis, rechts der Text. */
.legal-wrap{display:grid;grid-template-columns:minmax(0,.32fr) minmax(0,1fr);gap:clamp(28px,4vw,64px);padding-top:56px;padding-bottom:88px;align-items:start}

/* Sprungnavigation */
.legal-toc{position:sticky;top:96px;align-self:start;display:flex;flex-direction:column;min-width:0}
.legal-toc .toc-title{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin:0 0 12px}
.legal-toc a{font-size:14px;line-height:1.4;color:var(--ink-soft);text-decoration:none;padding:9px 0 9px 14px;border-left:2px solid var(--line);overflow-wrap:anywhere;transition:color .15s,border-color .15s}
.legal-toc a:hover,.legal-toc a:focus-visible{color:var(--brand)}
.legal-toc a.sub{padding-left:26px;font-size:13.5px}
.legal-toc a.active{color:var(--brand);border-left-color:var(--brand);font-weight:600}

/* Textspalte */
article.legal{max-width:820px;min-width:0;overflow-wrap:anywhere}
article.legal h2{font-size:22px;margin:44px 0 12px;padding-top:26px;border-top:1px solid var(--line);color:var(--ink)}
article.legal h2:first-child{margin-top:0;padding-top:0;border-top:none}
article.legal h3{font-size:17px;margin:24px 0 8px;color:var(--ink)}
article.legal p{font-size:16px;line-height:1.75;color:var(--ink-soft);margin:0 0 14px}
article.legal ul{margin:0 0 14px;padding-left:22px;color:var(--ink-soft);font-size:16px;line-height:1.75}
article.legal li{margin-bottom:6px}
article.legal strong{color:var(--ink)}
article.legal a{color:var(--brand)}
/* Sprungziele nicht unter den klebenden Seitenkopf schieben. */
article.legal h2,article.legal h3{scroll-margin-top:104px}
.legal-note{font-size:13.5px;color:var(--ink-soft);margin-top:40px;padding-top:24px;border-top:1px solid var(--line)}
.legal-credits{font-size:13.5px;line-height:1.9;color:var(--ink-soft);column-count:2;column-gap:32px}

@media(max-width:900px){
  /* Einspaltig: das Inhaltsverzeichnis wird zur Chip-Leiste über dem Text. */
  .legal-wrap{grid-template-columns:minmax(0,1fr);gap:28px;padding-top:36px;padding-bottom:64px}
  .legal-toc{position:static;flex-direction:row;flex-wrap:wrap;gap:8px}
  .legal-toc .toc-title{flex-basis:100%;margin:0}
  .legal-toc a{padding:7px 12px;border:1px solid var(--line);border-radius:999px;background:var(--surface);font-size:13.5px}
  .legal-toc a.sub{padding:7px 12px;font-size:13.5px}
  .legal-toc a.active{border-color:var(--brand)}
  .legal-credits{column-count:1}
}
@media(max-width:600px){
  article.legal h2{font-size:20px;margin:34px 0 10px;padding-top:22px}
  article.legal h3{font-size:16.5px}
  article.legal p,article.legal ul{font-size:15.5px}
  .legal-credits{font-size:13px}
}
@media(max-width:400px){
  .legal-wrap{padding-top:26px;padding-bottom:48px}
  article.legal{hyphens:auto}
  article.legal h2{font-size:18px;margin:26px 0 8px;padding-top:18px}
  article.legal h3{font-size:15.5px}
  article.legal p,article.legal ul{font-size:15px;line-height:1.7}
  article.legal ul{padding-left:18px}
  .legal-toc a{font-size:13px;padding:6px 10px}
}