/* ============================================================
   FAQ PAGE — desktop + mobile
   Nested accordions (category -> question). Visual language and
   active-glow mirror the "AI as a Force Multiplier" accordion.
   Built only from MSHRM design-system tokens.
   ============================================================ */

.faq-root{background:var(--ink-900)}

/* ---------- desktop hero ---------- */
.faq-desktop{background:var(--ink-900)}
.faq-hero{position:relative;background:var(--ink-900);overflow:hidden;margin-top:-6.25rem;padding:11.75rem 0 3.75rem}
.faq-hero::before{content:"";position:absolute;top:-10%;left:50%;transform:translateX(-50%);width:56.25rem;height:32.5rem;pointer-events:none;
  background:radial-gradient(60% 60% at 50% 0%,color-mix(in srgb,var(--ai-500) 16%,transparent),transparent 70%)}
.faq-hero-in{position:relative;max-width:61.25rem;margin:0 auto;padding:0 4.375rem}
.faq-hero-eb{margin:0 0 1.125rem}
.faq-hero-h{font-family:var(--font-display);font-weight:900;text-transform:uppercase;font-size:clamp(2.8rem,5vw,5rem);
  line-height:.9;letter-spacing:-.015em;color:#fff;margin:0}
.faq-hero-h .ds-accent{line-height:.94}
.faq-hero-sub{font-family:var(--font-sans);font-size:1.15rem;line-height:1.6;color:var(--fg-on-dark-2);margin:1.5rem 0 0;max-width:52ch}

/* ---------- desktop body ---------- */
.faq-body{background:var(--ink-900);padding:1.25rem 0 6.875rem}
.faq-body-in{max-width:61.25rem;margin:0 auto;padding:0 4.375rem}
.faq-list{border-top:1px solid var(--ink-700)}

/* category (level 1) */
.faq-cat{border-bottom:1px solid var(--ink-700);transition:background .35s var(--ease)}
.faq-cat:hover,.faq-cat.is-open{background:linear-gradient(90deg,color-mix(in srgb,var(--ai-500) 11%,transparent),transparent 64%)}
.faq-cat-h{margin:0}
.faq-cat-btn{width:100%;display:flex;align-items:center;gap:1.375rem;padding:1.875rem 0.5rem;background:none;border:0;text-align:left;cursor:pointer;transition:padding .3s var(--ease)}
.faq-cat:hover .faq-cat-btn,.faq-cat.is-open .faq-cat-btn{padding-left:1.125rem}
.faq-cat-n{font-family:var(--font-mono);font-size:0.8125rem;font-weight:600;letter-spacing:.12em;color:var(--pink-500);flex:none;transition:color .35s var(--ease),text-shadow .35s var(--ease)}
.faq-cat.is-open .faq-cat-n{color:var(--ai-500);text-shadow:0 0 14px color-mix(in srgb,var(--ai-500) 70%,transparent)}
.faq-cat-t{font-family:var(--font-display);font-weight:700;text-transform:uppercase;font-size:1.95rem;line-height:1;color:#fff;margin-right:auto}
.faq-cat-meta{font-family:var(--font-mono);font-size:0.75rem;font-weight:500;letter-spacing:.08em;color:var(--fg-on-dark-3);flex:none;padding:0.25rem 0.6875rem;border:1px solid var(--ink-600);border-radius:var(--r-pill)}
.faq-cat.is-open .faq-cat-meta{color:var(--ai-500);border-color:color-mix(in srgb,var(--ai-500) 45%,transparent)}
.faq-cat-chev{display:inline-flex;flex:none;color:var(--fg-on-dark-2);transition:transform .35s var(--ease),color .35s var(--ease)}
.faq-cat.is-open .faq-cat-chev{transform:rotate(180deg);color:var(--ai-500)}
.faq-cat-panel-in{padding:0.125rem 0.5rem 1.125rem 3.125rem}

/* question (level 2) */
.faq-q{border-top:1px solid var(--ink-700)}
.faq-q:first-child{border-top:0}
.faq-q-h{margin:0}
.faq-q-btn{width:100%;display:flex;align-items:flex-start;gap:1.125rem;padding:1.25rem 0.25rem;background:none;border:0;text-align:left;cursor:pointer}
.faq-q-t{font-family:var(--font-sans);font-weight:500;font-size:1.08rem;line-height:1.35;color:var(--fg-on-dark);margin-right:auto;transition:color .25s var(--ease)}
.faq-q:hover .faq-q-t{color:#fff}
.faq-q-chev{display:inline-flex;flex:none;margin-top:0.125rem;color:var(--fg-on-dark-3);transition:transform .35s var(--ease),color .35s var(--ease)}
.faq-q.is-open .faq-q-chev{transform:rotate(45deg);color:var(--ai-500)}
.faq-q.is-open .faq-q-t{color:#fff}
.faq-q-panel-in{overflow:hidden}
.faq-q-panel-in p{margin:0;padding:0 2.75rem 1.375rem 0;font-family:var(--font-sans);font-size:1rem;line-height:1.7;color:var(--fg-on-dark-2);max-width:74ch}

/* ============================================================
   MOBILE FAQ
   ============================================================ */
.faq-mobile{background:var(--ink-900)}
.faq-m-hero{position:relative;background:var(--ink-900);overflow:hidden;padding:1.125rem 1.375rem 1.875rem}
.faq-m-hero::before{content:"";position:absolute;top:-2.5rem;right:-2.5rem;width:17.5rem;height:17.5rem;pointer-events:none;
  background:radial-gradient(circle,color-mix(in srgb,var(--ai-500) 20%,transparent),transparent 68%)}
.faq-m-hero-bar{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:0.5rem 0 0}
.faq-m-brand{background:none;border:0;padding:0;display:flex;cursor:pointer}
.faq-m-logo{height:2.875rem;width:auto;display:block}
.faq-m-burger{background:none;border:0;padding:0.25rem;display:flex;cursor:pointer}
.faq-m-eb{position:relative;z-index:2;margin:1.875rem 0 0.75rem}
.faq-m-hero-h{position:relative;z-index:2;font-family:var(--font-display);font-weight:900;text-transform:uppercase;font-size:2.9rem;line-height:.9;letter-spacing:-.01em;color:#fff;margin:0}
.faq-m-hero-h .ds-accent{line-height:.94}
.faq-m-hero-sub{position:relative;z-index:2;font-family:var(--font-sans);font-size:1rem;line-height:1.55;color:var(--fg-on-dark-2);margin:1rem 0 0}

.faq-m-body{background:var(--ink-900);padding:0.5rem 1.375rem 3.125rem}
.faq-mobile .faq-list{border-top:1px solid var(--ink-700)}
.faq-mobile .faq-cat-btn{gap:0.875rem;padding:1.375rem 0.125rem}
.faq-mobile .faq-cat:hover .faq-cat-btn,.faq-mobile .faq-cat.is-open .faq-cat-btn{padding-left:0.625rem}
.faq-mobile .faq-cat-t{font-size:1.4rem;line-height:1.05}
.faq-mobile .faq-cat-meta{padding:0.1875rem 0.5625rem;font-size:0.6875rem}
.faq-mobile .faq-cat-chev{align-self:flex-start;margin-top:0.1875rem}
.faq-mobile .faq-cat-panel-in{padding:0 0 0.875rem 1.625rem}
.faq-mobile .faq-q-btn{gap:0.875rem;padding:1.0625rem 0.125rem}
.faq-mobile .faq-q-t{font-size:1rem}
.faq-mobile .faq-q-panel-in p{padding:0 0.375rem 1.25rem 0;font-size:.96rem;line-height:1.65}
