/*
 * Ansichten „anforderungen“, „hilfe“ und „info“ (js/views/info.js)
 * Wurzelklassen: .v-info-bereich (gemeinsam), .v-anf, .v-hilfe, .v-info
 */

/* =====================================================================
 * Gemeinsam
 * ===================================================================== */
.v-info-bereich .page-head { margin-bottom: 0; border-bottom: 0; padding-bottom: var(--s5); }
.v-info-bereich .page-head .btn-group { align-self: flex-end; }
.v-info-bereich h2[tabindex='-1']:focus, .v-info-bereich li[tabindex='-1']:focus { outline: none; }
.v-info-bereich h2[tabindex='-1']:focus-visible { outline: 3px solid var(--focus); outline-offset: 4px; }

/* Bereichsnavigation (Info-Seiten) */
.info-nav { position: relative; }
.info-tabs {
  display: flex; flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden;
  box-shadow: inset 0 -2px 0 var(--of-border); scrollbar-width: none;
}
.info-tabs::-webkit-scrollbar { display: none; }
.info-tabs .tab { flex: 0 0 auto; white-space: nowrap; margin-bottom: 0; padding: 12px 16px; }
.info-tabs .tab:first-child { padding-left: 0; }
.info-tabs .tab:first-child:hover { padding-left: 16px; }
.info-tabs .tab:focus-visible { outline-offset: -3px; }
@media (max-width: 1000px) {
  /* Hinweis, dass die Leiste seitlich weitergeht */
  .info-tabs { padding-right: 40px; -webkit-mask-image: linear-gradient(90deg, var(--of-text) calc(100% - 48px), transparent); mask-image: linear-gradient(90deg, var(--of-text) calc(100% - 48px), transparent); }
}

/* Kreispfeil-Link in Listen und Karten */
.info-link {
  display: inline-flex; align-items: flex-start; gap: 8px; max-width: 100%;
  color: var(--of-text); text-decoration: none; font-weight: var(--fw-bold); font-size: var(--fs-sm); line-height: 1.3;
}
.info-link .icon { width: 22px; height: 22px; flex: 0 0 22px; margin-top: -2px; color: var(--of-navy); transition: transform .15s var(--ease); }
.info-link:hover { color: var(--of-navy); }
.info-link:hover .info-link__text { text-decoration: underline; text-underline-offset: 3px; }
.info-link:hover .icon { transform: translateX(2px); }
.info-link__text { min-width: 0; overflow-wrap: anywhere; }
.info-link__rolle { display: block; margin-top: 1px; font-size: var(--fs-xs); font-weight: var(--fw-regular); color: var(--of-muted); }

/* Beispiel-Suche mit Trefferzahl */
.bsp-link {
  display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; max-width: 100%;
  min-height: 40px; padding: 6px 12px; background: var(--white); border: 1.5px solid var(--of-border-strong);
  color: var(--of-text); text-decoration: none; font-size: var(--fs-sm); line-height: 1.3;
}
.bsp-link code, .hilfe-code {
  font-family: ui-monospace, 'SFMono-Regular', Menlo, Consolas, 'Liberation Mono', monospace;
  font-size: .94em; font-weight: var(--fw-bold); color: var(--of-navy); overflow-wrap: anywhere;
}
.bsp-link__n { color: var(--of-muted); font-size: var(--fs-xs); font-weight: var(--fw-medium); }
.bsp-link:hover { border-color: var(--of-navy); background: var(--of-sky-tint); color: var(--of-text); }
.bsp-liste { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; }
.bsp-hinweis { font-size: var(--fs-xs); color: var(--of-muted); }

/* Kurzer Hervorhebungs-Effekt nach einem Sprung */
@keyframes info-ziel { from { box-shadow: 0 0 0 4px var(--eko-gelb); } to { box-shadow: 0 0 0 4px transparent; } }
.v-info-bereich .ist-ziel { animation: info-ziel 1.8s var(--ease) 1; }

/* Aktuelle Rolle (Abgleich, Drehbuch) */
.info-rolle {
  display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; align-items: center; gap: var(--s2) var(--s3);
  margin: 0 0 var(--s5); padding: 12px var(--s4); background: var(--white);
  border: 1px solid var(--of-border); border-left: 5px solid var(--of-sky);
}
.info-rolle:focus { outline: none; }
.info-rolle:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.info-rolle__icon { width: 24px; height: 24px; color: var(--of-navy); align-self: start; }
.info-rolle__text { min-width: 0; margin: 0; font-size: var(--fs-sm); line-height: 1.45; }
.info-rolle__label { font-size: var(--fs-xs); font-weight: var(--fw-bold); letter-spacing: .12em; text-transform: uppercase; color: var(--of-muted); margin-right: 4px; }
.info-rolle__erkl { display: block; margin-top: 2px; color: var(--of-text-2); }
@media (max-width: 640px) {
  .info-rolle { grid-template-columns: 24px minmax(0, 1fr); padding: 12px; }
  .info-rolle__knopf { grid-column: 2; justify-self: start; }
}

/* =====================================================================
 * Anforderungsabgleich (.v-anf)
 * ===================================================================== */
.anf-druckkopf { display: none; }

/* Status-Symbol (Harvey Ball): voll = gezeigt, halb = teilweise, leer = Anbieter */
.anf-ball {
  display: inline-block; flex: 0 0 14px; width: 14px; height: 14px; border-radius: 50%;
  border: 2px solid currentColor; vertical-align: -2px;
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
}
.anf-ball--gezeigt { color: var(--ok); background: var(--ok); }
.anf-ball--teilweise { color: var(--warn-text); background: linear-gradient(90deg, var(--eko-gelb) 50%, var(--white) 50%); }
.anf-ball--anbieter { color: var(--of-navy); background: var(--white); }

.anf-status {
  display: inline-flex; align-items: center; gap: 8px; padding: 4px 10px 4px 8px;
  font-size: var(--fs-xs); font-weight: var(--fw-bold); line-height: 1.25;
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
}
.anf-status--gezeigt { background: var(--ok-tint); color: var(--ok); }
.anf-status--teilweise { background: var(--warn-tint); color: var(--warn-text); }
.anf-status--anbieter { background: var(--of-section); color: var(--of-navy); }

