/* ===== Blogübersicht /blog/ (Entwurf A "Kuratiert und Verzeichnis", eingebaut 13.10.2026): Kürzel .bl- =====
   Wird nur auf /blog/ geladen (bau.py bindet quellen/werkzeuge/blog.css und blog.js je Seite ein).
   Oben eine petrolfarbene Fläche mit Seitenkopf, Schnellsuche und Aufmacher, darunter die übrigen Grundlagen als
   Bildkarten. Danach "Alle Beiträge" als Verzeichnis: links der Kern des Titels, daneben die Erläuterung, rechts die
   Rubrik. Suche und Filter stehen als schmale Leiste direkt über dem Verzeichnis; ihre Auswahlfelder öffnen sich erst
   auf Klick. Nur Werte aus qmp.css: Farb-Token, Radien 6px und 12px, Kurve --aus. */

/* Was erst mit JavaScript erscheint, trägt hidden; das schlägt jede display-Regel dieser Seite */
.bl-kopf [hidden], .bl-grundlagen [hidden], .bl-alle [hidden] { display: none !important; }

/* ---------- Seitenkopf: flache Petrolfläche, geht ohne Kante in die Fläche der Grundlagen über ---------- */
.bl-kopf::before { display: none; }
.unterseite .bl-kopf { padding-bottom: clamp(2.5rem, 5vw, 3.5rem); }
.bl-wege { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 2.25rem; margin-top: 2rem; }

/* Schnellsuche: sucht im Verzeichnis und springt dorthin */
.bl-schnell { display: flex; flex: 0 1 27rem; min-width: 0; gap: .5rem; }
.bl-schnell__feld { position: relative; flex: 1 1 auto; min-width: 0; }
.bl-lupe { position: absolute; left: .95rem; top: 50%; transform: translateY(-50%); color: var(--stahl); pointer-events: none; }
.bl-schnell__eingabe { display: block; width: 100%; min-height: 2.75rem; margin: 0; padding: .5rem .9rem .5rem 2.75rem; border: 1px solid var(--weiss); border-radius: 6px; background: var(--weiss); color: var(--ink); font-family: inherit; font-size: 1rem; line-height: 1.4; -webkit-appearance: none; appearance: none; }
.bl-schnell__eingabe::placeholder { color: var(--leise); opacity: 1; }
.bl-schnell__eingabe::-webkit-search-decoration { -webkit-appearance: none; }
.bl-schnell__los { flex: none; min-height: 2.75rem; margin: 0; padding: .5rem 1.1rem; border: 1px solid var(--grau); border-radius: 6px; background: transparent; color: var(--weiss); font-family: inherit; font-size: .9375rem; font-weight: 500; line-height: 1.2; cursor: pointer; transition: background-color .2s var(--aus), border-color .2s var(--aus); }
.bl-schnell__los:hover { border-color: var(--weiss); background: var(--petrol-tief); }
.bl-schnell__pfeil { display: none; }

/* Sprung zum Verzeichnis */
.bl-sprung { display: inline-flex; align-items: center; gap: .55rem; min-height: 2.75rem; color: var(--weiss); font-weight: 500; text-decoration: none; }
.bl-sprung span { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .25em; text-decoration-color: rgba(255, 255, 255, .32); transition: text-decoration-color .25s var(--aus); }
.bl-sprung svg { flex: none; transition: transform .35s var(--aus); }
.bl-sprung:hover span { text-decoration-color: var(--weiss); }
.bl-sprung:hover svg { transform: translateY(3px); }

/* ---------- Überschriften der beiden Abschnitte ---------- */
.unterseite main .bl-h2 { font-size: clamp(1.75rem, 2.8vw, 2.4rem); line-height: 1.1; letter-spacing: -.018em; color: var(--ink); }
.unterseite main .bl-buehne .bl-h2 { color: var(--weiss); padding-top: clamp(2.25rem, 4.5vw, 3.25rem); border-top: 1px solid var(--stahl); }

