/* =============================================================================
   数易产 · 设计令牌（唯一色值来源）— specs/058 design/visual-language.md 的落地
   🔴 全站任何页面不得出现本文件以外的色值；评审以 grep 校验为准。
   ========================================================================== */

:root{
  /* ---- 深空三层（新增基底；比旧 --bg:#0E0808 更"深空"） ---- */
  --void-0:#07070D;   /* 全站背景 */
  --void-1:#0B0B14;   /* 次级面：卡片/场景底 */
  --void-2:#12121E;   /* 三级面：浮层/代码块 */
  --star:rgba(255,255,255,.35);

  /* ---- 品牌光（沿用品牌色，未换色） ---- */
  --brand:#B61C22;              /* 朱砂红 = 资产本体／数据核 */
  --gold:#D4A85A;               /* 琥珀金 = 轨道／价值流动 */
  --brand-glow:rgba(182,28,34,.16);
  --gold-glow:rgba(212,168,90,.16);

  /* ---- 品牌光 · 透明度阶（唯一允许的"带 alpha 色值"来源） ----
     🔴 页面里**不要再写 rgba(182,28,34,…)**；一律引用下列令牌。 */
  --brand-a08:rgba(182,28,34,.08);
  --brand-a10:rgba(182,28,34,.10);
  --brand-a16:rgba(182,28,34,.16);
  --brand-a24:rgba(182,28,34,.24);
  --brand-a40:rgba(182,28,34,.40);
  --brand-a55:rgba(182,28,34,.55);
  --gold-a08:rgba(212,168,90,.08);
  --gold-a10:rgba(212,168,90,.10);
  --gold-a16:rgba(212,168,90,.16);
  --gold-a28:rgba(212,168,90,.28);
  --gold-a40:rgba(212,168,90,.40);
  --gold-a62:rgba(212,168,90,.62);
  --gold-a95:rgba(212,168,90,.95);
  --white-a06:rgba(255,255,255,.06);
  --white-a10:rgba(255,255,255,.10);
  --white-a22:rgba(255,255,255,.22);

  /* ---- 文本 ---- */
  --tx-1:#EDEDF5;
  --tx-2:#9AA0B5;
  /* 🔴 --tx-3 由 #5C6178 调亮到 #7B8199（2026-10-12）：
     原色在 --void-0/1/2 上对比度仅 3.29/3.20/3.04 ⇒ **不达 WCAG AA（正文需 4.5）**；
     而它被用在 12px 小字（页脚、meta、胶囊导航）上。新值 5.21/5.08/4.81 ✅ */
  --tx-3:#7B8199;

  /* ---- 线 ---- */
  --line-1:rgba(255,255,255,.28);
  --line-2:rgba(255,255,255,.10);
  --shadow-1:0 20px 60px rgba(0,0,0,.5);   /* 浮层投影（悬浮面板/弹层用）*/

  /* ---- 状态（涨红跌绿，中国口径） ---- */
  --ok:#4A9B7A;
  --warn:#D4A85A;
  --err:#B61C22;

  /* ---- 排版（字号种类 ≤6） ---- */
  --fs-hero:56px;
  --fs-act:32px;
  --fs-sub:28px;
  --fs-body:16px;
  --fs-label:12px;
  --font-sans:-apple-system,BlinkMacSystemFont,"SF Pro Rounded","PingFang SC","Microsoft YaHei",sans-serif;
  --font-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  /* ---- 圆角（沿用 24/16/12） ---- */
  --r-lg:24px;
  --r-md:16px;
  --r-sm:12px;

  /* ---- 缓动（统一；禁回弹） ---- */
  --ease:cubic-bezier(.22,1,.36,1);

  /* ---- 导航 ---- */
  --nav-bg:rgba(7,7,13,.72);
}

/* 移动端字号收敛 */
@media (max-width:768px){
  :root{ --fs-hero:32px; --fs-act:24px; --fs-sub:20px; --fs-body:15px; }
}

/* ============================ 基础 ============================ */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--void-0);
  color:var(--tx-1);
  font-family:var(--font-sans);
  font-size:var(--fs-body);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
h1,h2,h3{margin:0;font-weight:500;line-height:1.25}

/* ============================ 构图容器 ============================ */
.wrap{max-width:1180px;margin:0 auto;padding:0 32px}
@media (max-width:768px){ .wrap{padding:0 20px} }

/* 每一幕：一屏一事 */
.act{
  position:relative;
  min-height:100vh;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:120px 0 96px;
}
@media (max-width:768px){ .act{min-height:auto;padding:88px 0 72px} }

/* 3D/画布层：铺满该幕，位于内容之下 */
/* 🔴 overflow:hidden 必须有：装饰层（射线/弧/焦点光/静态光核）是**定尺寸绝对定位**，
   在 375px 移动端会把文档撑出横向滚动（实测首页 +223px、登录页 +193px）。
   裁到「幕」的边界即可——装饰层本来也只在本幕内可见。 */