/* Einleitung */
.v-anf .anf-intro { padding-top: var(--s6); }
.anf-intro__raster { display: grid; gap: var(--s6); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 980px) { .anf-intro__raster { grid-template-columns: minmax(0, 1fr) 400px; align-items: start; } }
.anf-intro h2 { font-size: var(--fs-xl); }
.anf-punkte { list-style: none; margin: 0; padding: 0; max-width: 68ch; }
.anf-punkte li { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: var(--s3); margin: 0 0 var(--s4); }
.anf-punkte .icon { width: 26px; height: 26px; color: var(--of-navy); margin-top: 1px; }
.anf-legende h3 { font-size: var(--fs-md); margin-bottom: var(--s3); }
.anf-legende dl { margin: 0; }
.anf-legende dl > div + div { margin-top: var(--s3); padding-top: var(--s3); border-top: 1px solid var(--of-border); }
.anf-legende dt { display: flex; align-items: center; gap: 10px; font-weight: var(--fw-bold); }
.anf-legende dd { margin: 4px 0 0 24px; font-size: var(--fs-sm); color: var(--of-text-2); }

/* Auf einen Blick */
.anf-ueberblick h2 { font-size: var(--fs-xl); margin-bottom: var(--s5); }
.anf-kpis { display: grid; gap: var(--s4); grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); }
.anf-kpi .kpi__value { font-variant-numeric: normal; }
.anf-kpi__werte { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; }
.anf-kpi__anteil { font-size: var(--fs-md); font-weight: var(--fw-bold); color: var(--of-text-2); }
.anf-kpi .kpi__label { display: flex; align-items: center; gap: 8px; margin-top: 8px; }
@media (max-width: 600px) {
  .anf-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .anf-kpi { padding: var(--s4); }
  .anf-kpi .kpi__label { align-items: flex-start; font-size: var(--fs-xs); }
  .anf-kpi .kpi__label .anf-ball { margin-top: 1px; }
  .anf-kpi__anteil { font-size: var(--fs-sm); }
}
.anf-kpi--gezeigt { border-top-color: var(--ok); }
.anf-kpi--teilweise { border-top-color: var(--eko-gelb); }
.anf-kpi--anbieter { border-top-color: var(--of-navy); }

/* Verteilung als segmentierter Balken (2 px Fläche zwischen den Teilen) */
.anf-verteilung { display: flex; gap: 2px; height: 10px; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.anf-verteilung__teil { flex-basis: 0; min-width: 3px; }
.anf-verteilung__teil--gezeigt { background: var(--ok); }
.anf-verteilung__teil--teilweise { background: var(--eko-gelb); }
.anf-verteilung__teil--anbieter { background: var(--of-navy); }
.anf-verteilung--gross { margin-top: var(--s5); }
.anf-verteilung--mini { flex: 0 0 88px; width: 88px; height: 6px; }

/* Schnellzugriffe (Kacheln wie auf offenbach.de) */
.anf-schnell { display: grid; gap: 10px; margin-top: var(--s6); grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); }
.anf-schnell__knopf {
  display: flex; align-items: center; gap: var(--s3); min-height: 72px; padding: 14px 18px;
  background: var(--of-sky); color: var(--of-text); border: 0; text-align: left; text-decoration: none;
  font-size: var(--fs-sm); line-height: 1.35; transition: background .15s var(--ease);
}
.anf-schnell__knopf > span { flex: 1; min-width: 0; }
.anf-schnell__knopf strong { display: block; font-size: var(--fs-md); }
.anf-schnell__knopf .icon { width: 28px; height: 28px; flex: 0 0 28px; }
.anf-schnell__knopf:hover { background: var(--of-sky-hover); color: var(--of-text); }
.anf-schnell__knopf:hover .icon:last-child { transform: translateX(3px); }
.anf-schnell__knopf .icon:last-child { transition: transform .15s var(--ease); }

/* Liste: Kopf und Werkzeuge */
.anf-liste__kopf { margin-bottom: var(--s5); }
.anf-liste__kopf h2 { margin-bottom: var(--s2); }
.anf-werkzeuge {
  display: grid; gap: var(--s4) var(--s6); grid-template-columns: minmax(0, 1fr);
  padding: var(--s5); margin-bottom: var(--s5); background: var(--of-section);
}
@media (min-width: 1200px) {
  .anf-werkzeuge { grid-template-columns: minmax(240px, 1fr) auto; align-items: end; }
  .anf-werkzeuge__fuss { grid-column: 1 / -1; }
  .anf-chips { flex-wrap: nowrap; }
}
.anf-werkzeuge .input { background: var(--white); }
.anf-werkzeuge .field__label { display: block; margin-bottom: 6px; }
.anf-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.anf-chip {
  display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 6px 8px 6px 12px;
  background: var(--white); color: var(--of-text); border: 2px solid var(--of-border-strong);
  font-size: var(--fs-sm); font-weight: var(--fw-medium); line-height: 1.2; text-align: left;
}
.anf-chip:hover { border-color: var(--of-navy); }
.anf-chip[aria-pressed='true'] { background: var(--of-navy); border-color: var(--of-navy); color: var(--white); }
.anf-chip[aria-pressed='true'] .anf-ball { box-shadow: 0 0 0 2px var(--white); }
/* Zähler: einheitliche Pille (.count); auf der gedrückten (Navy-)Fläche hell */
.anf-chip[aria-pressed='true'] .count { background: var(--white); color: var(--of-navy); }
.anf-werkzeuge__fuss { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s3) var(--s5); }
.anf-treffer { margin: 0; font-weight: var(--fw-bold); }
.anf-werkzeuge__knoepfe { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s3) var(--s5); }
.anf-werkzeuge__knoepfe .btn-link .icon { width: 18px; height: 18px; }
.anf-werkzeuge__knoepfe .btn { background: var(--white); }
.anf-werkzeuge__knoepfe .btn:hover { background: var(--of-sky-tint); }

