/* Stil für die Rechtsseiten (Impressum, Datenschutz).
   Als externe Datei nötig, weil die Content-Security-Policy der Seite
   keine inline-<style>-Blöcke erlaubt. */

.legal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 22px;
  padding-bottom: 22px;
  border-bottom: 1px solid var(--border-1);
}

.legal-header .brand-wordmark {
  display: block;
  height: 20px;
  width: auto;
}

.legal-header__home {
  font-family: var(--font-body);
  font-size: .95rem;
  color: var(--brand-600);
  text-decoration: none;
}
.legal-header__home:hover { text-decoration: underline; }

.legal {
  max-width: 760px;
  margin: 0 auto;
  padding: 44px 0 72px;
  font-family: var(--font-body);
  line-height: 1.65;
  color: var(--ink-650);
}

.legal h1 {
  font-family: var(--font-head);
  color: var(--ink-900);
  font-size: 2rem;
  margin: 0 0 .4em;
}

.legal h2 {
  font-family: var(--font-head);
  color: var(--ink-800);
  font-size: 1.28rem;
  margin: 2em 0 .5em;
}

.legal h3 {
  color: var(--ink-800);
  font-size: 1.05rem;
  margin: 1.5em 0 .35em;
}

.legal p { margin: .55em 0; }

.legal ul { padding-left: 1.25em; margin: .55em 0; }
.legal li { margin: .3em 0; }

.legal a { color: var(--brand-600); }

.legal address {
  font-style: normal;
  margin: .4em 0 1em;
}

.legal .placeholder {
  background: var(--brand-050);
  color: var(--brand-700);
  padding: 0 .25em;
  border-radius: 4px;
  font-family: var(--font-mono);
  font-size: .92em;
}

.legal .note {
  background: var(--surface-1);
  border: 1px solid var(--border-1);
  border-radius: 10px;
  padding: 14px 16px;
  margin: 1.2em 0;
  font-size: .92rem;
  color: var(--ink-560);
}

.legal .updated {
  margin-top: 2.6em;
  color: var(--ink-500);
  font-size: .875rem;
}