.stage{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.stage canvas{display:block;width:100%;height:100%}
.act > .wrap{position:relative;z-index:1}

/* ============================ 发光四层（不用 blur） ============================ */
.glow{position:relative;display:inline-block}
.glow::before,.glow::after{
  content:"";position:absolute;border-radius:50%;pointer-events:none;
}
.glow::before{
  left:50%;top:50%;width:92px;height:92px;transform:translate(-50%,-50%);
  background:var(--brand);opacity:.06;
}
.glow::after{
  left:50%;top:50%;width:70px;height:70px;transform:translate(-50%,-50%);
  background:var(--brand);opacity:.10;
}

/* ============================ 分区胶囊（右上角固定） ============================ */
.chapters{
  position:fixed;top:26px;right:32px;z-index:60;
  display:flex;gap:18px;align-items:center;
}
.chapters a{
  display:flex;flex-direction:column;gap:2px;
  font-size:var(--fs-label);color:var(--tx-3);
  padding-bottom:5px;border-bottom:1.5px solid transparent;
  transition:color .25s var(--ease),border-color .25s var(--ease);
}
.chapters a .en{font-size:10px;letter-spacing:.04em;}   /* 🔴 不再用 opacity 压暗：opacity 会把已达标的小字重新拉回 AA 以下 */
.chapters a:hover{color:var(--tx-2)}
.chapters a.on{color:var(--tx-1);border-bottom-color:var(--gold)}
@media (max-width:768px){ .chapters{display:none} }

/* ============================ 左上角两行小标签 ============================ */
.brandmark{
  position:fixed;top:26px;left:32px;z-index:60;display:flex;flex-direction:column;gap:2px;
}
.brandmark .l1{font-size:var(--fs-label);color:var(--tx-3)}
.brandmark .l2{font-size:14px;color:var(--tx-1)}
@media (max-width:768px){ .brandmark{left:20px;top:20px} }

/* ============================ 底部大字幕 ============================ */
.caption{
  position:relative;z-index:1;
  text-align:center;                    /* 唯一允许居中的长文本 */
  font-size:var(--fs-sub);font-weight:500;color:var(--tx-1);
  margin-top:44px;
}
@media (max-width:768px){ .caption{font-size:var(--fs-sub);margin-top:32px} }

/* ============================ 按钮 ============================ */
.btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:14px 26px;border-radius:var(--r-sm);
  border:1px solid var(--line-1);background:transparent;color:var(--tx-1);
  font-size:15px;cursor:pointer;transition:all .25s var(--ease);font-family:inherit;
}
.btn:hover{border-color:var(--gold);color:var(--gold)}
.btn-primary{background:var(--brand);border-color:var(--brand);color:#fff}
.btn-primary:hover{background:#d02127;border-color:#d02127;color:#fff}
.btn-link{border:none;padding:14px 6px;color:var(--tx-2)}
.btn-link:hover{color:var(--gold)}

/* ============================ 卡片（深空玻璃） ============================ */
.card{
  background:var(--void-1);
  border:1px solid var(--line-2);
  border-radius:var(--r-lg);
  padding:28px;
}
.card h3{font-size:18px;margin-bottom:8px}
.card p{color:var(--tx-2);margin:0}
/* 卡片标题（用于必须当 h2 的场合，保持与 .card h3 同字号） */
.card-title{font-size:18px;margin-bottom:8px;font-weight:500}

/* =============================================================================
   可访问性：正文内联链接必须能**不只靠颜色**区分（WCAG 1.4.1 / 1.4.3）
   🔴 2026-10-12 Lighthouse 线上实测 `link-in-text-block` 未通过 ⇒ 加下划线。
      排除按钮样式链接（.btn 自带边框/底色，已可区分）。
   ========================================================================== */
p a:not(.btn), li a:not(.btn), td a:not(.btn), .ls-t a:not(.btn), .prose a:not(.btn){
  text-decoration:underline; text-underline-offset:3px;
}

/* ============================ 可访问性 ============================ */
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:4px}
.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

/* ============================ 减动效（降级 1/3） ============================ */
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
}

/* ============================ 幕 3 · 机制：流动光点（CSS 驱动，减动效自动停） ============================ */
@keyframes flowY { from { transform: translateY(0); opacity: 0; }
                   12%   { opacity: .9; }
                   88%   { opacity: .9; }
                   to    { transform: translateY(400px); opacity: 0; } }
.flow circle{ animation: flowY 2.6s linear infinite; }
.flow circle:nth-child(1){ animation-delay: 0s; }
.flow circle:nth-child(2){ animation-delay: .52s; }
.flow circle:nth-child(3){ animation-delay: 1.04s; }
.flow circle:nth-child(4){ animation-delay: 1.56s; }
.flow circle:nth-child(5){ animation-delay: 2.08s; }