/* Kapitel-Trenner */
.anf-kapitel {
  margin: var(--s6) 0 var(--s3); font-size: var(--fs-xs); font-weight: var(--fw-bold);
  letter-spacing: .14em; text-transform: uppercase; color: var(--of-muted);
}
.anf-ergebnisse > .anf-kapitel:first-child { margin-top: 0; }

/* Aufklappbare Abschnitte */
.anf-gruppe { border: 1px solid var(--of-border); background: var(--white); margin-bottom: 8px; scroll-margin-top: 16px; }
.anf-gruppe.ist-offen { border-color: var(--of-border-strong); }
.anf-gruppe__kopf { margin: 0; font-size: inherit; line-height: inherit; letter-spacing: 0; }
.anf-gruppe__knopf {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; gap: var(--s4);
  width: 100%; min-height: 64px; padding: 12px var(--s4); background: var(--white); color: var(--of-text);
  border: 0; text-align: left; font: inherit;
}
.anf-gruppe__knopf:hover { background: var(--of-sky-tint); }
.anf-gruppe.ist-offen .anf-gruppe__knopf { background: var(--of-sky-tint); border-bottom: 1px solid var(--of-border); }
.anf-gruppe__knopf:focus-visible { outline-offset: -3px; }
.anf-gruppe__nr {
  display: inline-grid; place-items: center; min-width: 52px; height: 40px; padding: 0 8px;
  background: var(--of-navy); color: var(--white); font-size: var(--fs-md); font-weight: var(--fw-black); font-variant-numeric: tabular-nums;
}
.anf-gruppe--abnahme .anf-gruppe__nr { background: var(--ok); }
.anf-gruppe__titel { font-size: var(--fs-md); font-weight: var(--fw-bold); line-height: 1.3; }
.anf-gruppe__marke {
  display: inline-block; margin-left: 10px; padding: 2px 8px; vertical-align: 2px;
  background: var(--ok-tint); color: var(--ok); font-size: var(--fs-xxs); letter-spacing: .12em; text-transform: uppercase;
}
.anf-gruppe__meta { display: flex; align-items: center; gap: var(--s3); font-size: var(--fs-sm); color: var(--of-text-2); white-space: nowrap; }
.anf-gruppe__anzahl { min-width: 8.6rem; font-variant-numeric: tabular-nums; }
.anf-gruppe__chevron { width: 24px; height: 24px; color: var(--of-navy); transition: transform .15s var(--ease); }
.anf-gruppe__knopf[aria-expanded='true'] .anf-gruppe__chevron { transform: rotate(180deg); }
.anf-gruppe__inhalt { padding: var(--s2) var(--s4) var(--s4); }
@media (max-width: 720px) {
  /* Titel über die volle Breite, Zähler und Pfeil darunter – lange Wörter brauchen Platz */
  .anf-gruppe__knopf { grid-template-columns: auto minmax(0, 1fr) auto; gap: 6px var(--s3); padding: 12px; }
  .anf-gruppe__nr { grid-row: 1 / span 2; align-self: start; }
  .anf-gruppe__titel { grid-column: 2 / 4; grid-row: 1; }
  .anf-gruppe__meta { grid-column: 2; grid-row: 2; flex-wrap: wrap; gap: 4px var(--s3); white-space: normal; }
  .anf-gruppe__anzahl { min-width: 0; white-space: nowrap; }
  .anf-gruppe__chevron { grid-column: 3; grid-row: 2; }
  .anf-gruppe__nr { min-width: 46px; height: 36px; font-size: var(--fs-base); }
  .anf-gruppe__titel { font-size: var(--fs-base); }
  .anf-gruppe__inhalt { padding: var(--s2) 12px var(--s3); }
}

