/* ============================================================================
   W-DOCS · Documentation  /documentation/  · Tier 4 · Resources · knowledge base
   Theme rhythm D · L · L · L · D · L · L · L · L(nebula close).
   Prefixes: dxh- hero · dxr- search results · dxq- quick-start · dxc- categories ·
             dxp- popular · dxa- API band · dxv- videos · dxf- FAQ · dxs- support.
   Article/category CONTENT is generated from src/data/helpdocs.json
   (`npm run sync:docs` → scripts/sync-help-docs.js crawls help.slashexperts.com).
   The "what's-new" changelog section (dxn-) was removed — it had no data source.
   Foundation-only: every value is a --w-* token. Type: --w-fs-body for paragraphs.
   ============================================================================ */
/* ===== light-band technique (.cz-light) — WHITE variant (verbatim from sibling Carly-depth pages) ===== */
.cz-light{
  background:var(--w-bg);color:var(--w-text);
  --w-bg:#ffffff; --w-bg-deep:#ececec; --w-bg-elev:#ffffff;
  --w-card:#ffffff; --w-card-lo:#efefef; --w-card-hi:#ffffff;
  --w-text:var(--w-charcoal); --w-text-2:rgba(28,26,36,0.66); --w-text-3:rgba(28,26,36,0.62);
  --w-text-prose:#302d2e; --w-text-on-brand:#ffffff; --w-icon-ink:var(--w-charcoal);
  --w-line-soft:rgba(28,26,36,0.06); --w-line:rgba(28,26,36,0.10); --w-line-strong:rgba(28,26,36,0.16); --w-edge-top:rgba(255,255,255,0.9);
  --w-brand:var(--w-purple-ink); --w-brand-2:var(--w-purple); --w-brand-soft:rgba(152,135,244,0.10); --w-brand-line:rgba(152,135,244,0.28);
  --w-shadow-raise:0 8px 18px -8px rgba(28,26,36,0.07), inset 0 1px 0 rgba(255,255,255,0.9);
  --w-shadow-raise-soft:0 4px 10px -6px rgba(28,26,36,0.05), inset 0 1px 0 rgba(255,255,255,0.85);
  --w-shadow-recess:inset 0 1px 3px rgba(28,26,36,0.05), inset 0 -1px 0 rgba(255,255,255,0.8);
  --w-shadow-recess-deep:inset 0 2px 5px rgba(28,26,36,0.07), inset 0 -1px 0 rgba(255,255,255,0.7);
  --w-shadow-sm:0 1px 2px rgba(28,26,36,0.04); --w-shadow-md:0 4px 12px rgba(28,26,36,0.05); --w-shadow-lg:0 12px 28px rgba(28,26,36,0.07);
  --w-glow-brand:0 2px 8px rgba(28,26,36,0.05); --w-glow-brand-strong:0 6px 16px rgba(28,26,36,0.07);
  --w-glass-fill:rgba(255,255,255,0.66); --w-glass-fill-strong:rgba(255,255,255,0.86); --w-glass-tint:rgba(28,26,36,0.90);
  --w-glass-fill-soft:rgba(28,26,36,0.03); --w-glass-line:rgba(28,26,36,0.10); --w-glass-line-bright:rgba(28,26,36,0.16);
  --w-glass-rim-top:rgba(255,255,255,0.95); --w-glass-rim-bottom:rgba(28,26,36,0.05);
  --w-glass-blur:blur(18px) saturate(140%); --w-glass-blur-lg:blur(22px) saturate(145%);
  --w-glass-shadow:0 10px 24px rgba(28,26,36,0.06); --w-glass-shadow-soft:0 4px 12px rgba(28,26,36,0.05);
  --w-cta-fill:var(--w-glass-tint); --w-cta-text:#ffffff; --w-cta-glow:var(--w-shadow-md); --w-cta-glow-strong:var(--w-shadow-lg);
  --w-card-brand-wash:linear-gradient(160deg, rgba(28,26,36,0.06), rgba(28,26,36,0.015)); --w-card-brand-line:var(--w-line-strong);
  --w-tag-brand-bg:rgba(28,26,36,0.06); --w-tag-brand-fg:var(--w-text); --w-focus:rgba(28,26,36,0.55);
  --w-grad-surface:linear-gradient(180deg, #ffffff 0%, #f5f5f5 100%);
  --w-grad-surface-hi:linear-gradient(180deg, #ffffff 0%, #fafafa 100%);
  --w-grad-recess:linear-gradient(180deg, #ededed 0%, #e3e3e3 100%);
  /* ⚠️ MUST re-declare: --w-edge-fade is declared in :root with var(--w-bg) INSIDE it, so it
     substitutes to the DARK bg there and inherits already-resolved. Without this, every cux-
     scene's edge-fade dissolves to charcoal on a white section (the "gray box" bug). */
  --w-edge-fade:radial-gradient(ellipse 84% 82% at 50% 48%, transparent 52%, var(--w-bg) 100%);
}
@media (prefers-reduced-transparency: reduce){
  .cz-light .w-glass,.cz-light .w-btn--glass,.cz-light .w-tag,.cz-light .w-card,.cz-light .w-cta-band{background:var(--w-card);border-color:var(--w-line)}
}

/* ===== asymmetric section rhythm (tight top / generous bottom) ===== */
.w-section{padding-block:clamp(36px, 2.2vw + 1rem, 64px) clamp(64px, 4vw + 1.7rem, 108px)}
.w-section--hero{padding-block:clamp(96px, 6rem + 5vw, 168px) clamp(72px, 5vw + 2rem, 128px)}
.w-badge{box-shadow:0 2px 10px rgba(12,10,22,.12), inset 0 1px 0 var(--w-glass-rim-top)}
.w-panel-rise{--w-panel-overlap:34px}


/* ═══ §1 · HERO — DARK · search-first knowledge base ═══════════════════════════ */
.dxh{position:relative;overflow:hidden;isolation:isolate;text-align:center;
  padding-block:clamp(72px,10vw,132px) clamp(80px,9vw,128px)}
.dxh::before{content:"";position:absolute;inset:0;z-index:-1;
  background:radial-gradient(120% 90% at 50% 0%, rgba(152,135,244,0.18) 0%, transparent 60%)}
.dxh__wrap{max-width:820px;margin-inline:auto;display:flex;flex-direction:column;align-items:center}
.dxh__title{font-size:var(--w-fs-display);font-weight:var(--w-fw-black);letter-spacing:var(--w-ls-tight);
  line-height:1.02;margin-top:var(--w-s-4);color:#fff}
.dxh__lead{margin-top:var(--w-s-5);max-width:60ch;color:rgba(255,255,255,0.82)}
/* z-index matters: the results panel drops out of this box over the chips and
   stats below it. Those are later siblings, so without an explicit stacking
   order they paint ON TOP of the panel. */
.dxh__search{position:relative;z-index:50;margin-top:var(--w-s-7);width:min(640px,100%);display:flex;align-items:center;gap:var(--w-s-3);
  padding:8px 8px 8px var(--w-s-5);border-radius:var(--w-r-pill);
  background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.08), 0 12px 30px -12px rgba(0,0,0,0.5);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.dxh__search-ic{width:20px;height:20px;color:rgba(255,255,255,0.6);flex:none}
.dxh__input{flex:1;min-width:0;background:transparent;border:none;outline:none;color:#fff;
  font-family:var(--w-font);font-size:var(--w-fs-body)}
.dxh__input::placeholder{color:rgba(255,255,255,0.5)}
.dxh__searchbtn{flex:none;border:none;cursor:pointer;padding:11px 22px;border-radius:var(--w-r-pill);
  background:var(--w-grad-brand);color:var(--w-charcoal);font-family:var(--w-font);
  font-size:var(--w-fs-sm);font-weight:var(--w-fw-bold);box-shadow:var(--w-glow-brand);
  transition:box-shadow var(--w-dur) var(--w-ease),transform var(--w-dur) var(--w-ease)}
.dxh__searchbtn:hover{box-shadow:var(--w-glow-brand-strong);transform:translateY(-1px)}
.dxh__clear{flex:none;display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;
  border:none;background:rgba(255,255,255,0.12);border-radius:50%;cursor:pointer;color:rgba(255,255,255,0.75);
  transition:background var(--w-dur) var(--w-ease),color var(--w-dur) var(--w-ease)}
.dxh__clear:hover{background:rgba(255,255,255,0.22);color:#fff}
.dxh__clear .w-icon{width:14px;height:14px}
.dxh__clear[hidden]{display:none}

/* ── search results dropdown ─────────────────────────────────────────────── */
.dxr{position:absolute;top:calc(100% + 10px);left:0;right:0;z-index:40;text-align:left;
  border-radius:var(--w-r-xl);overflow:hidden;background:var(--w-charcoal);
  border:1px solid rgba(255,255,255,0.14);box-shadow:0 26px 60px -18px rgba(0,0,0,0.7);
  -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
.dxr[hidden]{display:none}
.dxr__status{padding:10px var(--w-s-5);font-family:var(--w-font-kicker);text-transform:uppercase;
  letter-spacing:.08em;font-size:var(--w-fs-xs);font-weight:var(--w-fw-bold);color:rgba(255,255,255,0.45);
  border-bottom:1px solid rgba(255,255,255,0.09)}
.dxr__list{max-height:min(56vh,440px);overflow-y:auto;overscroll-behavior:contain}
.dxr__item{display:flex;align-items:flex-start;gap:var(--w-s-4);padding:var(--w-s-4) var(--w-s-5);
  text-decoration:none;border-bottom:1px solid rgba(255,255,255,0.07);
  transition:background var(--w-dur) var(--w-ease)}
.dxr__item:last-child{border-bottom:none}
.dxr__item:hover,.dxr__item.is-active,.dxr__item:focus-visible{background:rgba(255,255,255,0.08);outline:none}
.dxr__ic{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;flex:none;
  border-radius:var(--w-r-md);background:rgba(255,255,255,0.1);color:var(--w-brand-2)}
.dxr__ic .w-icon{width:16px;height:16px}
.dxr__tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.dxr__t{font-size:var(--w-fs-body);font-weight:var(--w-fw-bold);color:#fff;line-height:1.35}
.dxr__d{font-size:var(--w-fs-sm);line-height:1.5;color:rgba(255,255,255,0.62);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.dxr__m{margin-top:2px;font-size:var(--w-fs-xs);font-weight:var(--w-fw-semi);color:rgba(255,255,255,0.42)}
.dxr__go{width:16px;height:16px;flex:none;margin-top:9px;color:rgba(255,255,255,0.35)}
.dxr__item:hover .dxr__go,.dxr__item.is-active .dxr__go{color:var(--w-brand-2)}
.dxr mark{background:rgba(152,135,244,0.28);color:#fff;border-radius:3px;padding:0 2px}
.dxr__empty{padding:var(--w-s-6) var(--w-s-5);font-size:var(--w-fs-body);line-height:1.6;color:rgba(255,255,255,0.7)}
.dxr__empty a{color:var(--w-brand-2);text-decoration:underline;text-underline-offset:3px}

.dxh__chips{margin-top:var(--w-s-5);display:flex;flex-wrap:wrap;justify-content:center;gap:var(--w-s-3)}
.dxh__chip{display:inline-flex;align-items:center;padding:7px 15px;border-radius:var(--w-r-pill);
  font-family:inherit;cursor:pointer;
  font-size:var(--w-fs-sm);font-weight:var(--w-fw-semi);text-decoration:none;color:rgba(255,255,255,0.86);
  background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.14);
  transition:background var(--w-dur) var(--w-ease),border-color var(--w-dur) var(--w-ease),color var(--w-dur) var(--w-ease)}
.dxh__chip:hover{background:rgba(255,255,255,0.13);border-color:rgba(255,255,255,0.3);color:#fff}
.dxh__stats{margin-top:var(--w-s-7);display:flex;flex-wrap:wrap;justify-content:center;gap:var(--w-s-3) var(--w-s-6)}
.dxh__stat{display:inline-flex;align-items:center;gap:8px;font-size:var(--w-fs-sm);font-weight:var(--w-fw-semi);color:rgba(255,255,255,0.72)}
.dxh__stat .w-icon{width:16px;height:16px;color:var(--w-brand-2)}

/* ═══ §2 · QUICK-START — LIGHT (panel-rise) · 3-step guided path ═══════════════ */
.dxq__title{font-size:var(--w-fs-h2);font-weight:var(--w-fw-bold);letter-spacing:var(--w-ls-tight);line-height:var(--w-lh-snug)}
.dxq__lead{margin-top:var(--w-s-4);max-width:52ch;margin-inline:auto}
.dxq__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--w-s-6);margin-top:var(--w-s-8)}
/* surface = DS7 .w-card .w-card--brand .w-card--link (glass brand card); layout only here */
.dxq__step{gap:0;align-items:flex-start}
.dxq__num{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;flex:none;
  border-radius:var(--w-r-md);background:var(--w-cta-fill);color:#fff;font-family:var(--w-font-kicker);
  font-size:var(--w-fs-lead);font-weight:var(--w-fw-bold);box-shadow:inset 0 1px 0 rgba(255,255,255,0.3),var(--w-cta-glow);margin-bottom:var(--w-s-5)}
.dxq__h{font-size:var(--w-fs-lead);font-weight:var(--w-fw-bold);letter-spacing:var(--w-ls-tight);color:var(--w-text)}
.dxq__b{margin-top:var(--w-s-3);font-size:var(--w-fs-body);line-height:1.6;color:var(--w-text-2)}
.dxq__go{margin-top:var(--w-s-5);display:inline-flex;align-items:center;gap:7px;font-size:var(--w-fs-sm);
  font-weight:var(--w-fw-bold);color:var(--w-brand)}
.dxq__go .w-icon{width:14px;height:14px;transition:transform var(--w-dur) var(--w-ease)}
.dxq__step:hover .dxq__go .w-icon{transform:translate(2px,-2px)}
.dxq__cta{margin-top:var(--w-s-7);display:flex;justify-content:center}

/* ═══ §3 · BROWSE BY CATEGORY — LIGHT · 6 topic cards ═════════════════════════ */
.dxc__title{font-size:var(--w-fs-h2);font-weight:var(--w-fw-bold);letter-spacing:var(--w-ls-tight);line-height:var(--w-lh-snug)}
.dxc__lead{margin-top:var(--w-s-4);max-width:56ch;margin-inline:auto}
.dxc__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--w-s-6);margin-top:var(--w-s-8)}
/* surface = DS7 .w-card .w-card--brand .w-card--link (glass brand card); layout only here */
.dxc__card{gap:0}
.dxc__ic{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;flex:none;
  border-radius:var(--w-r-md);background:var(--w-cta-fill);box-shadow:inset 0 1px 0 rgba(255,255,255,0.35),var(--w-cta-glow);margin-bottom:var(--w-s-5)}
.dxc__ic .w-icon{width:22px;height:22px;color:#fff}
.dxc__h{font-size:var(--w-fs-lead);font-weight:var(--w-fw-bold);letter-spacing:var(--w-ls-tight);color:var(--w-text)}
.dxc__b{margin-top:var(--w-s-3);font-size:var(--w-fs-body);line-height:1.55;color:var(--w-text-2)}
.dxc__links{margin-top:var(--w-s-5);display:flex;flex-direction:column;gap:2px;border-top:1px solid var(--w-line-soft);padding-top:var(--w-s-4)}
.dxc__link{display:block;padding:7px 0;font-size:var(--w-fs-sm);font-weight:var(--w-fw-semi);color:var(--w-text-2);
  text-decoration:none;transition:color var(--w-dur) var(--w-ease),padding var(--w-dur) var(--w-ease)}
.dxc__link:hover{color:var(--w-brand);padding-left:6px}
.dxc__all{display:inline-flex;align-items:center;gap:6px;color:var(--w-brand);text-decoration:none}
.dxc__all .w-icon{width:13px;height:13px}
.dxc__all:hover{text-decoration:underline;text-underline-offset:3px}
.dxc__count{margin-top:var(--w-s-4);font-family:var(--w-font-kicker);text-transform:uppercase;letter-spacing:.08em;
  font-size:var(--w-fs-xs);font-weight:var(--w-fw-bold);color:var(--w-text-3)}

/* ═══ §4 · MOST POPULAR — LIGHT · article rows ═══════════════════════════════ */
.dxp__head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--w-s-5);flex-wrap:wrap}
.dxp__title{font-size:var(--w-fs-h2);font-weight:var(--w-fw-bold);letter-spacing:var(--w-ls-tight);line-height:var(--w-lh-snug)}
.dxp__viewall{display:inline-flex;align-items:center;gap:6px;font-size:var(--w-fs-sm);font-weight:var(--w-fw-bold);color:var(--w-brand);text-decoration:none}
.dxp__viewall .w-icon{width:16px;height:16px;transition:transform var(--w-dur) var(--w-ease)}
.dxp__viewall:hover .w-icon{transform:translateX(3px)}
.dxp__list{margin-top:var(--w-s-7);display:flex;flex-direction:column;gap:var(--w-s-4)}
/* surface = DS7 .w-card .w-card--soft .w-card--link (soft widget); row layout override only */
.dxp__item{flex-direction:row;align-items:center;gap:var(--w-s-5);text-decoration:none}
.dxp__ic{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;flex:none;
  border-radius:var(--w-r-md);background:var(--w-card-brand-wash);color:var(--w-brand)}
.dxp__ic .w-icon{width:20px;height:20px}
.dxp__tx{flex:1;min-width:0}
.dxp__h{font-size:var(--w-fs-lead);font-weight:var(--w-fw-bold);letter-spacing:var(--w-ls-tight);color:var(--w-text)}
.dxp__b{margin-top:4px;font-size:var(--w-fs-body);line-height:1.5;color:var(--w-text-2)}
.dxp__meta{margin-top:var(--w-s-3);display:flex;gap:var(--w-s-5);flex-wrap:wrap}
.dxp__meta span{display:inline-flex;align-items:center;gap:6px;font-size:var(--w-fs-sm);color:var(--w-text-3)}
.dxp__meta .w-icon{width:15px;height:15px}
.dxp__arrow{width:20px;height:20px;flex:none;color:var(--w-text-3);transition:transform var(--w-dur) var(--w-ease),color var(--w-dur) var(--w-ease)}
.dxp__item:hover .dxp__arrow{transform:translateX(4px);color:var(--w-brand)}

/* ═══ §5 · API BAND — DARK (panel-rise) · developer code moment ═══════════════ */
.dxa__grid{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(32px,5vw,72px);align-items:center}
.dxa__grid>*{min-width:0}
.dxa__title{font-size:var(--w-fs-h2);font-weight:var(--w-fw-bold);letter-spacing:var(--w-ls-tight);
  line-height:var(--w-lh-snug);margin-top:var(--w-s-4);color:#fff}
.dxa__body{margin-top:var(--w-s-5);font-size:var(--w-fs-body);line-height:1.7;color:rgba(255,255,255,0.8);max-width:52ch}
.dxa__cta{margin-top:var(--w-s-7);display:flex;align-items:center;gap:var(--w-s-5);flex-wrap:wrap}
.dxa__ghost{display:inline-flex;align-items:center;font-size:var(--w-fs-sm);font-weight:var(--w-fw-bold);color:#fff;
  text-decoration:underline;text-underline-offset:4px;text-decoration-color:rgba(255,255,255,0.4)}
.dxa__ghost:hover{text-decoration-color:#fff}
.dxa__code{border-radius:var(--w-r-xl);overflow:hidden;background:rgba(0,0,0,0.34);
  border:1px solid rgba(255,255,255,0.12);box-shadow:0 24px 54px -22px rgba(0,0,0,0.6)}
.dxa__code-bar{display:flex;align-items:center;gap:8px;padding:12px var(--w-s-5);
  background:rgba(255,255,255,0.05);border-bottom:1px solid rgba(255,255,255,0.1)}
.dxa__dot{width:11px;height:11px;border-radius:50%;background:rgba(255,255,255,0.22)}
.dxa__file{margin-left:auto;font-family:var(--w-font-mono);font-size:var(--w-fs-xs);font-style:normal;color:rgba(255,255,255,0.5)}
.dxa__pre{margin:0;padding:var(--w-s-6);overflow-x:auto}
.dxa__pre code{font-family:var(--w-font-mono);font-size:var(--w-fs-sm);line-height:1.7;color:rgba(255,255,255,0.9);white-space:pre;display:block}
.dxa__pre .c-c{color:rgba(255,255,255,0.42)}
.dxa__pre .c-s{color:var(--w-brand-2)}
.dxa__pre .c-k{color:#fff;font-weight:var(--w-fw-semi)}
.dxa__pre .c-p{color:rgba(255,255,255,0.5)}

/* ═══ §6 · VIDEO TUTORIALS — LIGHT (panel-rise) · 3 cards ════════════════════ */
.dxv__title{font-size:var(--w-fs-h2);font-weight:var(--w-fw-bold);letter-spacing:var(--w-ls-tight);line-height:var(--w-lh-snug)}
.dxv__lead{margin-top:var(--w-s-4);max-width:52ch;margin-inline:auto}
.dxv__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--w-s-6);margin-top:var(--w-s-8)}
.dxv__card{display:flex;flex-direction:column;text-decoration:none;border-radius:var(--w-r-xl);overflow:hidden;
  background:var(--w-card);border:1px solid var(--w-line);box-shadow:var(--w-shadow-raise-soft);
  transition:border-color var(--w-dur) var(--w-ease),box-shadow var(--w-dur) var(--w-ease),transform var(--w-dur) var(--w-ease)}
.dxv__card:hover{border-color:var(--w-brand-line);box-shadow:var(--w-glow-brand);transform:translateY(-3px)}
/* Poster art comes from the help desk (video_poster_*.jpeg), set inline per card.
   The gradient underneath shows through while the poster loads, and stands in
   if a poster ever 404s. */
.dxv__thumb{position:relative;aspect-ratio:16/10;display:flex;align-items:center;justify-content:center;
  background-color:#26222f;background-image:linear-gradient(135deg,#26222f 0%,#3a3350 100%);
  background-size:cover;background-position:center top;background-repeat:no-repeat}
.dxv__thumb::after{content:"";position:absolute;inset:0;background:rgba(14,12,22,0.32);
  transition:background var(--w-dur) var(--w-ease)}
.dxv__card:hover .dxv__thumb::after{background:rgba(14,12,22,0.16)}
.dxv__play{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;
  background:rgba(255,255,255,0.92);box-shadow:0 8px 22px -8px rgba(0,0,0,0.5);transition:transform var(--w-dur) var(--w-ease)}
.dxv__play .w-icon{width:22px;height:22px;color:var(--w-charcoal);margin-left:2px}
.dxv__card:hover .dxv__play{transform:scale(1.08)}
.dxv__dur{position:absolute;right:10px;bottom:10px;padding:3px 9px;border-radius:var(--w-r-pill);
  font-family:var(--w-font-mono);font-size:var(--w-fs-xs);font-weight:var(--w-fw-semi);color:#fff;background:rgba(0,0,0,0.5);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.dxv__body{padding:var(--w-s-6)}
.dxv__tag{display:inline-block;font-family:var(--w-font-kicker);text-transform:uppercase;letter-spacing:.08em;
  font-size:var(--w-fs-xs);font-weight:var(--w-fw-bold);color:var(--w-brand)}
.dxv__h{margin-top:8px;font-size:var(--w-fs-lead);font-weight:var(--w-fw-bold);letter-spacing:var(--w-ls-tight);color:var(--w-text)}
.dxv__b{margin-top:var(--w-s-3);font-size:var(--w-fs-body);line-height:1.55;color:var(--w-text-2);
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.dxv__cta{margin-top:var(--w-s-7);display:flex;justify-content:center}

/* ═══ §7 · FAQ — LIGHT · native accordion ════════════════════════════════════ */
.dxf__wrap{max-width:820px}
.dxf__title{font-size:var(--w-fs-h2);font-weight:var(--w-fw-bold);letter-spacing:var(--w-ls-tight);line-height:var(--w-lh-snug)}
.dxf__list{margin-top:var(--w-s-8);display:flex;flex-direction:column;gap:var(--w-s-3)}
.dxf__item{border-radius:var(--w-r-lg);background:var(--w-card);border:1px solid var(--w-line);
  box-shadow:var(--w-shadow-raise-soft);overflow:hidden;transition:border-color var(--w-dur) var(--w-ease)}
.dxf__item[open]{border-color:var(--w-brand-line)}
.dxf__q{display:flex;align-items:center;justify-content:space-between;gap:var(--w-s-4);cursor:pointer;list-style:none;
  padding:var(--w-s-5) var(--w-s-6);font-size:var(--w-fs-lead);font-weight:var(--w-fw-semi);color:var(--w-text)}
.dxf__q::-webkit-details-marker{display:none}
.dxf__chev{width:20px;height:20px;flex:none;color:var(--w-text-3);transition:transform var(--w-dur) var(--w-ease)}
.dxf__item[open] .dxf__chev{transform:rotate(180deg);color:var(--w-brand)}
.dxf__a{padding:0 var(--w-s-6) var(--w-s-5)}
.dxf__a p{font-size:var(--w-fs-body);line-height:1.65;color:var(--w-text-2);max-width:64ch}

/* ═══ §8 · SUPPORT CTA — LIGHT · nebula band + channel cards ══════════════════ */
.dxs__band{position:relative;overflow:hidden;isolation:isolate;border-radius:var(--w-r-2xl);
  padding:clamp(48px,5vw,96px) var(--w-s-6);text-align:center;background:var(--w-charcoal)}
.dxs__band::before{content:"";position:absolute;inset:0;z-index:-1;
  background:radial-gradient(90% 130% at 50% 0%, rgba(152,135,244,0.32) 0%, transparent 58%),
             radial-gradient(70% 90% at 85% 110%, rgba(193,140,255,0.22) 0%, transparent 60%)}
.dxs__title{font-size:var(--w-fs-h1);color:#fff;max-width:680px;margin-inline:auto}
.dxs__body{margin-top:var(--w-s-4);font-size:var(--w-fs-body);line-height:1.6;color:rgba(255,255,255,0.82);max-width:56ch;margin-inline:auto}
.dxs__actions{margin-top:var(--w-s-7);display:flex;justify-content:center;align-items:center;gap:var(--w-s-5);flex-wrap:wrap}
.dxs__band .w-btn--primary{background:var(--w-grad-brand);color:var(--w-charcoal);box-shadow:var(--w-glow-brand)}
.dxs__band .w-btn--primary:hover{box-shadow:var(--w-glow-brand-strong)}
.dxs__ghost{display:inline-flex;align-items:center;font-size:var(--w-fs-sm);font-weight:var(--w-fw-bold);color:#fff;
  text-decoration:underline;text-underline-offset:4px;text-decoration-color:rgba(255,255,255,0.4)}
.dxs__ghost:hover{text-decoration-color:#fff}
.dxs__grid{margin-top:var(--w-s-6);display:grid;grid-template-columns:repeat(4,1fr);gap:var(--w-s-4)}
.dxs__ch{display:flex;flex-direction:column;align-items:flex-start;padding:var(--w-s-6);border-radius:var(--w-r-xl);
  background:var(--w-card);border:1px solid var(--w-line);box-shadow:var(--w-shadow-raise-soft);
  transition:border-color var(--w-dur) var(--w-ease),box-shadow var(--w-dur) var(--w-ease),transform var(--w-dur) var(--w-ease)}
.dxs__ch:hover{border-color:var(--w-brand-line);box-shadow:var(--w-glow-brand);transform:translateY(-3px)}
.dxs__ch-ic{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;
  border-radius:var(--w-r-md);background:var(--w-card-brand-wash);color:var(--w-brand);margin-bottom:var(--w-s-4)}
.dxs__ch-ic .w-icon{width:20px;height:20px}
.dxs__ch-h{font-size:var(--w-fs-lead);font-weight:var(--w-fw-bold);letter-spacing:var(--w-ls-tight);color:var(--w-text)}
.dxs__ch-b{margin-top:var(--w-s-3);font-size:var(--w-fs-body);line-height:1.55;color:var(--w-text-2)}

/* ═══ RESPONSIVE ═══════════════════════════════════════════════════════════════ */
@media(max-width:1024px){
  .dxc__grid{grid-template-columns:repeat(2,1fr)}
  .dxv__grid{grid-template-columns:repeat(2,1fr)}
  .dxs__grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:900px){
  .dxa__grid{grid-template-columns:1fr;gap:var(--w-s-7)}
  .dxq__grid{grid-template-columns:1fr;max-width:560px;margin-inline:auto}
  .dxv__grid{grid-template-columns:1fr;max-width:520px;margin-inline:auto}
}
@media(max-width:700px){
  .dxh__title{font-size:var(--w-fs-h1)}
  .dxr__list{max-height:min(48vh,340px)}
  .dxr__d{display:none}
  .dxq__title,.dxc__title,.dxp__title,.dxa__title,.dxv__title,.dxf__title,.dxs__title{font-size:var(--w-fs-h2)}
  .dxc__grid{grid-template-columns:1fr;max-width:460px;margin-inline:auto}
  .dxh__searchbtn{padding:11px 16px}
}
@media(max-width:560px){
  .dxs__grid{grid-template-columns:1fr;max-width:400px;margin-inline:auto}
  .dxs__actions{flex-direction:column}
  .dxs__actions .w-btn{width:100%;justify-content:center}
  .dxp__item{flex-wrap:wrap}
  .dxp__arrow{display:none}
}