/* ============================ 子页共用外框（同一套令牌） ============================ */
.page-head{ padding:120px 0 56px; position:relative; overflow:hidden; }
.page-head .kicker{ font-size:var(--fs-label); color:var(--tx-3); letter-spacing:.06em; }
.page-head h1{ font-size:var(--fs-act); margin:10px 0 14px; }
.page-head p{ color:var(--tx-2); max-width:42em; margin:0; }
.page-head .halo{
  position:absolute; right:-160px; top:-120px; width:460px; height:460px; border-radius:50%;
  background:var(--brand); opacity:.07; pointer-events:none;
}
.page-head .halo::after{
  content:""; position:absolute; left:70px; top:70px; width:320px; height:320px; border-radius:50%;
  background:var(--gold); opacity:.14;
}
.sec{ padding:56px 0; border-top:1px solid var(--line-2); }
.sec h2{ font-size:26px; margin-bottom:10px; }
.sec > .wrap > p.lead{ color:var(--tx-2); max-width:46em; margin:0 0 24px; }
.grid{ display:grid; gap:16px; }
.g2{ grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); }
.g3{ grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); }
.pill{
  display:inline-block; padding:4px 10px; border:1px solid var(--line-1); border-radius:999px;
  font-size:var(--fs-label); color:var(--tx-2);
}
.pill.on{ border-color:var(--gold); color:var(--gold); }
.prose{ max-width:720px; }           /* 阅读优先：行宽上限 */
.prose p, .prose li{ color:var(--tx-2); }
.prose h3{ font-size:18px; color:var(--tx-1); margin:26px 0 8px; }
.logo-slot{
  height:84px; border:1px dashed var(--line-1); border-radius:var(--r-md);
  display:flex; align-items:center; justify-content:center;
  color:var(--tx-3); font-size:var(--fs-label);
}
.tbl{ width:100%; border-collapse:collapse; }
.tbl th,.tbl td{ text-align:left; padding:12px 10px; border-bottom:1px solid var(--line-2); font-size:14px; }
.tbl th{ color:var(--tx-3); font-weight:400; font-size:var(--fs-label); }
.tbl td{ color:var(--tx-2); }
.tbl td:first-child{ color:var(--tx-1); }

/* =============================================================================
   窄屏：表格 → 卡片（≤768px）
   🔴 为什么必须做：375px 下四种合作方式那张 5 列表被压到每列 60–80px，
      中文每行只剩 4–5 字，实测**完全读不了**（截图抓到的）。
      做法＝`data-label` 伪元素方案：**不复制内容**，只把表头搬到每格的左侧。
   ========================================================================== */
@media (max-width:768px){
  .tbl thead, .article table thead{ display:none; }
  .tbl tr, .article table tr{
    display:block; padding:14px 16px; margin:0 0 12px;
    border:1px solid var(--line-2); border-radius:var(--r-md); background:var(--void-1);
  }
  .tbl td, .article table td{
    display:flex; gap:10px; align-items:flex-start;
    border:0; padding:6px 0; background:none!important;
  }
  .tbl td::before, .article table td::before{
    content:attr(data-label);
    flex:0 0 5.5em; color:var(--tx-3); font-size:var(--fs-label); line-height:1.7;
  }
  .tbl td[data-label="合作方式"]{ font-size:15px; }
}
/* 锚点跳转时别被左上角固定标识压住 */
.act, .sec{ scroll-margin-top:88px; }

/* ============================ 主按钮脉冲光环（能量感；无 blur） ============================ */
.btn-primary{ position:relative; }
.btn-primary::after{
  content:""; position:absolute; inset:-2px; border-radius:calc(var(--r-sm) + 2px);
  border:1px solid var(--brand); opacity:.55;
  animation:pulseRing 2.4s var(--ease) infinite; pointer-events:none;
}
@keyframes pulseRing{
  0%   { transform:scale(1);    opacity:.55; }
  70%  { transform:scale(1.14); opacity:0;   }
  100% { transform:scale(1.14); opacity:0;   }
}

/* ============================ 射线旋转（光核外挂；无 blur） ============================ */
.rays-wrap{ position:absolute; width:0; height:0; pointer-events:none; }
.rays{ position:absolute; left:-220px; top:-220px; width:440px; height:440px; overflow:visible; }
.rays line{ stroke:var(--gold); stroke-linecap:round; opacity:.26; }
.rays-b line{ stroke:var(--brand); }        /* 内圈＝朱砂红（品牌核色），与外圈金形成对冲 */
.rays-a,.rays-b{ transform-box:view-box; transform-origin:0 0; }
.rays-a{ animation:raySpin 40s linear infinite; }
.rays-b{ animation:raySpinRev 62s linear infinite; opacity:.38; }
@keyframes raySpin    { from{transform:rotate(0)}   to{transform:rotate(360deg)} }
@keyframes raySpinRev { from{transform:rotate(0)}   to{transform:rotate(-360deg)} }

/* =============================================================================
   幕 1 · 现象：未成形（射线替代物）—— 两段【不闭合】的虚线弧在转，永远合不拢
   「散着 → 试着聚 → 聚不成核」的视觉隐喻；与幕 0/2 的闭合轨道形成对照。
   ========================================================================== */
