
/* ═══════════════════════════════════════════════════════
   SLATE 皮肤 — 高端奢华风 · 黑金酒红 · 衬线大字 · 细线边框
   所有选择器限定在 body.skin-slate 作用域
   ═══════════════════════════════════════════════════════ */
:root{
  --sl-ink:#0e0e10;--sl-paper:#f7f5f0;--sl-surface:#ffffff;--sl-line:#d8d4cc;--sl-muted:#6b6660;
  --sl-gold:#c9a84c;--sl-crimson:#8b1a2f;--sl-accent:#9c36b5;
  --sl-rail:260px;--sl-maxw:1100px;
  --sl-serif:"Georgia","Times New Roman","Noto Serif SC",serif;
  --sl-sans:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  --sl-mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
}

/* Reset & base */
*{box-sizing:border-box;margin:0;padding:0}
body.skin-slate{
  background:var(--sl-paper);color:var(--sl-ink);
  font-family:var(--sl-sans);font-size:17px;line-height:1.75;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
body.skin-slate img{max-width:100%;height:auto;display:block}
body.skin-slate a{color:inherit;text-decoration:none;transition:color .18s}
body.skin-slate ul,body.skin-slate ol{list-style:none}

/* Typography */
body.skin-slate h1,body.skin-slate h2,body.skin-slate h3,body.skin-slate h4{
  font-family:var(--sl-serif);font-weight:400;line-height:1.18;letter-spacing:-.01em;
}
body.skin-slate h1{font-size:clamp(2.4rem,5.5vw,4.2rem);letter-spacing:-.025em}
body.skin-slate h2{font-size:clamp(1.6rem,3.2vw,2.4rem)}
body.skin-slate h3{font-size:1.15rem;font-family:var(--sl-sans);font-weight:700}
body.skin-slate p{margin:0 0 1em}
body.skin-slate strong{font-weight:700}

/* 跳过导航（无障碍） */
body.skin-slate .sl-skip{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
body.skin-slate .sl-skip:focus{position:fixed;left:20px;top:20px;width:auto;height:auto;padding:10px 16px;background:var(--sl-ink);color:#fff;z-index:9999;border:2px solid var(--sl-gold);outline:none}

/* ── 左侧竖排 Rail 导航 ───────────────────────────── */
body.skin-slate .sl-rail-check{display:none}
body.skin-slate .sl-rail{
  position:fixed;top:0;left:0;bottom:0;width:var(--sl-rail);
  background:var(--sl-ink);color:#f0ece4;
  display:flex;flex-direction:column;padding:36px 28px 28px;
  border-right:1px solid rgba(201,168,76,.2);z-index:100;
}
body.skin-slate .sl-rail-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:52px}
body.skin-slate .sl-brand{display:flex;align-items:center;gap:10px;color:#f0ece4}
body.skin-slate .sl-brand:hover{color:var(--sl-gold)}
body.skin-slate .sl-brand-mark{color:var(--sl-gold);font-size:1rem}
body.skin-slate .sl-brand-name{font-family:var(--sl-serif);font-size:1.2rem;letter-spacing:.02em}
body.skin-slate .sl-burger{display:none;font-size:1.4rem;cursor:pointer;color:#f0ece4;line-height:1}
body.skin-slate .sl-nav{flex:1}
body.skin-slate .sl-nav ul{display:flex;flex-direction:column;gap:0}
body.skin-slate .sl-nav a{
  display:block;padding:14px 0;
  font-size:.97rem;letter-spacing:.04em;color:rgba(240,236,228,.72);
  border-bottom:1px solid rgba(240,236,228,.1);
  transition:color .18s,padding-left .18s;
}
body.skin-slate .sl-nav a:hover{color:var(--sl-gold);padding-left:6px}
body.skin-slate .sl-nav a:focus-visible{outline:2px solid var(--sl-gold);outline-offset:2px;border-radius:2px}
body.skin-slate .sl-nav a[aria-current]{color:var(--sl-gold);border-bottom-color:rgba(201,168,76,.35)}
body.skin-slate .sl-rail-foot{margin-top:auto;padding-top:20px;border-top:1px solid rgba(240,236,228,.1)}
body.skin-slate .sl-rail-tagline{font-size:.78rem;color:rgba(240,236,228,.4);line-height:1.5;display:block}

/* ── Main content 偏移 ───────────────────────────── */
body.skin-slate .sl-main{margin-left:var(--sl-rail);min-height:100vh}

/* ── Hero 双图错位拼贴 ───────────────────────────── */
body.skin-slate .sl-hero{
  display:grid;grid-template-columns:1.1fr .9fr;
  gap:clamp(32px,5vw,64px);align-items:center;
  padding:clamp(64px,9vw,120px) clamp(28px,4vw,60px);
  max-width:var(--sl-maxw);margin:0 auto;
}
body.skin-slate .sl-hero:not(.has-img){grid-template-columns:1fr;max-width:760px}
body.skin-slate .sl-hero h1{margin-bottom:.45em}
body.skin-slate .sl-hero-cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:32px}
body.skin-slate .sl-hero-copy{align-self:center}
body.skin-slate .sl-eyebrow{
  display:inline-block;font-family:var(--sl-mono);font-size:.72rem;
  letter-spacing:.2em;text-transform:uppercase;color:var(--sl-gold);
  margin-bottom:20px;
}
body.skin-slate .sl-lead{font-size:1.12rem;color:var(--sl-muted);max-width:52ch;margin-top:4px}
body.skin-slate .page-meta{font-family:var(--sl-mono);font-size:.77rem;color:var(--sl-muted);margin:14px 0 0}

/* 错位拼贴容器 */
body.skin-slate .sl-hero-collage{position:relative;padding-bottom:40px;padding-right:32px}
body.skin-slate .sl-collage-a{position:relative;z-index:1}
body.skin-slate .sl-collage-a img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:10px}
body.skin-slate .sl-collage-frame{
  position:absolute;bottom:0;right:0;
  width:65%;height:70%;
  border:1px solid var(--sl-gold);border-radius:10px;
  z-index:0;pointer-events:none;
}

/* ── 按钮 ────────────────────────────────────────── */
body.skin-slate .sl-btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:14px 28px;
  background:var(--sl-ink);color:#f0ece4;
  font-family:var(--sl-mono);font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;
  border:1px solid var(--sl-gold);border-radius:10px;
  transition:background .18s,color .18s;
}
body.skin-slate .sl-btn:hover{background:var(--sl-gold);color:var(--sl-ink)}
body.skin-slate .sl-btn:focus-visible{outline:2px solid var(--sl-gold);outline-offset:3px}
body.skin-slate .sl-btn-ghost{background:transparent;color:var(--sl-ink);border-color:var(--sl-ink)}
body.skin-slate .sl-btn-ghost:hover{background:var(--sl-ink);color:#f0ece4}
/* 公共 .btn 兼容 */
body.skin-slate .btn{
  display:inline-flex;align-items:center;gap:8px;padding:14px 28px;
  background:var(--sl-ink);color:#f0ece4;
  font-family:var(--sl-mono);font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;
  border:1px solid var(--sl-gold);border-radius:10px;transition:background .18s,color .18s;
}
body.skin-slate .btn:hover{background:var(--sl-gold);color:var(--sl-ink)}
body.skin-slate .btn:focus-visible{outline:2px solid var(--sl-gold);outline-offset:3px}
body.skin-slate .btn.ghost{background:transparent;color:var(--sl-ink);border-color:var(--sl-line)}
body.skin-slate .btn.ghost:hover{background:var(--sl-ink);color:#f0ece4;border-color:var(--sl-ink)}

/* ── Section 通用 ────────────────────────────────── */
body.skin-slate .section{padding:clamp(56px,7vw,96px) 0;border-top:1px solid var(--sl-line)}
body.skin-slate .section:first-child{border-top:0}
body.skin-slate .container{max-width:var(--sl-maxw);margin:0 auto;padding:0 clamp(20px,4vw,60px)}
body.skin-slate .sec-head{max-width:64ch;margin-bottom:44px}
body.skin-slate .sec-head.center{margin-inline:auto;text-align:center}
body.skin-slate .eyebrow{
  display:inline-block;font-family:var(--sl-mono);font-size:.72rem;
  letter-spacing:.2em;text-transform:uppercase;color:var(--sl-gold);margin-bottom:16px;
}

/* ── Stats ───────────────────────────────────────── */
body.skin-slate .stats{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid var(--sl-line)}
body.skin-slate .stat{padding:32px 28px;border-right:1px solid var(--sl-line)}
body.skin-slate .stat:last-child{border-right:0}
body.skin-slate .stat .num{
  font-family:var(--sl-serif);font-size:clamp(2rem,4vw,3rem);
  color:var(--sl-gold);display:block;margin-bottom:6px;
}
body.skin-slate .stat .lbl{color:var(--sl-muted);font-size:.9rem}
@media(max-width:600px){body.skin-slate .stats{grid-template-columns:1fr}}

/* ── Content / Prose ─────────────────────────────── */
body.skin-slate .prose{max-width:72ch}
body.skin-slate .prose h2{margin:1.2em 0 .5em}
body.skin-slate .prose h3{margin:1em 0 .4em;color:var(--sl-ink)}
body.skin-slate .prose ul,body.skin-slate .prose ol{padding-left:1.4em;list-style:disc}
body.skin-slate .prose ol{list-style:decimal}
body.skin-slate .prose li{margin:.4em 0;color:var(--sl-muted)}
body.skin-slate .prose p{color:var(--sl-muted)}
body.skin-slate .prose strong{color:var(--sl-ink)}

/* ── Split ───────────────────────────────────────── */
body.skin-slate .split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,60px);align-items:center}
body.skin-slate .split.v-media-right .split-media{order:2}
body.skin-slate .split-media img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px;border:1px solid var(--sl-line)}
body.skin-slate .split-body ul{padding-left:1.2em;list-style:disc}
body.skin-slate .split-body li{margin:.5em 0;color:var(--sl-muted)}
body.skin-slate .split-body p{color:var(--sl-muted)}
@media(max-width:820px){
  body.skin-slate .split{grid-template-columns:1fr}
  body.skin-slate .split.v-media-right .split-media{order:0}
}