/* ---------- Fläche mit Aufmacher ---------- */
.bl-buehne { background: var(--petrol); color: rgba(255, 255, 255, .84); padding-bottom: clamp(3.5rem, 7vw, 5.5rem); }
.bl-buehne :focus-visible { outline-color: var(--weiss); }
.bl-aufmacher { position: relative; display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: clamp(2rem, 4vw, 3.5rem); align-items: center; margin-top: clamp(1.75rem, 3vw, 2.5rem); }
.bl-aufmacher__bild { overflow: hidden; border-radius: 12px; background: var(--petrol-tief); }
.bl-aufmacher__bild img, .bl-karte__bild img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; transition: transform .6s var(--aus); }
.bl-aufmacher:hover .bl-aufmacher__bild img { transform: scale(1.03); }
.bl-buehne .marke { color: var(--grau-lesen); }
.bl-buehne .marke::before { background: var(--grau); }
.unterseite main .bl-aufmacher__titel { margin-top: 1rem; font-size: clamp(1.6rem, 2.4vw, 2.1rem); line-height: 1.18; letter-spacing: -.012em; font-weight: 500; color: var(--weiss); }
.bl-aufmacher__titel .bl-kern { display: block; }
.bl-aufmacher__titel .bl-erl { display: block; margin-top: .7rem; font-size: 1.15rem; line-height: 1.45; letter-spacing: 0; font-weight: 400; color: rgba(255, 255, 255, .88); }
.bl-aufmacher__anriss { max-width: 34rem; margin-top: 1.15rem; font-size: 1rem; line-height: 1.6; color: var(--grau-lesen); }
.bl-aufmacher__link { color: inherit; text-decoration: none; }
.bl-aufmacher__link::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: 12px; }
.bl-aufmacher__link:focus-visible { outline: none; }
.bl-aufmacher__link:focus-visible::after { outline: 3px solid var(--weiss); outline-offset: 8px; }
.bl-aufmacher:hover .bl-kern { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .18em; }

/* ---------- Die übrigen Grundlagen ---------- */
.bl-karten { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(2.75rem, 4vw, 3.5rem) clamp(1.5rem, 2.5vw, 2rem); padding-top: clamp(3.5rem, 7vw, 5rem); }
.bl-karte { position: relative; display: flex; flex-direction: column; align-items: flex-start; }
.bl-karte__bild { align-self: stretch; overflow: hidden; border-radius: 12px; background: var(--flaeche); }
.bl-karte:hover .bl-karte__bild img { transform: scale(1.03); }
.bl-karte__rubrik { margin-top: 1.3rem; }
.unterseite main .bl-karte__titel { margin-top: .65rem; font-size: 1.25rem; line-height: 1.3; letter-spacing: 0; font-weight: 500; color: var(--ink); }
.bl-karte__titel .bl-kern { display: block; }
.bl-karte__titel .bl-erl { display: block; margin-top: .45rem; font-size: 1rem; line-height: 1.55; font-weight: 400; color: var(--text); text-wrap: pretty; }
.bl-ganz { white-space: nowrap; }
.bl-karte__link { color: inherit; text-decoration: none; }
.bl-karte__link::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: 12px; }
.bl-karte__link:focus-visible { outline: none; }
.bl-karte__link:focus-visible::after { outline: 3px solid var(--petrol); outline-offset: 8px; }
.bl-karte:hover .bl-kern { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .2em; }

/* ---------- Alle Beiträge ---------- */
.bl-alle { padding: clamp(4.5rem, 9vw, 7rem) 0 clamp(4rem, 8vw, 6.5rem); scroll-margin-top: 1rem; }
.bl-alle .bl-h2 { scroll-margin-top: 1rem; }

