/* ===== FAQ — accordion (blueprint 09) ===== */
#faq { padding: var(--s7) 0; }

#faq .faq-list {
  margin-top: var(--s5);
  max-width: 820px;
  border-top: 1px solid var(--line);
}

#faq .faq-item { border-bottom: 1px solid var(--line); }

#faq .faq-q {
  display: flex; align-items: center; justify-content: space-between; gap: var(--s3);
  padding: var(--s3) 4px;
  cursor: pointer;
  list-style: none;
  font-family: var(--font-head, "Manrope", sans-serif);
  font-weight: 700; font-size: clamp(16px, 2vw, 19px);
  color: var(--ink);
}
#faq .faq-q::-webkit-details-marker { display: none; }
#faq .faq-q:hover { color: var(--green); }

/* plus / minus mark */
#faq .faq-mark { position: relative; flex: 0 0 auto; width: 18px; height: 18px; }
#faq .faq-mark::before,
#faq .faq-mark::after {
  content: ""; position: absolute; background: var(--green); border-radius: 2px;
  transition: transform .2s ease, opacity .2s ease;
}
#faq .faq-mark::before { top: 8px; left: 0; width: 18px; height: 2px; }        /* horizontal */
#faq .faq-mark::after  { top: 0; left: 8px; width: 2px; height: 18px; }         /* vertical */
#faq .faq-item[open] .faq-mark::after { transform: scaleY(0); opacity: 0; }

#faq .faq-a {
  padding: 0 4px var(--s4);
  color: var(--muted);
  font-size: 15px;
  max-width: 68ch;
}
#faq .faq-a p { margin: 0 0 .6em; }
#faq .faq-a p:last-child { margin-bottom: 0; }

@media (prefers-reduced-motion: no-preference) {
  #faq .faq-item[open] .faq-a { animation: faqIn .22s ease both; }
  @keyframes faqIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
}