/* acessio.de · Startseite · Fragen vor dem Start (Modul faq, Release 2026-10-22-verkaufsstark).
   Übernommen vom Fragen-Block auf acessio.eu (werkzeug/startseite-eu/stil.css, Abschnitt „Fragen“):
   Kopf links und sticky, rechts native <details> ohne JavaScript, Plus/Minus im Kreis.
   Nur Token der Seite (start-*.css): --ink, --ink-2, --line-2, --accent, --accent-ink,
   --fs-lead, --dur-fast, --ease, --kopf-hoehe. Abstände wie #zusammenarbeit, Überschrift wie „Feedback unserer Kunden.“ */

.fragen.section { padding-block: clamp(52px, 6.5vw, 92px); }
.fragen { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: clamp(32px, 6vw, 96px); align-items: start; }

.fragen__kopf { position: sticky; top: calc(var(--kopf-hoehe, 90px) + 32px); }
.fragen__titel { font-size: clamp(29px, 3.4vw, 48px); max-width: 14ch; margin: 0 0 0.45em; text-wrap: balance; }
.fragen__lead { font-size: var(--fs-lead); line-height: 1.5; color: var(--ink-2); max-width: 34ch; margin: 0; }
.fragen__bild { display: block; width: clamp(220px, 21vw, 300px); height: auto; margin: clamp(28px, 3vw, 44px) 0 0; }

.fragen__liste { border-bottom: 1px solid var(--line-2); }
.fragen details { border-top: 1px solid var(--line-2); }
.fragen summary { list-style: none; cursor: pointer; position: relative; color: var(--ink);
  padding: 22px 52px 22px 0; font-size: clamp(19px, 0.7vw + 0.75rem, 23px); font-weight: 600;
  line-height: 1.3; letter-spacing: -0.015em; }
.fragen summary::-webkit-details-marker { display: none; }
.fragen summary::after { content: "+"; position: absolute; right: 6px; top: 50%;
  transform: translateY(-50%); width: 32px; height: 32px; border-radius: 50%;
  border: 1.5px solid var(--line-2); display: grid; place-items: center; box-sizing: border-box;
  font: 400 20px/1 var(--sans); color: var(--ink);
  transition: border-color var(--dur-fast) var(--ease), background-color var(--dur-fast) var(--ease); }
.fragen details[open] summary::after { content: "–"; }
.fragen summary:hover::after { border-color: var(--ink); }
.fragen summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; border-radius: 4px; }

.fragen__antwort { margin: 0 0 10px; max-width: 62ch; color: var(--ink-2);
  hyphens: auto; overflow-wrap: break-word; }
.fragen__antwort:last-child { margin-bottom: 24px; }
.fragen__mehr { margin: 0 0 24px; display: flex; flex-wrap: wrap; gap: 4px 20px; }
.fragen__mehr a { color: var(--accent-ink); font-weight: 600; text-decoration: underline;
  text-underline-offset: 3px; text-decoration-thickness: 1px; }
.fragen__mehr a:hover { color: var(--ink); }

@media (max-width: 899px) {
  .fragen { grid-template-columns: minmax(0, 1fr); }
  .fragen__kopf { position: static; }
  .fragen__bild { width: 200px; margin-top: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .fragen summary::after { transition: none; }
}