/* FAQ page: builds on about.css */
.faq-top { padding-bottom: clamp(110px, 12vw, 160px); }
.faq-top .wrap { position: relative; z-index: 1; }
.faq-top .sub { max-width: 52ch; }
.faq-top .sub a { color: #ffd48a; text-decoration: underline; text-underline-offset: 3px; }
.faq-group + .faq-group { padding-top: 0; }
.wg .faq-list { display: grid; gap: 12px; }
.faq-list details { background: #fff; border-radius: 18px; box-shadow: 0 1px 0 var(--line); border-left: 5px solid #3378e6; }
.faq-list summary { cursor: pointer; list-style: none; padding: 18px 52px 18px 22px; font-weight: 800; font-size: 18px; color: var(--ink); position: relative; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { content: "+"; position: absolute; right: 22px; top: 50%; transform: translateY(-50%); font-size: 24px; line-height: 1; color: #3378e6; transition: transform 0.2s ease; }
.faq-list details[open] summary::after { transform: translateY(-50%) rotate(45deg); }
.faq-list summary:focus-visible { outline: 3px solid #3378e6; outline-offset: 2px; border-radius: 18px; }
.faq-list details p { padding: 0 22px 20px; margin: 0; color: var(--ink-2); font-size: 17px; line-height: 1.55; }
.faq-list details p a { color: #2a5bb5; }
@media (prefers-reduced-motion: reduce) { .faq-list summary::after { transition: none; } }