/* Purpose: FAQ accordion built on native <details>, with a gold plus/minus marker. */

.qa { max-width: 840px; margin: 0 auto; border-top: 1px solid var(--color-border); }
.qa details { border-bottom: 1px solid var(--color-border); }
.qa summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--space-6);
  padding: var(--space-6) 0;
  font-family: var(--font-heading);
  font-size: var(--text-md);
  color: var(--color-primary);
  line-height: var(--leading-cozy);
}
.qa summary::-webkit-details-marker { display: none; }
.qa summary i { position: relative; width: 14px; height: 14px; flex: none; }
.qa summary i::before, .qa summary i::after { content: ""; position: absolute; left: 0; top: 6.5px; width: 14px; height: 1px; background: var(--color-accent); transition: transform var(--duration-medium) var(--ease); }
.qa summary i::after { transform: rotate(90deg); }
.qa details[open] summary i::after { transform: rotate(0); }

.qa .ans { padding: 0 0 var(--space-6) 0; color: var(--color-text-muted); font-size: var(--text-body-sm); }
.qa address { font-style: normal; margin-top: var(--space-4); padding-left: var(--space-4); border-left: 1px solid var(--color-accent); color: var(--color-text); line-height: var(--leading-relaxed); }

.faq-foot { text-align: center; margin-top: var(--space-8); font-size: var(--text-body-sm); color: var(--color-text-muted); }
.faq-foot a { color: var(--color-primary); }

/* md */
@media (min-width: 641px) {
  .qa summary { font-size: var(--text-xl); }
  .qa .ans { padding-right: var(--space-12); }
}