/* ============================================================
   Verhandlungsoffensive — Unterseiten (Impressum, Datenschutz, 404)
   Teilt Schriften und Farben mit index.html; bewusst schlank.
   ============================================================ */
@font-face{
  font-family:"Anton";
  src:url("fonts/Anton-Regular.woff2") format("woff2"),
      url("fonts/Anton-Regular.ttf") format("truetype");
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Hanken Grotesk";
  src:url("fonts/HankenGrotesk-Variable.woff2") format("woff2"),
      url("fonts/HankenGrotesk-Variable.ttf") format("truetype");
  font-weight:100 900; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Space Mono";
  src:url("fonts/SpaceMono-Regular.woff2") format("woff2"),
      url("fonts/SpaceMono-Regular.ttf") format("truetype");
  font-weight:400; font-style:normal; font-display:swap;
}

:root{
  --ink:#0B0E13; --flare:#39FF97; --flare-deep:#0FB968;
  --paper:#F4F6F2; --skew:-7deg;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--paper);color:var(--ink);
  font-family:"Hanken Grotesk",sans-serif;font-size:17px;line-height:1.62;
  -webkit-font-smoothing:antialiased;
}

/* ---------- Kopfleiste ---------- */
.sub-nav{background:var(--ink);border-bottom:1px solid rgba(255,255,255,.08)}
.sub-nav__inner{
  max-width:760px;margin:0 auto;padding:16px 28px;
  display:flex;align-items:center;justify-content:space-between;gap:20px;
}
.sub-nav__home{
  font-family:"Space Mono",monospace;font-size:.72rem;letter-spacing:.2em;
  text-transform:uppercase;color:rgba(255,255,255,.74);text-decoration:none;
  transition:color .2s;
}
.sub-nav__home:hover{color:var(--flare)}
.sub-nav__mark{height:30px;width:auto;display:block}

/* ---------- Inhalt ---------- */
.legal{max-width:760px;margin:0 auto;padding:46px 28px 90px}
.legal__eyebrow{
  font-family:"Space Mono",monospace;font-size:.7rem;letter-spacing:.22em;
  text-transform:uppercase;color:var(--flare-deep);display:block;margin-bottom:14px;
}
.legal h1,.legal h2{
  font-family:"Anton",sans-serif;font-weight:400;text-transform:uppercase;
  line-height:.94;letter-spacing:.01em;
  font-size:clamp(2rem,5vw,3rem);margin-bottom:26px;
}
.legal h3{
  font-family:"Anton",sans-serif;font-weight:400;text-transform:uppercase;
  letter-spacing:.02em;font-size:1.1rem;margin:30px 0 8px;
}
.legal h4{font-weight:700;font-size:1rem;margin:20px 0 6px}
.legal p{margin-bottom:12px;color:rgba(11,14,19,.78);font-size:.98rem;max-width:68ch}
.legal ul{margin:0 0 12px 1.2em;color:rgba(11,14,19,.78);font-size:.98rem;max-width:68ch}
.legal li{margin-bottom:6px}
.legal address{font-style:normal;margin-bottom:12px;line-height:1.75;color:rgba(11,14,19,.8)}
.legal strong{font-weight:700;color:var(--ink)}
.legal a{color:var(--flare-deep);text-decoration:none}
.legal a:hover{text-decoration:underline}
.legal__note{
  font-family:"Space Mono",monospace;font-size:.74rem;line-height:1.6;
  color:rgba(11,14,19,.55);border-left:3px solid var(--flare);
  padding:12px 0 12px 16px;margin:24px 0 0;
}

/* ---------- Fußzeile ---------- */
.sub-footer{background:var(--ink);color:rgba(244,246,242,.6)}
.sub-footer__inner{
  max-width:760px;margin:0 auto;padding:30px 28px;
  display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;
  font-family:"Space Mono",monospace;font-size:.72rem;letter-spacing:.06em;
}
.sub-footer a{color:rgba(244,246,242,.78);text-decoration:none}
.sub-footer a:hover{color:var(--flare)}
.sub-footer__spacer{margin-left:auto}

/* ---------- 404 ---------- */
.nf{max-width:760px;margin:0 auto;padding:90px 28px 110px;text-align:left}
.nf__code{
  font-family:"Anton",sans-serif;font-size:clamp(4.5rem,18vw,9rem);line-height:.86;
  text-transform:uppercase;color:var(--ink);
}
.nf__code em{font-style:normal;color:var(--flare-deep)}
.nf h1{
  font-family:"Anton",sans-serif;font-weight:400;text-transform:uppercase;
  font-size:clamp(1.6rem,5vw,2.4rem);line-height:.96;margin:18px 0 14px;
}
.nf p{color:rgba(11,14,19,.72);max-width:52ch;margin-bottom:28px}
.btn{
  display:inline-block;white-space:nowrap;font-family:"Anton",sans-serif;
  text-transform:uppercase;letter-spacing:.03em;font-size:1rem;padding:16px 30px;
  border:none;cursor:pointer;text-decoration:none;
  transform:skewX(var(--skew));transition:transform .25s,box-shadow .25s;
  background:var(--flare);color:var(--ink);
  box-shadow:0 14px 30px -12px rgba(57,255,151,.8);
}
.btn>span{display:inline-block;transform:skewX(7deg)}
.btn:hover{transform:skewX(var(--skew)) translateY(-3px);box-shadow:0 20px 40px -14px rgba(57,255,151,.9)}

@media (prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
  html{scroll-behavior:auto}
}