/* ---------------------------------------------------------------------------
   AWM Lade – Gestaltung
   Themeunabhängig: alles hängt unter .verz-* und setzt keine Theme-Klassen
   voraus. Keine externe Schrift, kein externes Bild, keine externe Anfrage.
   --------------------------------------------------------------------------- */

:root {
  --verz-grund: #ffffff;
  --verz-flaeche: #f5f8fa;
  --verz-flaeche-2: #eef3f6;
  --verz-linie: #dfe7ec;
  --verz-text: #0e1620;
  --verz-text-leise: #5b6b7a;
  --verz-akzent: #0c6e5c;
  --verz-akzent-hell: #e6f4f0;
  --verz-schnell: #b45309;
  --verz-schnell-hell: #fdf1e3;
  --verz-radius: 12px;
  --verz-radius-s: 8px;
  --verz-schatten: 0 1px 2px rgba(14,22,32,.05), 0 8px 24px -16px rgba(14,22,32,.25);
  --verz-breite: 1180px;
}

@media (prefers-color-scheme: dark) {
  :root {
    --verz-grund: #0e1620;
    --verz-flaeche: #16212d;
    --verz-flaeche-2: #1d2a38;
    --verz-linie: #2a3947;
    --verz-text: #e8eef3;
    --verz-text-leise: #9bacba;
    --verz-akzent: #4bbfa4;
    --verz-akzent-hell: #123029;
    --verz-schnell: #e8a33d;
    --verz-schnell-hell: #33260f;
    --verz-schatten: 0 1px 2px rgba(0,0,0,.4), 0 8px 24px -16px rgba(0,0,0,.8);
  }
}

