.faq-item {
  cursor: pointer;
  padding: 1em;
  border-bottom: 1px solid #ccc;
  position: relative;
}
.faq-item::after {
  content: "+";
  position: absolute;
  right: 1em;
  top: 1.2em;
  font-size: 1.2em;
  transition: transform 0.2s;
  color: #888;
}

.faq-item.active::after {
  content: "−"; /* Let op: dit is een echt min-teken (Unicode U+2212), geen streepje */
  color: #000;
}
.faq-content {
  display: none;
  padding: 0 1em 1em;
  animation: fadein 0.3s ease;
}
.faq-item.active + .faq-content {
  display: block;
}

.faq-item.active::after {
  transform: rotate(180deg);
}

@keyframes fadein {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}