/* ── Features / Cards ────────────────────────────── */
body.skin-slate .grid{display:grid;gap:1px;background:var(--sl-line);border:1px solid var(--sl-line)}
body.skin-slate .grid.cols-2{grid-template-columns:repeat(2,1fr)}
body.skin-slate .grid.cols-3{grid-template-columns:repeat(3,1fr)}
body.skin-slate .grid.cols-4{grid-template-columns:repeat(4,1fr)}
body.skin-slate .card{
  background:var(--sl-surface);padding:32px;
  border-left:3px solid transparent;transition:border-color .18s;
}
body.skin-slate .card:hover{border-left-color:var(--sl-gold)}
body.skin-slate .card .ico{font-size:1.6rem;margin-bottom:14px;display:block}
body.skin-slate .card h3{margin-bottom:.35em;font-size:1.05rem}
body.skin-slate .card p{color:var(--sl-muted);margin:0;font-size:.95rem}
@media(max-width:820px){body.skin-slate .grid.cols-3,body.skin-slate .grid.cols-4{grid-template-columns:1fr 1fr}}
@media(max-width:560px){body.skin-slate .grid{grid-template-columns:1fr!important}}

/* ── Steps ───────────────────────────────────────── */
body.skin-slate .steps{display:grid;gap:0;border:1px solid var(--sl-line)}
body.skin-slate .steps.cols{grid-template-columns:1fr 1fr}
body.skin-slate .step{background:var(--sl-surface);padding:28px 30px;border-top:1px solid var(--sl-line)}
body.skin-slate .step:first-child{border-top:0}
body.skin-slate .step .ico{font-size:1.4rem;margin-bottom:12px;display:block}
body.skin-slate .step h3{margin-bottom:.3em}
body.skin-slate .step p{margin:0;color:var(--sl-muted);font-size:.95rem}
@media(max-width:720px){body.skin-slate .steps.cols{grid-template-columns:1fr}}

