/* ============================================================
   八个六维修 · 全站 UI/UX 精美设计系统 v2
   品牌橙 #E8721A ｜ 深空灰 #0F1419 ｜ 金 #FFB454
   覆盖式美化：文章页重排版 + 全站组件精致化
   ============================================================ */

/* ========== 设计令牌 ========== */
:root{
  --brand:#E8721A;
  --brand-600:#D1620F;
  --brand-700:#C05621;
  --brand-dark:#9C4406;
  --brand-light:#FFF3E8;
  --brand-soft:#FFE8D6;
  --gold:#FFB454;

  --ink:#12161C;
  --ink-2:#3D444D;
  --ink-3:#5F6770;
  --ink-4:#8B939C;
  --ink-5:#B4BABF;

  --line:#ECEEF0;
  --line-2:#E2E5E8;
  --bg:#FFFFFF;
  --bg-soft:#FAFAF9;
  --bg-tint:#F7F5F2;
  --deep:#0F1419;
  --deep-2:#1A1F2E;
  --deep-3:#2D3548;

  --green:#1E9E6A;
  --red:#E5484D;

  --sh-xs:0 1px 2px rgba(16,24,40,.05);
  --sh-sm:0 2px 6px rgba(16,24,40,.06),0 1px 2px rgba(16,24,40,.04);
  --sh-md:0 6px 16px rgba(16,24,40,.08),0 2px 5px rgba(16,24,40,.04);
  --sh-lg:0 20px 44px rgba(16,24,40,.12),0 8px 16px rgba(16,24,40,.05);
  --sh-xl:0 32px 64px rgba(16,24,40,.16);
  --sh-brand:0 10px 26px rgba(232,114,26,.30);
  --sh-brand-lg:0 16px 38px rgba(232,114,26,.38);

  --r-xs:6px; --r-sm:10px; --r-md:14px; --r-lg:18px; --r-xl:24px; --r-2xl:32px; --r-full:999px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --safe-b:env(safe-area-inset-bottom,0px);
}