/* Zwischenüberschriften und Zeilen */
.anf-teil {
  margin: var(--s5) 0 0; padding-bottom: var(--s2); font-size: var(--fs-xs); font-weight: var(--fw-bold);
  letter-spacing: .14em; text-transform: uppercase; color: var(--of-link);
}
.anf-gruppe__inhalt > .anf-teil:first-child, .anf-abnahme__liste > .anf-teil:first-of-type { margin-top: var(--s3); }
.anf-zeilen { list-style: none; margin: 0; padding: 0; }
.anf-zeile {
  display: grid; grid-template-columns: 4.5rem minmax(0, 1fr); gap: var(--s2) var(--s4);
  margin: 0; padding: var(--s4) 0; border-top: 1px solid var(--of-border); scroll-margin-top: 96px;
}
.anf-zeilen > .anf-zeile:first-child { border-top-color: var(--of-border-strong); }
.anf-gruppe__inhalt > .anf-zeilen:first-child > .anf-zeile:first-child { border-top: 0; }
.anf-zeile__nr { font-size: var(--fs-sm); font-weight: var(--fw-bold); color: var(--of-muted); font-variant-numeric: tabular-nums; padding-top: 1px; }
.anf-zeile__haupt { min-width: 0; }
.anf-zeile__text { margin: 0; font-weight: var(--fw-medium); line-height: 1.4; }
.anf-zeile__info { margin: 4px 0 0; font-size: var(--fs-sm); color: var(--of-text-2); }
.anf-zeile__seite { grid-column: 2; display: flex; flex-wrap: wrap; align-items: flex-start; gap: var(--s2) var(--s4); min-width: 0; }
.anf-zeile__links { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.anf-zeile__links li { margin: 0; }
@media (min-width: 900px) {
  .anf-zeile { grid-template-columns: 4.5rem minmax(0, 1fr) 16.5rem; }
  .anf-zeile__seite { grid-column: 3; flex-direction: column; flex-wrap: nowrap; }
}
@media (max-width: 520px) {
  .anf-zeile { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .anf-zeile__seite { grid-column: 1; margin-top: 4px; }
  .anf-zeile__nr { padding-top: 0; }
}
.anf-tags { list-style: none; margin: var(--s3) 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.anf-tags li { margin: 0; }
.anf-tags .tag { gap: 8px; font-size: var(--fs-xs); min-height: 30px; }
.anf-frage-link {
  display: inline-flex; align-items: flex-start; gap: 8px; padding: 0; background: none; border: 0;
  color: var(--of-link); font-size: var(--fs-sm); font-weight: var(--fw-bold); line-height: 1.3; text-align: left;
}
.anf-frage-link .icon { width: 22px; height: 22px; flex: 0 0 22px; margin-top: -2px; }
.anf-frage-link:hover { color: var(--of-navy); text-decoration: underline; text-underline-offset: 3px; }
.v-anf mark { padding: 0 1px; }
.anf-leer { margin-top: var(--s2); }

/* Abnahmekriterien als Checkliste */
.anf-abnahme__kopf {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s3) var(--s5);
  margin: var(--s2) 0 var(--s3); padding: var(--s4); background: var(--ok-tint);
}
.anf-abnahme__kopf p { margin: 0; max-width: 62ch; font-size: var(--fs-sm); }
.anf-abnahme__stand { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2) var(--s3); font-size: var(--fs-sm); font-weight: var(--fw-bold); }
.anf-meter { display: inline-block; width: 120px; height: 8px; background: var(--white); -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.anf-meter__wert { display: block; height: 100%; background: var(--ok); transition: width .2s var(--ease); }
.anf-abnahme__liste { margin: 0; }
.anf-zeile--check { grid-template-columns: minmax(0, 1fr); }
.anf-zeile--check .anf-zeile__seite { grid-column: 1; padding-left: 32px; }
.anf-zeile--check .anf-zeile__info { padding-left: 32px; }
.anf-check { padding: 0; font-weight: var(--fw-medium); line-height: 1.4; }
.anf-check .anf-zeile__nr { margin-right: 6px; }
.anf-zeile--check.ist-erledigt .check__label { color: var(--ok); }
@media (min-width: 900px) {
  .anf-zeile--check { grid-template-columns: minmax(0, 1fr) 16.5rem; }
  .anf-zeile--check .anf-zeile__seite { grid-column: 2; padding-left: 0; }
}

/* Offene Fragen */
.anf-fragen__kopf { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--s4) var(--s6); margin-bottom: var(--s6); }
.anf-fragen__kopf .lead { margin-bottom: 0; }
.anf-fragen__raster { display: grid; gap: var(--s6) var(--s7); grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); align-items: start; }
.anf-fragen__gruppe h3 { margin: 0; padding-bottom: var(--s3); border-bottom: 3px solid var(--of-navy); font-size: var(--fs-lg); }
.anf-fragen__unter { display: block; margin-top: 4px; font-size: var(--fs-sm); font-weight: var(--fw-regular); color: var(--of-text-2); letter-spacing: 0; }
.anf-fragen__liste { list-style: none; margin: 0; padding: 0; }
.anf-frage {
  display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: var(--s3);
  margin: 0; padding: var(--s4) 0; border-bottom: 1px solid var(--of-border-strong); scroll-margin-top: 24px;
}
.anf-frage__nr {
  display: inline-grid; place-items: center; width: 44px; height: 32px;
  background: var(--of-navy); color: var(--white); font-size: var(--fs-sm); font-weight: var(--fw-bold);
}
.anf-frage__inhalt { min-width: 0; }
.anf-frage__titel { margin: 0 0 4px; font-weight: var(--fw-bold); line-height: 1.35; }
.anf-frage__text { margin: 0 0 var(--s2); font-size: var(--fs-sm); color: var(--of-text-2); }
.anf-frage__bezug { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0; }
.anf-frage__bezug-label { font-size: var(--fs-xxs); font-weight: var(--fw-bold); letter-spacing: .12em; text-transform: uppercase; color: var(--of-muted); margin-right: 2px; }
.anf-bezug {
  min-width: 40px; min-height: 30px; padding: 2px 8px; background: var(--white); color: var(--of-navy);
  border: 1.5px solid var(--of-border-strong); font-size: var(--fs-xs); font-weight: var(--fw-bold); font-variant-numeric: tabular-nums;
}
.anf-bezug:hover { border-color: var(--of-navy); background: var(--of-sky-tint); }

/* Grundlage */
.anf-grundlage h2 { font-size: var(--fs-md); margin-bottom: var(--s2); }
.anf-grundlage p { max-width: 90ch; font-size: var(--fs-sm); color: var(--of-text-2); }

/* =====================================================================
 * Hilfe (.v-hilfe)
 * ===================================================================== */
.hilfe-sprung .tiles { list-style: none; margin: 0; padding: 0; gap: 8px; }
.hilfe-sprung li { margin: 0; }
.hilfe-sprung .tile { min-height: 44px; padding: 8px 16px 8px 12px; border: 0; font-size: var(--fs-sm); font-weight: var(--fw-bold); }
.hilfe-sprung .tile .icon { width: 18px; height: 18px; }

.hilfe-probe {
  display: grid; gap: var(--s3) var(--s6); grid-template-columns: minmax(0, 1fr); margin-top: var(--s5);
  padding: var(--s5); background: var(--of-navy); color: var(--white);
}
@media (min-width: 980px) { .hilfe-probe { grid-template-columns: minmax(0, 300px) minmax(0, 1fr); align-items: center; } .hilfe-probe__beispiele { grid-column: 2; } }
.hilfe-probe h2 { color: var(--white); font-size: var(--fs-xl); margin-bottom: var(--s2); }
.hilfe-probe__text p { margin: 0; color: var(--of-sky-tint); font-size: var(--fs-sm); }
.hilfe-probe .searchbar { max-width: none; }
.hilfe-probe .searchbar__btn { background: var(--of-sky); color: var(--of-text); }
.hilfe-probe .searchbar__btn:hover { background: var(--of-sky-hover); }
.hilfe-probe__beispiele { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin: 0; font-size: var(--fs-sm); }
.hilfe-probe__beispiele span { color: var(--of-sky-tint); }
.hilfe-probe__beispiele a { color: var(--white); font-family: ui-monospace, 'SFMono-Regular', Menlo, Consolas, 'Liberation Mono', monospace; overflow-wrap: anywhere; }

