/* Gemeinsame Gestaltung für Impressum und Datenschutz – gleiche Tokens wie index.html */
:root {
  --petrol: #163a3a; --petrol-dark: #0f2a2a; --coral: #d9534a; --rose: #f2c4c0;
  --snow: #fffef8; --paper: #f7f1e7; --ink: #3d2f28; --muted: #7a6a60;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font: 400 1.0625rem/1.65 'Figtree', system-ui, sans-serif; background: var(--snow); color: var(--ink); -webkit-font-smoothing: antialiased;; min-height: 100vh; display: flex; flex-direction: column; }
a { color: var(--petrol); text-decoration-color: var(--coral); text-underline-offset: 3px; }
.serif, h1, h2 { font-family: 'Fraunces', Georgia, serif; font-variation-settings: 'SOFT' 50, 'WONK' 1; }
:focus-visible { outline: 2px solid #e8b04b; outline-offset: 3px; }

.topbar { position: sticky; top: 0; z-index: 50; background: rgba(22,58,58,.9); backdrop-filter: blur(16px) saturate(160%); -webkit-backdrop-filter: blur(16px) saturate(160%); color: var(--snow); }
@media (prefers-reduced-transparency: reduce) { .topbar { background: var(--petrol); backdrop-filter: none; -webkit-backdrop-filter: none; } }
.topbar div { max-width: 760px; margin: 0 auto; padding: 0 20px; height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.topbar a { color: inherit; text-decoration: none; }
.topbar .logo { font-size: 1.25rem; font-weight: 600; }
.topbar .back { font-size: .8rem; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; }
.topbar .back:hover { color: var(--rose); }

main { flex: 1; width: 100%; max-width: 760px; margin: 0 auto; padding: 64px 20px 88px; }  /* flex: 1 hält den Fuß unten, auch bei kurzen Seiten */
h1 { font-size: clamp(1.6rem, 8vw, 3.2rem); line-height: 1.05; letter-spacing: -0.02em; color: var(--petrol); font-weight: 600; }
.stand { color: var(--muted); font-size: .9rem; margin-top: 8px; }
h2 { font-size: 1.5rem; line-height: 1.2; color: var(--petrol); font-weight: 600; margin: 44px 0 10px; }
h3 { font-size: .8rem; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); font-weight: 600; margin: 24px 0 6px; }
p, ul, address { margin-top: 10px; font-style: normal; }
ul { padding-left: 1.2em; }
li + li { margin-top: 4px; }
.karte { background: var(--paper); border-radius: 4px; padding: 20px 22px; margin-top: 16px; }
.karte p:first-child { margin-top: 0; }

footer { background: var(--petrol-dark); color: rgba(255,254,248,.7); font-size: .88rem; }
footer div { max-width: 760px; margin: 0 auto; padding: 28px 20px; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
footer nav { display: flex; gap: 24px; }
footer a { color: inherit; text-decoration: none; }
footer a:hover, footer a[aria-current] { color: var(--snow); }

@media (max-width: 480px) { .topbar .back { display: none; } }
@media (max-width: 380px) { .topbar .logo { font-size: 1.05rem; } }
/* Erfurter Rad im Logo: dreht sich beim Laden einmal und rollt weich aus */
.topbar .logo { display: inline-flex; align-items: center; gap: 10px; white-space: nowrap; }
.rad { width: 28px; height: 28px; flex-shrink: 0; animation: rad-start 1.6s cubic-bezier(.16, 1, .3, 1) .15s both; }
@keyframes rad-start { from { transform: rotate(-360deg); } }
@media (prefers-reduced-motion: reduce) { .rad { animation: none; } }
@media (max-width: 380px) { .rad { width: 22px; height: 22px; } .topbar .logo { gap: 8px; } }