/* Impressum und Datenschutz (06.10.2026). Eigene kleine Datei statt styles.css: die zwei Seiten brauchen nur Kopf, Textspalte und Fuß.
   Farben wie im Shop (dunkel Standard, hell über html[data-theme="light"], gemerkt in localStorage „archive-theme“).
   <mark class="fehlt"> = Angabe fehlt noch und muss vor dem Start eingetragen werden (fällt absichtlich auf). */
/* Ersatz für Arial Black auf dem iPhone, wie in styles.css */
@font-face { font-family: "Archivo Black Web"; src: url("assets/fonts/archivo-black-web.woff2") format("woff2"); font-style: normal; font-weight: 1 1000; font-display: block; }
:root {
  color-scheme: dark;
  --black: #080808;
  --paper: #e8e8e5;
  --muted: #92928f;
  --line: rgba(232, 232, 229, .19);
  --mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --display: "Arial Black", "Archivo Black Web", Impact, Haettenschweiler, sans-serif;
  --sans: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --gutter: clamp(20px, 6.4vw, 106px);
}
:root[data-theme="light"] {
  color-scheme: light;
  --black: #efeee9;
  --paper: #131312;
  --muted: #5b5a56;
  --line: rgba(19, 19, 18, .2);
}
* { box-sizing: border-box; }
html { background: var(--black); scroll-behavior: smooth; }
body { margin: 0; color: var(--paper); background: var(--black); font-family: var(--sans); -webkit-font-smoothing: antialiased; }
a { color: inherit; }
:focus-visible { outline: 1px solid var(--paper); outline-offset: 4px; }

.legal-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 22px var(--gutter); border-bottom: 1px solid var(--line); }
.legal-head img { display: block; width: 92px; height: auto; }
:root[data-theme="light"] .legal-head img { filter: invert(1); }
.legal-back { font: 10px/1 var(--mono); letter-spacing: .14em; text-decoration: none; text-transform: uppercase; }
.legal-back:hover { text-decoration: underline; text-underline-offset: 4px; }

.legal { max-width: 760px; padding: clamp(46px, 8vw, 96px) var(--gutter) 80px; }
.legal .eyebrow { display: flex; align-items: center; gap: 10px; margin: 0 0 22px; color: var(--muted); font: 9px/1.4 var(--mono); letter-spacing: .15em; text-transform: uppercase; }
.legal .eyebrow::before { width: 20px; height: 1px; background: var(--paper); content: ""; }
.legal h1 { margin: 0 0 34px; font: 800 clamp(40px, 7vw, 76px)/.92 var(--display); letter-spacing: -.05em; text-transform: uppercase; }
.legal h2 { margin: 44px 0 12px; padding-top: 18px; border-top: 1px solid var(--line); font: 700 15px/1.3 var(--sans); }
.legal h3 { margin: 22px 0 8px; font: 700 13px/1.35 var(--sans); }
.legal p, .legal li { color: color-mix(in srgb, var(--paper) 78%, var(--black)); font: 14px/1.7 var(--sans); }
.legal p { margin: 0 0 12px; }
.legal ul { margin: 0 0 12px; padding-left: 20px; }
.legal li { margin: 0 0 6px; }
.legal address { font-style: normal; }
.legal .lead { color: var(--paper); font-size: 16px; }
.legal .small { color: var(--muted); font: 11px/1.7 var(--mono); }
.legal nav.toc { margin: 0 0 10px; }
.legal nav.toc a { display: inline-block; margin: 0 14px 8px 0; font: 10px/1.4 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
mark.fehlt { padding: 1px 5px; border: 1px dashed #ff6a5c; border-radius: 4px; color: #ff8a7e; background: rgba(255, 90, 76, .1); font: 12px/1.5 var(--mono); }
:root[data-theme="light"] mark.fehlt { color: #b3261e; border-color: #b3261e; background: rgba(179, 38, 30, .07); }

.legal-foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 20px; padding: 16px var(--gutter) 22px; border-top: 1px solid var(--line); color: var(--muted); font: 10px/1.4 var(--mono); letter-spacing: .1em; text-transform: uppercase; }
.legal-foot nav { display: flex; flex-wrap: wrap; gap: 6px 18px; }
.legal-foot a { text-decoration: none; }
.legal-foot a:hover, .legal-foot a[aria-current="page"] { color: var(--paper); text-decoration: underline; text-underline-offset: 4px; }

/* Handy (22.10.2026): Links mit Platz zum Antippen, vorher 10–16 px hoch. */
@media (max-width: 680px) {
  .legal-back, .legal-foot a { display: inline-flex; min-height: 40px; align-items: center; }
  .legal a[href^="tel:"], .legal a[href^="mailto:"] { display: inline-block; padding: 8px 0; }
}