.arcs{ position:absolute; width:0; height:0; pointer-events:none; }
.arcs svg{ position:absolute; left:-190px; top:-190px; width:380px; height:380px; overflow:visible; }
.arcs circle{ fill:none; stroke:var(--gold-a62); stroke-width:1.5; }
.arcs .a{ animation:arcSpin 34s linear infinite; transform-box:view-box; transform-origin:0 0; }
.arcs .b{ animation:arcSpinRev 47s linear infinite; transform-box:view-box; transform-origin:0 0; opacity:.6; }
@keyframes arcSpin    { from{transform:rotate(0)}  to{transform:rotate(360deg)} }
@keyframes arcSpinRev { from{transform:rotate(0)}  to{transform:rotate(-360deg)} }

/* =============================================================================
   静态兜底（降级 1／2 与"3D 模块缺失"）：只在 html.no-gl / html.rm 时显示
   —— 用 radial-gradient 造柔边发光（**不用 blur**），保证"不白屏、信息完整"
   ========================================================================== */
.static-core,.static-scatter,.static-graph{ display:none; }
html.no-gl .static-core, html.rm .static-core,
html.no-gl .static-scatter, html.rm .static-scatter,
html.no-gl .static-graph, html.rm .static-graph{ display:block; }
.static-core{
  position:absolute; width:min(620px,120vw); height:min(620px,120vw); border-radius:50%; pointer-events:none;
  background:radial-gradient(closest-side,
    var(--brand-a55), var(--brand-a16) 34%, var(--gold-a10) 58%, transparent 76%);
}
.static-scatter{ position:absolute; width:100%; height:100%; pointer-events:none; }

/* =============================================================================
   幕 3 · 机制：竖向能量束（gradient，非 blur）
   ========================================================================== */
.beam{ position:absolute; left:50%; top:12%; width:2px; height:76%; transform:translateX(-50%);
  background:linear-gradient(180deg, transparent, var(--gold-a40) 18%, var(--gold-a62) 50%, var(--gold-a40) 82%, transparent); }

/* =============================================================================
   幕 4 · 证据：节点晕环（多层同心＝发光，非 blur）
   ========================================================================== */
.node-halo{ animation:haloPulse 4.2s var(--ease) infinite; transform-box:fill-box; transform-origin:center; }
@keyframes haloPulse{ 0%,100%{ opacity:.28; transform:scale(1) } 50%{ opacity:.68; transform:scale(1.14) } }
.travel{ animation:travelPulse 3.4s var(--ease) infinite; }
@keyframes travelPulse{ 0%{ opacity:0 } 20%{ opacity:.95 } 80%{ opacity:.95 } 100%{ opacity:0 } }

/* =============================================================================
   幕 5 · 行动：光收束（线向 CTA 汇聚；留白最大化，只保留一处焦点）
   ========================================================================== */
.converge{ position:absolute; inset:0; pointer-events:none; opacity:.5; }
/* 幕 5 焦点光：柔边发光（radial-gradient，非 blur）；留白最大化 ⇒ 只此一处光 */
.focus-glow{
  position:absolute; left:50%; top:44%; width:min(820px,130vw); height:min(820px,130vw); transform:translate(-50%,-50%);
  border-radius:50%; pointer-events:none;
  background:radial-gradient(closest-side, var(--brand-a16), var(--gold-a08) 42%, transparent 72%);
}

/* =============================================================================
   掉帧保护 · 提示行（plan.md §三：降级后留一行提示，**可关**）
   ========================================================================== */
.perf-note{
  position:fixed; left:32px; bottom:24px; z-index:70;
  display:flex; align-items:center; gap:10px;
  padding:8px 14px; border:1px solid var(--line-2); border-radius:var(--r-sm);
  background:var(--void-2); color:var(--tx-3); font-size:var(--fs-label);
}
.perf-note a{ color:var(--gold); cursor:pointer; }
/* 🔴 必须显式写：.perf-note 的 display:flex 会盖掉 UA 的 [hidden]{display:none}
   ⇒ 否则提示行**一开始就常显**（实测截图抓到）。 */
.perf-note[hidden]{ display:none; }
@media (max-width:768px){ .perf-note{ left:20px; bottom:16px } }

/* 降级为静态构图：停掉一切 CSS 动画（3D 由 js 侧停止驱动） */
html[data-quality="static"] *{ animation:none!important; }

/* =============================================================================
   阅读模板（blog 详情页 T209）—— 类名沿用旧页，但**全部改由令牌驱动**
   目标：纯阅读优先 —— 行宽 ≤720px、无 3D、无位移动画。旧页自带 <style> 已删除。
   ========================================================================== */
.maxw{ max-width:720px; margin:0 auto; padding:0 36px; }
@media (max-width:768px){ .maxw{ padding:0 20px } }

.nav{ position:sticky; top:0; z-index:50; background:var(--nav-bg); border-bottom:1px solid var(--line-2); }
.nav-inner{ display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:14px 36px; max-width:720px; margin:0 auto; }
@media (max-width:768px){ .nav-inner{ padding:14px 20px } }
.brand{ display:flex; align-items:center; gap:10px; color:var(--tx-1); }
.brand-name{ font-size:15px; font-weight:500; letter-spacing:.02em; }
.nav-link{ color:var(--tx-2); font-size:13px; transition:color .25s var(--ease); }
.nav-link:hover{ color:var(--gold); }

