/* #faq: copied from the Validator LP FAQ (apps/vbe-web/lp/sections/07-start, .st-faq) and adapted to native <details>:
 * centred two-tone heading, a gradient label line, white question cards with a spectrum hairline when hovered or open.
 * The answer opens inside its card, so the two columns never reflow. */
#faq{overflow:hidden}
#faq .fq-glow{position:absolute;left:50%;top:160px;z-index:0;width:min(760px,100%);height:340px;translate:-50% 0;border-radius:50%;filter:blur(70px);pointer-events:none;
  background:var(--grad);opacity:.08}
#faq .wrap{position:relative;z-index:1;max-width:calc(880px + var(--gutter) * 2)}
#faq .fq-in{text-align:center}
#faq .fq-eb{justify-content:center}
#faq .fq-h{margin-top:16px;text-wrap:balance}
#faq .fq-h span{display:block}
#faq .fq{margin-top:44px}
#faq .fq-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 16px;padding:0 6px}
#faq .fq-label{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:500;line-height:1.5;letter-spacing:.17em;text-transform:uppercase;color:var(--muted)}
#faq .fq-label::before{content:"";width:22px;height:2px;border-radius:2px;background:var(--grad)}
#faq .fq-stat{display:flex;align-items:center;gap:10px;font-size:12.5px;line-height:1.5;color:var(--muted)}
#faq .fq-stat i{width:7px;height:7px;border-radius:50%;background:var(--green)}
#faq .fq-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:12px;margin-top:14px}
#faq .fq-card{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 1px 2px rgba(12,21,41,.04);
  transition:border-color .25s,box-shadow .3s ease,translate .3s var(--ease)}
#faq .fq-card::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad);transform:scaleX(0);transform-origin:0;transition:transform .5s var(--ease)}
#faq .fq-card:hover{border-color:#c4cbd6;translate:0 -1px;box-shadow:0 26px 60px -44px rgba(12,21,41,.55)}
#faq .fq-card:hover::before,#faq .fq-card[open]::before{transform:scaleX(1)}
#faq .fq-card[open]{border-color:#d6dce5;box-shadow:0 30px 70px -48px rgba(12,21,41,.45);translate:none}
#faq .fq-b{display:grid;grid-template-columns:28px minmax(0,1fr) 28px;align-items:center;gap:10px;min-height:76px;padding:16px 16px 16px 18px;cursor:pointer;list-style:none;border-radius:18px}
#faq .fq-b::-webkit-details-marker{display:none}
#faq .fq-b:focus-visible{outline:3px solid var(--blue-ink);outline-offset:-3px}
#faq .fq-n{font-size:12px;font-weight:600;line-height:1.6;font-variant-numeric:tabular-nums;color:var(--c-ink)}
#faq .fq-t{font-size:15.5px;font-weight:500;line-height:1.45;letter-spacing:-.01em;color:var(--ink)}
#faq .fq-go{display:grid;place-items:center;width:28px;height:28px;border:1px solid var(--line);border-radius:50%;background:#fff;color:var(--muted);
  transition:background-color .25s,border-color .25s,color .25s}
#faq .fq-go svg{transition:transform .35s var(--ease)}
#faq .fq-card:hover .fq-go,#faq .fq-card[open] .fq-go{background:var(--ink);border-color:var(--ink);color:#fff}
#faq .fq-card[open] .fq-go svg{transform:rotate(90deg)}
#faq .fq-ans{padding:0 18px 18px 56px}
#faq .fq-ans p{font-size:14.5px;line-height:1.65;color:var(--body)}
#faq .fq-talk{margin-top:12px;display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:500;color:var(--ink);text-decoration:underline;text-decoration-color:#cfd6df;text-underline-offset:4px}
#faq .fq-talk:hover{text-decoration-color:var(--ink)}
#faq .fq-talk svg{transition:translate .3s var(--ease)}
#faq .fq-talk:hover svg{translate:3px 0}
.motion #faq .fq-card[open] .fq-ans{animation:fq-in .45s var(--ease) both}
@keyframes fq-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

@media (max-width:760px){
  #faq .fq-grid{grid-template-columns:minmax(0,1fr)}
  #faq .fq-b{min-height:0;padding:14px 14px 14px 16px;grid-template-columns:24px minmax(0,1fr) 28px}
  #faq .fq-ans{padding:0 16px 16px 50px}
}
@media (max-width:420px){
  #faq .fq-ans{padding-left:16px}
}