/* Filterleiste: Suche und drei Auswahlknöpfe in einer Zeile */
.bl-filter { margin-top: clamp(1.5rem, 3vw, 2rem); }
.bl-leiste { position: relative; z-index: 3; display: flex; flex-wrap: wrap; align-items: stretch; gap: .75rem; }
.bl-suche { position: relative; flex: 1 1 18rem; max-width: 30rem; }
.bl-suche__eingabe { display: block; width: 100%; min-height: 3rem; margin: 0; padding: .65rem 1rem .65rem 2.75rem; border: 1px solid var(--stahl); border-radius: 6px; background: var(--weiss); color: var(--ink); font-family: inherit; font-size: 1rem; line-height: 1.4; -webkit-appearance: none; appearance: none; transition: border-color .2s var(--aus); }
.bl-suche__eingabe:hover { border-color: var(--ink); }
.bl-suche__eingabe:focus-visible { outline: 3px solid var(--petrol); outline-offset: 2px; border-color: var(--petrol); }
.bl-suche__eingabe::placeholder { color: var(--leise); opacity: 1; }
.bl-suche__eingabe::-webkit-search-decoration { -webkit-appearance: none; }
.bl-wahlen { display: flex; flex-wrap: wrap; gap: .5rem; }
.bl-wahl { position: relative; }
.bl-wahl__knopf { display: inline-flex; align-items: center; gap: .5rem; min-height: 3rem; margin: 0; padding: .5rem .9rem .5rem 1rem; border: 1px solid var(--stahl); border-radius: 6px; background: var(--weiss); color: var(--ink); font-family: inherit; font-size: .9375rem; font-weight: 500; line-height: 1.2; cursor: pointer; transition: border-color .2s var(--aus), background-color .2s var(--aus); }
.bl-wahl__knopf:hover { border-color: var(--ink); background: var(--flaeche); }
.bl-wahl__knopf[aria-expanded="true"] { border-color: var(--petrol); background: var(--flaeche); }
.bl-wahl__knopf.bl-gewaehlt { border-color: var(--petrol); }
.bl-wahl__winkel { flex: none; color: var(--stahl); transition: transform .3s var(--aus); }
.bl-wahl__knopf[aria-expanded="true"] .bl-wahl__winkel { transform: rotate(180deg); }
.bl-wahl__anzahl { display: inline-grid; place-items: center; min-width: 1.45rem; height: 1.45rem; padding: 0 .4rem; border-radius: 999px; background: var(--petrol); color: var(--weiss); font-size: .8125rem; font-weight: 600; font-variant-numeric: tabular-nums; }

/* Auswahlfeld unter dem Knopf. Es trägt tabindex="-1": ein Klick auf Text, Zahl oder Innenfläche fokussiert das Feld
   selbst und nicht main, deshalb bleibt es offen */