.article{ padding:64px 0 24px; }
.hud-tag{ display:inline-block; padding:5px 14px; border:1px solid var(--line-2); border-radius:999px;
  font-size:var(--fs-label); color:var(--gold); letter-spacing:.06em; background:var(--void-1); }
.article h1{ font-size:var(--fs-sub); line-height:1.35; margin:20px 0 14px; color:var(--tx-1); }
.meta{ display:flex; gap:16px; flex-wrap:wrap; font-size:var(--fs-label); color:var(--tx-3); margin-bottom:36px; }
.meta span{ display:inline-flex; align-items:center; gap:5px; }
.article h2{ font-size:22px; margin:44px 0 14px; padding-left:14px; border-left:3px solid var(--brand); color:var(--tx-1); }
.article h3{ font-size:17px; margin:24px 0 10px; color:var(--gold); }
.article p{ margin:0 0 16px; color:var(--tx-2); }
.article strong{ color:var(--tx-1); font-weight:500; }
.article ul,.article ol{ margin:0 0 16px; padding-left:22px; color:var(--tx-2); }
.article li{ margin:6px 0; }
.article a{ color:var(--gold); }
.article .card{ margin:20px 0; padding:24px; }
.article .card.gold{ border-color:var(--gold-a40); }
.article .card.red{ border-color:var(--brand-a55); }
.article .card .t{ font-size:15px; font-weight:500; color:var(--gold); margin-bottom:10px; }
.article .card p:last-child{ margin-bottom:0; }
.article table{ width:100%; border-collapse:collapse; margin:20px 0; font-size:14px; }
.article th{ text-align:left; padding:11px 12px; font-size:var(--fs-label); font-weight:400;
  color:var(--tx-3); border-bottom:1px solid var(--line-2); }
.article td{ padding:11px 12px; color:var(--tx-2); border-bottom:1px solid var(--line-2); }
.article td:first-child{ color:var(--tx-1); }
.article tr:nth-child(even) td{ background:var(--white-a06); }
.article .num{ font-size:40px; line-height:1.1; color:var(--gold); }
.article .num.red{ color:var(--brand); }
.article .faq{ border:1px solid var(--line-2); border-radius:var(--r-md); padding:16px 20px;
  margin:12px 0; background:var(--void-1); }
.article .faq b{ display:block; margin-bottom:6px; font-size:15px; font-weight:500; color:var(--gold); }
.article .faq span{ font-size:14px; color:var(--tx-2); }
.article .cta{ text-align:center; padding:40px 24px; margin:44px 0; border-radius:var(--r-lg);
  border:1px solid var(--gold-a40);
  background:radial-gradient(120% 140% at 50% 0%, var(--brand-a16), var(--void-1) 72%); }
