.faq-section { width: min(1080px, calc(100% - 44px)); margin: 0 auto; padding: 0 0 120px; }
.faq-heading { max-width: 660px; margin: 0 auto 34px; text-align: center; }
.faq-heading > p:first-child { margin: 0; color: var(--purple-bright); font: 700 9px "Space Mono", monospace; letter-spacing: .15em; }
.faq-heading h2 { margin: 12px 0 15px; font-size: clamp(42px, 5.5vw, 76px); font-weight: 900; letter-spacing: -.085em; line-height: .86; text-transform: uppercase; }
.faq-heading h2 span { color: var(--purple-bright); text-shadow: 0 0 28px var(--purple-glow); }
.faq-heading > p:last-child:not(:first-child) { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.faq-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
.faq-item { overflow: hidden; border: 1px solid #3f3747; border-radius: 15px; background: linear-gradient(145deg, #100d15, #0b0810); }
.faq-item[open] { border-color: #6952bf; background: radial-gradient(circle at 100% 0, #4d2ab02e, transparent 44%), linear-gradient(145deg, #151020, #0b0810); }
.faq-item summary { min-height: 74px; padding: 0 19px; display: flex; align-items: center; justify-content: space-between; gap: 14px; cursor: pointer; list-style: none; color: var(--text); font-size: 11px; font-weight: 900; letter-spacing: .065em; line-height: 1.25; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary b { width: 26px; height: 26px; display: grid; flex: 0 0 auto; place-items: center; border: 1px solid #5a4e66; border-radius: 50%; color: var(--purple-bright); font-size: 19px; font-weight: 500; line-height: 1; transition: transform .18s ease, background .18s ease; }
.faq-item[open] summary b { transform: rotate(45deg); border-color: #8068e6; background: #2b1d5e; color: #fff; }
.faq-item > div { padding: 0 19px 20px; color: var(--muted); font-size: 12px; line-height: 1.6; }
.faq-item > div p { margin: 0; }
.faq-item > div a { color: #c5b8ff; font-weight: 800; }
.faq-item > div a:hover { color: #fff; }
.faq-item summary:focus-visible { outline: 2px solid var(--purple-bright); outline-offset: -3px; }

@media (max-width: 760px) {
  .faq-section { width: min(100% - 26px, 1080px); padding-bottom: 76px; }
  .faq-grid { grid-template-columns: 1fr; }
  .faq-item summary { min-height: 66px; }
}

@media (max-width: 560px) {
  .faq-heading { margin-bottom: 25px; }
  .faq-heading h2 { font-size: 40px; }
  .faq-heading > p:last-child:not(:first-child) { font-size: 12px; }
  .faq-item summary { padding: 0 16px; font-size: 10px; }
  .faq-item > div { padding: 0 16px 18px; font-size: 12px; }
}
