:root {
  color-scheme: light dark;
  --grund: #fbfaf7;
  --text: #17202a;
  --leise: #667085;
  --flaeche: #ffffff;
  --linie: #d8dde3;
  --akzent: #185a72;
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.65;
}
* { box-sizing: border-box; }
body { margin: 0; color: var(--text); background: var(--grund); }
a { color: var(--akzent); text-underline-offset: .18em; }
a:focus-visible, summary:focus-visible { outline: 3px solid var(--akzent); outline-offset: .2rem; }
.sprungverweis { position: absolute; left: 1rem; top: -5rem; z-index: 10; padding: .7rem 1rem; color: var(--grund); background: var(--text); }
.sprungverweis:focus { top: 1rem; }
.seitenkopf, footer { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem max(1rem, calc((100% - 72rem) / 2)); border-bottom: 1px solid var(--linie); }
footer { justify-content: flex-start; border-top: 1px solid var(--linie); border-bottom: 0; margin-top: 4rem; }
.wortmarke { color: inherit; font-size: 1.15rem; font-weight: 750; text-decoration: none; }
details summary { cursor: pointer; font-weight: 650; }
details a { display: block; padding: .5rem 0; }
.menue-breit { display: none; }
main { width: min(100% - 2rem, 72rem); margin: 0 auto; padding: clamp(2rem, 6vw, 5rem) 0; }
article { max-width: 46rem; margin: 0 auto; }
h1 { max-width: 20ch; font-size: clamp(2.3rem, 7vw, 4.8rem); line-height: 1.04; letter-spacing: -.035em; }
h2 { margin-top: 2.5rem; line-height: 1.2; }
.meta { color: var(--leise); }
.einleitung { font-size: 1.25rem; color: var(--leise); }
img { display: block; max-width: 100%; width: 100%; height: auto; aspect-ratio: attr(width) / attr(height); object-fit: cover; margin: 2rem 0; border-radius: 1rem; }
table { display: block; width: 100%; max-width: 100%; border-collapse: collapse; overflow-x: auto; }
th, td { padding: .65rem; border: 1px solid var(--linie); text-align: left; }
blockquote, .checkliste, .verwandte, .beitragskarte { padding: 1.25rem; border: 1px solid var(--linie); border-radius: .8rem; background: var(--flaeche); }
.knopf { display: inline-block; padding: .7rem 1rem; border-radius: .45rem; color: white; background: var(--akzent); font-weight: 700; text-decoration: none; }
.beitragsliste { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); gap: 1rem; }
.beitragskarte h2 { margin-top: 0; }
.beitragskarte img { margin: -1.25rem -1.25rem 1rem; width: calc(100% + 2.5rem); max-width: none; border-radius: .8rem .8rem 0 0; }
@media (min-width: 44rem) {
  .menue-schmal { display: none; }
  .menue-breit { display: flex; gap: 1.25rem; }
  .beitragsliste { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 68rem) {
  .beitragsliste { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (prefers-color-scheme: dark) {
  :root { --grund: #11171c; --text: #eef2f5; --leise: #aeb8c2; --flaeche: #192129; --linie: #34414d; --akzent: #77c7df; }
  .knopf { color: #071117; background: var(--akzent); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
@media print {
  .seitenkopf, footer, .sprungverweis, .menue-breit, .menue-schmal { display: none !important; }
  body { color: #000; background: #fff; }
  main { width: 100%; padding: 0; }
}