/* FAQ page — additive stylesheet, loaded alongside style.css.
   Accordion uses plain <details>/<summary> — no JS needed. */

.faq-hero{margin-top:12px;text-align:center;max-width:640px;margin-left:auto;margin-right:auto}
.faq-hero h1{font-size:28px;font-weight:800;color:var(--ink);letter-spacing:-.5px;margin-bottom:8px}
.faq-hero p{font-size:13.5px;color:var(--body);line-height:1.6}

.faq-list{max-width:800px;margin:20px auto 50px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}

.faq-item{border-bottom:1px solid var(--line)}
.faq-item:last-child{border-bottom:none}

.faq-item summary{display:flex;align-items:center;justify-content:space-between;gap:14px;list-style:none;cursor:pointer;padding:16px 20px;font-size:13.5px;font-weight:700;color:var(--ink);transition:background .15s}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:hover{background:var(--bg)}

.faq-chev{flex-shrink:0;width:18px;height:18px;color:var(--muted);transition:transform .2s}
.faq-item[open] .faq-chev{transform:rotate(180deg);color:var(--orange)}
.faq-item[open] summary{color:var(--orange)}

.faq-answer{padding:0 20px 16px;font-size:13px;color:var(--body);line-height:1.7}

@media(max-width:760px){
  .faq-hero{margin-top:8px}
  .faq-hero h1{font-size:21px}
  .faq-list{margin:14px auto 32px;border-radius:var(--radius-sm)}
  .faq-item summary{padding:13px 16px;font-size:12.5px;gap:10px}
  .faq-answer{padding:0 16px 13px;font-size:12px}
}