/* ==========================================================================
   FAQ: native <details> rows, so it needs no script.
   ========================================================================== */

.faq { border-top: 1px solid var(--line); }
.faq .section-head { margin-bottom: 2.5rem; }

.faq-list details { border-top: 1px solid var(--line); }
.faq-list details:last-child { border-bottom: 1px solid var(--line); }

.faq-list summary {
  position: relative;
  padding: 20px 48px 20px 0;
  list-style: none;
  font-size: 16px;
  font-weight: 500;
  cursor: pointer;
}
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after {
  content: "+";
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  font-family: var(--serif);
  font-size: 24px;
  font-weight: 400;
  color: var(--faint);
  transition: transform 200ms;
}
.faq-list details[open] summary::after { transform: translateY(-50%) rotate(45deg); }

.faq-list details p,
.faq-list details ul { padding: 0 48px 20px 0; font-size: 15px; color: var(--muted); }
.faq-list details ul { list-style: disc; padding-left: 20px; }
.faq-list details li + li { margin-top: 10px; }
.faq-list details li strong { color: var(--ink); font-weight: 600; }