.faq-list {margin-bottom:20px !important;}
/* Button/Trigger */
.faq-question {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  text-align: left;
  font-size: 1.1em;
  padding: 0.6em 0.6em 0.6em 2em;
  margin: 0;
  border: none;
  border-bottom: 1px solid #ddd;
  background: #f9f9f9 !important;
  cursor: pointer;
  transition: background 0.3s;
  position: relative;
}
.faq-question::before {
  content: "+";
  position: absolute;
  left: 0.5rem;
  font-weight: bold;
}
.faq-question[aria-expanded="true"]::before {
  content: "–";
}

/* Panel */
.faq-answer {
  /* WICHTIG: keine open-Klasse, keine max-height:auto */
  display: none;               /* wird per JS gesetzt */
  overflow: hidden;            /* wird in Animation gesetzt */
  height: 0;                   /* wird in Animation gesetzt */
  border-left: 2px solid #ddd;
  margin-bottom: 0.8em;
  transition: height 0.35s ease; /* nur height animieren → stabil in Firefox */
  padding:10px;
}

.faq-answer p {padding: 0.5em 1em;  }


/* Optional: etwas mehr Platz, wenn offen (per Adjacent-Selector) */
.faq-question[aria-expanded="true"] + .faq-answer {
  /* Hier KEIN height! Die steuern wir im JS. */
  
}

/* Sonstiges (deins beibehalten) */
.faq-icon-wrap { flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; }
img.faq-icon { width: 50px; height: 50px; object-fit: contain; margin-right: 10px; }
.faq-text { flex: 1; }
.faq-category { font-size: 1.4em; font-weight: bold; margin: 1.5em 0 0.5em; padding-bottom: 0.3em; border-bottom: 2px solid #ddd; }
.faq-category small { font-weight: normal; color: #666; }

/* Accessibility: deaktiviert Animationen bei reduced motion */
@media (prefers-reduced-motion: reduce) {
  .faq-answer { transition: none !important; }
}


.cat-icon {width:40px;height:40px;object-fit:contain;margin-right:.6rem;vertical-align:middle;}
