/* =========================
   FAQ (Handorgel) – Card Look
   Ziel: modern, passend zu deinen Kacheln
   ========================= */

/* Scope: Artikel 28 ODER Klasse faq-block */
.content-accordion,
.faq-block .content-accordion{
  margin-top: 22px;
}

/* Überschrift */
.content-accordion > h2,
.faq-block .content-accordion > h2{
  margin: 0 0 14px;
}

/* Jeder Header (Frage) als "Card" */
.handorgel__header,
.faq-block .handorgel__header{
  margin: 0 0 12px;
  border: 1px solid #eee;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 10px 30px rgba(0,0,0,0.07);
  overflow: hidden;
  transition: box-shadow .18s ease, transform .18s ease;
}

/* Hover */
.handorgel__header:hover,
.faq-block .handorgel__header:hover{
  transform: translateY(-1px);
  box-shadow: 0 14px 36px rgba(0,0,0,0.10);
}

/* Button = Frage-Zeile */
.handorgel__header__button,
.faq-block .handorgel__header__button{
  width: 100%;
  text-align: left;
  cursor: pointer;

  padding: 16px 56px 16px 18px; /* rechts Platz für Icon */
  border: 0;
  background: transparent;

  font-weight: 800;
  line-height: 1.25;
  font-size: 16px;
  color: #111;

  position: relative;
}

/* Plus/Minus rechts */
.handorgel__header__button::after,
.faq-block .handorgel__header__button::after{
  content: "+";
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 34px;
  height: 34px;
  border-radius: 12px;

  display: grid;
  place-items: center;

  background: #fff;
  border: 1px solid rgba(244,180,0,0.35);
  box-shadow: 0 8px 18px rgba(0,0,0,0.06);

  font-weight: 900;
  line-height: 1;
}

/* "Open"-State: Handorgel setzt data-open auf .handorgel__content */
.handorgel__content[data-open] + .handorgel__header .handorgel__header__button::after,
.faq-block .handorgel__content[data-open] + .handorgel__header .handorgel__header__button::after{
  content: "–";
}

/* Alternative: Wenn Handorgel open-state via aria-expanded am Button setzt */
.handorgel__header__button[aria-expanded="true"]::after,
.faq-block .handorgel__header__button[aria-expanded="true"]::after{
  content: "–";
}

/* Content Panel optisch "eingeklinkt" an die Header-Card */
.handorgel__content,
.faq-block .handorgel__content{
  margin: -8px 0 12px; /* schiebt Content näher an den Header */
}

/* Inner Content als Card-Unterteil */
.handorgel__content__inner,
.faq-block .handorgel__content__inner{
  border: 1px solid #eee;
  border-top: 0;
  border-radius: 0 0 18px 18px;
  background: #fff;
  box-shadow: 0 10px 30px rgba(0,0,0,0.07);
  padding: 14px 18px 18px;
}

/* Typo im Antworttext */
.handorgel__content__inner .rte p,
.faq-block .handorgel__content__inner .rte p{
  margin: 0;
  line-height: 1.6;
  color: #222;
}

/* Optional: kleine gelbe Akzentlinie links in der Antwort */
.handorgel__content__inner,
.faq-block .handorgel__content__inner{
  position: relative;
}

.handorgel__content__inner::before,
.faq-block .handorgel__content__inner::before{
  content: "";
  position: absolute;
  left: 0;
  top: 14px;
  bottom: 14px;
  width: 3px;
  border-radius: 3px;
  background: rgba(244,180,0,0.75);
}

/* Mobile: etwas kompakter */
@media (max-width: 780px){
  .handorgel__header__button,
  .faq-block .handorgel__header__button{
    padding: 14px 52px 14px 16px;
    font-size: 15px;
  }
}

.faq-block .handorgel__content__inner ul,
.handorgel__content__inner ul{
  padding-left: 30px;
}
.faq-block .handorgel__content__inner ul li,
.handorgel__content__inner ul li{
  list-style: square;
}