/* ============================================================
   Gemeinsamer Stil für Impressum und Datenschutz
   (gleiche Farben wie die Startseite)
   ============================================================ */
@font-face {
  font-family: "Bangers";
  src: url("fonts/bangers.woff2") format("woff2");
  font-display: swap;
}

:root {
  --nacht: #0b0b0f;
  --panel: #17161d;
  --tinte: #f4f4f7;
  --tuerkis: #1fc8d6;
  --lila: #a23cff;
  --leise: #b4b2bd;
  --titel: "Bangers", Impact, "Arial Black", sans-serif;
  --text: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: var(--text);
  color: var(--tinte);
  line-height: 1.7;
  background:
    radial-gradient(rgba(255,255,255,.06) 1.2px, transparent 1.3px) 0 0 / 7px 7px,
    var(--nacht);
}
a { color: var(--tuerkis); }
.container { width: min(860px, 100% - 32px); margin-inline: auto; }

/* Kopfzeile */
header { border-bottom: 3px solid var(--tinte); }
.nav { display: flex; align-items: center; justify-content: space-between; height: 72px; }
.logo {
  font-family: var(--titel); font-size: 1.9rem; letter-spacing: .04em;
  text-transform: uppercase; text-decoration: none; color: var(--tinte);
}
.logo span { color: var(--tuerkis); }
.zurueck {
  font-family: var(--titel); font-size: 1.2rem; letter-spacing: .05em; text-transform: uppercase;
  text-decoration: none; color: #000; background: var(--tuerkis);
  border: 3px solid #000; box-shadow: 4px 4px 0 var(--tinte); padding: 6px 14px 4px;
}

/* Inhalt als Comic-Panel */
main { padding: 56px 0 80px; }
h1 {
  font-family: var(--titel); font-weight: 400; text-transform: uppercase; letter-spacing: .04em;
  font-size: clamp(2.8rem, 8vw, 4.4rem); line-height: 1; color: var(--tuerkis);
  -webkit-text-stroke: 1.5px #000;
  text-shadow: 4px 4px 0 #000, 0 0 18px rgba(162,60,255,.55);
  margin-bottom: 28px;
}
.panel {
  background: var(--panel);
  border: 4px solid var(--tinte);
  box-shadow: 10px 10px 0 var(--lila);
  padding: clamp(22px, 5vw, 44px);
}
h2 {
  font-family: var(--titel); font-weight: 400; text-transform: uppercase; letter-spacing: .05em;
  font-size: 1.8rem; color: var(--lila); text-shadow: 2px 2px 0 #000;
  margin: 34px 0 10px;
}
h2:first-child { margin-top: 0; }
h3 { font-size: 1.05rem; margin: 18px 0 4px; }
p, ul { color: var(--leise); margin-bottom: 10px; }
ul { padding-left: 22px; }
strong { color: var(--tinte); }
.platzhalter {
  background: rgba(162,60,255,.15); border: 2px dashed var(--lila);
  padding: 8px 12px; color: var(--tinte);
}
.stand { margin-top: 30px; font-size: .9rem; }

footer { border-top: 3px solid var(--tinte); padding: 28px 0; color: var(--leise); font-size: .95rem; }
footer .container { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
footer a { color: var(--leise); text-decoration: none; margin-left: 16px; display: inline-block; padding: 8px 0; }   /* große Tippfläche */
footer a:hover { color: var(--tuerkis); }