/* ── FAQ ─────────────────────────────────────────── */
body.skin-slate .faq{max-width:780px}
body.skin-slate .faq details{border-bottom:1px solid var(--sl-line)}
body.skin-slate .faq summary{
  cursor:pointer;font-weight:700;padding:20px 0;list-style:none;
  display:flex;justify-content:space-between;align-items:center;gap:16px;
}
body.skin-slate .faq summary::-webkit-details-marker{display:none}
body.skin-slate .faq summary::after{
  content:"+";flex-shrink:0;
  font-family:var(--sl-mono);font-size:1.1rem;color:var(--sl-gold);
  transition:transform .18s;
}
body.skin-slate .faq details[open] summary::after{content:"—";transform:none}
body.skin-slate .faq summary:focus-visible{outline:2px solid var(--sl-gold);outline-offset:2px}
body.skin-slate .faq details p{color:var(--sl-muted);padding-bottom:20px;margin:0;line-height:1.7}

/* ── Gallery ─────────────────────────────────────── */
body.skin-slate .gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:var(--sl-line)}
body.skin-slate .gallery figure{margin:0;position:relative;overflow:hidden;background:var(--sl-surface)}
body.skin-slate .gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:0;transition:transform .35s}
body.skin-slate .gallery figure:hover img{transform:scale(1.04)}
body.skin-slate .gallery figcaption{
  position:absolute;left:0;bottom:0;right:0;padding:14px 16px;
  font-family:var(--sl-mono);font-size:.8rem;color:#fff;
  background:linear-gradient(0deg,rgba(14,14,16,.65),transparent);
}
@media(max-width:820px){body.skin-slate .gallery{grid-template-columns:1fr 1fr}}
@media(max-width:520px){body.skin-slate .gallery{grid-template-columns:1fr}}