.hilfe-karten { display: grid; gap: var(--s5); grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); margin-bottom: var(--s6); }
.hilfe-karte {
  display: flex; flex-direction: column; gap: var(--s3); padding: var(--s5);
  background: var(--white); border-top: 4px solid var(--of-sky); box-shadow: var(--shadow-1);
}
.hilfe-karte h3 { display: flex; align-items: center; gap: 10px; margin: 0; font-size: var(--fs-lg); }
.hilfe-karte h3 .icon { width: 26px; height: 26px; color: var(--of-navy); }
.hilfe-karte > p { margin: 0; font-size: var(--fs-sm); color: var(--of-text-2); }
.hilfe-karte .bsp-liste { margin-top: auto; }
.hilfe-synonyme { list-style: none; margin: auto 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.hilfe-synonyme li { margin: 0; }

.hilfe-tabelle { background: var(--white); }
.hilfe-tabelle th[scope='row'] { font-weight: var(--fw-regular); width: 55%; }
.hilfe-tabelle .hilfe-code { display: inline-block; min-width: 9.5em; margin-right: var(--s3); font-size: var(--fs-sm); }
.hilfe-tabelle__was { color: var(--of-text-2); }
@media (max-width: 640px) {
  .hilfe-tabelle thead { display: none; }
  .hilfe-tabelle tr { display: block; padding: 10px 0; border-bottom: 1px solid var(--of-border); }
  .hilfe-tabelle th[scope='row'], .hilfe-tabelle td { display: block; width: auto; padding: 4px 12px; border: 0; }
  .hilfe-tabelle .hilfe-code { display: block; min-width: 0; }
}

.hilfe-schritte { display: grid; gap: var(--s5); grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); margin-bottom: var(--s6); }
.hilfe-schritt { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: var(--s3); }
.hilfe-schritt__nr {
  display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
  background: var(--of-sky); color: var(--of-text); font-weight: var(--fw-black); font-size: var(--fs-lg);
}
.hilfe-schritt h3 { font-size: var(--fs-md); margin: 8px 0 4px; }
.hilfe-schritt p { margin: 0; font-size: var(--fs-sm); color: var(--of-text-2); }
.hilfe-beispiel { padding: var(--s5); background: var(--of-section); margin-bottom: var(--s5); }
.hilfe-beispiel__titel { margin: 0 0 var(--s3); font-size: var(--fs-xs); font-weight: var(--fw-bold); letter-spacing: .14em; text-transform: uppercase; color: var(--of-muted); }
.hilfe-beispiel > p:last-child { margin: var(--s4) 0 0; }
.hilfe-mock { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: var(--s4); background: var(--white); border: 2px dashed var(--of-border-strong); }
.hilfe-mock .chip { padding-right: 10px; cursor: default; }
.hilfe-mock .chip:hover { background: var(--of-navy); }
.hilfe-mock__label { font-size: var(--fs-sm); font-weight: var(--fw-bold); }
.hilfe-mock__link { font-size: var(--fs-sm); color: var(--of-link); text-decoration: underline; text-underline-offset: 3px; }
.hilfe-facetten { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px var(--s3); margin: 0; font-size: var(--fs-sm); color: var(--of-text-2); }
.hilfe-facetten .label-caps { font-size: var(--fs-xs); color: var(--of-muted); }
.v-hilfe .hilfe-unter { margin-top: var(--s7); }
.hilfe-sortierung { list-style: none; margin: var(--s4) 0 0; padding: 0; border-top: 1px solid var(--of-border-strong); }
.hilfe-sortierung li {
  display: grid; grid-template-columns: minmax(0, 19rem) minmax(0, 1fr) auto; align-items: baseline; gap: var(--s2) var(--s5);
  margin: 0; padding: 12px 0; border-bottom: 1px solid var(--of-border);
}
.hilfe-sortierung span { color: var(--of-text-2); font-size: var(--fs-sm); }
@media (max-width: 720px) { .hilfe-sortierung li { grid-template-columns: minmax(0, 1fr); } }

.hilfe-faq__raster { display: grid; gap: var(--s5) var(--s7); grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); align-items: start; }
.hilfe-faq__gruppe h3 { font-size: var(--fs-lg); margin: var(--s6) 0 var(--s3); }
.hilfe-faq__gruppe h3:first-child { margin-top: 0; }
.faq { background: var(--white); border-top: 1px solid var(--of-border-strong); }
.faq:last-of-type { border-bottom: 1px solid var(--of-border-strong); }
.faq > summary {
  display: flex; align-items: center; justify-content: space-between; gap: var(--s3);
  min-height: 56px; padding: 12px var(--s4); cursor: pointer; list-style: none;
  font-weight: var(--fw-bold); line-height: 1.35;
}
.faq > summary::-webkit-details-marker { display: none; }
.faq > summary:hover { background: var(--of-sky-tint); }
.faq > summary:focus-visible { outline-offset: -3px; }
.faq > summary .icon { flex: 0 0 22px; width: 22px; height: 22px; color: var(--of-navy); transition: transform .15s var(--ease); }
.faq[open] > summary .icon { transform: rotate(180deg); }
.faq[open] > summary { background: var(--of-sky-tint); }
.faq__antwort { padding: var(--s3) var(--s4) var(--s4); font-size: var(--fs-sm); }
.faq__antwort > :last-child { margin-bottom: 0; }
.faq__links { display: flex; flex-wrap: wrap; gap: var(--s2) var(--s5); }
.hilfe-dl { margin: 0 0 var(--s4); }
.hilfe-dl > div { padding: 8px 0; border-bottom: 1px solid var(--of-border); }
.hilfe-dl > div:first-child { padding-top: 0; }
.hilfe-dl dt { font-weight: var(--fw-bold); }
.hilfe-dl dd { margin: 2px 0 0; color: var(--of-text-2); }
.hilfe-dl--badges > div { display: grid; grid-template-columns: 8.5rem minmax(0, 1fr); gap: var(--s3); align-items: center; }
.hilfe-dl--badges dd { margin: 0; }
.hilfe-tasten { margin: var(--s2) 0 0; }
.v-hilfe kbd {
  display: inline-block; min-width: 1.9em; padding: 1px 6px; margin: 1px 0;
  background: var(--white); border: 1.5px solid var(--of-border-strong); border-bottom-width: 3px;
  font-family: inherit; font-size: .9em; font-weight: var(--fw-bold); text-align: center; line-height: 1.4;
}
.hilfe-kontakt__raster { display: grid; gap: var(--s5); grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); align-items: start; }
.hilfe-kontakt__raster h3 { font-size: var(--fs-lg); }
/* Beispiel eines Vormerkstatus (Wortlaut aus dem Kern) */
.hilfe-status { padding: 10px 14px; background: var(--of-sky-tint); border-left: 4px solid var(--of-sky); }

