.faq{position:relative;isolation:isolate;overflow:hidden}
.faq .sonar{position:absolute;inset:0;width:100%;height:100%;z-index:-2;pointer-events:none;color:#9aa4b0}
:root[data-theme="dark"] .faq .sonar{color:#6b7787}
.faq-wash{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(ellipse 44% 46% at 50% 56%,var(--bg) 0%,transparent 100%)}
.faq .wrap{cursor:default}
section.sec.faq{padding-block:64px 56px}
.faq-head{position:relative;z-index:1;text-align:center;margin:0 auto 36px}
.faq-head::before{content:'';position:absolute;inset:-36px 22%;z-index:-1;pointer-events:none;
  background:radial-gradient(closest-side,var(--bg) 55%,transparent)}
.faq-head h2{font-size:clamp(22px,2.8vw,33px)}

.faq-stage{position:relative;display:flex;justify-content:center}
.faq-drum{--drum-r:300px;position:relative;flex:0 1 760px;min-width:0;height:500px;perspective:1100px;outline:none}
.faq-drum:focus-visible{outline:2px solid var(--blue);outline-offset:6px;border-radius:18px}

.faq{--faq-card:#e9edf2;--faq-card-line:#d3dbe5}
:root[data-theme="dark"] .faq{--faq-card:var(--surface);--faq-card-line:var(--line)}
.faq-item{position:absolute;left:0;right:0;top:50%;margin-inline:auto;width:min(100%,720px);
  transform-origin:50% 50%;backface-visibility:hidden;will-change:transform,opacity;
  background:var(--faq-card);border:1px solid var(--faq-card-line);border-radius:18px;
  box-shadow:0 10px 30px -12px rgba(17,43,74,.28),0 2px 6px rgba(17,43,74,.06);
  transition:transform 640ms cubic-bezier(.22,.8,.24,1),opacity 640ms ease,box-shadow 640ms ease;
  cursor:pointer}
:root[data-theme="dark"] .faq-item{box-shadow:0 14px 36px -12px rgba(0,0,0,.7),0 2px 6px rgba(0,0,0,.35)}
.faq-item.is-open{cursor:default;box-shadow:0 26px 60px -18px rgba(17,43,74,.42),0 4px 10px rgba(17,43,74,.08)}
:root[data-theme="dark"] .faq-item.is-open{box-shadow:0 26px 60px -18px rgba(0,0,0,.85),0 0 0 1px rgba(60,200,255,.18)}
.faq-item.is-far{transition:opacity 200ms ease;pointer-events:none}

.faq-q{display:flex;align-items:baseline;gap:14px;width:100%;padding:18px 24px;border:0;background:none;
  font:inherit;color:var(--fg);text-align:start;cursor:inherit}
.faq-q:focus-visible{outline:2px solid var(--blue);outline-offset:-4px;border-radius:14px}
.faq-n{flex:none;font-size:13px;font-weight:700;color:var(--blue);letter-spacing:.02em;min-width:2ch}
:root[data-theme="dark"] .faq-n{color:var(--blue-lt)}
.faq-qt{font-size:16.5px;font-weight:700;line-height:1.8}
.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows 520ms cubic-bezier(.22,.8,.24,1)}
.faq-item.is-open .faq-a{grid-template-rows:1fr}
.faq-ain{min-height:0;overflow:hidden}
.faq-ain p{margin:0;padding-block:0 8px;padding-inline:calc(24px + 2ch + 14px) 24px;color:var(--fg-2);font-size:15px;line-height:1.95}
.faq-ain p:last-child{padding-bottom:20px}

@media(max-width:760px){
  section.sec.faq{padding-block:48px 41px}
  .faq-head{margin-bottom:28px}
  .faq-drum{--drum-r:215px;flex:none;width:100%;height:370px}
  .faq-q{padding:15px 18px;gap:10px}
  .faq-qt{font-size:15.5px}
  .faq-ain p{padding-inline:18px}
  .faq-ain p:last-child{padding-bottom:18px}
}
@media (prefers-reduced-motion:reduce){
  .faq-item,.faq-a{transition:none}
}