.bl-wahl__feld { position: absolute; top: calc(100% + .5rem); left: 0; z-index: 4; width: max-content; min-width: 17.5rem; max-width: min(24rem, calc(100vw - 2.5rem)); padding: .85rem .75rem .75rem; border: 1px solid var(--linie); border-radius: 12px; background: var(--weiss); box-shadow: 0 1px 0 var(--linie), 0 30px 60px -40px rgba(15, 23, 42, .45); }
.bl-wahl__feld:focus { outline: none; }
.bl-wahl__feld.bl-rechts { left: auto; right: 0; }
.bl-offen-an { animation: bl-auf .18s var(--aus); }
@keyframes bl-auf { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.bl-wahl__gruppe { min-width: 0; margin: 0; padding: 0; border: 0; }
.bl-wahl__legende { padding: 0 .5rem .45rem; font-size: .875rem; font-weight: 500; line-height: 1.4; color: var(--leise); }
.bl-wahl__liste { display: grid; }
.bl-option { display: flex; align-items: center; gap: .7rem; min-height: 2.5rem; padding: .3rem .5rem; border-radius: 6px; color: var(--ink); font-size: .9375rem; line-height: 1.3; cursor: pointer; }
.bl-option:hover { background: var(--flaeche); }
.bl-option__feld { flex: none; width: 1.1rem; height: 1.1rem; margin: 0; accent-color: var(--petrol); cursor: pointer; }
.bl-option__text { flex: 1 1 auto; }
.bl-option__zahl { padding-left: .75rem; font-size: .875rem; color: var(--leise); font-variant-numeric: tabular-nums; }
.bl-wahl__fertig { display: block; min-height: 2.5rem; margin: .55rem 0 0 auto; padding: .45rem 1rem; border: 0; border-radius: 6px; background: var(--petrol); color: var(--weiss); font-family: inherit; font-size: .9375rem; font-weight: 500; cursor: pointer; transition: background-color .2s var(--aus); }
.bl-wahl__fertig:hover { background: var(--petrol-tief); }

/* Gewählte Angaben als entfernbare Marken */
.bl-marken { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.bl-weg { display: inline-flex; align-items: center; gap: .55rem; min-height: 2.25rem; margin: 0; padding: .3rem .6rem .3rem .8rem; border: 1px solid var(--linie); border-radius: 6px; background: var(--flaeche); color: var(--ink); font-family: inherit; font-size: .9375rem; line-height: 1.2; cursor: pointer; transition: border-color .2s var(--aus); }
.bl-weg:hover { border-color: var(--petrol); }
.bl-weg svg { flex: none; color: var(--petrol); }

/* Trefferzahl und Zurücksetzen über dem Verzeichnis; ohne JavaScript bleibt die Zeile leer und lässt keinen Abstand */
.bl-stand { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .25rem 1.5rem; min-height: 2.75rem; margin-top: clamp(1.5rem, 3vw, 2rem); }
.bl-stand:has(> .bl-stand__text:empty):has(> .bl-stand__zurueck[hidden]) { display: none; }
.bl-stand__text { font-size: 1rem; line-height: 1.5; color: var(--text); }
.bl-stand__text strong { color: var(--ink); font-weight: 600; font-variant-numeric: tabular-nums; }
.bl-stand__seite { color: var(--leise); }
.bl-stand__zurueck { display: inline-flex; align-items: center; min-height: 2.75rem; margin: 0; padding: .4rem 0; border: 0; background: none; color: var(--petrol); font-family: inherit; font-size: .95rem; font-weight: 500; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .22em; cursor: pointer; }
.bl-stand__zurueck:hover { color: var(--ink); }

/* Verzeichnis: Kern | Erläuterung | Rubrik */
.bl-verzeichnis { margin-top: .5rem; border-top: 1px solid var(--ink); }
/* Ohne JavaScript fehlen Filterleiste und Trefferzeile: Abstand zur Überschrift wie sonst über der Leiste */
.bl-alle .huelle:has(> .bl-filter[hidden]) > .bl-verzeichnis { margin-top: clamp(1.5rem, 3vw, 2rem); }
.bl-eintrag { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 10.5rem; column-gap: clamp(1.5rem, 3vw, 2.5rem); align-items: baseline; padding: 1.05rem 0 1.1rem; border-bottom: 1px solid var(--linie); }
.bl-eintrag__link { display: grid; grid-template-columns: minmax(0, 20rem) minmax(0, 1fr); column-gap: clamp(1.5rem, 3vw, 2.5rem); align-items: baseline; color: inherit; text-decoration: none; }
.bl-eintrag__link > .bl-kern:only-child { grid-column: 1 / -1; }
.bl-eintrag__link::after { content: ""; position: absolute; inset: 0; }
.bl-eintrag__link:focus-visible { outline: none; }
.bl-eintrag__link:focus-visible::after { outline: 3px solid var(--petrol); outline-offset: 2px; }
.bl-eintrag .bl-kern { font-size: 1.0625rem; line-height: 1.4; font-weight: 600; color: var(--ink); text-wrap: pretty; transition: color .2s var(--aus); }
.bl-eintrag .bl-erl { font-size: 1rem; line-height: 1.5; color: var(--leise); text-wrap: pretty; }
.bl-eintrag__rubrik { font-size: .875rem; line-height: 1.4; color: var(--stahl); -webkit-hyphens: auto; hyphens: auto; }
.bl-eintrag:hover .bl-kern { color: var(--petrol); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .2em; }
.bl-leer { max-width: 40rem; padding-top: 1.75rem; font-size: 1.0625rem; color: var(--ink); }

/* Seiten des Verzeichnisses (gleiche Adresse, Seite im Fragment) */
.bl-seiten { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin-top: 2.25rem; }
.bl-seiten__liste { display: flex; flex-wrap: wrap; gap: .4rem; }
.bl-seiten__nr { display: inline-grid; place-items: center; min-width: 2.75rem; min-height: 2.75rem; padding: 0 .6rem; border: 1px solid var(--linie); border-radius: 6px; background: var(--weiss); color: var(--ink); font-size: 1rem; font-weight: 500; font-variant-numeric: tabular-nums; text-decoration: none; transition: border-color .2s var(--aus); }
.bl-seiten__nr:hover { border-color: var(--petrol); }
.bl-seiten__nr[aria-current="page"] { border-color: var(--petrol); background: var(--petrol); color: var(--weiss); cursor: default; }
.bl-seiten__schritt { display: inline-flex; align-items: center; gap: .45rem; min-height: 2.75rem; padding: .4rem .25rem; color: var(--petrol); font-size: 1rem; font-weight: 500; text-decoration: none; cursor: pointer; }
.bl-seiten__schritt:hover span { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .22em; }
.bl-seiten__schritt:not([href]) { color: var(--leise); cursor: default; }
.bl-seiten__schritt:not([href]):hover span { text-decoration: none; }

/* ---------- Breiten ---------- */
@media (max-width: 999px) {
  .bl-aufmacher { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 2rem; }
  .bl-karten { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bl-eintrag { grid-template-columns: minmax(0, 1fr); row-gap: .3rem; }
  .bl-eintrag__rubrik { order: -1; }
  .bl-eintrag__link { display: block; }
  .bl-eintrag .bl-kern, .bl-eintrag .bl-erl { display: block; }
  .bl-eintrag .bl-erl { margin-top: .2rem; }
}
@media (max-width: 759px) {
  .bl-schnell { flex-basis: 100%; }
  /* Schmal: Pfeil statt Wort, damit der Platzhalter ganz ins Feld passt; der Name des Knopfes bleibt "Suchen" */
  .bl-schnell__los { display: inline-grid; place-items: center; width: 2.75rem; padding: 0; }
  .bl-schnell__wort { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
  .bl-schnell__pfeil { display: block; }
  .bl-aufmacher { grid-template-columns: minmax(0, 1fr); row-gap: 1.75rem; }
  .bl-aufmacher__anriss { max-width: 40rem; }
  .bl-suche { flex-basis: 100%; max-width: none; }
  .bl-wahlen { flex: 1 1 100%; }
  .bl-wahl { flex: 1 1 auto; }
  .bl-wahl__knopf { position: relative; width: 100%; justify-content: flex-start; padding-left: .85rem; padding-right: .75rem; }
  .bl-wahl__winkel { margin-left: auto; }
  /* Zahl der gewählten Angaben an der Ecke, damit die drei Knöpfe ihre Breite behalten */
  .bl-wahl__anzahl { position: absolute; top: -.6rem; right: -.45rem; box-shadow: 0 0 0 2px var(--weiss); }
  /* Auswahlfelder spannen die ganze Leiste, statt am Knopf zu hängen */
  .bl-wahl { position: static; }
  .bl-wahl__feld, .bl-wahl__feld.bl-rechts { left: 0; right: 0; width: auto; min-width: 0; max-width: none; }
  /* Grundlagen als kompakte Zeilen: kleines Bild links, Titel rechts */
  .bl-karten { grid-template-columns: minmax(0, 1fr); gap: 0; padding-top: clamp(2.5rem, 7vw, 3.5rem); }
  .bl-karte { display: grid; grid-template-columns: 6.5rem minmax(0, 1fr); column-gap: 1rem; align-items: start; padding: 1.15rem 0; border-bottom: 1px solid var(--linie); }
  .bl-karte:first-child { border-top: 1px solid var(--linie); }
  .bl-karte__bild { grid-column: 1; grid-row: 1 / span 2; align-self: start; border-radius: 6px; }
  .bl-karte__rubrik { grid-column: 2; margin-top: 0; }
  .unterseite main .bl-karte__titel { grid-column: 2; margin-top: .4rem; font-size: 1.0625rem; line-height: 1.35; }
  .bl-karte__titel .bl-erl { margin-top: .25rem; font-size: .9375rem; line-height: 1.5; }
  .bl-karte__link::after { border-radius: 0; }
  .bl-karte__link:focus-visible::after { outline-offset: 2px; }
  .bl-aufmacher__link:focus-visible::after { outline-offset: 4px; }
}

/* Steht die letzte Grundlagen-Karte allein in ihrer Reihe, liegt sie quer über die ganze Breite: Bild in Spaltenbreite
   links, Rubrik und Titel daneben. Hängt nicht an der Kartenzahl (zwei Spalten bis 999 px, drei ab 1000 px). */
@media (min-width: 760px) and (max-width: 999px) {
  .bl-karte:last-child:nth-child(odd) { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: auto auto 1fr; column-gap: clamp(1.5rem, 2.5vw, 2rem); }
  .bl-karte:last-child:nth-child(odd) > .bl-karte__bild { grid-column: 1; grid-row: 1 / -1; align-self: start; }
  .bl-karte:last-child:nth-child(odd) > :not(.bl-karte__bild) { grid-column: 2 / -1; }
  .bl-karte:last-child:nth-child(odd) > .bl-karte__rubrik { margin-top: 0; }
}
@media (min-width: 1000px) {
  .bl-karte:last-child:nth-child(3n+1) { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: auto auto 1fr; column-gap: clamp(1.5rem, 2.5vw, 2rem); }
  .bl-karte:last-child:nth-child(3n+1) > .bl-karte__bild { grid-column: 1; grid-row: 1 / -1; align-self: start; }
  .bl-karte:last-child:nth-child(3n+1) > :not(.bl-karte__bild) { grid-column: 2 / -1; }
  .bl-karte:last-child:nth-child(3n+1) > .bl-karte__rubrik { margin-top: 0; }
}

/* Anbindung (Freigabe Christian 13.10.2026): Ab 760 px ragt die erste Kartenreihe in die Petrolfläche, wie das Foto im
   Beitragskopf (.artikel-bild in komponenten.css). So lesen sich Aufmacher und Karten als eine Sammlung unter
   "Grundlagen". Der Abstand zum Aufmacher bleibt, nur vorhandene Farben und Abstände. Schmal bleibt es wie bisher. */
@media (min-width: 760px) {
  .bl-buehne { padding-bottom: calc(clamp(3.5rem, 7vw, 5rem) + clamp(4.5rem, 9vw, 8rem)); }
  .bl-karten { position: relative; padding-top: 0; margin-top: clamp(-8rem, -9vw, -4.5rem); }
}

/* Seiten des Verzeichnisses schmal: Zurück und Weiter nur als Pfeil (der Name bleibt "Zurück" und "Weiter", wie beim
   Pfeilknopf der Schnellsuche), damit die Navigation eine Zeile bleibt. Bei mehr Seiten, als in die Zeile passen,
   brechen nur die Seitenzahlen zwischen den Pfeilen um. */
@media (max-width: 599px) {
  .bl-seiten { display: grid; grid-template-columns: auto minmax(0, max-content) auto; justify-content: start; align-items: start; column-gap: .25rem; }
  .bl-seiten__schritt { justify-content: center; min-width: 2.75rem; padding: 0; }
  .bl-seiten__schritt span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
}
@media (max-width: 359px) {
  .bl-seiten__nr { min-width: 2.5rem; padding: 0 .4rem; }
}

/* Schmal (bis 374 px, auch 320 px und 400 % Zoom): Lupe im Kopffeld entfällt, der Pfeil daneben zeigt die Suche an;
   so bleibt der Platzhalter ganz lesbar. Chromium hält im Suchfeld rechts Platz für den Löschknopf frei, deshalb liegt
   die Grenze nicht bei 359 px (bei 360 px war die 5 von "§ 45" angeschnitten, per Aufnahme geprüft). Die Schrift im
   Feld bleibt 16 px, sonst vergrößert iOS beim Antippen. */
@media (max-width: 374px) {
  .bl-schnell .bl-lupe { display: none; }
  .bl-schnell__eingabe { padding-left: .85rem; padding-right: .6rem; }
  .bl-schnell__eingabe::placeholder { font-size: .9375rem; }
}

/* Erzwungene Farben (Kontrastmodus): Die Petrolfläche der aktuellen Seite entfällt dort; ein kräftiger Rahmen und
   fette Ziffer zeigen sie weiter an */
@media (forced-colors: active) {
  .bl-seiten__nr[aria-current="page"] { border-width: 3px; font-weight: 600; }
}

@media (prefers-reduced-motion: reduce) {
  .bl-aufmacher__bild img, .bl-karte__bild img, .bl-sprung svg, .bl-wahl__winkel { transition: none; }
  .bl-aufmacher:hover .bl-aufmacher__bild img, .bl-karte:hover .bl-karte__bild img { transform: none; }
  .bl-offen-an { animation: none; }
}
@media print {
  .bl-filter, .bl-stand, .bl-seiten, .bl-wege { display: none !important; }
  .bl-buehne { background: none !important; color: #000 !important; }
  .unterseite main .bl-buehne .bl-h2, .unterseite main .bl-aufmacher__titel { color: #000 !important; }
}