.article .cta .btn{ margin-top:16px; background:var(--brand); border-color:var(--brand); color:#fff; }
.article .cta .btn:hover{ background:#d02127; border-color:#d02127; color:#fff; }
.footer{ padding:32px 0 48px; border-top:1px solid var(--line-2); font-size:var(--fs-label);
  color:var(--tx-3); text-align:center; }
.footer a{ color:var(--tx-3); } .footer a:hover{ color:var(--gold); }
@media (max-width:640px){ .article h1{font-size:26px} .article h2{font-size:19px} .article .num{font-size:32px} }

/* =============================================================================
   blog 列表（T208）—— 深空卡片流；字号收敛
   ========================================================================== */
.blog .page-head{ padding:120px 0 40px; }
.blog .group{ margin:48px 0; }
.blog .group-title{ display:flex; align-items:center; gap:12px; font-size:var(--fs-label);
  letter-spacing:.08em; color:var(--gold); margin-bottom:18px; }
.blog .group-title::after{ content:""; flex:1; height:1px; background:var(--line-2); }
.blog .grid{ grid-template-columns:repeat(2,1fr); gap:18px; }
@media (max-width:768px){ .blog .grid{ grid-template-columns:1fr; } }
.blog .card{ display:block; transition:transform .3s var(--ease),border-color .3s var(--ease),background .3s var(--ease); }
.blog .card:hover{ transform:translateY(-4px); border-color:var(--gold); background:var(--void-2); }
.blog .card h2{ font-size:17px; line-height:1.5; margin:0 0 10px; color:var(--tx-1); }
.blog .card p{ font-size:13.5px; color:var(--tx-2); line-height:1.7; margin:0;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.blog .card .tag{ display:inline-block; font-size:11px; color:var(--gold); background:var(--brand-a16);
  border-radius:999px; padding:3px 11px; margin-bottom:14px; }
.blog .card .meta{ display:flex; gap:12px; flex-wrap:wrap; font-size:var(--fs-label); color:var(--tx-3); margin:14px 0 0; }
.blog .card .more{ font-size:var(--fs-label); color:var(--gold); margin-top:12px; }
.blog .breadcrumb{ font-size:var(--fs-label); color:var(--tx-3); margin-bottom:12px; }
.blog .breadcrumb a{ color:var(--gold); }

/* =============================================================================
   落地区（FR-3）—— 定价四档 / 四种合作方式 / 客户与资质 / 下载 / blog / 登录条带
   口径全部沿用 054（约 1.5 万/年起、客户具名、下载弱化、四选一口径）
   ========================================================================== */
.sec-title{ margin-bottom:14px; }
.sec-title h2{ font-size:var(--fs-act); }
.sec-title .kicker{ font-size:var(--fs-label); color:var(--tx-3); letter-spacing:.06em; margin-bottom:8px; }

.g4{ grid-template-columns:repeat(4,1fr); }
@media (max-width:1024px){ .g4{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .g4{ grid-template-columns:1fr; } }

.price-grid{ display:grid; gap:16px; }
.price-card{ position:relative; display:flex; flex-direction:column; }
.price-card .pc-en{ font-size:var(--fs-label); letter-spacing:.08em; color:var(--tx-3); margin-bottom:10px; }
.price-card .pc-desc{ font-size:13.5px; color:var(--tx-2); margin:0 0 14px; }
.price-card ul{ margin:0 0 18px; padding-left:18px; color:var(--tx-2); font-size:13.5px; }
.price-card li{ margin:5px 0; }
.price-card .pc-cta{ margin-top:auto; }
.pc-badge{ position:absolute; top:-11px; left:24px; padding:3px 12px; border-radius:999px;
  font-size:11px; background:var(--brand); color:#fff; }
.price-note{ margin:22px 0 0; font-size:13px; color:var(--tx-2); line-height:1.8; }

.stat{ text-align:center; }
.stat .num{ display:block; font-size:36px; line-height:1.15; color:var(--gold); }
.stat .lbl{ display:block; margin-top:8px; font-size:13px; color:var(--tx-2); }

.cust-card{ text-align:center; }
.cust-card .avatar{ width:56px; height:56px; margin:0 auto 14px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; font-size:22px; color:#fff; background:var(--brand); }
.cust-card .cn{ font-size:15px; color:var(--tx-1); }
.cust-card .ct{ display:flex; flex-wrap:wrap; gap:8px; justify-content:center; margin-top:12px; }

.cred-row{ display:flex; flex-wrap:wrap; gap:12px; margin-top:24px; }
.cred-item{ display:inline-flex; align-items:center; gap:10px; padding:11px 18px; border-radius:999px;
  background:var(--void-1); border:1px solid var(--line-2); font-size:13px; color:var(--tx-2); }
.cred-item svg{ width:18px; height:18px; flex:0 0 auto; stroke:var(--gold); fill:none;
  stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.partner-tags{ display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }

.login-strip{ display:flex; align-items:center; justify-content:center; gap:18px; flex-wrap:wrap;
  padding:22px 26px; border:1px solid var(--line-2); border-radius:var(--r-lg); background:var(--void-1);
  text-align:center; }
.login-strip .ls-t{ font-size:14px; color:var(--tx-2); line-height:1.7; }
.login-strip .ls-t b{ color:var(--tx-1); }

/* =============================================================================
   无障碍：跳转到主内容（键盘用户第一个可聚焦元素）
   ========================================================================== */
.skip-link{
  position:absolute; left:-9999px; top:0; z-index:100;
  padding:10px 16px; border-radius:0 0 var(--r-sm) 0;
  background:var(--brand); color:#fff; font-size:14px;
}
.skip-link:focus{ left:0; }

/* =============================================================================
   入驻表单（pricing.html#join）
   🔴 本站**没有**公开接收表单的服务端接口 ⇒ 提交**不假装成功**：
      校验通过后生成 `mailto:` 草稿（真实可用）并在页面显示可复制文本 ＋ 电话/邮箱。
   ========================================================================== */
.field{ display:block; margin-bottom:16px; }
.field > .fl{ display:block; font-size:var(--fs-label); color:var(--tx-3); margin-bottom:6px; }
.field input,.field select,.field textarea{
  width:100%; padding:11px 14px; border-radius:var(--r-sm);
  border:1px solid var(--line-1); background:var(--void-1); color:var(--tx-1);
  font:inherit; font-size:14px;
}
.field input::placeholder,.field textarea::placeholder{ color:var(--tx-3); }
.choice{ display:grid; gap:10px; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); }
.choice label{ display:flex; gap:10px; align-items:flex-start; padding:12px 14px;
  border:1px solid var(--line-2); border-radius:var(--r-md); background:var(--void-1);
  cursor:pointer; font-size:14px; color:var(--tx-2); }
.choice label:hover{ border-color:var(--gold); }
.choice input{ accent-color:var(--brand); margin-top:3px; }
.form-err{ color:var(--gold); font-size:13px; margin:10px 0 0; }
.join-out{ margin-top:18px; padding:16px 18px; border:1px solid var(--gold-a40); border-radius:var(--r-md);
  background:var(--void-1); font-size:13.5px; color:var(--tx-2); white-space:pre-wrap; word-break:break-all; }
.join-out[hidden]{ display:none; }
.join-out a{ color:var(--gold); }

/* =============================================================================
   数字管家（specs/060 · 迁移自 054 的「数字客服」，**令牌名全部映射到 058 新令牌**）
   🔴 旧令牌（--bg2/--glass/--glass-border/--txt/--txt3/--brand-hi/--violet/--font）
      在 058 已不存在 ⇒ 这里逐一映射，禁止再引旧名（否则静默失效）。
   ========================================================================== */
.syc-chat-btn{position:fixed;right:24px;bottom:24px;width:58px;height:58px;border-radius:50%;
  background:linear-gradient(135deg,var(--brand-glow),var(--brand));color:#fff;border:none;cursor:pointer;
  box-shadow:0 8px 30px var(--brand-a55);z-index:1000;display:flex;align-items:center;justify-content:center;
  transition:transform .2s var(--ease),box-shadow .2s var(--ease)}
.syc-chat-btn:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 12px 38px var(--brand-a55)}
.syc-chat-btn svg{width:28px;height:28px;fill:none;stroke:#fff;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.syc-chat-panel{position:fixed;right:24px;bottom:96px;width:376px;max-width:calc(100vw - 48px);
  background:var(--void-1);border:1px solid var(--line-2);border-radius:var(--r-lg);
  box-shadow:var(--shadow-1);z-index:1000;overflow:hidden;display:none;flex-direction:column}
.syc-chat-panel.open{display:flex}
.syc-chat-head{display:flex;align-items:center;gap:12px;padding:16px 18px;
  background:linear-gradient(135deg,var(--brand-a24),var(--gold-a16));border-bottom:1px solid var(--line-2)}
.syc-chat-head .ava{width:38px;height:38px;border-radius:50%;
  background:linear-gradient(135deg,var(--brand-glow),var(--gold));display:flex;align-items:center;justify-content:center;
  font-size:18px;color:#fff;flex:0 0 auto}
.syc-chat-head .name{font-size:var(--fs-sub);font-weight:700;color:var(--tx-1)}
.syc-chat-head .sts{font-size:var(--fs-label);color:var(--gold);margin-top:2px}
.syc-chat-close{margin-left:auto;background:none;border:none;color:var(--tx-3);font-size:20px;cursor:pointer;
  /* 060 实测：原 24x22 低于 WCAG 2.5.8 的 24x24 最小目标 ⇒ 给足命中区（视觉不变，只是可点范围） */
  min-width:40px;min-height:40px;display:inline-flex;align-items:center;justify-content:center;line-height:1}
.syc-chat-body{padding:16px 18px;max-height:min(52vh,360px);overflow-y:auto;scroll-behavior:smooth}
.syc-msg{font-size:var(--fs-label);line-height:1.7;margin-bottom:12px;padding:10px 14px;border-radius:var(--r-md);max-width:86%}
.syc-msg.bot{background:var(--white-a06);color:var(--tx-1);border-top-left-radius:4px;margin-right:auto}
.syc-msg.user{background:linear-gradient(135deg,var(--brand-glow),var(--brand));color:#fff;border-top-right-radius:4px;margin-left:auto}
.syc-msg.sys{background:var(--gold-a10);border:1px solid var(--line-2);color:var(--gold);
  font-size:var(--fs-label);text-align:center;max-width:100%;border-radius:var(--r-md);margin:0 auto 12px}
.syc-msg.bot a{color:var(--gold);text-decoration:underline;text-underline-offset:3px}
.syc-quick{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 12px}
.syc-chip{background:var(--white-a06);border:1px solid var(--line-2);color:var(--gold);border-radius:999px;
  padding:7px 13px;font-size:var(--fs-label);font-family:var(--font-sans);cursor:pointer;
  /* 060 实测：原高 32px < 本 spec 的 40px 点击目标线 ⇒ 统一提到 40px（更好点、也更易读） */
  display:inline-flex;align-items:center;min-height:40px;
  transition:border-color .2s var(--ease),transform .2s var(--ease)}
.syc-chip:hover{border-color:var(--gold);transform:translateY(-1px)}
.syc-typing span{display:inline-block;width:6px;height:6px;margin:0 2px;border-radius:50%;
  background:var(--tx-3);animation:sycDot 1.2s infinite}
.syc-typing span:nth-child(2){animation-delay:.2s}
.syc-typing span:nth-child(3){animation-delay:.4s}
@keyframes sycDot{0%,60%,100%{opacity:.25;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
.syc-chat-form{padding:12px 18px 16px;border-top:1px solid var(--line-2)}
.syc-compose{display:flex;gap:8px;align-items:flex-end}
.syc-compose textarea{flex:1;min-height:44px;max-height:110px;resize:none;padding:10px 12px;border-radius:var(--r-md);
  border:1px solid var(--line-2);background:var(--white-a06);color:var(--tx-1);font-size:var(--fs-label);
  font-family:var(--font-sans);outline:none}
.syc-compose textarea:focus{border-color:var(--gold)}
.syc-compose .send{width:auto;margin:0;padding:10px 16px;white-space:nowrap}
.syc-compose .send[disabled]{opacity:.55;cursor:not-allowed}
.syc-hint{font-size:var(--fs-label);color:var(--tx-3);margin-top:8px;line-height:1.6}
.syc-lead-card{background:var(--white-a06);border:1px solid var(--gold);border-radius:var(--r-md);padding:12px 14px;margin:0 0 12px}
.syc-lead-card .t{font-size:var(--fs-label);color:var(--gold);margin-bottom:8px}
.syc-lead-card input{width:100%;padding:9px 12px;border-radius:var(--r-md);border:1px solid var(--line-2);
  background:var(--void-0);color:var(--tx-1);font-size:var(--fs-label);font-family:var(--font-sans);outline:none;margin-bottom:8px}
.syc-lead-card input:focus{border-color:var(--gold)}
.syc-lead-card .row{display:flex;gap:8px}
.syc-lead-card .row .btn{flex:1;padding:9px 12px;font-size:var(--fs-label)}
.syc-lead-card .skip{background:none;border:none;color:var(--tx-3);font-size:var(--fs-label);cursor:pointer;
  margin-top:8px;text-decoration:underline;text-underline-offset:3px;
  /* 060 复测：实测仅 144x18 < WCAG 2.5.8(24) 与本 spec 的 40 ⇒ 给足命中区 */
  min-height:40px;display:inline-flex;align-items:center}
/* --- 060 选型顾问 --- */
.syc-adv{padding:0 18px 12px}
.syc-adv-t{font-size:var(--fs-label);color:var(--tx-2);margin:4px 0 8px}
.syc-adv-opts{display:flex;flex-wrap:wrap;gap:8px}
.syc-adv-card{border:1px solid var(--gold);border-radius:var(--r-md);padding:12px 14px;background:var(--gold-a08)}
.syc-adv-card .t{font-size:var(--fs-sub);color:var(--tx-1);margin-bottom:6px}
.syc-adv-card .t b{color:var(--gold)}
.syc-adv-card .d{font-size:var(--fs-label);color:var(--tx-2);margin-bottom:8px}
.syc-adv-card dl{margin:0 0 10px;font-size:var(--fs-label)}
.syc-adv-card dt{color:var(--tx-3);float:left;clear:left;width:5.5em}
.syc-adv-card dd{margin:0 0 4px;color:var(--tx-2)}
.syc-adv-card::after{content:'';display:block;clear:both}
.syc-adv-cta{display:block;width:100%;text-align:center;margin-bottom:8px}
.syc-adv-card .skip{display:flex;background:none;border:none;color:var(--tx-3);font-size:var(--fs-label);
  cursor:pointer;margin:0 auto 6px;text-decoration:underline;text-underline-offset:3px;
  min-height:40px;align-items:center;justify-content:center}
.syc-lead-card label.f{display:block;margin-bottom:8px}
.syc-lead-card .lb{display:block;font-size:var(--fs-label);color:var(--tx-3);margin-bottom:4px}
@media (max-width:480px){
  .syc-chat-panel{right:12px;left:12px;width:auto;bottom:84px}
  .syc-chat-body{max-height:min(46vh,300px)}
}

/* =============================================================================
   060 · 首屏背书条（老板要的「背书前置」）
   🔴 为什么用绝对定位而不是新增一幕：`.act` 是 min-height:100vh 且内容居中，
      若在 hero 里**追加**普通流元素，会被推到首屏之外 ⇒ 等于没前置；
      新增独立 section 又会破坏 058 的「6 幕 + 1 落地区」结构。
      ⇒ 绝对定位在 hero 底部：首屏可见、不增幕、不动 058 FR-3 的落地区六项。
   ========================================================================== */
.hero-trust{
  position:absolute;left:0;right:0;bottom:26px;z-index:2;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px 12px;
  padding:0 96px;font-size:var(--fs-label);text-align:center;
}
.hero-trust .ht-lb{color:var(--tx-3)}
.hero-trust .ht-c{color:var(--tx-2)}
.hero-trust .ht-s{color:var(--line-2)}
.hero-trust .ht-cred{color:var(--gold);text-decoration:underline;text-underline-offset:3px}
/* 掉帧提示行出现时（左下固定）自动上抬，避免叠字 */
body:has(.perf-note:not([hidden])) .hero-trust{bottom:70px}
@media (max-width:768px){
  /* 移动端 .act 不限高，改为正常流式：仍紧跟首屏 CTA 之后，无需绝对定位 */
  .hero-trust{position:static;padding:0;justify-content:flex-start;text-align:left;margin-top:22px;gap:6px 10px}
}
/* 060 修正：枚举类字段改为下拉（老板 10-12 反馈：地区/行业/客户量不该手打） */
.syc-lead-card select{width:100%;padding:9px 12px;border-radius:var(--r-md);border:1px solid var(--line-2);
  background:var(--void-0);color:var(--tx-1);font-size:var(--fs-label);font-family:var(--font-sans);
  outline:none;margin-bottom:8px;appearance:auto}
.syc-lead-card select:focus{border-color:var(--gold)}
.syc-lead-card .lb{display:block;font-size:var(--fs-label);color:var(--tx-3);margin-bottom:4px}
/* 🔴 面板只有 376px：省/市两个下拉**并排会把「新疆维吾尔自治区」这类长名截断** ⇒ 纵向堆叠 */
.syc-row2{display:block}