/* Rechtstexte — gleicher Look wie die Landingpage, auf Lesbarkeit getrimmt */
:root{
  --bg:#0B0B0C; --bg-1:#0E0E10;
  --text:#F0EEE9; --text-dim:#A8A49C; --text-faint:#837F77;
  --pane:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.018));
  --edge:rgba(255,255,255,.09);
  --accent:#FF3B2F;
  --font:"Satoshi",system-ui,-apple-system,"Segoe UI",sans-serif;
  --r:20px; --r-lg:28px; --r-pill:100px;
  --ease:cubic-bezier(.16,1,.3,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{
  font-family:var(--font); background:var(--bg); color:var(--text);
  line-height:1.68; font-weight:400; -webkit-font-smoothing:antialiased;
  padding-bottom:env(safe-area-inset-bottom);
}
a{color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}

.wrap{
  max-width:760px; margin:0 auto;
  padding:clamp(28px,6vw,56px) max(20px,env(safe-area-inset-left)) 96px;
}
.back{
  display:inline-flex;align-items:center;gap:8px;color:var(--text-dim);
  font-size:.9rem;margin-bottom:28px;min-height:44px;
  transition:color .3s var(--ease);
}
.back:hover{color:var(--text)}

.card{
  background:var(--pane); border:1px solid var(--edge); border-radius:var(--r-lg);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07), 0 30px 70px -34px rgba(0,0,0,.8);
  padding:clamp(24px,5vw,52px);
}
h1{font-size:clamp(1.6rem,4.4vw,2.2rem);font-weight:700;letter-spacing:-.03em;margin-bottom:6px}
.updated{color:var(--text-faint);font-size:.84rem;margin-bottom:30px}
h2{
  font-size:1.02rem;font-weight:600;letter-spacing:-.012em;margin:34px 0 10px;
  padding-top:22px;border-top:1px solid var(--edge);
}
h2:first-of-type{margin-top:0;padding-top:0;border-top:none}
h3{font-size:.94rem;font-weight:600;margin:20px 0 6px}
p,li{color:var(--text-dim);font-size:.95rem}
p+p{margin-top:12px}
ul,ol{margin:12px 0 0 20px;display:grid;gap:8px}
ul li{list-style:disc}
ol li{list-style:decimal}
address{font-style:normal;color:var(--text-dim);margin-top:6px}
strong,b{color:var(--text);font-weight:600}
a[href^="mailto"],a[href^="http"]{color:var(--accent);text-decoration:underline;text-underline-offset:2px}
a[href^="mailto"]:hover,a[href^="http"]:hover{color:var(--text)}

.note{
  margin-top:16px;padding:15px 17px;border:1px solid var(--edge);border-radius:var(--r);
  background:rgba(255,255,255,.03);font-size:.87rem;color:var(--text-faint);
}
.form-block{
  margin-top:14px;padding:18px 20px;border:1px dashed var(--edge);border-radius:var(--r);
  background:rgba(255,255,255,.02);font-size:.9rem;color:var(--text-dim);
}
.form-block p+p{margin-top:9px}

.legal-nav{
  display:flex;flex-wrap:wrap;gap:8px;justify-content:center;
  margin:34px auto 0;max-width:760px;
  padding-inline:max(20px,env(safe-area-inset-left));
}
.legal-nav a{
  font-size:.85rem;color:var(--text-dim);border:1px solid var(--edge);
  background:var(--pane);border-radius:var(--r-pill);
  padding:10px 17px;min-height:44px;display:inline-flex;align-items:center;
  transition:color .3s var(--ease),border-color .3s var(--ease);
}
.legal-nav a:hover{color:var(--text);border-color:rgba(255,255,255,.24)}
.legal-nav a[aria-current="page"]{color:var(--text);border-color:rgba(255,255,255,.24)}

.foot{
  text-align:center;color:var(--text-faint);font-size:.8rem;
  margin-top:26px;padding-bottom:34px;
}

@media (prefers-reduced-motion: reduce){*{transition:none !important}}

/* Vierte Ebene + Zitat — gebraucht seit der AGB-Umstrukturierung (30.08.2026),
   als Teil A–D und der Zustimmungstext nach § 356 Abs. 5 BGB dazukamen. */
h4{font-size:.9rem;font-weight:600;margin:16px 0 4px;color:var(--text)}
blockquote{
  margin:14px 0 0;padding:14px 16px;border-left:2px solid var(--accent);
  background:rgba(255,255,255,.03);border-radius:0 var(--r) var(--r) 0;
}
blockquote p{margin:0;color:var(--text);font-size:.93rem}


/* Wörtliches Zitat der Checkbox aus dem Bezahlvorgang. Es muss als Zitat
   erkennbar sein, nicht als Fließtext — die Rechtsfolge hängt genau an diesem
   Wortlaut, deshalb steht er abgesetzt und unverändert. */
.box-quote {
  margin: 14px 0; padding: 14px 18px;
  border: 1px solid var(--line, rgba(23,21,15,.14));
  border-left: 2px solid var(--accent, #DA0600);
  border-radius: 10px;
  background: rgba(23,21,15,.025);
  font-size: .96rem; line-height: 1.55;
}