/* ============================================================
   LexUp · AGB — Ergänzung zu legal.css, scoped #lx-lg
   Eigene Datei statt Eingriff in legal.css: Impressum und
   Datenschutz sind live und dürfen sich nicht mitbewegen.
   Enthält ausschließlich Selektoren, die dort nicht vorkommen.
   ============================================================ */

/* ---------- Nummerierte Absätze (1) (2) (3) ----------
   Hängende Einrückung: die Nummer steht links neben dem Satz,
   Folgezeilen fluchten unter dem Text, nicht unter der Nummer. */
#lx-lg ol.abs{list-style:none;counter-reset:abs;display:block}
#lx-lg ol.abs > li{counter-increment:abs;position:relative;
  padding-left:2.6em;color:var(--mut);line-height:1.72;font-size:15.5px;overflow-wrap:break-word}
#lx-lg ol.abs > li + li{margin-top:1em}
#lx-lg ol.abs > li::before{content:"(" counter(abs) ")";position:absolute;left:0;top:0;
  width:2.6em;color:var(--mut2);font-weight:800;font-size:14px;font-variant-numeric:tabular-nums;
  line-height:1.9}
#lx-lg ol.abs strong{color:var(--ink);font-weight:700}
#lx-lg ol.abs p{margin-top:.7em}

/* ---------- Aufzählung innerhalb eines Absatzes ---------- */
#lx-lg ul.dots{list-style:none;margin-top:.8em;display:block}
#lx-lg ul.dots > li{position:relative;padding-left:1.15em;color:var(--mut);
  line-height:1.7;font-size:15px;overflow-wrap:break-word}
#lx-lg ul.dots > li + li{margin-top:.5em}
#lx-lg ul.dots > li::before{content:"";position:absolute;left:0;top:.72em;
  width:5px;height:5px;border-radius:99px;background:rgba(22,123,252,.45)}

/* ---------- Zwischenüberschrift im Fließtext ---------- */
#lx-lg .body h3{font-weight:900;letter-spacing:-.02em;line-height:1.25;
  font-size:1.05rem;color:var(--ink);margin:1.6em 0 .7em;overflow-wrap:break-word;hyphens:auto}
#lx-lg .body h3:first-child{margin-top:0}

/* ---------- Widerrufsbelehrung: amtlicher Mustertext ----------
   Optisch abgesetzt, weil der Text bewusst unverändert in der
   Sie-Form steht (Gesetzlichkeitsfiktion, Anlage 1 EGBGB). */
#lx-lg .amt{margin-top:1.2em;border:1px solid rgba(22,123,252,.22);
  border-left:3px solid var(--blue);border-radius:var(--r-m);
  padding:clamp(20px,2.6vw,28px) clamp(18px,2.6vw,30px);background:rgba(22,123,252,.035)}
/* Auf der getönten Fläche trägt --blue nur 3,81:1. Das dunklere --blue-deep
   liegt über 4,5:1 und sieht im Versal-Label identisch aus. Gemessen mit
   _global/responsive_audit.cjs, 34 Breiten. */
#lx-lg .amt .amt-k{display:block;font-size:10.5px;font-weight:900;letter-spacing:.16em;
  text-transform:uppercase;color:var(--blue-deep);margin-bottom:1em}
/* Gleiches Problem für Links auf getöntem Grund (3,81 bzw. 3,84:1). */
#lx-lg .amt a[href],#lx-lg .wform a[href]{color:var(--blue-deep);
  text-decoration-color:rgba(28,49,144,.4)}
#lx-lg .amt a[href]:hover,#lx-lg .wform a[href]:hover{text-decoration-color:var(--blue-deep)}
#lx-lg .amt h3{margin-top:1.5em}
#lx-lg .amt h3:first-of-type{margin-top:0}
#lx-lg .amt p{font-size:15px}

/* ---------- Muster-Widerrufsformular ---------- */
#lx-lg .wform{margin-top:1.4em;border:1px dashed rgba(51,49,50,.22);border-radius:var(--r-m);
  padding:clamp(18px,2.4vw,26px) clamp(18px,2.4vw,28px);background:rgba(51,49,50,.02)}
#lx-lg .wform p{font-size:14.5px}
#lx-lg .wform .hint{font-style:italic;color:var(--mut2);font-size:13.5px}
#lx-lg .wform ul{list-style:none;margin-top:1em;display:block}
#lx-lg .wform ul li{position:relative;padding-left:1.1em;color:var(--mut);
  font-size:14.5px;line-height:1.9;border-bottom:1px solid var(--line-soft)}
#lx-lg .wform ul li::before{content:"—";position:absolute;left:0;color:var(--mut2)}

/* ---------- Zeile mit Geltungsbereich (Verbraucher / Unternehmer) ---------- */
#lx-lg .tag{display:inline;box-decoration-break:clone;-webkit-box-decoration-break:clone;
  background:rgba(15,37,66,.06);color:var(--navy);border-radius:7px;
  padding:2px 8px;font-size:11.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  margin-right:.5em;vertical-align:1px}

/* ---------- Fußzeile der Seite: Fassung / Druck ---------- */
#lx-lg .vers{margin:clamp(30px,4vw,44px) 0 0;padding-top:clamp(20px,2.6vw,28px);
  border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:10px 20px;
  align-items:center;justify-content:space-between}
#lx-lg .vers p{font-size:13.5px;color:var(--mut2);margin:0}
/* Schriftstapel wie in der Live-Fassung von legal.css: nur 'Google Sans' liegt
   lokal auf dem Server, 'Google Sans Flex' würde still auf die Systemschrift
   fallen und den Knopf anders rendern als die Chips daneben. */
#lx-lg .vers button{font:700 13px/1 'Google Sans',system-ui,-apple-system,sans-serif;color:var(--mut);
  background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:10px 18px;
  min-height:44px;display:inline-flex;align-items:center;gap:8px;cursor:pointer;
  transition:color .2s,border-color .2s,background .2s;-webkit-appearance:none;appearance:none}
#lx-lg .vers button:hover{color:var(--ink);border-color:rgba(22,123,252,.35);background:rgba(22,123,252,.05)}
#lx-lg .vers svg{width:15px;height:15px;stroke:currentColor;stroke-width:2;fill:none;
  stroke-linecap:round;stroke-linejoin:round;flex:none}

@media (max-width:640px){
  #lx-lg ol.abs > li{padding-left:2.3em}
  #lx-lg .vers{flex-direction:column;align-items:stretch}
  #lx-lg .vers button{justify-content:center}
}
@media print{
  #lx-lg .vers{display:none !important}
  #lx-lg .amt,#lx-lg .wform{break-inside:avoid;page-break-inside:avoid}
}