/* ═══════════════════════════════════════════════════════════════════
   Shared stylesheet for the five legal pages (imprint, privacy, terms,
   cookies, contact). Same origin, no external requests — the CSP-safe
   rule the advertorial follows still holds.

   The advertorial and thankyou pages keep their CSS inline because they
   are the ad units and must render in one request. These pages are
   read rarely and benefit more from being consistent with each other.
   ═══════════════════════════════════════════════════════════════════ */

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:#16181C}
body,h1,h2,h3,h4,p,ul,ol,li,table,figure{margin:0;padding:0}
ul,ol{list-style:none}
img,svg{display:block;max-width:100%}

:root{
  --page:#FCFBF7; --panel:#F4F1EA; --shade:#DCD8D0;
  --ink:#14161A; --ink-2:#3A4047; --ink-3:#6A7079;
  --rule:#D8D3C8; --rule-d:#B4AEA1;
  --red:#B3122C; --green:#116A45;
  --serif:Georgia,"Iowan Old Style","Times New Roman",Times,serif;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
body{background:var(--shade);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
.wrap{max-width:1160px;margin-inline:auto;padding-inline:16px}

/* ───── masthead, shared with the advertorial ───── */
.adnote{background:#16181C;color:#9AA0A7;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;
  font-weight:600;text-align:center;padding:6px 14px}
.masthead{background:var(--page);border-bottom:1px solid var(--rule)}
.masthead .in{display:flex;align-items:center;gap:14px;padding-block:12px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.brand .wm{font-family:var(--serif);font-weight:700;font-size:1.36rem;letter-spacing:-.022em;line-height:1}
.brand .wm i{font-style:normal;color:var(--red)}
.brand .edition{font-size:.58rem;font-weight:800;letter-spacing:.19em;text-transform:uppercase;color:var(--ink-3);
  padding-left:10px;margin-left:2px;border-left:1px solid var(--rule-d);align-self:stretch;display:flex;align-items:center}
@media (max-width:480px){ .brand .edition{display:none} }
.masthead .back{margin-left:auto;font-size:.76rem;color:var(--ink-3);text-decoration:none}
.masthead .back:hover{color:var(--red)}

/* ───── document ───── */
.doc{max-width:760px;margin-inline:auto;background:var(--page);border-inline:1px solid var(--rule);
  padding:26px 20px 34px}
@media (min-width:760px){ .doc{padding:38px 48px 46px} }

.kicker{font-size:.66rem;font-weight:800;letter-spacing:.17em;text-transform:uppercase;color:var(--red);
  padding-bottom:9px;border-bottom:2px solid var(--ink);margin-bottom:16px}
h1{font-family:var(--serif);font-size:1.72rem;font-weight:700;letter-spacing:-.02em;line-height:1.15}
@media (min-width:760px){ h1{font-size:2.15rem} }
.upd{font-size:.76rem;color:var(--ink-3);margin-top:.6em}

.doc h2{font-family:var(--serif);font-size:1.2rem;font-weight:700;line-height:1.25;color:var(--ink);
  margin-top:1.7em;margin-bottom:.45em;padding-top:1em;border-top:1px solid var(--rule)}
.doc h3{font-size:.92rem;font-weight:800;color:var(--ink);margin-top:1.2em;margin-bottom:.3em}
.doc p{font-size:.96rem;line-height:1.62;color:var(--ink-2);margin-bottom:.9em}
.doc a{color:var(--red)}
.doc strong{color:var(--ink);font-weight:700}

.doc ul.b li{position:relative;padding-left:19px;margin-bottom:8px;font-size:.96rem;line-height:1.55;color:var(--ink-2)}
.doc ul.b li:last-child{margin-bottom:0}
.doc ul.b li::before{content:"—";position:absolute;left:0;color:var(--rule-d)}
.doc ul.b{margin-bottom:1em}

/* identity / definition blocks */
.card{border:1px solid var(--rule-d);background:var(--panel);padding:16px 18px;margin-bottom:1.1em}
.card p{margin-bottom:.5em;font-size:.92rem}
.card p:last-child{margin-bottom:0}
.card .lbl{display:block;font-size:.64rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink-3);margin-bottom:6px}

/* data / cookie tables */
.tw{overflow-x:auto;margin-bottom:1.1em;border:1px solid var(--rule-d)}
table{border-collapse:collapse;width:100%;min-width:520px;font-size:.86rem}
th,td{text-align:left;padding:10px 13px;border-bottom:1px solid var(--rule);vertical-align:top;line-height:1.45}
th{background:var(--panel);font-size:.68rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
tr:last-child td{border-bottom:0}
td strong{color:var(--ink)}

.warn{border-left:4px solid var(--red);background:var(--panel);padding:14px 16px;margin-bottom:1.1em}
.warn p{margin-bottom:0;font-size:.9rem}

footer{background:#16181C;color:#868C94;padding-block:24px;font-family:var(--sans);font-size:.72rem;line-height:1.5}
footer p{margin-bottom:.8em;font-size:.72rem}
footer strong{color:#A8AEB5}
footer .copy{margin-left:auto;color:#6E757D}
footer .links{display:flex;flex-wrap:wrap;align-items:center;gap:7px 15px;margin-top:13px;padding-top:12px;
  border-top:1px solid #2A2E34}
footer a{color:#A8AEB5}

/* ───── German typesetting ─────
   The legal pages are the densest German on the site — Verbraucherschlichtungs-
   stelle, Datenschutzaufsichtsbehörde, Standardvertragsklauseln. Inside the
   narrow table cells those will push a column past its container. Hyphenation
   needs lang="de" on <html>, which every legal page now sets. */
body{hyphens:auto;-webkit-hyphens:auto;overflow-wrap:break-word;
  /* only long compounds — see the note in index.html */
  hyphenate-limit-chars:10 4 4;-webkit-hyphenate-limit-before:4;-webkit-hyphenate-limit-after:4}
h1,.doc h2,.doc h3{hyphens:manual;-webkit-hyphens:manual}
td,th{hyphens:auto;-webkit-hyphens:auto}