/* =====================================================================
 * Info-Seiten (.v-info)
 * ===================================================================== */
.info-zweck { display: grid; gap: var(--s5) var(--s6); grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); }
.info-zweck__punkt { padding-top: var(--s4); border-top: 4px solid var(--of-sky); }
.info-zweck__punkt .icon { color: var(--of-navy); margin-bottom: var(--s2); }
.info-zweck__punkt h2 { font-size: var(--fs-lg); margin-bottom: var(--s2); }
.info-zweck__punkt p { margin: 0; color: var(--of-text-2); }

.info-fakten { padding: var(--s6) 0; }
.info-fakten__liste { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s5); grid-template-columns: repeat(auto-fit, minmax(min(100%, 140px), 1fr)); }
.info-fakten__liste li { margin: 0; padding-left: var(--s4); border-left: 3px solid var(--of-sky); }
.info-fakt__zahl { display: block; font-size: clamp(34px, 4vw, 48px); font-weight: var(--fw-black); line-height: 1; color: var(--white); }
.info-fakt__text { display: block; margin-top: 8px; font-size: var(--fs-sm); color: var(--of-sky-tint); }

/* Demo-Drehbuch */
.info-druckkopf { display: none; }
.info-drehbuch__kopf { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--s4) var(--s6); margin-bottom: var(--s6); }
.info-drehbuch__kopf .lead { margin-bottom: 0; }
.info-drehbuch__knoepfe { display: flex; flex-wrap: wrap; gap: var(--s2); }
.drehbuch { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); column-gap: var(--s6); }
.drehbuch__schritt { position: relative; display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: var(--s4); margin: 0; padding-bottom: var(--s4); }
.drehbuch__schritt::before { content: ''; position: absolute; left: 25px; top: 52px; bottom: 0; width: 2px; background: var(--of-border-strong); }
.drehbuch__schritt:last-child::before { display: none; }
.drehbuch__nr {
  position: relative; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%;
  background: var(--of-sky); color: var(--of-text); font-size: var(--fs-lg); font-weight: var(--fw-black);
}
.drehbuch__karte { min-width: 0; padding: var(--s4) var(--s5); background: var(--white); box-shadow: var(--shadow-1); }
.drehbuch__kopf { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px var(--s3); margin-bottom: var(--s2); }
.drehbuch__titel { margin: 0; font-size: var(--fs-lg); }
.drehbuch__meta { margin: 0; font-size: var(--fs-xxs); font-weight: var(--fw-bold); letter-spacing: .12em; text-transform: uppercase; color: var(--of-muted); }
.drehbuch__rolle { display: flex; align-items: flex-start; gap: 6px; margin: 0 0 var(--s2); font-size: var(--fs-xs); color: var(--of-text-2); overflow-wrap: anywhere; }
.drehbuch__rolle .icon { width: 16px; height: 16px; flex: 0 0 16px; margin-top: 1px; color: var(--of-navy); }
.drehbuch__rolle span { min-width: 0; }
.drehbuch__text { margin: 0 0 var(--s2); }
.drehbuch__achten { margin: 0 0 var(--s3); padding-left: var(--s3); border-left: 3px solid var(--eko-gelb); font-size: var(--fs-sm); color: var(--of-text-2); }
.drehbuch__links { display: flex; flex-wrap: wrap; gap: var(--s2) var(--s5); margin: 0; }
.drehbuch__text, .drehbuch__achten { overflow-wrap: break-word; hyphens: auto; -webkit-hyphens: auto; }
/* Schmale Bildschirme: kleinere Nummern, damit die Karten mehr Breite bekommen */
@media (max-width: 520px) {
  .drehbuch__schritt { grid-template-columns: 34px minmax(0, 1fr); gap: 10px; }
  .drehbuch__schritt::before { left: 16px; top: 34px; }
  .drehbuch__nr { width: 34px; height: 34px; font-size: var(--fs-base); }
  .drehbuch__karte { padding: 14px; }
  .drehbuch__titel { font-size: var(--fs-md); }
}
@media (min-width: 1100px) {
  .drehbuch { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(5, auto); grid-auto-flow: column; }
  .drehbuch__schritt:nth-child(5)::before { display: none; }
}

/* Echt oder simuliert */
.info-vergleich { display: grid; gap: var(--s5); grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); margin-top: var(--s5); }
.info-spalte { padding: var(--s5); background: var(--white); border: 1px solid var(--of-border); border-top: 6px solid var(--ok); }
.info-spalte--simuliert { border-top-color: var(--eko-gelb); }
.info-spalte h3 { display: flex; align-items: center; gap: 10px; font-size: var(--fs-xl); }
.info-spalte h3 .icon { width: 28px; height: 28px; color: var(--of-navy); }
.info-punkte { list-style: none; margin: 0; padding: 0; }
.info-punkte li { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: var(--s3); margin: 0; padding: 12px 0; border-top: 1px solid var(--of-border); }
.info-punkte .anf-ball { margin-top: 4px; }
.info-punkte strong { display: block; }
.info-punkte span { display: block; font-size: var(--fs-sm); color: var(--of-text-2); }
.info-punkte .info-link { margin-top: 6px; }
.info-punkte .info-link span { display: inline; color: inherit; font-size: inherit; }
.info-punkte .info-link .info-link__rolle { display: block; color: var(--of-muted); font-size: var(--fs-xs); }

/* Zwei Spalten */
.info-zwei { display: grid; gap: var(--s6) var(--s7); grid-template-columns: repeat(auto-fit, minmax(min(100%, 400px), 1fr)); align-items: start; }
.info-zwei--weit { grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr)); }
@media (min-width: 1000px) { .info-zwei--weit { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); } }