/* ── CTA Band ────────────────────────────────────── */
body.skin-slate .cta-band{
  border:1px solid var(--sl-line);padding:clamp(36px,6vw,60px);
  text-align:center;background:var(--sl-surface);border-radius:10px;margin:0 clamp(20px,4vw,60px);
}
body.skin-slate .cta-band h2{margin-bottom:.35em}
body.skin-slate .cta-band .lead,.cta-band .sl-lead{margin:0 auto 24px;max-width:56ch;color:var(--sl-muted)}

/* ── Footer 四栏 ─────────────────────────────────── */
body.skin-slate .sl-footer{background:var(--sl-ink);color:rgba(240,236,228,.85);padding:clamp(48px,6vw,80px) clamp(20px,4vw,60px) 28px}
body.skin-slate .sl-foot-inner{
  max-width:var(--sl-maxw);margin:0 auto;
  display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;
  padding-bottom:40px;border-bottom:1px solid rgba(240,236,228,.12);
}
body.skin-slate .sl-foot-brand .sl-brand-mark-lg{font-size:1.4rem;display:block;margin-bottom:10px;color:var(--sl-gold)}
body.skin-slate .sl-foot-name{font-family:var(--sl-serif);font-size:1.15rem;color:#f0ece4;display:block;margin-bottom:12px}
body.skin-slate .sl-foot-desc{color:rgba(240,236,228,.5);font-size:.9rem;max-width:34ch;line-height:1.6}
body.skin-slate .sl-foot-col ul{display:flex;flex-direction:column;gap:10px}
body.skin-slate .sl-foot-col a{color:rgba(240,236,228,.65);font-size:.92rem;transition:color .18s}
body.skin-slate .sl-foot-col a:hover{color:var(--sl-gold)}
body.skin-slate .sl-foot-col a:focus-visible{outline:2px solid var(--sl-gold);outline-offset:2px;border-radius:2px}
body.skin-slate .sl-foot-contact{display:flex;flex-direction:column;gap:10px}
body.skin-slate .sl-foot-email,.sl-foot-phone{font-family:var(--sl-mono);font-size:.85rem;color:rgba(240,236,228,.65);word-break:break-all}
body.skin-slate .sl-foot-email:hover{color:var(--sl-gold)}
body.skin-slate .sl-foot-bar{
  max-width:var(--sl-maxw);margin:24px auto 0;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;
  font-family:var(--sl-mono);font-size:.78rem;color:rgba(240,236,228,.35);
}
@media(max-width:900px){body.skin-slate .sl-foot-inner{grid-template-columns:1fr 1fr}}
@media(max-width:560px){body.skin-slate .sl-foot-inner{grid-template-columns:1fr}}

/* ── 移动端 Rail → 顶栏 ───────────────────────────── */
@media(max-width:960px){
  body.skin-slate .sl-rail{
    position:sticky;top:0;left:0;right:0;bottom:auto;width:100%;flex-direction:row;
    padding:14px 20px;align-items:center;
    border-right:0;border-bottom:1px solid rgba(201,168,76,.2);
  }
  body.skin-slate .sl-rail-top{margin-bottom:0;flex:1}
  body.skin-slate .sl-burger{display:block}
  body.skin-slate .sl-nav{
    position:absolute;top:100%;left:0;right:0;
    background:var(--sl-ink);border-bottom:1px solid rgba(201,168,76,.2);
    max-height:0;overflow:hidden;transition:max-height .3s ease;
  }
  body.skin-slate .sl-rail-check:checked ~ .sl-rail .sl-nav{max-height:70vh}
  body.skin-slate .sl-nav ul{flex-direction:column;padding:12px 20px 16px}
  body.skin-slate .sl-rail-foot{display:none}
  body.skin-slate .sl-main{margin-left:0}
  body.skin-slate .sl-hero{grid-template-columns:1fr}
  body.skin-slate .sl-hero-collage{display:none}
}

/* ── reveal 动效（fx-reveal class 由 interactions.js 控制） ───── */
body.skin-slate .reveal-target{opacity:0;transform:translateY(22px);transition:opacity .55s ease,transform .55s ease}
body.skin-slate .reveal-target.revealed{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  body.skin-slate .reveal-target{opacity:1;transform:none;transition:none}
}


/* ---- variants: shared layout (pipeline/lib/variants.js) ---- */
.sec-head.center{text-align:center}
.sec-head.center .lead{margin-left:auto;margin-right:auto}
/* features=list */
.feat-list{display:grid;gap:0;border-top:1px solid color-mix(in srgb,currentColor 16%,transparent)}
.feat-row{display:grid;grid-template-columns:72px 1fr;gap:22px;padding:26px 0;border-bottom:1px solid color-mix(in srgb,currentColor 16%,transparent);align-items:start}
.feat-row .feat-lead{font-size:1.8rem;line-height:1}
.feat-row .feat-dot{display:block;width:12px;height:12px;border-radius:50%;background:currentColor;margin-top:10px;opacity:.6}
.feat-row h3{margin:0 0 .35em}
.feat-row p{margin:0;opacity:.8}
/* features=bento */
.bento{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;grid-auto-flow:dense}
.bento .card.span2{grid-column:span 2}
/* features=numbered */
.feat-num{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:28px 48px;counter-reset:fn}
.feat-num li{display:grid;grid-template-columns:56px 1fr;gap:16px;align-items:start}
.feat-num .n{font-size:1.6rem;font-weight:800;line-height:1;opacity:.35;font-variant-numeric:tabular-nums}
.feat-num h3{margin:0 0 .3em}
.feat-num p{margin:0;opacity:.8}
/* steps=timeline */
.timeline{list-style:none;margin:0;padding:0 0 0 34px;position:relative;max-width:720px}
.timeline::before{content:"";position:absolute;left:9px;top:6px;bottom:6px;width:2px;background:color-mix(in srgb,currentColor 18%,transparent)}
.timeline .step{position:relative;padding:0 0 34px 18px;background:none;border:0;box-shadow:none}
.timeline .step:last-child{padding-bottom:0}
.timeline .step::before{content:"";position:absolute;left:-34px;top:8px;width:20px;height:20px;border-radius:50%;background:currentColor;opacity:.85}
.timeline .step::after{content:"";position:absolute;left:-28px;top:14px;width:8px;height:8px;border-radius:50%;background:#fff;opacity:.9}
.timeline .n{display:block;font-size:.8rem;letter-spacing:.12em;opacity:.5;margin-bottom:6px;font-variant-numeric:tabular-nums}
.timeline h3{margin:0 0 .3em}
.timeline p{margin:0;opacity:.8}
/* steps=row */
.steps-row{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:22px;position:relative}
.steps-row::before{content:"";position:absolute;left:0;right:0;top:17px;height:2px;background:color-mix(in srgb,currentColor 16%,transparent)}
.steps-row .step{position:relative;padding:54px 0 0;background:none;border:0;box-shadow:none;border-radius:0}
.steps-row .n{position:absolute;top:0;left:0;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.85rem;border:2px solid currentColor;font-variant-numeric:tabular-nums}
.steps-row h3{margin:0 0 .3em}
.steps-row p{margin:0;opacity:.8}
/* faq=twocol */
.faq.faq-cols{display:grid;grid-template-columns:1fr 1fr;gap:0 40px;align-items:start;max-width:none}
/* faq=list */
.faq-list{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:28px 48px}
.faq-list .faq-item{padding:0 0 22px;border-bottom:1px solid color-mix(in srgb,currentColor 14%,transparent)}
.faq-list dt{font-weight:700;font-size:1.05rem;margin:0 0 .4em;display:flex;gap:12px;align-items:baseline}
.faq-list dt .n{font-size:.78rem;letter-spacing:.1em;opacity:.45;font-variant-numeric:tabular-nums}
.faq-list dd{margin:0;opacity:.82}
/* cta=split */
.cta-split{display:grid;grid-template-columns:1.4fr auto;gap:32px;align-items:center;padding:34px 38px;border:1px solid color-mix(in srgb,currentColor 22%,transparent)}
.cta-split h2{margin:0 0 .25em}
.cta-split .lead{margin:0}
/* cta=inline */
.cta-inline{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:22px 0;border-top:2px solid currentColor;border-bottom:2px solid currentColor}
.cta-inline h2{margin:0;font-size:clamp(1.2rem,2.4vw,1.7rem)}
/* content=columns */
.prose.prose-cols{column-count:2;column-gap:48px;max-width:none}
.prose.prose-cols>*{break-inside:avoid}
.prose.prose-cols h2,.prose.prose-cols h3{column-span:all}
/* content=sidebar */
.content-side{display:grid;grid-template-columns:minmax(220px,.8fr) 2fr;gap:48px;align-items:start}
.content-side .content-aside{position:sticky;top:90px}
.content-side .sec-head{text-align:left;margin:0}
/* gallery=masonry */
.gallery.gallery-masonry{display:block;column-count:3;column-gap:16px}
.gallery.gallery-masonry figure{break-inside:avoid;margin:0 0 16px}
/* gallery=strip */
.gallery.gallery-strip{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;grid-template-columns:none}
.gallery.gallery-strip figure{flex:0 0 min(70vw,420px);scroll-snap-align:start;margin:0}
/* stats=cards */
.stats.stat-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px}
.stats.stat-cards .stat{padding:26px 20px;border:1px solid color-mix(in srgb,currentColor 18%,transparent);text-align:center}
@media(max-width:860px){
  .bento{grid-template-columns:1fr 1fr}
  .bento .card.span2{grid-column:span 2}
  .feat-num,.faq.faq-cols,.faq-list,.content-side{grid-template-columns:1fr}
  .feat-row{grid-template-columns:48px 1fr;gap:14px}
  .steps-row{grid-auto-flow:row}
  .steps-row::before{display:none}
  .cta-split{grid-template-columns:1fr;padding:26px}
  .cta-inline{flex-direction:column;align-items:flex-start}
  .prose.prose-cols{column-count:1}
  .gallery.gallery-masonry{column-count:2}
  .content-side .content-aside{position:static}
}
@media(max-width:560px){.bento{grid-template-columns:1fr}.bento .card.span2{grid-column:auto}}


/* 滚动渐显：仅在 JS 就绪(js-reveal) + 允许动效时隐藏，无 JS 或 reduce-motion 时正常显示，防止内容看不见 */
@media (prefers-reduced-motion:no-preference){
  body.js-reveal.fx-reveal .section{opacity:0;transform:translateY(18px);transition:opacity .7s cubic-bezier(.2,.6,.2,1),transform .7s cubic-bezier(.2,.6,.2,1)}
  body.js-reveal.fx-reveal .section.in{opacity:1;transform:none}
}
/* 图片 lightbox */
body.fx-lightbox .gallery img{cursor:zoom-in}
.lb-overlay{position:fixed;inset:0;background:rgba(8,10,14,.92);display:none;align-items:center;justify-content:center;z-index:200;padding:24px;cursor:zoom-out}
.lb-overlay.open{display:flex}
.lb-overlay img{max-width:92vw;max-height:92vh;border-radius:8px;box-shadow:0 24px 70px rgba(0,0,0,.5)}
