/* Gemeinsame Gestaltung für Impressum und Datenschutz – gleiche Farben und Schriften wie die Startseite */
@font-face{font-family:"Atkinson Hyperlegible"; font-style:normal; font-weight:400; font-display:swap; src:url("fonts/atkinson-hyperlegible-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Atkinson Hyperlegible"; font-style:normal; font-weight:700; font-display:swap; src:url("fonts/atkinson-hyperlegible-latin-700-normal.woff2") format("woff2")}
@font-face{font-family:"Source Serif 4"; font-style:normal; font-weight:600; font-display:swap; src:url("fonts/source-serif-4-latin-600-normal.woff2") format("woff2")}

:root{
  --bg:#F8F6F1; --surface:#FFFFFF; --mist:#E9EFEA; --sage:#7B9F84; --sage-deep:#2F5A68;
  --ink:#1E2D32; --muted:#56666A; --line:#DCE3DD;
  --font-display:"Source Serif 4", Georgia, "Times New Roman", serif;
  --font-body:"Atkinson Hyperlegible", "Segoe UI", system-ui, -apple-system, sans-serif;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#121A1C; --surface:#1A2427; --mist:#1F2C2B; --sage:#93B89B; --sage-deep:#A6C6CF;
  --ink:#E7EEEC; --muted:#A5B5B3; --line:#2C3B3C; color-scheme:dark;}}
:root[data-theme="dark"]{
  --bg:#121A1C; --surface:#1A2427; --mist:#1F2C2B; --sage:#93B89B; --sage-deep:#A6C6CF;
  --ink:#E7EEEC; --muted:#A5B5B3; --line:#2C3B3C; color-scheme:dark;}

*{box-sizing:border-box}
html{padding-top:env(safe-area-inset-top, 0px); padding-bottom:env(safe-area-inset-bottom, 0px)}
body{margin:0; background:var(--bg); color:var(--ink); font-family:var(--font-body); font-size:17px; line-height:1.65;
  padding-left:max(16px, env(safe-area-inset-left, 0px)); padding-right:max(16px, env(safe-area-inset-right, 0px))}
.wrap{max-width:760px; margin-inline:auto}
header{display:flex; flex-wrap:wrap; gap:1rem; align-items:center; justify-content:space-between; padding-block:1.25rem; border-bottom:1px solid var(--line)}
.brand{display:flex; align-items:center; gap:.7rem; text-decoration:none; color:var(--ink)}
.brand img{display:block; height:auto; width:min(260px, 62vw); border-radius:6px}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .brand img{background:#F8F6F1; padding:5px 8px}}
:root[data-theme="dark"] .brand img{background:#F8F6F1; padding:5px 8px}
.back{font-weight:700; color:var(--sage-deep); text-decoration:none}
.back:hover{text-decoration:underline}
main{padding-block:2.5rem 4rem}
h1,h2{font-family:var(--font-display); font-weight:600; line-height:1.2; text-wrap:balance}
h1{font-size:clamp(1.9rem, 1.5rem + 1.6vw, 2.6rem); margin:0 0 1.5rem}
h2{font-size:1.3rem; margin:2.25rem 0 .6rem; padding-top:1.25rem; border-top:1px solid var(--line)}
h3{font-size:1.05rem; margin:1.5rem 0 .4rem}
p, ul{margin:0 0 .9rem}
ul{padding-left:1.2rem}
li{margin-bottom:.3rem}
a{color:var(--sage-deep); overflow-wrap:anywhere}
a:focus-visible{outline:3px solid var(--sage); outline-offset:3px; border-radius:4px}
.muted{color:var(--muted)}
.card{background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:1.1rem 1.3rem; margin:0 0 1rem}
.card p:last-child{margin-bottom:0}
footer{border-top:1px solid var(--line); padding-block:1.5rem 3rem; color:var(--muted); font-size:.9rem; display:flex; flex-wrap:wrap; gap:.5rem 1.5rem; justify-content:space-between}
footer nav{display:flex; gap:1.25rem}