/* Balken: Bestand nach Medienart (eine Farbe, Wert am Balkenende) */
.info-balken__titel { font-size: var(--fs-md); margin-top: var(--s5); }
.info-balken { list-style: none; margin: 0; padding: 0; }
.info-balken__zeile { display: grid; grid-template-columns: minmax(0, 11rem) minmax(0, 1fr); align-items: center; gap: var(--s3); margin: 0; padding: 5px 0; }
.info-balken__name { font-size: var(--fs-sm); }
.info-balken__spur { display: flex; align-items: center; gap: 8px; min-width: 0; border-left: 1px solid var(--of-border-strong); }
.info-balken__wert { display: block; height: 14px; min-width: 2px; background: var(--of-navy-soft); -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.info-balken__zahl { font-size: var(--fs-sm); font-weight: var(--fw-bold); font-variant-numeric: tabular-nums; }
@media (max-width: 520px) { .info-balken__zeile { grid-template-columns: minmax(0, 8.5rem) minmax(0, 1fr); } }

.info-dl { margin: 0; }
.info-dl > div { display: grid; grid-template-columns: 8.5rem minmax(0, 1fr); gap: var(--s3); padding: 12px 0; border-top: 1px solid var(--of-border-strong); }
.info-dl dt { font-weight: var(--fw-bold); }
.info-dl dd { margin: 0; color: var(--of-text-2); }
@media (max-width: 520px) { .info-dl > div { grid-template-columns: minmax(0, 1fr); gap: 2px; } }

/* Farben */
.info-farben { list-style: none; margin: var(--s5) 0 0; padding: 0; display: grid; gap: var(--s4); grid-template-columns: repeat(auto-fill, minmax(min(100%, 150px), 1fr)); }
.info-farbe { margin: 0; background: var(--white); border: 1px solid var(--of-border); }
.info-farbe__feld { display: block; height: 72px; border-bottom: 1px solid var(--of-border); -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.info-farbe__text { display: block; padding: 10px 12px 12px; font-size: var(--fs-sm); }
.info-farbe__text strong { display: block; }
.info-farbe__hex { display: block; font-family: ui-monospace, 'SFMono-Regular', Menlo, Consolas, 'Liberation Mono', monospace; font-size: var(--fs-xs); color: var(--of-muted); text-transform: lowercase; }
.info-farbe__wo { display: block; margin-top: 4px; color: var(--of-text-2); font-size: var(--fs-xs); }
.info-hinweis-klein { margin: var(--s4) 0 0; font-size: var(--fs-sm); color: var(--of-muted); }

/* Karten (Datenschutz, Barrierefreiheit) */
.info-karten { display: grid; gap: var(--s5); grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); }
.info-karte { padding: var(--s5); background: var(--white); border: 1px solid var(--of-border); border-top: 4px solid var(--of-sky); }
.info-karte .icon { color: var(--of-navy); margin-bottom: var(--s3); }
.info-karte h3 { font-size: var(--fs-md); margin-bottom: var(--s2); }
.info-karte p { margin: 0; font-size: var(--fs-sm); color: var(--of-text-2); }
.info-speicher th[scope='row'] { font-weight: var(--fw-medium); }
.info-loeschen { border-top: 4px solid var(--eko-rot); }
.info-loeschen h3 { font-size: var(--fs-lg); }
.info-anforderungen { list-style: none; margin: var(--s5) 0 0; padding: 0; display: grid; gap: var(--s4) var(--s6); grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); }
.info-anforderungen--einspaltig { grid-template-columns: minmax(0, 1fr); margin-top: var(--s4); }
.info-anforderungen li { margin: 0; padding: var(--s4) 0 var(--s4); border-top: 3px solid var(--of-navy); }
.info-anforderungen h3 { font-size: var(--fs-md); margin-bottom: 4px; }
.info-anforderungen p { margin: 0 0 var(--s2); font-size: var(--fs-sm); color: var(--of-text-2); }
.info-grenzen { list-style: none; margin: var(--s4) 0 var(--s5); padding: 0; }
.info-grenzen li { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: var(--s3); margin: 0; padding: 10px 0; border-top: 1px solid var(--of-border); }
.info-grenzen .icon { color: var(--warn-text); margin-top: 1px; }

/* Kontrasttabelle */
.info-kontraste { background: var(--white); }
.info-kontraste th[scope='row'] { font-weight: var(--fw-medium); }
.info-kontraste td, .info-kontraste th { vertical-align: middle; }
.info-probe { display: inline-grid; place-items: center; width: 56px; height: 40px; font-size: var(--fs-md); font-weight: var(--fw-bold); border: 1px solid var(--of-border); -webkit-print-color-adjust: exact; print-color-adjust: exact; }
/* Probe für Fokusrahmen: Rahmen in der Vordergrundfarbe auf der Fläche */
.info-probe--rahmen > span { display: block; width: 30px; height: 18px; outline-width: 3px; outline-style: solid; outline-offset: 0; }
.info-kontraste tr.ist-negativ th, .info-kontraste tr.ist-negativ td.num { color: var(--of-muted); }
.info-kontraste .badge .icon { width: 14px; height: 14px; }
.info-kontraste .badge { white-space: normal; }
@media (max-width: 640px) {
  .info-kontraste thead { display: none; }
  .info-kontraste td:nth-child(4) { min-width: 0; }
  .info-kontraste tr { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; grid-template-areas: 'probe name wert' 'probe bewertung bewertung'; align-items: center; gap: 4px 10px; padding: 10px 0; border-bottom: 1px solid var(--of-border); }
  .info-kontraste td, .info-kontraste th { padding: 0; border: 0; }
  .info-kontraste td:nth-child(1) { grid-area: probe; }
  .info-kontraste th[scope='row'] { grid-area: name; }
  .info-kontraste td:nth-child(3) { grid-area: wert; }
  .info-kontraste td:nth-child(4) { grid-area: bewertung; }
}
.info-klein-titel { font-size: var(--fs-md); margin-bottom: var(--s2); }
.info-leer__kacheln { list-style: none; margin: var(--s5) 0 0; padding: 0; justify-content: center; }
.info-leer__kacheln li { margin: 0; }
.info-leer__kacheln .tile { font-size: var(--fs-base); }
.v-info .info-leer__kacheln .icon { width: 22px; height: 22px; margin: 0; color: currentColor; }

