/* Modul „fakten“ (module/fakten). Nur Tokens: --bm-* (Website), --bb-*
   (Bausteine, Ton-Regel). Werte aus seiten/module/d2d.css (Kennzahlen,
   Eckdaten). Breakpoints: 640 / 1024 (max: −1). */

/* ── zahlen: sehr große Ziffern, Linie darüber, keine Karten ───────────── */
.bb-m-fakten__zahlen {
  display: grid;
  grid-template-columns: repeat(var(--bb-m-fakten-spalten, 3), minmax(0, 1fr));
  gap: clamp(2rem, 3vw, 3rem) var(--bb-raster-luecke);
  margin: 0;
  padding: 0;
  list-style: none;
}
.bb-m-fakten__zahl { position: relative; padding-top: clamp(1.25rem, 2vw, 1.75rem); }
.bb-m-fakten__zahl::before {
  content: '';
  position: absolute;
  inset: 0 0 auto;
  height: 1px;
  background: var(--bb-linie);
}
.bb-m-fakten__wert {
  margin: 0;
  font-family: var(--bm-font-ziffer);
  font-size: var(--bm-t-display);
  font-weight: var(--bm-g-titel);
  line-height: 1;
  letter-spacing: var(--bm-sp-eng);
  font-variant-numeric: tabular-nums;
  color: var(--bb-text);
  overflow-wrap: anywhere;
}
.bb-m-fakten__label {
  margin: 0.875rem 0 0;
  max-width: 30ch;
  font-size: var(--bm-t-body);
  line-height: var(--bm-zh-mittel);
  color: var(--bb-text-ruhig);
}
@media (max-width: 1023px) {
  .bb-m-fakten__zahlen { grid-template-columns: repeat(min(var(--bb-m-fakten-spalten, 3), 2), minmax(0, 1fr)); }
}
@media (max-width: 639px) {
  .bb-m-fakten__zahlen { grid-template-columns: minmax(0, 1fr); }
}

/* ── liste: Bezeichnung links, Wert rechts, Linien dazwischen ──────────── */
.bb-m-fakten__liste {
  margin: 0;
  max-width: var(--bm-textbreite);
  border-top: 1px solid var(--bb-linie);
}
.bb-m-fakten__zeile {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.25rem 2rem;
  padding-block: 1.125rem;
  border-bottom: 1px solid var(--bb-linie);
}
.bb-m-fakten__bezeichnung {
  font-size: var(--bm-t-body);
  line-height: var(--bm-zh-mittel);
  color: var(--bb-text-ruhig);
}
.bb-m-fakten__eintrag {
  margin: 0 0 0 auto;
  font-size: var(--bm-t-lead);
  line-height: var(--bm-zh-mittel);
  color: var(--bb-text);
  text-align: right;
}