/* ========== 基础精致化 ========== */
*{ -webkit-tap-highlight-color:transparent; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; scroll-padding-top:88px; }
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
  text-rendering:optimizeLegibility; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  color:var(--ink-2);
}
img{ max-width:100%; height:auto; }
a{ transition:color .22s var(--ease),opacity .22s var(--ease),background .22s var(--ease),border-color .22s var(--ease),transform .22s var(--ease),box-shadow .22s var(--ease); }
::selection{ background:var(--brand); color:#fff; }

/* 精致滚动条 */
::-webkit-scrollbar{ width:11px; height:11px; }
::-webkit-scrollbar-track{ background:#F3F4F6; }
::-webkit-scrollbar-thumb{ background:linear-gradient(180deg,#CBD2D9,#B6BEC7); border-radius:99px; border:3px solid #F3F4F6; }
::-webkit-scrollbar-thumb:hover{ background:linear-gradient(180deg,var(--brand),var(--brand-600)); }

/* 无障碍焦点 */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:3px solid rgba(232,114,26,.42); outline-offset:3px; border-radius:6px;
}

/* ========== 1. 阅读进度条 ========== */
.ui-progress{
  position:fixed; top:0; left:0; height:3px; width:0%; z-index:9999;
  background:linear-gradient(90deg,var(--brand) 0%,var(--gold) 60%,#FFD28A 100%);
  box-shadow:0 0 10px rgba(232,114,26,.55);
  transition:width .08s linear; border-radius:0 3px 3px 0;
}
.ui-progress::after{
  content:''; position:absolute; right:0; top:0; width:24px; height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.9)); animation:ui-shine 1.6s linear infinite;
}
@keyframes ui-shine{ 0%{opacity:.3} 50%{opacity:1} 100%{opacity:.3} }

/* ========== 2. 返回顶部 ========== */
.ui-top{
  position:fixed; right:18px; bottom:calc(88px + var(--safe-b));
  width:48px; height:48px; border-radius:var(--r-full);
  background:rgba(255,255,255,.94); backdrop-filter:blur(10px);
  border:1px solid var(--line); color:var(--ink-3);
  display:flex; align-items:center; justify-content:center;
  box-shadow:var(--sh-md); cursor:pointer; z-index:120; padding:0;
  opacity:0; visibility:hidden; transform:translateY(12px) scale(.88);
  transition:all .34s var(--ease-out);
}
.ui-top.show{ opacity:1; visibility:visible; transform:translateY(0) scale(1); }
.ui-top:hover{ background:var(--brand); color:#fff; border-color:var(--brand); transform:translateY(-4px); box-shadow:var(--sh-brand); }
.ui-top:active{ transform:translateY(0) scale(.94); }

/* ========== 3. 悬浮拨号球 ========== */
.ui-fab{
  position:fixed; right:18px; bottom:calc(146px + var(--safe-b));
  width:58px; height:58px; border-radius:var(--r-full);
  background:linear-gradient(145deg,#FF8A2B 0%,var(--brand) 45%,var(--brand-700) 100%);
  color:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-decoration:none; z-index:130; gap:1px;
  box-shadow:var(--sh-brand), inset 0 1px 0 rgba(255,255,255,.35);
  transition:transform .3s var(--ease-out),box-shadow .3s var(--ease);
  animation:ui-pulse 2.8s var(--ease) infinite;
}
.ui-fab:hover{ transform:scale(1.09) translateY(-3px); box-shadow:var(--sh-brand-lg); }
.ui-fab:active{ transform:scale(.95); }
.ui-fab svg{ width:22px; height:22px; }
.ui-fab span{ font-size:10px; font-weight:600; letter-spacing:.6px; }
@keyframes ui-pulse{
  0%{ box-shadow:0 0 0 0 rgba(232,114,26,.5),var(--sh-brand); }
  70%{ box-shadow:0 0 0 16px rgba(232,114,26,0),var(--sh-brand); }
  100%{ box-shadow:0 0 0 0 rgba(232,114,26,0),var(--sh-brand); }
}
@media(max-width:768px){ .ui-fab{ bottom:calc(128px + var(--safe-b)); width:54px; height:54px; } }

/* ========== 4. 移动端底部导航（玻璃拟态） ========== */
.ui-bnav{
  position:fixed; left:0; right:0; bottom:0; z-index:150; display:none;
  background:rgba(255,255,255,.92);
  backdrop-filter:saturate(200%) blur(18px); -webkit-backdrop-filter:saturate(200%) blur(18px);
  border-top:1px solid rgba(0,0,0,.06);
  padding-bottom:var(--safe-b);
  box-shadow:0 -6px 24px rgba(16,24,40,.10);
}
.ui-bnav-in{ display:flex; align-items:stretch; height:60px; }
.ui-bnav a{
  flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
  text-decoration:none; color:var(--ink-3); font-size:11px; font-weight:500;
  position:relative; transition:all .2s var(--ease);
}
.ui-bnav a svg{ width:22px; height:22px; }
.ui-bnav a:active{ background:rgba(0,0,0,.04); }
.ui-bnav a.ui-bnav-call{
  background:linear-gradient(145deg,#FF8A2B,var(--brand-700));
  color:#fff; flex:1.55; font-weight:800; font-size:12.5px; letter-spacing:.3px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3);
}
.ui-bnav a.ui-bnav-call svg{ width:20px; height:20px; }
@media(max-width:768px){
  .ui-bnav{ display:block; }
  body{ padding-bottom:calc(60px + var(--safe-b)); }
}

/* ========== 5. 微信客服弹窗 ========== */
.ui-mask{
  position:fixed; inset:0; background:rgba(12,16,22,.58); z-index:200;
  display:flex; align-items:center; justify-content:center; padding:20px;
  opacity:0; visibility:hidden; transition:all .3s var(--ease); backdrop-filter:blur(4px);
}
.ui-mask.show{ opacity:1; visibility:visible; }
.ui-modal{
  background:#fff; border-radius:var(--r-2xl); width:100%; max-width:352px;
  padding:34px 28px 28px; text-align:center; box-shadow:var(--sh-xl);
  transform:translateY(24px) scale(.94); transition:all .36s var(--ease-out);
  position:relative; overflow:hidden;
}
.ui-mask.show .ui-modal{ transform:translateY(0) scale(1); }
.ui-modal::before{
  content:''; position:absolute; top:0; left:0; right:0; height:5px;
  background:linear-gradient(90deg,var(--brand),var(--gold));
}
.ui-modal h4{ font-size:20px; color:var(--ink); margin:0 0 5px; font-weight:800; letter-spacing:.3px; }
.ui-modal .sub{ font-size:13px; color:var(--ink-4); margin:0 0 20px; }
.ui-qr{
  width:176px; height:176px; margin:0 auto 18px; border-radius:var(--r-lg);
  background:#fff url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><rect width='100' height='100' fill='%23fff'/><g fill='%2312161C'><rect x='8' y='8' width='26' height='26' rx='3'/><rect x='13' y='13' width='16' height='16' fill='%23fff'/><rect x='17' y='17' width='8' height='8' rx='1'/><rect x='66' y='8' width='26' height='26' rx='3'/><rect x='71' y='13' width='16' height='16' fill='%23fff'/><rect x='75' y='17' width='8' height='8' rx='1'/><rect x='8' y='66' width='26' height='26' rx='3'/><rect x='13' y='71' width='16' height='16' fill='%23fff'/><rect x='17' y='75' width='8' height='8' rx='1'/><rect x='42' y='42' width='9' height='9' rx='1'/><rect x='55' y='42' width='9' height='9' rx='1'/><rect x='42' y='55' width='9' height='9' rx='1'/><rect x='58' y='58' width='9' height='9' rx='1'/><rect x='70' y='42' width='9' height='9' rx='1'/><rect x='42' y='70' width='9' height='9' rx='1'/><rect x='66' y='66' width='9' height='9' rx='1'/><rect x='82' y='82' width='9' height='9' rx='1'/><rect x='80' y='42' width='9' height='9' rx='1'/><rect x='55' y='80' width='9' height='9' rx='1'/></g></svg>") center/contain no-repeat;
  border:1px solid var(--line); box-shadow:var(--sh-sm);
}
.ui-modal .wxnum{
  font-size:23px; font-weight:800; color:var(--brand); letter-spacing:1.2px; margin:0 0 6px;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
}
.ui-modal .tip{ font-size:12px; color:var(--ink-4); margin:0 0 20px; }
.ui-modal .acts{ display:flex; gap:10px; }
.ui-modal .acts a{
  flex:1; padding:12px 0; border-radius:var(--r-full); font-size:14px;
  text-decoration:none; font-weight:700; transition:all .24s var(--ease);
}
.ui-modal .acts .c1{ background:var(--bg-soft); color:var(--ink-2); border:1px solid var(--line-2); }
.ui-modal .acts .c1:hover{ background:#fff; border-color:var(--brand); color:var(--brand-700); transform:translateY(-2px); }
.ui-modal .acts .c2{
  background:linear-gradient(145deg,#FF8A2B,var(--brand-700)); color:#fff;
  box-shadow:var(--sh-brand); border:1px solid transparent;
}
.ui-modal .acts .c2:hover{ transform:translateY(-2px); box-shadow:var(--sh-brand-lg); }
.ui-close{
  position:absolute; top:13px; right:15px; width:32px; height:32px;
  border:none; background:var(--bg-soft); border-radius:50%; cursor:pointer;
  color:var(--ink-4); font-size:15px; line-height:1; transition:all .22s var(--ease);
}
.ui-close:hover{ background:var(--brand-light); color:var(--brand-700); transform:rotate(90deg); }

/* ========== 6. 滚动淡入 ========== */
.ui-reveal{ opacity:0; transform:translateY(24px); transition:opacity .62s var(--ease-out),transform .62s var(--ease-out); }
.ui-reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){
  .ui-reveal{ opacity:1 !important; transform:none !important; transition:none !important; }
  html{ scroll-behavior:auto; }
  .ui-fab{ animation:none; }
  .ui-progress::after{ animation:none; }
}

/* ========== 7. 全站按钮 / 卡片动效 ========== */
.btn,.btn-primary,.btn-ghost,.hd-cta,.cta-btn,.btn-outline{
  transition:transform .24s var(--ease-out),box-shadow .24s var(--ease),filter .24s var(--ease) !important;
}
.btn:hover,.btn-primary:hover,.hd-cta:hover,.cta-btn:hover,.btn-outline:hover{
  transform:translateY(-2px); box-shadow:var(--sh-brand);
}
.btn:active,.btn-primary:active,.hd-cta:active,.cta-btn:active{ transform:translateY(0) scale(.98); }

/* 卡片悬浮 */
.ui-cardize .card:hover,.ui-cardize .case-card:hover,
.ui-cardize .price-card:hover,.ui-cardize .faq-item:hover{
  transform:translateY(-4px); box-shadow:var(--sh-lg);
}
.card,.case-card,.price-card,.faq-item{ transition:transform .3s var(--ease-out),box-shadow .3s var(--ease); }

/* 顶部导航吸顶 */
.site-header{ transition:box-shadow .3s var(--ease),background .3s var(--ease) !important; }
.site-header.ui-stuck{ box-shadow:var(--sh-md); }

/* ============================================================
   8. ★ 文章页重排版（800篇主体）—— 杂志级质感
   ============================================================ */
body:has(main.wrap) > header,
body > header:has(~ main.wrap){
  background:
    radial-gradient(1200px 380px at 15% -10%,rgba(232,114,26,.28),transparent 60%),
    radial-gradient(900px 320px at 88% 0%,rgba(255,180,84,.20),transparent 62%),
    linear-gradient(160deg,#0F1419 0%,#1A1F2E 52%,#2D3548 100%) !important;
  padding:46px 20px 42px !important; position:relative; overflow:hidden;
}
body:has(main.wrap) > header::after{
  content:''; position:absolute; left:0; right:0; bottom:-1px; height:26px;
  background:linear-gradient(180deg,transparent,rgba(247,245,242,.14));
}
body:has(main.wrap) > header h1{
  font-size:clamp(23px,4.4vw,34px) !important; font-weight:800 !important;
  letter-spacing:.4px; line-height:1.42 !important; text-shadow:0 2px 14px rgba(0,0,0,.32);
  max-width:820px; margin:0 auto !important;
}
body:has(main.wrap) > header .sub{
  font-size:14.5px !important; color:#FFCB8A !important; margin-top:14px !important;
  letter-spacing:.5px;
}

/* 文章页背景 + 主体白卡片浮起 */
body:has(main.wrap){
  background:linear-gradient(180deg,#F7F5F2 0%,#FAFAF9 100%) !important;
  background-attachment:fixed;
}
body:has(main.wrap) main.wrap{
  background:#fff; border-radius:var(--r-2xl);
  box-shadow:0 2px 8px rgba(16,24,40,.05),0 18px 48px rgba(16,24,40,.09);
  padding:44px 52px 56px !important; margin:26px auto 40px !important;
  max-width:860px; border:1px solid rgba(255,255,255,.9);
}
@media(max-width:768px){
  body:has(main.wrap) main.wrap{
    border-radius:var(--r-xl); padding:26px 20px 34px !important;
    margin:16px 12px 28px !important; box-shadow:0 1px 4px rgba(16,24,40,.05),0 8px 22px rgba(16,24,40,.07);
  }
}

/* 面包屑条 */
body:has(main.wrap) > nav{
  max-width:860px; margin:0 auto; padding:14px 20px 0 !important;
  font-size:13px; color:var(--ink-4); background:transparent; border:none;
  display:flex; flex-wrap:wrap; align-items:center; gap:6px;
}
body:has(main.wrap) > nav a{ color:var(--brand-700); text-decoration:none; font-weight:500; }
body:has(main.wrap) > nav a:hover{ color:var(--brand); text-decoration:underline; }

/* ---------- 文章正文排版 ---------- */
.prose{ font-size:16.8px; line-height:1.95; color:#333A43; letter-spacing:.25px; }
.prose .lead{
  font-size:17.4px !important; line-height:1.9 !important; color:var(--ink);
  background:linear-gradient(135deg,#FFFCF7 0%,#FFF3E8 100%) !important;
  border:none !important; border-left:5px solid var(--brand) !important;
  border-radius:0 var(--r-lg) var(--r-lg) 0 !important;
  padding:22px 26px !important; margin:0 0 34px !important;
  box-shadow:var(--sh-xs); font-weight:500;
}
.prose h2{
  font-size:21.5px !important; line-height:1.48 !important; color:var(--ink);
  font-weight:800 !important; letter-spacing:.3px;
  margin:46px 0 20px !important; padding:2px 0 13px 0 !important;
  border-left:none !important; border-bottom:2px solid transparent !important;
  border-image:linear-gradient(90deg,var(--brand),rgba(232,114,26,.08)) 1 !important;
  scroll-margin-top:92px; position:relative;
}
.prose h2:first-of-type{ margin-top:6px !important; }
.prose h2 .h2n{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:27px; height:27px; padding:0 8px; margin-right:11px;
  border-radius:var(--r-sm);
  background:linear-gradient(145deg,#FF8A2B,var(--brand-700));
  color:#fff; font-size:14px; font-weight:800; vertical-align:2px;
  box-shadow:0 3px 8px rgba(232,114,26,.32);
}
.prose p{ margin:0 0 19px !important; text-align:justify; }
.prose strong{ color:var(--brand-700) !important; font-weight:700; }
.prose ul,.prose ol{ margin:0 0 22px !important; padding-left:2px !important; }
.prose ul{ list-style:none !important; }
.prose ul li{ position:relative; padding-left:26px !important; margin:0 0 12px !important; }
.prose ul li::before{
  content:''; position:absolute; left:7px; top:12px; width:7px; height:7px;
  border-radius:50%; background:linear-gradient(145deg,var(--brand),var(--brand-700));
  box-shadow:0 0 0 3px rgba(232,114,26,.14);
}
.prose ol{ counter-reset:li; list-style:none !important; }
.prose ol li{ position:relative; padding-left:36px !important; margin:0 0 14px !important; counter-increment:li; }
.prose ol li::before{
  content:counter(li); position:absolute; left:0; top:4px;
  width:24px; height:24px; border-radius:50%;
  background:linear-gradient(145deg,#FFF3E8,#FFE8D6); color:var(--brand-700);
  font-size:12.5px; font-weight:800; display:flex; align-items:center; justify-content:center;
  border:1px solid rgba(232,114,26,.22);
}
.prose a{ color:var(--brand-700); text-decoration:none; border-bottom:1px solid rgba(232,114,26,.34); }
.prose a:hover{ color:var(--brand); border-bottom-color:var(--brand); }

/* 结论 speakable 块 */
.prose .speak,body .wrap .speak{
  margin:0 0 32px !important; padding:20px 24px !important;
  border-radius:var(--r-lg) !important;
  background:linear-gradient(135deg,#F2F8FF 0%,#E8F1FD 100%) !important;
  border:1px solid #C7E0F7 !important; border-left:5px solid #2B7DE9 !important;
  font-size:15.8px !important; color:#1C4E80 !important; box-shadow:var(--sh-xs);
}
.prose .speak strong{ color:#0F4C81 !important; }

/* CTA 转化块 */
body .wrap .cta{
  border-radius:var(--r-xl) !important; padding:34px 24px 30px !important;
  background:
    radial-gradient(600px 200px at 50% 0%,rgba(255,255,255,.18),transparent 70%),
    linear-gradient(140deg,#FF8A2B 0%,var(--brand) 48%,var(--brand-700) 100%) !important;
  box-shadow:var(--sh-brand-lg),inset 0 1px 0 rgba(255,255,255,.3) !important;
  margin:44px 0 8px !important;
}
body .wrap .cta p{ color:rgba(255,255,255,.94) !important; font-size:14.5px !important; letter-spacing:.4px; }
body .wrap .cta .tel{
  font-size:clamp(27px,6.4vw,38px) !important; font-weight:800; letter-spacing:1px;
  color:#fff !important; text-shadow:0 3px 12px rgba(0,0,0,.22);
  display:block; margin:10px 0 !important; text-decoration:none;
}
body .wrap .cta .tel:hover{ transform:scale(1.03); }

/* 相关阅读 → 胶囊标签 */
body .wrap .related{
  border-radius:var(--r-xl) !important; border:1px solid var(--line) !important;
  background:linear-gradient(150deg,#FFFFFF 0%,#FFFBF6 100%) !important;
  padding:24px 26px !important; box-shadow:var(--sh-xs); margin-top:36px !important;
}
body .wrap .related h3{
  font-size:16px !important; color:var(--ink); font-weight:800; margin:0 0 15px !important;
  padding-bottom:11px !important; border-bottom:1px dashed var(--line-2) !important;
}
body .wrap .related a{
  display:inline-block; background:#fff; border:1px solid var(--line-2);
  border-radius:var(--r-full); padding:7px 15px; margin:0 9px 9px 0 !important;
  font-size:13px !important; color:var(--ink-2); text-decoration:none;
  transition:all .26s var(--ease-out);
}
body .wrap .related a:hover{
  background:linear-gradient(145deg,#FF8A2B,var(--brand-700)); color:#fff;
  border-color:transparent; transform:translateY(-3px); box-shadow:var(--sh-brand);
}

/* 电话高亮 */
.ui-tel{
  color:var(--brand-700) !important; font-weight:800; letter-spacing:.5px;
  white-space:nowrap; background:linear-gradient(180deg,transparent 62%,rgba(232,114,26,.16) 62%);
  padding:0 1px;
}

/* ========== 9. 内链矩阵（精致卡片网格） ========== */
.ui-matrix{
  margin:44px 0 6px !important; padding:28px 26px; border-radius:var(--r-xl);
  background:linear-gradient(160deg,#FFFFFF 0%,#FFFCF8 100%);
  border:1px solid var(--line); box-shadow:var(--sh-sm);
}
.ui-matrix h3{
  font-size:16px !important; color:var(--ink) !important; font-weight:800 !important;
  margin:0 0 16px !important; padding-bottom:12px !important;
  border-bottom:1px dashed var(--line-2) !important; letter-spacing:.3px;
}
.ui-matrix-grid{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(192px,1fr));
  gap:11px; margin-bottom:24px;
}
.ui-matrix-grid:last-of-type{ margin-bottom:12px; }
.ui-matrix-grid a{
  display:flex; flex-direction:column; gap:4px;
  padding:13px 15px; border-radius:var(--r-md);
  background:#fff; border:1px solid var(--line);
  text-decoration:none; transition:all .28s var(--ease-out); position:relative; overflow:hidden;
}
.ui-matrix-grid a::before{
  content:''; position:absolute; left:0; top:0; bottom:0; width:3px;
  background:linear-gradient(180deg,var(--brand),var(--gold));
  transform:scaleY(0); transform-origin:top; transition:transform .3s var(--ease-out);
}
.ui-matrix-grid a:hover{
  border-color:transparent; transform:translateY(-3px);
  box-shadow:var(--sh-md); background:#fff;
}
.ui-matrix-grid a:hover::before{ transform:scaleY(1); }
.ui-matrix-grid .m-t{ font-size:14px; color:var(--ink); font-weight:700; line-height:1.45; }
.ui-matrix-grid .m-s{ font-size:12px; color:var(--ink-4); }
.ui-matrix-grid a:hover .m-t{ color:var(--brand-700); }
.ui-matrix-tip{
  margin:0 !important; padding-top:16px !important; border-top:1px solid var(--line) !important;
  font-size:13px !important; color:var(--ink-4) !important; text-align:center !important;
}
.ui-matrix-tip a{ color:var(--brand-700) !important; font-weight:800; text-decoration:none; border:none !important; }
.ui-matrix-tip a:hover{ color:var(--brand) !important; text-decoration:underline; }
@media(max-width:600px){
  .ui-matrix{ padding:20px 16px; }
  .ui-matrix-grid{ grid-template-columns:repeat(auto-fill,minmax(142px,1fr)); gap:9px; }
}

/* ========== 10. 文章目录 TOC（桌面右侧） ========== */
.ui-toc{
  position:fixed; top:96px; left:50%; margin-left:440px; width:210px;
  max-height:calc(100vh - 150px); overflow-y:auto; z-index:60;
  padding:18px 6px 18px 16px; border-left:2px solid var(--line);
  display:none;
}
@media(min-width:1280px){ .ui-toc{ display:block; } }
.ui-toc h4{
  font-size:12px; color:var(--ink-4); font-weight:700; letter-spacing:1.4px;
  margin:0 0 12px; text-transform:uppercase;
}
.ui-toc a{
  display:block; font-size:13px; color:var(--ink-3); text-decoration:none;
  padding:6px 10px 6px 12px; margin-left:-16px; border-left:2px solid transparent;
  line-height:1.55; transition:all .22s var(--ease);
}
.ui-toc a:hover{ color:var(--brand-700); background:var(--brand-light); }
.ui-toc a.active{
  color:var(--brand-700); font-weight:700; border-left-color:var(--brand);
  background:linear-gradient(90deg,var(--brand-light),transparent);
}

/* ========== 11. 页脚 + 备案号 ========== */
body:has(main.wrap) > footer,
body > footer:not(.site-footer){
  background:linear-gradient(180deg,#0F1419 0%,#151A26 100%) !important;
  color:#9AA3B2 !important; text-align:center !important;
  padding:38px 20px calc(38px + var(--safe-b)) !important; margin-top:0 !important;
  font-size:13.5px !important; line-height:2 !important; letter-spacing:.3px;
}
body:has(main.wrap) > footer p,
body > footer:not(.site-footer) p{ margin:0 0 6px !important; color:#9AA3B2 !important; }
body:has(main.wrap) > footer a,
body > footer:not(.site-footer) a{ color:var(--gold) !important; text-decoration:none !important; font-weight:600; }
body:has(main.wrap) > footer a:hover,
body > footer:not(.site-footer) a:hover{ color:#fff !important; text-decoration:underline !important; }

/* 全站页脚（含首页 .site-footer）美化 */
.site-footer{
  background:linear-gradient(180deg,#0F1419 0%,#151A26 100%) !important;
  color:#9AA3B2 !important;
}
.site-footer a{ color:var(--gold) !important; text-decoration:none !important; }
.site-footer a:hover{ color:#fff !important; text-decoration:underline !important; }
.site-footer h5{ color:#fff !important; font-weight:700 !important; letter-spacing:.4px; }

/* ---- 备案条 ---- */
.ui-beian{
  margin-top:16px; padding-top:16px;
  border-top:1px solid rgba(255,255,255,.10);
  font-size:12.5px; color:#7C8595; line-height:1.9;
  display:flex; flex-wrap:wrap; gap:4px 14px; align-items:center; justify-content:center;
}
.ui-beian a{
  color:#8C94A3 !important; text-decoration:none !important; font-weight:500 !important;
  display:inline-flex; align-items:center; gap:4px; transition:color .22s var(--ease);
}
.ui-beian a:hover{ color:var(--gold) !important; text-decoration:underline !important; }
.ui-beian .sep{ color:#4A5261; }
.site-footer .ui-beian{ justify-content:flex-start; text-align:left; }

/* ========== 11.5 内页精致化（首页/区站/价格/案例/关于/wiki） ========== */
/* 区块呼吸留白（不覆盖原有交替底色设计） */
main#app > section{ scroll-margin-top:88px; }
/* 区块标题装饰线 */
.section-title,.sec-title,.container > h2{
  position:relative; letter-spacing:.4px;
}
.section-title::after,.sec-title::after,.container > h2::after{
  content:''; display:block; width:54px; height:3px; margin:14px auto 0;
  border-radius:99px; background:linear-gradient(90deg,var(--brand),var(--gold));
}
/* 卡片统一圆角 + 柔和阴影 + 悬浮 */
.card,.case-card,.price-card,.faq-item,.svc-card,.kw-card,.step-card,.pro-card{
  border-radius:var(--r-lg) !important;
  box-shadow:var(--sh-sm);
  transition:transform .32s var(--ease-out),box-shadow .32s var(--ease) !important;
}
.card:hover,.case-card:hover,.price-card:hover,.faq-item:hover,
.svc-card:hover,.kw-card:hover,.step-card:hover,.pro-card:hover{
  transform:translateY(-4px);
  box-shadow:var(--sh-lg);
}
/* 卡片内标题与正文微调 */
.card h3,.case-card h3,.price-card h3,.svc-card h3,.step-card h3{
  letter-spacing:.3px; font-weight:700;
}
/* 价签 / 数字强调 */
.price-card .price,.price-card .num,.card .num{
  background:linear-gradient(135deg,var(--brand),var(--brand-700));
  -webkit-background-clip:text; background-clip:text; color:transparent;
  font-weight:800;
}
/* 内页链接下划线弱化 */
.container a:not(.btn):not(.btn-primary):not(.btn-ghost):not(.hd-cta){
  text-decoration:none;
}
.container a:not(.btn):not(.btn-primary):not(.btn-ghost):not(.hd-cta):hover{
  text-decoration:underline;
}
/* 顶栏高度与阴影 */
.site-header{ box-shadow:var(--sh-xs); }

/* ========== 12. 隐藏旧版重复组件 ========== */
body > .bottom-nav:not(.ui-bnav),
body > .fab:not(.ui-fab),
body > a.fab:not(.ui-fab){ display:none !important; }

/* ========== 13. 打印 ========== */
@media print{
  .ui-bnav,.ui-fab,.ui-top,.ui-progress,.ui-mask,.ui-toc{ display:none !important; }
  body{ padding-bottom:0 !important; }
  body:has(main.wrap) main.wrap{ box-shadow:none !important; }
}

/* ========== 14. 微信客服条（页脚上方，HTML 可见） ========== */
.ui-wxbar{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center;
  gap:10px 14px; max-width:940px; margin:0 auto 18px;
  padding:16px 22px; border-radius:var(--r-xl);
  background:linear-gradient(135deg,#F4FFF8 0%,#E9FBF2 55%,#FFF8EE 100%);
  border:1px solid rgba(30,158,106,.22);
  box-shadow:var(--sh-sm);
}
.ui-wxbar-btn{
  display:inline-flex; align-items:center; gap:7px;
  padding:9px 18px; border-radius:var(--r-full); text-decoration:none;
  background:linear-gradient(145deg,#22C07E,#159C63); color:#fff !important;
  font-size:14px; font-weight:700; letter-spacing:.4px;
  box-shadow:0 5px 14px rgba(30,158,106,.32); border:1px solid transparent;
  transition:all .26s var(--ease-out); cursor:pointer;
}
.ui-wxbar-btn:hover{ transform:translateY(-2px); box-shadow:0 9px 20px rgba(30,158,106,.42); }
.ui-wxbar-btn:active{ transform:translateY(0) scale(.97); }
.ui-wxbar-num{
  font-size:20px; font-weight:800; color:#0E7A4C; letter-spacing:1.2px;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  background:linear-gradient(180deg,transparent 64%,rgba(30,158,106,.16) 64%);
  padding:0 3px;
}
.ui-wxbar-tip{ font-size:12.5px; color:#5F6770; letter-spacing:.3px; }
.ui-wxbar-tel{
  font-size:15px; font-weight:800; color:var(--brand-700) !important;
  text-decoration:none; padding:8px 16px; border-radius:var(--r-full);
  background:#fff; border:1px solid rgba(232,114,26,.32);
  box-shadow:var(--sh-xs); transition:all .24s var(--ease-out);
}
.ui-wxbar-tel:hover{ background:linear-gradient(145deg,#FF8A2B,var(--brand-700)); color:#fff !important; border-color:transparent; transform:translateY(-2px); box-shadow:var(--sh-brand); }
@media(max-width:600px){
  .ui-wxbar{ padding:14px 15px; gap:9px 11px; border-radius:var(--r-lg); }
  .ui-wxbar-num{ font-size:18px; }
  .ui-wxbar-tip{ font-size:11.5px; width:100%; text-align:center; }
}

/* 备案条内微信加粗 */
.ui-beian b{ color:#A8B0BF; font-weight:700; }