/* Shared styles for imprint.html and datenschutz.html — simple,
   readable legal-text layout using the same design tokens as the
   main site, but without the full-bleed/video treatment. */

body {
  background: var(--color-paper);
  color: var(--color-ink);
}

.site-header {
  position: static;
  mix-blend-mode: normal;
  background: var(--color-paper);
  border-bottom: 1px solid var(--color-ash);
}

.site-header .brand { color: var(--color-ink); }

.legal {
  max-width: 720px;
  margin: 0 auto;
  padding: 80px var(--spacing-29) 100px;
}

.legal .eyebrow {
  color: #8a8a8a;
}

.legal .statement {
  font-size: 41px;
  margin-bottom: var(--spacing-43);
}

/* Undo the main site's sticky slide-over panels (styles.css `section`):
   here every section is plain text that scrolls normally. */
.legal section {
  position: static;
  min-height: 0;
  padding: 0;
  margin-bottom: var(--spacing-43);
}

.legal h2 {
  font-size: var(--text-body);
  font-weight: 400;
  margin: 0 0 var(--spacing-17);
}

.legal p {
  font-size: var(--text-body);
  font-weight: 300;
  line-height: var(--leading-body);
  color: #333;
  margin: 0 0 var(--spacing-17);
}

.legal p:last-child { margin-bottom: 0; }

.legal a {
  text-decoration: underline;
  text-underline-offset: 2px;
}

.legal-footnote {
  font-size: var(--text-caption);
  color: #666;
  padding-top: var(--spacing-29);
  border-top: 1px solid var(--color-ash);
}

.legal ul {
  margin: 0 0 var(--spacing-17);
  padding-left: 20px;
}

.legal li {
  font-size: var(--text-body);
  font-weight: 300;
  line-height: var(--leading-body);
  color: #333;
  margin-bottom: var(--spacing-6);
}

footer a { color: inherit; }