/* Modul „fragen“ – Akkordeon (Werte aus seiten/module/d2c.css „Faq“ und
   „d2c-kreis“ übernommen). Farben nur aus der Ton-Regel (--bb-*), sonst
   Website-Tokens. Breakpoints 640/768 (max: …-1). */
/* Kopf → Liste wie der Bestand (bm-m-sektion__inhalt--nach-kopf). */
.bb-m-fragen { --bb-kopf-abstand: calc(var(--bm-sektion) * 0.75); }
.bb-m-fragen__liste { border-top: 1px solid var(--bb-linie); }
.bb-m-fragen__eintrag { border-bottom: 1px solid var(--bb-linie); }
.bb-m-fragen__knopf {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  width: 100%;
  padding: 1.875rem 0 1.875rem 5rem;
  text-align: left;
  color: var(--bb-text);
  cursor: pointer;
  list-style: none;
}
.bb-m-fragen__knopf::-webkit-details-marker { display: none; }
.bb-m-fragen__knopf:focus-visible { outline: var(--bm-fokus-breite) solid var(--bb-fokus); outline-offset: var(--bm-fokus-versatz, 3px); }
.bb-m-fragen__frage {
  margin: 0;
  font-family: var(--bm-font-titel);
  font-size: var(--bm-t-h3);
  font-weight: var(--bm-g-normal);
  font-synthesis: none;
  line-height: var(--bm-zh-snug);
  letter-spacing: var(--bm-sp-leicht);
  hyphens: auto;
  transition: color var(--bm-dauer-kurz) var(--bm-ease-linear);
}
.bb-m-fragen__knopf:is(:hover, :focus-visible) .bb-m-fragen__frage { color: var(--bb-text-ruhig); }

/* Kreis mit Chevron: Linie, beim Überfahren Signal; offen gedreht. */
.bb-m-fragen__kreis {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  border: 1px solid var(--bb-linie);
  border-radius: var(--bm-radius-pille);
  color: var(--bb-text);
  transition: background-color var(--bm-dauer-kurz) var(--bm-ease-linear), border-color var(--bm-dauer-kurz) var(--bm-ease-linear);
}
.bb-m-fragen__knopf:is(:hover, :focus-visible) .bb-m-fragen__kreis {
  background: var(--bm-signal);
  border-color: var(--bm-signal);
  color: var(--bm-signal-text);
}
.bb-m-fragen__kreis svg { transition: transform var(--bm-dauer) var(--bm-ease); }
.bb-m-fragen__eintrag[open] .bb-m-fragen__kreis svg { transform: rotate(180deg); }

.bb-m-fragen__antwort {
  margin: 0;
  padding: 0 4.25rem 2rem 5rem;
  max-width: calc(68ch + 9.25rem);
  font-size: var(--bm-t-body);
  line-height: var(--bm-zh-text);
  color: var(--bb-text-ruhig);
  white-space: pre-line;
}
/* Antwort aus der FAQ-Datenbank: Absätze und Listen als HTML. */
.bb-m-fragen__antwort--html { white-space: normal; }
.bb-m-fragen__antwort--html > :is(p, ul) { margin: 0; }
.bb-m-fragen__antwort--html > * + * { margin-top: 0.75em; }
.bb-m-fragen__antwort--html ul { padding-left: 1.25em; }
.bb-m-fragen__antwort--html a { color: var(--bb-text); text-underline-offset: var(--bb-textlink-versatz); }
.bb-m-fragen__antwort--html a:hover { color: var(--bb-akzent); }
.bb-m-fragen__eintrag[open] .bb-m-fragen__antwort { animation: bb-m-fragen-ein var(--bm-dauer) var(--bm-ease); }
@keyframes bb-m-fragen-ein { from { opacity: 0; } to { opacity: 1; } }

@media (max-width: 767px) {
  .bb-m-fragen__knopf { padding: 1.5rem 0 1.5rem 2.5rem; gap: 1rem; }
  .bb-m-fragen__antwort { padding: 0 0 1.5rem 2.5rem; }
}
@media (max-width: 639px) {
  .bb-m-fragen__knopf { padding-left: 0; }
  .bb-m-fragen__antwort { padding-left: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .bb-m-fragen__frage, .bb-m-fragen__kreis, .bb-m-fragen__kreis svg { transition: none; }
  .bb-m-fragen__eintrag[open] .bb-m-fragen__antwort { animation: none; }
}
