/* Shared styling for the legal pages. Same tokens as index.html, minus
   everything the landing page needs and these do not. */

:root{
  color-scheme: light;
  --paper:#FBFAF7; --surface:#FFFFFF; --surface-2:#F2F0EB;
  --topbar-bg:rgba(251,250,247,.86);
  --ink:#161616; --ink-2:#3A3A3A; --ink-3:#4A4A4A; --grey:#6B6B6B;
  --line:#E7E3D9; --rule:#D8D3C8;
  --accent:#1F4E5F; --accent-d:#173B48; --accent-fg:#FFFFFF;
  --gold:#B8860B; --gold-soft:#F3ECDA;
  --footer-bg:#161616; --footer-fg:#CFCFCF; --footer-strong:#FFFFFF;
  --footer-dim:#8F8F8F; --footer-line:#3A3A3A;
  --shadow-1:0 1px 2px rgba(16,24,28,.05);
  --maxw:820px; --gut:24px; --r-sm:8px; --r-md:12px; --hdr-h:64px;
  --serif:'Fraunces',Georgia,'Times New Roman',serif;
  --sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    color-scheme: dark;
    --paper:#0E1317; --surface:#151C21; --surface-2:#121A1F;
    --topbar-bg:rgba(14,19,23,.84);
    --ink:#EDEBE6; --ink-2:#C9C6BF; --ink-3:#B6B3AC; --grey:#93918B;
    --line:#242E34; --rule:#35424A;
    --accent:#7FC3D6; --accent-d:#9AD3E2; --accent-fg:#07161C;
    --gold:#D9A441; --gold-soft:#2B2415;
    --footer-bg:#080C0F; --footer-fg:#B9B7B1; --footer-dim:#7C7A75;
    --footer-line:#242E34;
    --shadow-1:0 1px 2px rgba(0,0,0,.40);
  }
}
:root[data-theme="dark"]{
  color-scheme: dark;
  --paper:#0E1317; --surface:#151C21; --surface-2:#121A1F;
  --topbar-bg:rgba(14,19,23,.84);
  --ink:#EDEBE6; --ink-2:#C9C6BF; --ink-3:#B6B3AC; --grey:#93918B;
  --line:#242E34; --rule:#35424A;
  --accent:#7FC3D6; --accent-d:#9AD3E2; --accent-fg:#07161C;
  --gold:#D9A441; --gold-soft:#2B2415;
  --footer-bg:#080C0F; --footer-fg:#B9B7B1; --footer-dim:#7C7A75;
  --footer-line:#242E34;
  --shadow-1:0 1px 2px rgba(0,0,0,.40);
}

*{margin:0; padding:0; box-sizing:border-box}
html{scroll-behavior:smooth; -webkit-text-size-adjust:100%}
body{font-family:var(--sans); color:var(--ink); background:var(--paper);
  line-height:1.62; font-size:16.5px; -webkit-font-smoothing:antialiased}
.wrap{max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gut)}
a{color:var(--accent)}
a:hover{color:var(--accent-d)}

html[lang="de"] [data-en]{display:none !important}
html[lang="en"] [data-de]{display:none !important}
html:not([lang="en"]) [data-en]{display:none !important}

.topbar{position:sticky; top:0; z-index:40; background:var(--topbar-bg);
  -webkit-backdrop-filter:saturate(140%) blur(10px);
  backdrop-filter:saturate(140%) blur(10px); border-bottom:1px solid var(--line)}
.topbar .wrap{max-width:1120px; display:flex; align-items:center;
  justify-content:space-between; gap:16px; min-height:var(--hdr-h); flex-wrap:wrap}
.brand{display:flex; align-items:center; gap:10px; font-weight:700; font-size:15px;
  text-decoration:none; color:var(--ink); white-space:nowrap}
.brand .dot{width:11px; height:11px; border-radius:50%; background:var(--gold);
  box-shadow:0 0 0 3px var(--gold-soft); flex:none}
.brand small{color:var(--grey); font-weight:500}
/* wordmarks — AvantiGroup.AI (Avanti bold, Group thin, .AI bold)
   and B2BModernSelling (B2B bold, Modern thin, Selling bold) */
.wm b{font-weight:700}
.wm .lt{font-weight:300}
.topbar-ctrl{display:flex; align-items:center; gap:12px}
.seg{display:inline-flex; align-items:center; border:1px solid var(--rule);
  border-radius:999px; overflow:hidden; background:var(--surface); flex:none}
.seg button{font:inherit; font-size:12px; font-weight:600; letter-spacing:.03em;
  padding:5px 11px; background:transparent; border:0; color:var(--grey);
  cursor:pointer; display:inline-grid; place-items:center; line-height:1}
.seg button:hover{color:var(--ink)}
.seg button[aria-pressed="true"]{background:var(--accent); color:var(--accent-fg)}
.seg.theme button{padding:6px 9px}
.seg.theme svg{width:15px; height:15px; display:block; fill:none;
  stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}
.back{font-size:14px; text-decoration:none; color:var(--grey); font-weight:500}
.back:hover{color:var(--ink)}

main{padding-block:56px 72px}
h1{font-family:var(--serif); font-weight:600; font-size:clamp(30px,5vw,42px);
  line-height:1.1; letter-spacing:-.012em; margin-bottom:10px}
.updated{color:var(--grey); font-size:14px; margin-bottom:40px}
h2{font-family:var(--serif); font-weight:600; font-size:23px; line-height:1.2;
  margin:40px 0 12px; padding-top:8px; border-top:1px solid var(--line)}
h2:first-of-type{border-top:0; padding-top:0}
h3{font-family:var(--sans); font-weight:700; font-size:16px; margin:22px 0 8px}
p{margin-bottom:14px; color:var(--ink-2)}
ul,ol{margin:0 0 16px 22px; color:var(--ink-2)}
li{margin-bottom:7px}
dl{margin-bottom:16px}
dt{font-weight:650; color:var(--ink); margin-top:12px}
dd{margin-left:0; color:var(--ink-2)}
strong{font-weight:650; color:var(--ink)}
table{width:100%; border-collapse:collapse; margin-bottom:20px; font-size:15px;
  display:block; overflow-x:auto}
th,td{text-align:left; padding:10px 12px; border-bottom:1px solid var(--line);
  vertical-align:top}
th{font-weight:700; color:var(--ink); white-space:nowrap}
td{color:var(--ink-2)}
.box{background:var(--surface); border:1px solid var(--line);
  border-left:3px solid var(--gold); border-radius:var(--r-md);
  padding:18px 20px; margin-bottom:24px; box-shadow:var(--shadow-1)}
.box p:last-child{margin-bottom:0}
.fill{background:var(--gold-soft); color:var(--ink); font-weight:650;
  padding:1px 6px; border-radius:4px; font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:.92em}

footer{background:var(--footer-bg); color:var(--footer-fg); padding-block:40px}
footer .wrap{max-width:1120px; display:flex; justify-content:space-between;
  gap:20px; flex-wrap:wrap; align-items:center; font-size:14px}
footer a{color:var(--footer-fg); text-decoration:none;
  border-bottom:1px solid var(--footer-line)}
footer a:hover{color:var(--footer-strong); border-color:var(--footer-strong)}
footer small{color:var(--footer-dim)}

:focus-visible{outline:3px solid var(--gold); outline-offset:2px; border-radius:4px}
@media(prefers-reduced-motion:reduce){*{transition:none !important}}
@media print{.topbar,.seg,.back{display:none !important}
  body{background:#fff; color:#000; font-size:11pt}}