/* Native, auch ohne JavaScript bedienbare Fragen und Antworten. */
.subpage main > .section.service-faq {
  padding-block: clamp(52px, 6vw, 88px);
  border-bottom: 1px solid var(--sub-line);
  background: #fff;
}
.service-faq .faq-layout {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  gap: clamp(32px, 6vw, 88px);
  align-items: start;
}
.service-faq .faq-layout > * { min-width: 0; }
.subpage main > .section.service-faq h2 {
  margin-bottom: 22px;
  font-size: clamp(2rem, 3.6vw, 3.8rem);
  line-height: 1.08;
  letter-spacing: -.045em;
}
.service-faq .faq-intro p { max-width: 440px; color: var(--ink-soft); }
.service-faq .faq-list { border-top: 1px solid var(--line); }
.service-faq details { border-bottom: 1px solid var(--line); }
.service-faq summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-height: 76px;
  padding: 22px 8px;
  list-style: none;
  cursor: pointer;
  color: var(--ink);
  font-size: 1.05rem;
  font-weight: 750;
  line-height: 1.5;
}
.service-faq summary::-webkit-details-marker { display: none; }
.service-faq summary:hover { color: var(--green-dark); background: #f7faf5; }
.service-faq summary:focus-visible,
.service-faq a:focus-visible { outline: 3px solid #176a9b; outline-offset: 3px; border-radius: 4px; }
.service-faq .faq-toggle {
  position: relative;
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #edf4e8;
  color: var(--green-dark);
}
.service-faq .faq-toggle::before,
.service-faq .faq-toggle::after {
  content: "";
  position: absolute;
  top: 13px;
  left: 7px;
  width: 14px;
  height: 2px;
  background: currentColor;
}
.service-faq .faq-toggle::after { transform: rotate(90deg); }
.service-faq details[open] .faq-toggle::after { display: none; }
.service-faq .faq-answer { padding: 0 56px 22px 8px; color: var(--ink-soft); }
.service-faq .faq-answer p { margin: 0; line-height: 1.75; }
.service-faq .faq-answer a { color: var(--green-dark); text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
@media (max-width: 900px) {
  .service-faq .faq-layout { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .service-faq .faq-intro p { max-width: 680px; margin-bottom: 0; }
}
@media (max-width: 480px) {
  .service-faq summary { padding-block: 18px; gap: 12px; font-size: 1rem; }
  .service-faq .faq-answer { padding-right: 8px; }
}