/* Rechtliche Seiten (Impressum, Datenschutz) – gleiche Werte wie die Startseite, aus Smart-Link Design */
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url(../../schrift/Inter-400.woff) format('woff'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 500; font-display: swap; src: url(../../schrift/Inter-500.woff) format('woff'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url(../../schrift/Inter-600.woff) format('woff'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 700; font-display: swap; src: url(../../schrift/Inter-700.woff) format('woff'); }

:root { --raster: 28px; --kopf: 54px; }
@media (prefers-contrast: more) { :root { --muted: var(--text-2); --border: #4a5266; } }

* { box-sizing: border-box; }
html, body { margin: 0; }
html { background: var(--bg); }
body {
  min-height: 100vh; display: flex; flex-direction: column;
  font-family: var(--font); font-size: 17px; line-height: 1.6;
  color: var(--text); -webkit-font-smoothing: antialiased;
  background-color: var(--bg);
  background-image: radial-gradient(var(--border-2) 1px, transparent 1.2px);
  background-size: var(--raster) var(--raster);
}
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
a { color: var(--accent); text-underline-offset: 3px; }
a:hover { color: var(--accent-hover); }
.wort { font-weight: 600; letter-spacing: -.01em; }
.wort span { color: var(--accent); font-weight: 400; }

nav { position: sticky; top: 0; z-index: 10; background: color-mix(in srgb, var(--bg) 90%, transparent); border-bottom: 1px solid var(--border); }
nav .innen { max-width: 820px; margin: 0 auto; padding: 0 22px; height: var(--kopf); display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.marke { display: flex; align-items: center; gap: 10px; font-size: 15px; color: var(--text); text-decoration: none; }
.marke img { width: 34px; height: 34px; display: block; }
.zurueck { height: 32px; padding: 0 11px; display: inline-flex; align-items: center; gap: 6px; border-radius: var(--r); border: 1px solid var(--border); background: var(--panel); color: var(--text-2); font-size: 13px; font-weight: 500; text-decoration: none; }
.zurueck:hover { background: var(--panel-hover); border-color: var(--border-2); color: var(--text); }

main { flex: 1; width: 100%; max-width: 820px; margin: 0 auto; padding: clamp(40px, 7vw, 72px) 22px clamp(56px, 8vw, 96px); }
.abschnitt { margin: 0; font-size: 12.5px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--text-2); }
h1 { margin: 10px 0 0; font-size: clamp(2rem, 5vw, 2.8rem); line-height: 1.1; letter-spacing: -.03em; }
.stand { margin: 10px 0 0; color: var(--muted); font-size: 15px; }
.tafel { margin-top: 28px; padding: clamp(20px, 4vw, 32px); border-radius: var(--r-lg); border: 1px solid var(--border); background: var(--panel); }
h2 { margin: 30px 0 6px; font-size: 1.15rem; letter-spacing: -.01em; }
.tafel > h2:first-child { margin-top: 0; }
h3 { margin: 20px 0 4px; font-size: 1rem; color: var(--text); }
p, li { color: var(--text-2); }
p { margin: 8px 0 0; }
ul { margin: 8px 0 0; padding-left: 20px; }
li + li { margin-top: 4px; }
address { font-style: normal; color: var(--text); }
.mono { font-family: var(--mono); font-variant-numeric: tabular-nums; }

/* Noch offene Angaben: gut sichtbar, bis Janik sie liefert */
.offen { color: var(--highlight); border-bottom: 1px dashed var(--highlight); }
.hinweis-offen { margin-top: 20px; padding: 12px 14px; border-radius: var(--r); border: 1px solid var(--highlight); color: var(--text-2); font-size: 14.5px; background: color-mix(in srgb, var(--highlight) 8%, transparent); }

footer { border-top: 1px solid var(--border); background: color-mix(in srgb, var(--bg) 90%, transparent); }
footer .innen { max-width: 820px; margin: 0 auto; padding: 14px 22px 20px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 16px; font-size: 13px; color: var(--muted); }
footer a { color: var(--text-2); text-decoration: none; }
footer a:hover, footer a[aria-current] { color: var(--accent); }
footer .links { display: flex; gap: 16px; }