.verz-main {
  color: var(--verz-text);
  background: var(--verz-grund);
  font-size: clamp(16px, 0.5vw + 15px, 17.5px);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
.verz-main *, .verz-main *::before, .verz-main *::after { box-sizing: border-box; }

.verz-wrap { max-width: var(--verz-breite); margin-inline: auto; padding-inline: clamp(16px, 4vw, 32px); }
.verz-schmal { max-width: 760px; }
.verz-abschnitt { padding-block: clamp(28px, 5vw, 52px); }
.verz-abschnitt + .verz-abschnitt { border-top: 1px solid var(--verz-linie); }

/* --- Typografie ---------------------------------------------------------- */
.verz-main h1, .verz-main h2, .verz-main h3 {
  color: var(--verz-text);
  line-height: 1.18;
  letter-spacing: -0.015em;
  margin: 0 0 .5em;
  text-wrap: balance;
}
.verz-h1 { font-size: clamp(1.9rem, 3.6vw, 3rem); font-weight: 700; }
.verz-h2 { font-size: clamp(1.35rem, 1.8vw, 1.75rem); font-weight: 650; margin-top: 1.8em; }
.verz-h3 { font-size: 1.05rem; font-weight: 620; }
.verz-main p { margin: 0 0 1.1em; }
.verz-lead { font-size: clamp(1.05rem, 1vw + .85rem, 1.3rem); color: var(--verz-text-leise); max-width: 62ch; }
.verz-main a { color: var(--verz-akzent); text-underline-offset: .18em; text-decoration-thickness: 1px; }
.verz-main a:hover { text-decoration-thickness: 2px; }

.verz-auge {
  display: inline-block; font-size: .78rem; font-weight: 600; letter-spacing: .07em;
  text-transform: uppercase; color: var(--verz-akzent); margin-bottom: .5em;
}

/* --- Kopf ---------------------------------------------------------------- */
.verz-kopf { padding-block: clamp(20px, 3vw, 36px) clamp(16px, 2vw, 24px); }
.verz-hero {
  background: linear-gradient(160deg, var(--verz-flaeche) 0%, var(--verz-grund) 70%);
  border-bottom: 1px solid var(--verz-linie);
  padding-block: clamp(36px, 6vw, 72px);
}

/* --- Brotkrumen ---------------------------------------------------------- */
.verz-krumen { font-size: .84rem; color: var(--verz-text-leise); margin-bottom: 1em; }
.verz-krumen a { color: var(--verz-text-leise); text-decoration: none; }
.verz-krumen a:hover { color: var(--verz-akzent); text-decoration: underline; }
.verz-krumen-tr { margin-inline: .5em; opacity: .5; }

/* --- Kennzahlen ---------------------------------------------------------- */
.verz-kpis {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
  gap: 1px; margin: 1.6em 0 0; padding: 0;
  background: var(--verz-linie); border: 1px solid var(--verz-linie);
  border-radius: var(--verz-radius); overflow: hidden;
}
.verz-kpi { background: var(--verz-grund); padding: 14px 16px; margin: 0; }
.verz-kpi dt { font-size: .78rem; color: var(--verz-text-leise); margin: 0 0 2px; }
.verz-kpi dd {
  margin: 0; font-size: clamp(1.25rem, 1.6vw, 1.65rem); font-weight: 680;
  font-variant-numeric: tabular-nums; letter-spacing: -.02em; line-height: 1.2;
}
.verz-kpi dd small { display: block; font-size: .74rem; font-weight: 400; color: var(--verz-text-leise); letter-spacing: 0; }

/* --- Kurzantwort --------------------------------------------------------- */
.verz-antwort {
  background: var(--verz-akzent-hell); border-left: 3px solid var(--verz-akzent);
  border-radius: 0 var(--verz-radius-s) var(--verz-radius-s) 0;
  padding: 14px 18px; font-size: 1.02rem; margin: 0 0 1.6em;
}

/* --- Karte --------------------------------------------------------------- */
.verz-karte-rahmen {
  border: 1px solid var(--verz-linie); border-radius: var(--verz-radius);
  overflow: hidden; background: var(--verz-flaeche); margin: 0 0 1.4em;
}
.verz-karte { display: block; width: 100%; height: auto; }
.verz-karte-grund { fill: var(--verz-flaeche); }
.verz-karte-gitter { stroke: var(--verz-linie); stroke-width: 1; }
/* Amtlicher Gebietsumriss (BKG VG250) – das, was aus der Punktwolke eine
   Karte macht. Gefüllt, damit die Fläche als Fläche lesbar bleibt. */
.verz-gebiet {
  fill: var(--verz-grund); fill-opacity: .92;
  stroke: var(--verz-akzent); stroke-opacity: .55; stroke-width: 1.4;
  stroke-linejoin: round;
}
.verz-punkt--normal { fill: var(--verz-akzent); fill-opacity: .55; }
/* Punktwolken als ein Pfad je Art: "M x y h.01" mit runder Linienkappe ergibt
   einen Punkt. Spart bei der Deutschlandkarte rund 460 KB. */
.verz-spur { fill: none; stroke-linecap: round; }
.verz-spur--normal { stroke: var(--verz-akzent); stroke-opacity: .5; stroke-width: 3; }
.verz-spur--schnell { stroke: var(--verz-schnell); stroke-opacity: .85; stroke-width: 4; }
.verz-punkt--schnell { fill: var(--verz-schnell); fill-opacity: .9; }
.verz-punkt--aktiv { fill: var(--verz-akzent); stroke: var(--verz-grund); stroke-width: 2; }
.verz-punkt-halo { fill: var(--verz-akzent); fill-opacity: .18; }
.verz-karte-massstab { stroke: var(--verz-text-leise); stroke-width: 2; }
.verz-karte-beschriftung { fill: var(--verz-text-leise); font-size: 11px; font-family: inherit; }
.verz-legende {
  display: flex; flex-wrap: wrap; gap: 14px; align-items: center;
  font-size: .82rem; color: var(--verz-text-leise);
  padding: 10px 14px; border-top: 1px solid var(--verz-linie); background: var(--verz-grund);
}
.verz-legende i { width: 9px; height: 9px; border-radius: 50%; display: inline-block; margin-right: 6px; vertical-align: baseline; }
.verz-legende .n { background: var(--verz-akzent); opacity: .6; }
.verz-legende .s { background: var(--verz-schnell); }

/* --- Raster und Kacheln -------------------------------------------------- */
.verz-raster { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 12px; }
.verz-raster--klein { grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }
.verz-kachel {
  display: flex; flex-direction: column; gap: 3px;
  padding: 14px 16px; border: 1px solid var(--verz-linie); border-radius: var(--verz-radius);
  background: var(--verz-grund); text-decoration: none; color: inherit;
  transition: border-color .12s, transform .12s, box-shadow .12s;
}
.verz-kachel:hover { border-color: var(--verz-akzent); transform: translateY(-1px); box-shadow: var(--verz-schatten); }
.verz-kachel-t { font-weight: 620; color: var(--verz-text); }
.verz-kachel-z { font-size: .85rem; color: var(--verz-text-leise); font-variant-numeric: tabular-nums; }

/* --- Linkwolke ----------------------------------------------------------- */
.verz-wolke { display: flex; flex-wrap: wrap; gap: 7px; }
.verz-wolke a {
  display: inline-flex; align-items: baseline; gap: 6px;
  padding: 5px 11px; border: 1px solid var(--verz-linie); border-radius: 999px;
  background: var(--verz-grund); text-decoration: none; color: var(--verz-text); font-size: .9rem;
}
.verz-wolke a:hover { border-color: var(--verz-akzent); color: var(--verz-akzent); }
.verz-wolke a b { font-weight: 600; font-size: .8rem; color: var(--verz-text-leise); font-variant-numeric: tabular-nums; }

/* --- Balken -------------------------------------------------------------- */
.verz-balken { list-style: none; margin: 0; padding: 0; display: grid; gap: 7px; }
.verz-balken li { display: grid; grid-template-columns: minmax(90px, 15em) 1fr auto; gap: 12px; align-items: center; font-size: .92rem; }
.verz-balken-l { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.verz-balken-l a { text-decoration: none; }
.verz-balken-l a:hover { text-decoration: underline; }
.verz-balken-s { background: var(--verz-flaeche-2); border-radius: 999px; height: 8px; overflow: hidden; }
.verz-balken-s i { display: block; height: 100%; background: var(--verz-akzent); border-radius: 999px; }
.verz-balken-n { font-variant-numeric: tabular-nums; color: var(--verz-text-leise); font-size: .86rem; min-width: 4ch; text-align: right; }

/* --- Chips --------------------------------------------------------------- */
.verz-chips { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 1em; padding: 0; }
.verz-chips li {
  font-size: .82rem; padding: 3px 10px; border-radius: 999px;
  background: var(--verz-flaeche-2); color: var(--verz-text-leise);
}

/* --- Stationsliste ------------------------------------------------------- */
.verz-liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.verz-station {
  border: 1px solid var(--verz-linie); border-radius: var(--verz-radius);
  padding: 15px 17px; background: var(--verz-grund);
}
.verz-station[hidden] { display: none; }
.verz-station-kopf { display: flex; gap: 12px; align-items: flex-start; justify-content: space-between; }
.verz-station-t { margin: 0 0 2px; font-size: 1.03rem; font-weight: 640; }
.verz-station-t a { text-decoration: none; }
.verz-station-t a:hover { text-decoration: underline; }
.verz-marke {
  flex: none; font-size: .73rem; font-weight: 600; letter-spacing: .03em;
  padding: 3px 9px; border-radius: 999px; white-space: nowrap;
  background: var(--verz-akzent-hell); color: var(--verz-akzent);
}
.verz-marke--schnell { background: var(--verz-schnell-hell); color: var(--verz-schnell); }
.verz-station-adr { margin: 0 0 .5em; color: var(--verz-text-leise); font-size: .9rem; }
.verz-fakten { list-style: none; display: flex; flex-wrap: wrap; gap: 6px 18px; margin: .4em 0; padding: 0; font-size: .9rem; color: var(--verz-text-leise); }
.verz-fakten b { color: var(--verz-text); font-variant-numeric: tabular-nums; font-weight: 640; }
.verz-station-bez, .verz-station-btr { margin: .3em 0 0; font-size: .85rem; color: var(--verz-text-leise); }
.verz-station-bez span { font-weight: 600; }
.verz-seit { opacity: .75; }

/* --- Filter -------------------------------------------------------------- */
.verz-filter {
  display: flex; flex-wrap: wrap; gap: 8px 22px; align-items: center;
  padding: 12px 14px; margin: 0 0 14px;
  background: var(--verz-flaeche); border: 1px solid var(--verz-linie); border-radius: var(--verz-radius);
}
.verz-filter-gruppe { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.verz-filter-l { font-size: .78rem; font-weight: 600; color: var(--verz-text-leise); margin-right: 2px; }
.verz-f {
  font: inherit; font-size: .85rem; cursor: pointer;
  padding: 4px 11px; border-radius: 999px;
  border: 1px solid var(--verz-linie); background: var(--verz-grund); color: var(--verz-text);
}
.verz-f:hover { border-color: var(--verz-akzent); }
.verz-f.is-an { background: var(--verz-akzent); border-color: var(--verz-akzent); color: #fff; }
.verz-filter-stand { width: 100%; margin: 0; font-size: .82rem; color: var(--verz-text-leise); }

/* --- Suche --------------------------------------------------------------- */
.verz-suche { position: relative; max-width: 560px; margin: 1.6em 0 0; }
.verz-suche input {
  width: 100%; font: inherit; font-size: 1.05rem;
  padding: 14px 18px; border-radius: var(--verz-radius);
  border: 1px solid var(--verz-linie); background: var(--verz-grund); color: var(--verz-text);
  box-shadow: var(--verz-schatten);
}
.verz-suche input:focus { outline: 2px solid var(--verz-akzent); outline-offset: 1px; border-color: transparent; }
.verz-treffer {
  position: absolute; z-index: 20; left: 0; right: 0; top: calc(100% + 6px);
  background: var(--verz-grund); border: 1px solid var(--verz-linie);
  border-radius: var(--verz-radius); box-shadow: var(--verz-schatten);
  list-style: none; margin: 0; padding: 4px; max-height: 340px; overflow: auto;
}
.verz-treffer:empty { display: none; }
.verz-treffer a {
  display: flex; justify-content: space-between; gap: 12px;
  padding: 8px 12px; border-radius: var(--verz-radius-s);
  text-decoration: none; color: var(--verz-text);
}
.verz-treffer a:hover, .verz-treffer .is-aktiv a { background: var(--verz-flaeche-2); }
.verz-treffer small { color: var(--verz-text-leise); font-size: .82rem; }

/* --- FAQ ----------------------------------------------------------------- */
.verz-faq { display: grid; gap: 8px; }
.verz-faq-i { border: 1px solid var(--verz-linie); border-radius: var(--verz-radius); background: var(--verz-grund); }
.verz-faq-i summary { cursor: pointer; padding: 13px 16px; font-weight: 600; list-style: none; }
.verz-faq-i summary::-webkit-details-marker { display: none; }
.verz-faq-i summary::after { content: '+'; float: right; color: var(--verz-akzent); font-weight: 400; font-size: 1.3em; line-height: 1; }
.verz-faq-i[open] summary::after { content: '–'; }
.verz-faq-a { padding: 0 16px 14px; color: var(--verz-text-leise); }
.verz-faq-a p { margin: 0; }

/* --- Zweispalter --------------------------------------------------------- */
.verz-spalten { display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(24px, 3vw, 44px); }
@media (min-width: 940px) { .verz-spalten { grid-template-columns: minmax(0, 1fr) 310px; } }
.verz-kasten {
  border: 1px solid var(--verz-linie); border-radius: var(--verz-radius);
  padding: 16px 18px; background: var(--verz-flaeche); margin-bottom: 14px;
}
.verz-kasten h2, .verz-kasten h3 { font-size: .82rem; text-transform: uppercase; letter-spacing: .06em; color: var(--verz-text-leise); margin: 0 0 .8em; }
.verz-dl { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: 5px 14px; font-size: .92rem; }
.verz-dl dt { color: var(--verz-text-leise); }
.verz-dl dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; font-weight: 600; }
.verz-kasten ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 5px; font-size: .92rem; }

/* --- Tabelle ------------------------------------------------------------- */
.verz-tabelle-huelle { overflow-x: auto; border: 1px solid var(--verz-linie); border-radius: var(--verz-radius); }
.verz-tabelle { width: 100%; border-collapse: collapse; font-size: .92rem; }
.verz-tabelle th, .verz-tabelle td { padding: 9px 14px; text-align: left; border-bottom: 1px solid var(--verz-linie); white-space: nowrap; }
.verz-tabelle th { background: var(--verz-flaeche); font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; color: var(--verz-text-leise); font-weight: 600; }
.verz-tabelle tr:last-child td { border-bottom: 0; }
.verz-tabelle td.z, .verz-tabelle th.z { text-align: right; font-variant-numeric: tabular-nums; }
.verz-tabelle a { text-decoration: none; font-weight: 600; }
.verz-tabelle a:hover { text-decoration: underline; }

/* --- A–Z ----------------------------------------------------------------- */
.verz-az { display: flex; flex-wrap: wrap; gap: 4px; margin: 1em 0 1.6em; }
.verz-az a { display: inline-block; min-width: 30px; text-align: center; padding: 4px 6px; border: 1px solid var(--verz-linie); border-radius: var(--verz-radius-s); text-decoration: none; font-weight: 600; font-size: .88rem; }
.verz-azh { font-size: 1.1rem; margin-top: 1.4em; padding-bottom: .3em; border-bottom: 2px solid var(--verz-akzent); }

/* --- Fußnoten ------------------------------------------------------------ */
.verz-quelle, .verz-hinweis {
  font-size: .84rem; color: var(--verz-text-leise); line-height: 1.55;
  border-top: 1px solid var(--verz-linie); padding-top: 12px; margin-top: 2em;
}
.verz-hinweis { border: 0; padding-top: 0; margin-top: .6em; }
/* --- Fußbereich ---------------------------------------------------------- */
.verz-fuss {
  background: var(--verz-flaeche); border-top: 1px solid var(--verz-linie);
  color: var(--verz-text); padding-block: clamp(28px, 4vw, 44px) 20px; margin-top: 40px;
  font-size: clamp(15px, 0.4vw + 14px, 16px); line-height: 1.6;
}
.verz-fuss-raster {
  display: grid; gap: 28px;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
}
.verz-fuss-marke b { display: block; font-size: 1.05rem; margin-bottom: .4em; color: var(--verz-text); }
.verz-fuss-marke p { margin: 0; color: var(--verz-text-leise); font-size: .88rem; max-width: 34ch; }
.verz-fuss-spalte { display: flex; flex-direction: column; gap: 6px; }
.verz-fuss-h {
  font-size: .78rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  color: var(--verz-text-leise); margin-bottom: 4px;
}
.verz-fuss-spalte a { color: var(--verz-text); text-decoration: none; font-size: .92rem; }
.verz-fuss-spalte a:hover { color: var(--verz-akzent); text-decoration: underline; }
.verz-fuss-zeile {
  margin: 26px 0 0; padding-top: 14px; border-top: 1px solid var(--verz-linie);
  font-size: .8rem; color: var(--verz-text-leise);
}
/* Der Theme-Fuß würde darunter ein zweites Mal dasselbe sagen. */
.site-info { display: none; }
.verz-mehr { display: inline-block; font-weight: 600; text-decoration: none; margin-top: .6em; }
.verz-mehr:hover { text-decoration: underline; }
.verz-leer { color: var(--verz-text-leise); font-style: italic; }