/* =====================================================================
 * Druck
 * ===================================================================== */
@media print {
  .v-info-bereich .page-head { padding: 0 0 6pt; }
  .v-info-bereich .page-head h1 { font-size: 20pt; }
  .v-info-bereich .breadcrumb, .info-nav, .info-rolle, .anf-werkzeuge, .anf-schnell, .anf-zeile__link,
  #anf-haken-weg, .anf-grundlage .arrow-link, .hilfe-sprung, .hilfe-probe,
  .info-drehbuch__knoepfe, .info-loeschen, .faq__links { display: none !important; }
  /* Verweise bleiben erhalten: offene Fragen mit Nummer und Titel, „Bezug“ als Text */
  .anf-zeile__links { gap: 0; }
  .anf-frage-link { font-size: 8pt; color: var(--of-text); }
  .anf-frage-link .icon { display: none; }
  .anf-frage-link::before { content: '→\00a0'; }
  .anf-frage-link .visually-hidden { position: static !important; width: auto; height: auto; margin: 0; overflow: visible; clip: auto; white-space: normal; }
  .anf-frage__bezug { gap: 0 3pt; }
  .anf-bezug { min-width: 0; min-height: 0; padding: 0; border: 0; background: none; color: var(--of-text); font-size: 8.5pt; }
  .anf-bezug:not(:last-child)::after { content: ','; }
  /* Drehbuch: Links als Text, damit klar bleibt, wohin ein Schritt führt */
  .drehbuch__links { gap: 0 10pt; }
  .drehbuch__links .info-link { font-size: 8.5pt; font-weight: var(--fw-medium); }
  .drehbuch__links .icon, .info-link__rolle { display: none; }
  .drehbuch__links .info-link::before { content: '→\00a0'; }
  .info-druckkopf { display: block; font-size: 8.5pt; color: var(--of-text-2); border-bottom: 1pt solid var(--of-text); padding-bottom: 4pt; margin-bottom: 8pt; }
  .info-druckkopf p { margin: 0; }
  /* „Drehbuch drucken“: nur der Drehbuch-Abschnitt */
  .v-info--prototyp.ist-druck-drehbuch > :not(.info-drehbuch) { display: none !important; }
  .v-info-bereich .section { padding: 8pt 0; background: none !important; }
  .v-info-bereich h2 { font-size: 15pt; break-after: avoid; }
  .v-info-bereich h3 { break-after: avoid; }
  .v-info-bereich .container { max-width: none; padding-left: 0; padding-right: 0; }
  .anf-druckkopf { display: block; font-size: 8.5pt; color: var(--of-text-2); border-bottom: 1pt solid var(--of-text); padding-bottom: 4pt; margin-bottom: 8pt; }
  .anf-druckkopf p { margin: 0; }
  .anf-intro__raster { grid-template-columns: minmax(0, 1fr) 42%; }
  .anf-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .anf-kpi { box-shadow: none; border: .5pt solid var(--of-border-strong); padding: 6pt; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .anf-kpi .kpi__value { font-size: 18pt; }
  .anf-gruppe { border: 0; margin: 0 0 6pt; }
  .anf-gruppe__inhalt[hidden] { display: block !important; }
  .anf-gruppe__inhalt { padding: 0; }
  .anf-gruppe__knopf { min-height: 0; padding: 6pt 0 3pt; background: none !important; border-bottom: 1.5pt solid var(--of-text) !important; }
  .anf-gruppe__chevron, .anf-verteilung--mini { display: none; }
  /* Kopf einzeilig, auch wenn das Papier schmaler als die Umbruchbreite ist */
  .anf-gruppe__knopf { grid-template-columns: auto minmax(0, 1fr) auto; }
  .anf-gruppe__nr, .anf-gruppe__titel, .anf-gruppe__meta { grid-column: auto; grid-row: auto; }
  .anf-gruppe__nr { min-width: 0; height: auto; padding: 1pt 5pt; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .anf-kapitel { margin: 10pt 0 4pt; }
  .anf-zeile { grid-template-columns: 3.4rem minmax(0, 1fr) 10.5rem; gap: 2pt 8pt; padding: 4pt 0; break-inside: avoid; }
  .anf-zeile__seite { grid-column: 3; }
  .anf-zeile--check { grid-template-columns: minmax(0, 1fr) 10.5rem; }
  .anf-zeile--check .anf-zeile__seite { grid-column: 2; padding-left: 0; }
  .anf-zeile__text { font-size: 10pt; }
  .anf-zeile__info, .anf-tags .tag { font-size: 8.5pt; }
  .anf-tags .tag { min-height: 0; padding: 0 4pt; }
  .anf-status { padding: 1pt 5pt; font-size: 7.5pt; }
  .anf-check input { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .v-info-bereich :focus, .v-info-bereich :focus-visible { outline: none !important; }
  .anf-liste__kopf p, .anf-fragen__kopf .lead { display: none; }
  .anf-frage__titel { font-size: 10pt; }
  .anf-frage__text { font-size: 9pt; margin-bottom: 0; }
  .anf-fragen { break-before: page; }
  .anf-fragen__raster { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10pt 18pt; }
  .anf-frage { break-inside: avoid; padding: 5pt 0; }
  .anf-frage__nr { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .drehbuch { grid-template-columns: minmax(0, 1fr); grid-auto-flow: row; grid-template-rows: none; }
  .drehbuch__schritt { break-inside: avoid; padding-bottom: 6pt; }
  .drehbuch__schritt::before { display: none; }
  .drehbuch__karte { box-shadow: none; border: .5pt solid var(--of-border-strong); padding: 6pt 8pt; }
  .drehbuch__nr { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .info-fakten { color: var(--of-text) !important; }
  .info-fakt__zahl, .info-fakt__text { color: var(--of-text) !important; }
  .faq__antwort { display: block; }
  .info-spalte, .info-karte, .hilfe-karte { box-shadow: none; break-inside: avoid; }
}