/* FAQ accordion using native <details>, styled to match the original
   wdt-accordion (card rows, plus/cross toggle, orange active state). */
.faq-list { max-width: 860px; margin-inline: auto; display: grid; gap: var(--sp-2); }

.faq-item {
  background: #fff; border: 1px solid var(--c-line); border-radius: var(--r-md);
  overflow: hidden;
}
.faq-item summary {
  list-style: none; cursor: pointer;
  display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3);
  padding: var(--sp-3) var(--sp-4);
  font-family: var(--font-heading); font-weight: 600; color: var(--c-text);
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary:hover { color: var(--c-accent); }

.faq-item__icon {
  flex: none; width: 26px; height: 26px; border-radius: 50%;
  display: grid; place-items: center;
  background: var(--c-tint-1); color: var(--c-accent);
  transition: transform var(--t-base) var(--ease), background var(--t-fast) var(--ease);
}
.faq-item__icon svg { width: 13px; height: 13px; }
.faq-item[open] summary { color: var(--c-accent); }
.faq-item[open] .faq-item__icon { transform: rotate(45deg); background: var(--c-primary); color: #fff; }

.faq-item__body { padding: 0 var(--sp-4) var(--sp-4); color: var(--c-text-2); }
.faq-item__body p + p { margin-top: var(--sp-2); }