/* ============================================================
   Shared styling for the legal pages.
   Same 1-bit language as the landing page, but calmer: these are
   documents, not a pitch. Language switching is done by hiding
   whole blocks rather than swapping strings — far easier to keep
   long legal text correct that way.
   ============================================================ */

:root{
  --ink:#000;
  --paper:#fff;
  --mono: ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
  --w: 74ch;
  --rule: 1px;
}
html[data-invert="on"]{ --ink:#fff; --paper:#000; }

*{ box-sizing:border-box; }

html{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--mono);
  font-size:15px;
  line-height:1.7;
  -webkit-font-smoothing:none;
}
body{ margin:0; }

/* language blocks */
html[data-lang="de"] [data-only="en"]{ display:none; }
html[data-lang="en"] [data-only="de"]{ display:none; }

.wrap{ max-width:var(--w); margin:0 auto; padding:0 20px; }

/* ---------------- top bar ---------------- */
.topbar{
  position:sticky; top:0; z-index:50;
  background:var(--paper);
  border-bottom:var(--rule) solid var(--ink);
}
.topbar-in{
  max-width:var(--w); margin:0 auto; padding:9px 20px;
  display:flex; align-items:center; gap:12px;
  font-size:12px; letter-spacing:0.12em; text-transform:uppercase;
}
.brand{ display:flex; align-items:center; gap:9px; font-weight:700; letter-spacing:0.24em; text-decoration:none; color:var(--ink); }
.brand:hover{ background:none; }
.spacer{ flex:1; }
.toggle{ display:flex; border:var(--rule) solid var(--ink); }
.toggle button{
  font:inherit; font-size:11px; letter-spacing:0.12em;
  background:var(--paper); color:var(--ink);
  border:0; padding:3px 9px; cursor:pointer; text-transform:uppercase;
}
.toggle button + button{ border-left:var(--rule) solid var(--ink); }
.toggle button[aria-pressed="true"]{ background:var(--ink); color:var(--paper); }
.toggle button:focus-visible{ outline:2px solid var(--ink); outline-offset:2px; }

/* ---------------- document ---------------- */
main{ padding:44px 0 20px; }

h1{
  font-size:clamp(20px,5vw,26px);
  letter-spacing:0.14em; text-transform:uppercase;
  margin:0 0 8px;
}
h2{
  font-size:14px; letter-spacing:0.2em; text-transform:uppercase;
  margin:36px 0 12px; padding-top:16px;
  border-top:var(--rule) solid var(--ink);
}
h3{ font-size:14px; letter-spacing:0.06em; margin:22px 0 6px; }
p{ margin:0 0 14px; }
a{ color:var(--ink); text-underline-offset:3px; }
a:hover{ background:var(--ink); color:var(--paper); text-decoration:none; }
small{ font-size:12.5px; line-height:1.6; }

ul{ margin:0 0 14px; padding-left:0; list-style:none; }
li{ position:relative; padding-left:22px; margin-bottom:7px; }
li::before{ content:"\2022"; position:absolute; left:6px; top:-1px; }

.block{
  border:var(--rule) solid var(--ink);
  padding:14px 16px;
  margin:0 0 18px;
  white-space:pre-line;
}
.note{
  border:var(--rule) solid var(--ink);
  padding:12px 14px;
  margin:0 0 22px;
  font-size:12.5px;
  line-height:1.65;
}
.note strong{ display:block; margin-bottom:4px; letter-spacing:0.12em; text-transform:uppercase; font-size:11px; }

.lead{ font-size:13px; margin-bottom:26px; }

table{ border-collapse:collapse; width:100%; margin:0 0 18px; font-size:13px; }
th,td{ border:var(--rule) solid var(--ink); padding:8px 10px; text-align:left; vertical-align:top; }
th{ font-weight:700; letter-spacing:0.08em; }

footer{
  border-top:var(--rule) solid var(--ink);
  margin-top:40px; padding:22px 0 40px; font-size:12px;
}
.foot-links{ display:flex; flex-wrap:wrap; gap:8px 18px; margin-bottom:12px; }