@font-face{font-family:"Archivo";src:url(../fonts/archivo-var.woff2) format("woff2");font-weight:400 900;font-display:swap}
@font-face{font-family:"Anton";src:url(../fonts/anton.woff2) format("woff2");font-weight:400;font-display:swap}
:root{--bg:oklch(0.12 0.004 80);--ink:oklch(0.96 0.008 85);--dim:oklch(0.78 0.008 85);--mute:oklch(0.62 0.008 85);--line:oklch(0.96 0.008 85 / 0.12);--gold:oklch(0.83 0.125 86);--gold-ink:oklch(0.22 0.03 80)}
*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;background:radial-gradient(120% 70% at 50% 0,oklch(0.17 0.006 80),var(--bg) 60%) no-repeat;color:var(--dim);font:400 16px/1.7 "Helvetica Neue","Archivo",Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--ink);text-underline-offset:3px;text-decoration-color:oklch(0.83 0.125 86 / .6)}
a:hover{color:var(--gold)}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:4px}
.wrap{max-width:720px;margin:0 auto;padding:clamp(28px,6vw,64px) 20px calc(72px + env(safe-area-inset-bottom))}
.top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:clamp(36px,7vw,64px)}
.top img{width:72px;height:auto}
.back{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 18px;border-radius:999px;font-size:14px;font-weight:600;text-decoration:none;color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
.back:hover{color:var(--ink);box-shadow:inset 0 0 0 1px oklch(0.83 0.125 86 / .6)}
h1{margin:0 0 34px;font-family:"Anton","Helvetica Neue",sans-serif;font-weight:400;font-size:clamp(44px,9vw,84px);line-height:.95;text-transform:uppercase;color:var(--ink);letter-spacing:.005em;text-shadow:0 0 18px oklch(0.97 0.03 85 / .25)}
h2{margin:40px 0 10px;font-size:13px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--ink)}
p,li{max-width:64ch}
p{margin:0 0 12px}
strong{color:var(--ink);font-weight:600}
ul{padding-left:20px}
footer{margin-top:56px;padding-top:22px;border-top:1px solid var(--line);font-size:13px;color:var(--mute)}

/* Versteckter Zugang zur Statistik (Joost 16.10.2026): sieht aus wie normaler Text */
footer a.still{color:inherit;text-decoration:none;border:0}

/* Mobil-Check 22.10.2026 (nur Format) */
/* Ueberschriften: kein einzelnes Wort allein in der letzten Zeile ("(SERVER-LOGS)", "BROWSER"), lange Woerter brechen statt zu ragen.
   Kein hyphens:auto: es trennte "Datenschutz­erklaerung" an einer schlechteren Stelle als dem gesetzten Trennzeichen */
h1,h2{overflow-wrap:break-word;text-wrap:balance}
p{text-wrap:pretty}
/* Telefonnummer nie ueber zwei Zeilen ("+49" / "157 31668306") */
a[href^="tel:"]{white-space:nowrap}
/* 320 px (iPhone SE 1 / Anzeigezoom): "VERBRAUCHERSTREITBEILEGUNG" war 284 px breit in 280 px Platz */
@media (max-width:359px){h2{letter-spacing:.1em}}
/* Fusslinks waren 15 px hoch; nur die Tippflaeche waechst auf 44 px, die Zeile bleibt gleich hoch */
@media (pointer:coarse){footer a{display:inline-block;padding:14px 2px;margin:-14px -2px}}