/* ---------- Fonts (self-hosted, DSGVO) ---------- */
@font-face{font-family:'Cabinet';src:url('fonts/cabinet-700.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'Cabinet';src:url('fonts/cabinet-800.woff2') format('woff2');font-weight:800;font-display:swap}
@font-face{font-family:'Switzer';src:url('fonts/switzer-400.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Switzer';src:url('fonts/switzer-500.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Switzer';src:url('fonts/switzer-600.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'PlexMono';src:url('fonts/plexmono-400.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'PlexMono';src:url('fonts/plexmono-500.woff2') format('woff2');font-weight:500;font-display:swap}

:root{
  --paper:#f4f1ea;   --paper:oklch(0.955 0.008 84);
  --card:#fbf9f4;    --card:oklch(0.982 0.006 84);
  --ink:#1a1f28;     --ink:oklch(0.255 0.014 260);
  --ink-soft:#454e5b;--ink-soft:oklch(0.43 0.017 258);
  --ink-faint:#69727f;--ink-faint:oklch(0.55 0.015 258);
  --accent:#2e6bef;  --accent:oklch(0.585 0.185 258);
  --accent-ink:#1f54cc;--accent-ink:oklch(0.50 0.20 262);
  --line:rgba(26,31,40,.14);
  --line-2:rgba(26,31,40,.075);
  --dark:#0f141c;    --dark:oklch(0.17 0.015 258);
  --paper-lt:#eef1f6;--paper-lt:oklch(0.955 0.006 250);
  --chrome-lt:#aab3c2;--chrome-lt:oklch(0.76 0.014 258);
  --muted-lt:#7d8697;--muted-lt:oklch(0.60 0.016 258);
  --accent-lt:#6ea0ff;--accent-lt:oklch(0.72 0.15 262);
  --line-dk:rgba(150,162,182,.24);
  --display:'Cabinet','Arial Narrow',system-ui,sans-serif;
  --sans:'Switzer','Segoe UI',system-ui,sans-serif;
  --mono:'PlexMono','SFMono-Regular',ui-monospace,'Consolas',monospace;
}

*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:1rem;line-height:1.68;-webkit-font-smoothing:antialiased}
a{color:var(--accent-ink);text-decoration:underline;text-underline-offset:2px}
a:hover{color:var(--accent)}
.skip{position:absolute;left:-9999px}
.skip:focus{left:16px;top:16px;z-index:99;background:var(--accent);color:#fff;padding:10px 16px;border-radius:8px;text-decoration:none}

/* Kopf */
.rhead{border-bottom:1px solid var(--line);background:var(--card)}
.rhead-in{max-width:820px;margin:0 auto;padding:20px 24px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.rhead img{display:block;width:190px;height:auto}
.rhead a.back{font-family:var(--mono);font-size:.8rem;letter-spacing:.06em;text-decoration:none}
.rhead a.back::before{content:"← "}

/* Inhalt */
main{max-width:820px;margin:0 auto;padding:clamp(40px,7vw,72px) 24px clamp(56px,8vw,96px)}
.eyebrow{font-family:var(--mono);font-weight:500;font-size:.74rem;letter-spacing:.22em;text-transform:uppercase;color:var(--accent-ink);display:inline-flex;align-items:center;gap:.7em}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--accent-ink)}
h1{font-family:var(--display);font-weight:800;font-size:clamp(2.2rem,5.5vw,3.4rem);line-height:1.02;letter-spacing:-.02em;margin:18px 0 10px}
h2{font-family:var(--display);font-weight:700;font-size:1.32rem;line-height:1.15;margin:38px 0 12px;color:var(--ink)}
h3{font-family:var(--sans);font-weight:600;font-size:1.02rem;margin:22px 0 6px}
p,li{color:var(--ink-soft);max-width:70ch}
p+p{margin-top:12px}
ul,ol{margin:10px 0 0 1.15em}
li{margin-bottom:6px}
.stand{font-family:var(--mono);font-size:.78rem;letter-spacing:.05em;color:var(--ink-faint);margin-top:6px}
hr{border:0;border-top:1px solid var(--line);margin:34px 0}

/* Datenblock */
.box{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:22px 24px;margin-top:16px}
.box p{color:var(--ink)}
dl{display:grid;grid-template-columns:auto 1fr;gap:8px 22px;margin-top:4px}
dt{font-family:var(--mono);font-size:.76rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);padding-top:4px}
dd{color:var(--ink)}
@media (max-width:560px){dl{grid-template-columns:1fr;gap:2px 0}dd{margin-bottom:10px}}

/* Lücken, die der Kunde füllen muss */
.todo{background:rgba(46,107,239,.09);border:1px dashed rgba(46,107,239,.5);border-radius:6px;padding:2px 8px;font-family:var(--mono);font-size:.8rem;color:var(--accent-ink);display:inline-block}
.hinweis{border-left:3px solid var(--accent);background:rgba(46,107,239,.06);padding:16px 20px;border-radius:0 10px 10px 0;margin-top:20px}
.hinweis b{color:var(--ink)}

/* Fuß */
footer{background:var(--dark);color:var(--muted-lt);border-top:1px solid var(--line-dk);padding:34px 24px}
.rfoot{max-width:820px;margin:0 auto;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-family:var(--mono);font-size:.76rem;letter-spacing:.05em}
footer a{color:var(--chrome-lt)}
footer a:hover{color:var(--accent-lt)}