/* ============================================================
   密码保险箱 · 落地网站样式（设计语言取自 EDIY 落地站点，仅改品牌）
   深蓝科技风（复用客户端设计系统变量），深浅双主题，六页选项卡
   版本：v2 ｜ 2026-10-06
   ============================================================ */
:root {
  --bg: #0c0f16;
  --bg2: #10141d;
  --bg3: #141926;
  --card: #12161f;
  --card-solid: #161b26;
  --line: rgba(255, 255, 255, 0.08);
  --line-strong: rgba(255, 255, 255, 0.16);
  --text: #e6eaf2;
  --text-dim: #9aa4b5;
  --text-faint: #8892A8;   /* R160：同客户端，暗色下 #66708a 只有 3.7:1 */
  --primary: #2f7bff;
  /* R160：白字实心底专用值（= 主站 --c1 亮色值 #2563EB，白字 4.99:1） */
  --primary-solid: #2563EB;
  /* R160：彩色「文字」专用深档（主站 --c1-ink 语义）。本体 --primary 压在浅底只有 3.3–3.6:1，
     只许做描边/底/图标；凡是给人读的彩色字一律走 ink。暗色下与本体同值。 */
  --primary-ink: #8FC0FF;
  --primary2: #4f6ef7;
  --accent: #22d3ee;
  --ok: #34d399;
  --warn: #fbbf24;
  --danger: #f87171;
  --radius: 14px;
  --radius-sm: 10px;
  --shadow: 0 8px 24px rgba(0, 0, 0, 0.32);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.18);
  --hover-bg: rgba(47, 123, 255, 0.10);
  --input-bg: #0f141d;
  /* R172：版心令牌——落地页与客户端首页同一个数（客户端 public/css/app.css `--wrap:1440px`）。
     此前落地页写死 1100，比客户端首页窄 340px，同一个产品点「首页」和点「产品页」像换了尺度。 */
  --wrap: 1440px;
  --wrap-pad: 24px;
  --hero-grad: radial-gradient(900px 420px at 18% -10%, rgba(47, 123, 255, .28), transparent 60%),
               radial-gradient(760px 400px at 88% 0%, rgba(34, 211, 238, .16), transparent 55%),
               linear-gradient(180deg, #0d1424 0%, #0c0f16 68%);
  --logo-bg: #2f7bff;
}

/* ---------------- 浅色主题 ---------------- */
[data-theme="light"] {
  /* R160（A6 亮色令牌对齐）：此前亮色底色三端三套——客户端 #eef2f9、落地页/面板 #f4f7fc，--text-dim 也有 #56688c / #5a6b85 两档，同一个产品切到明亮模式像换了套皮肤。现统一取 EDIY 主站设计系统 v3.1.2 §2 的值：bg/surface/text/sub 全部照抄，--text-faint 取 #57697D（比 --text-dim 淡一档，且在 bg/bg2/bg3/白卡四种底上对比度都 ≥4.63:1）。暗色不动。 */
  --bg:#F1F4F9;
  --bg2:#E4E9F1;
  --bg3:#E8EDF5;
  --card:#ffffff;
  --card-solid: #ffffff;
  --line:#C9D3E2;
  --line-strong:#BFC9D9;
  --text:#33445C;
  --text-dim:#54657C;
  /* R158 把 #93a1b8 加深到 #6b7789（4.12:1，仍不到 4.5）；R160 统一取 #57697D，
     在 bg / bg2 / bg3 / 白卡四种底上均 ≥4.63:1，且比 --text-dim(#54657C) 淡一档。 */
  --text-faint:#57697D;
  /* R160：亮色下彩色文字用主站 --c1-ink 深档（#2f7bff 压在浅底仅 3.3:1，
     导航当前页「产品概览」实测 2.93:1，几乎读不出）。 */
  --primary-solid: #2563EB;
  --primary-ink: #1D4ED8;
  --shadow: 0 8px 24px rgba(20, 40, 80, 0.10);
  --shadow-sm: 0 1px 3px rgba(20, 40, 80, 0.08);
  --hover-bg: rgba(47, 123, 255, 0.08);
  --input-bg:#ffffff;
  /* R160：亮色 hero 光晕从 .30 降到 .16。原来光晕叠出 #B7D0FB，
     正文 --text(#54657C) 压上去只有 3.79:1，整块首屏都在「偏淡」名单里。 */
  --hero-grad: radial-gradient(980px 460px at 16% -12%, rgba(47, 123, 255, .12), transparent 62%),
               radial-gradient(820px 420px at 90% -4%, rgba(34, 211, 238, .12), transparent 58%),
               linear-gradient(180deg, #e6eefb 0%, #ecf1fa 46%, #F1F4F9 76%);
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", "Noto Sans SC", sans-serif;
  background: var(--bg);
  color: var(--text);
  font-size: 14px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  transition: background .25s ease, color .25s ease;
  /* R153（A5）：页脚贴底——短页面（如 FAQ/关于）此前页脚悬在内容下、底部露出大片背景。
     改为整页纵向 flex，页脚 margin-top:auto 吃掉剩余高度，长页面行为不变。 */
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
body > .footer { margin-top: auto; }
a { color: var(--primary-ink); text-decoration: none; }
a:hover { text-decoration: none; }
img { max-width: 100%; vertical-align: middle; }
::selection { background: rgba(47, 123, 255, 0.35); }
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-thumb { background: rgba(120, 135, 160, 0.35); border-radius: 6px; }
::-webkit-scrollbar-thumb:hover { background: rgba(120, 135, 160, 0.55); }
::-webkit-scrollbar-track { background: transparent; }

/* R172：版心与客户端首页对齐（1440 / 左右 24），全站唯一真源走 --wrap 令牌 */
.container { width: 100%; max-width: var(--wrap); margin: 0 auto; padding: 0 var(--wrap-pad); }

/* ---------------- 通用控件 ---------------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  padding: 9px 18px; border-radius: var(--radius-sm); border: 1px solid var(--line-strong);
  background: var(--card-solid); color: var(--text); font-size: 13.5px; font-weight: 600;
  cursor: pointer; line-height: 1.4; transition: all .18s ease; white-space: nowrap;
}
.btn:hover { border-color: var(--primary); color: var(--primary-ink); }
.btn.primary { background: var(--primary-solid); border-color: var(--primary-solid); color: #fff; }
.btn.primary:hover { background: #2668e0; border-color: #2668e0; color: #fff; }
.btn.ghost { background: transparent; border-color: var(--line-strong); color: var(--text); }
.btn.ghost:hover { background: var(--hover-bg); border-color: var(--primary); color: var(--primary-ink); }
.btn.lg { padding: 12px 26px; font-size: 15px; border-radius: var(--radius-sm); }
/* 文字链档：hero 里一屏只留一个主行动，最弱入口降为文字链，不再与主按钮争重量 */
.btn.text { background: transparent; border-color: transparent; color: var(--text-dim); padding: 12px 8px; }
.btn.text:hover { background: transparent; border-color: transparent; color: var(--primary-ink); }
.btn.sm { padding: 6px 13px; font-size: 12.5px; }

/* QQ 群按钮（与客户端一致：QQ 图标 + 蓝底白字） */
.qq-group-btn {
  display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px;
  border-radius: 8px; background: linear-gradient(135deg, #3ec6ff, #12b7f5);
  color: #fff; font-size: 13px; font-weight: 600; text-decoration: none; vertical-align: middle;
  box-shadow: 0 2px 6px rgba(18, 183, 245, .25); transition: opacity .15s, transform .15s; line-height: 1.2; cursor: pointer;
}
.qq-group-btn:hover { opacity: .9; color: #fff; transform: translateY(-1px); }
.qq-group-btn svg { flex: none; }

/* 主题切换按钮 */
.theme-btn {
  flex: none; width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 9px; border: 1px solid var(--line); background: var(--card); color: var(--text-dim);
  cursor: pointer; transition: all .16s ease;
}
.theme-btn:hover { border-color: var(--primary); color: var(--primary-ink); }

/* ---------------- 顶栏（六页选项卡） ---------------- */
.topbar {
  position: sticky; top: 0; z-index: 100;
  min-height: 60px; display: flex; align-items: center;
  background: var(--bg); border-bottom: 1px solid var(--line);
  backdrop-filter: blur(10px);
}
.topbar-in { display: flex; align-items: center; gap: 12px; }
.brand { display: flex; align-items: center; gap: 11px; flex: none; }
.brand .logo { width: 34px; height: 34px; border-radius: 9px; flex: none; }
.brand-t { display: flex; flex-direction: column; line-height: 1.15; }
.brand-t .bn { font-size: 16px; font-weight: 700; letter-spacing: .5px; }
.brand-t .sub { font-size: 11px; color: var(--text-faint); letter-spacing: 2.5px; font-weight: 600; }

/* 选项卡导航 */
.page-tabs { display: flex; align-items: center; gap: 2px; margin-left: auto; }
.page-tabs a {
  position: relative; padding: 9px 14px; border-radius: 8px; color: var(--text-dim);
  font-size: 13.5px; font-weight: 600; transition: all .16s ease; white-space: nowrap;
}
.page-tabs a:hover { color: var(--text); background: var(--hover-bg); }
.page-tabs a.active { color: var(--primary-ink); background: var(--hover-bg); }
.page-tabs a.active::after {
  content: ""; position: absolute; left: 14px; right: 14px; bottom: 4px; height: 2px;
  border-radius: 2px; background: var(--primary);
}
.topbar .theme-btn { flex: none; }
.topbar .btn.primary.sm { flex: none; }
/* v0.99.53：返回官网入口（全部页面顶栏，胶囊按钮，hover 变主色，显眼可找） */
.topbar .home-link {
  flex: none; display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 14px; border-radius: 999px; border: 1px solid var(--line-strong);
  color: var(--text-dim); font-size: 12.5px; font-weight: 600; text-decoration: none;
  transition: all .18s; white-space: nowrap; background: transparent;
}
.topbar .home-link svg { width: 13px; height: 13px; flex: none; }
.topbar .home-link:hover { color: #fff; border-color: var(--primary); background: var(--primary); box-shadow: 0 4px 14px rgba(47, 123, 255, .35); }
[data-theme="light"] .topbar .home-link:hover { color: #fff; }
@media (max-width: 900px) {
  .topbar .home-link { padding: 6px 10px; }
  .topbar .home-link span.t { display: none; }
}

.menu-btn {
  display: none; flex: none; width: 36px; height: 36px; align-items: center; justify-content: center;
  border-radius: 9px; border: 1px solid var(--line); background: var(--card); color: var(--text);
  cursor: pointer;
}
.menu-btn:hover { border-color: var(--primary); color: var(--primary-ink); }

/* ---------------- 抽屉（≤900px） ---------------- */
.nav-mask { position: fixed; inset: 0; z-index: 199; background: rgba(0, 0, 0, .55); }
[data-theme="light"] .nav-mask { background: rgba(20, 35, 60, .35); }
.nav-drawer {
  position: fixed; top: 0; left: 0; bottom: 0; z-index: 200; width: 280px;
  background: var(--bg2); border-right: 1px solid var(--line-strong);
  transform: translateX(-100%); transition: transform .22s ease;
  display: flex; flex-direction: column;
}
.nav-drawer.open { transform: translateX(0); }
.nd-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 18px; border-bottom: 1px solid var(--line);
}
.nd-title { font-size: 14.5px; font-weight: 700; }
.nd-close {
  width: 30px; height: 30px; border: none; background: transparent; color: var(--text-dim);
  font-size: 16px; cursor: pointer; border-radius: 8px;
}
.nd-close:hover { color: var(--text); background: var(--hover-bg); }
.nd-body { flex: 1; overflow-y: auto; padding: 12px 10px; }
.nd-body a {
  display: flex; align-items: center; padding: 11px 14px; border-radius: 9px;
  color: var(--text-dim); font-size: 14px; font-weight: 500;
}
.nd-body a:hover { color: var(--text); background: var(--hover-bg); }
.nd-body a.active { color: var(--primary-ink); background: var(--hover-bg); }
.nd-body .nd-dl { margin: 10px 14px 4px; }
.nd-foot { padding: 12px 18px 18px; border-top: 1px solid var(--line); color: var(--text-dim); font-size: 12px; }

/* ---------------- Hero ---------------- */
.hero {
  position: relative; overflow: hidden;
  background: var(--hero-grad);
  border-bottom: 1px solid var(--line);
}
/* R181 · 方格底纹全站取消。
   产品方 2026-11-01 拍板：「要去，全部。全站指是全站，包含客户端、运维面板、落地页等，全部包含。」
   原实现 = 两束 115deg 斜光条 + 两组 44px 网格线（横一组、竖一组），明暗各一份。
   现在只删**网格线**与对应的 background-size，两束斜光条保留——那是光，不是格，
   是 hero 的层次感来源；铁律 A 允许「光晕 / 单向光带」，只禁「重复方格、点阵、斜纹、扫描线」。 */
.hero::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background:
    linear-gradient(115deg, transparent 40%, rgba(255, 255, 255, .045) 46%, transparent 52%),
    linear-gradient(115deg, transparent 62%, rgba(47, 123, 255, .10) 68%, transparent 74%);
  background-size: 200% 200%, 200% 200%;
  mask-image: radial-gradient(ellipse 88% 74% at 50% 0%, #000 42%, transparent 86%);
  -webkit-mask-image: radial-gradient(ellipse 88% 74% at 50% 0%, #000 42%, transparent 86%);
}
[data-theme="light"] .hero::after {
  background:
    linear-gradient(115deg, transparent 40%, rgba(47, 123, 255, .05) 46%, transparent 52%),
    linear-gradient(115deg, transparent 62%, rgba(47, 123, 255, .08) 68%, transparent 74%);
  background-size: 200% 200%, 200% 200%;
  mask-image: radial-gradient(ellipse 88% 74% at 50% 0%, #000 42%, transparent 86%);
  -webkit-mask-image: radial-gradient(ellipse 88% 74% at 50% 0%, #000 42%, transparent 86%);
}
.hero-in { position: relative; z-index: 1; padding: 78px var(--wrap-pad) 64px; text-align: center; }
.hero-logo { width: 76px; height: 76px; border-radius: 20px; box-shadow: 0 12px 40px rgba(47, 123, 255, .35); margin-bottom: 18px; }
.hero h1 { font-size: 48px; font-weight: 800; letter-spacing: .5px; line-height: 1.16; }
.hero .slogan { margin-top: 12px; font-size: 16px; color: var(--text-dim); max-width: 640px; margin-left: auto; margin-right: auto; }
.hero .ver-badge {
  display: inline-flex; align-items: center; gap: 6px; margin-top: 16px;
  padding: 5px 13px; border-radius: 999px; border: 1px solid rgba(47, 123, 255, .35);
  background: rgba(47, 123, 255, .10); color: #9cc0ff; font-size: 13px; font-weight: 600;
}
/* R158：明亮模式下 #2f7bff 压在 rgba(47,123,255,.10) 的浅蓝底上，实测只有 2.32:1
   （比暗色还糟：暗色底深、蓝字够亮；浅色底也被染蓝，蓝字和它撞在一起）。改为深蓝 #1a4fbf。 */
[data-theme="light"] .hero .ver-badge { color: #1a4fbf; border-color: rgba(26, 79, 191, .30); }
.hero .ver-badge .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--ok); box-shadow: 0 0 8px var(--ok); }
.hero-actions { margin-top: 26px; display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }

/* ---------------- 截图展示 ---------------- */
.shot-hero { position: relative; z-index: 1; padding-bottom: 58px; }
/* R172：截图框跟随版心（原来写死 1100，比新的 1440 版心窄一圈，首屏出现「双层宽度」） */
.shot-frame {
  position: relative; max-width: 100%; margin: 0 auto;
  border: 1px solid var(--line-strong); border-radius: 16px; overflow: hidden;
  box-shadow: var(--shadow); background: var(--card);
}
.shot-frame .sf-top {
  display: flex; align-items: center; gap: 6px; padding: 9px 14px;
  border-bottom: 1px solid var(--line); background: var(--bg2);
}
.shot-frame .sf-top i { width: 9px; height: 9px; border-radius: 50%; background: var(--text-faint); opacity: .8; }
.shot-frame .sf-top i:nth-child(1) { background: #f87171; }
.shot-frame .sf-top i:nth-child(2) { background: #fbbf24; }
.shot-frame .sf-top i:nth-child(3) { background: #34d399; }
.shot-frame .sf-top span { margin-left: 8px; font-size: 12px; color: var(--text-dim); }
/* R173 修：原来 max-height:780 + object-fit:contain，在宽容器里图被整体缩小居中，
   左右露出 --bg2 底色，看上去「截图没撑满容器」。截图统一 2160×1350（16:10），
   直接用 width:100% + height:auto 按原始比例铺满，不加任何裁切。 */
.shot-frame img { width: 100%; height: auto; aspect-ratio: 16 / 10; display: block; background: var(--bg2); }
.shot-caption { text-align: center; margin-top: 12px; font-size: 12.5px; color: var(--text-dim); }

.shot-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.shot-card {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  overflow: hidden; transition: all .2s ease;
}
.shot-card:hover { border-color: rgba(47, 123, 255, .45); transform: translateY(-3px); box-shadow: var(--shadow-sm); }
.shot-card img { width: 100%; display: block; }
.shot-card .sc-cap { padding: 11px 14px; font-size: 13px; font-weight: 600; color: var(--text-dim); border-top: 1px solid var(--line); }

/* ---------------- 板块 ---------------- */
.section { padding: 60px 0; border-bottom: 1px solid var(--line); }
.section-head { text-align: center; margin-bottom: 38px; }
/* R161：删掉每节标题上方那行英文大写眉标（WHY TIANSHU / FEATURES…）。
   「大标题上压一行 tracking 小标签」是最典型的生成式模板痕迹，信息量为零。 */
.section-head h2 { margin-top: 0; font-size: 25px; font-weight: 800; letter-spacing: .5px; }
.section-head p { margin-top: 10px; color: var(--text-dim); max-width: 620px; margin-left: auto; margin-right: auto; }

/* 图文结合行 */
.media-row { display: grid; grid-template-columns: 1.25fr 1fr; gap: 30px; align-items: center; margin-bottom: 30px; }
.media-row.reverse .media-txt { order: 2; }
.media-row .media-txt h2, .media-row .media-txt h3 { font-size: 18px; font-weight: 700; display: flex; align-items: center; gap: 8px; }
.media-row .media-txt h2 .m-no, .media-row .media-txt h3 .m-no {
  width: 28px; height: 28px; flex: none; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 8px; background: rgba(47, 123, 255, .14); color: #9cc0ff; font-size: 13px; font-weight: 800;
}
[data-theme="light"] .media-row .media-txt h2 .m-no, [data-theme="light"] .media-row .media-txt h3 .m-no { color: #2f7bff; }
.media-row .media-txt p { margin-top: 10px; color: var(--text-dim); font-size: 14px; line-height: 1.75; }
.media-row .media-txt ul { margin-top: 10px; padding-left: 0; list-style: none; }
.media-row .media-txt ul li { position: relative; padding-left: 18px; margin-top: 6px; color: var(--text-dim); font-size: 13.5px; }
.media-row .media-txt ul li::before {
  content: ""; position: absolute; left: 2px; top: 8px; width: 6px; height: 6px;
  border-radius: 50%; background: var(--primary);
}

/* 痛点与价值（产品页 v5） */
.pain-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.pain-card {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 20px 18px; transition: border-color .2s, transform .15s, box-shadow .2s;
}
.pain-card:hover { border-color: rgba(47, 123, 255, .45); transform: translateY(-3px); box-shadow: var(--shadow-sm); }
.pain-card .pc-icon { font-size: 20px; }
.pain-card .pc-k { margin-top: 12px; font-size: 15px; font-weight: 700; }
.pain-card .pc-d { margin-top: 7px; font-size: 12.8px; color: var(--text-dim); line-height: 1.65; }
.value-banner {
  margin-top: 22px; padding: 20px 24px; border-radius: var(--radius);
  background: linear-gradient(120deg, rgba(47, 123, 255, .14), rgba(47, 123, 255, .05));
  border: 1px solid rgba(47, 123, 255, .35); display: flex; gap: 14px; align-items: center; flex-wrap: wrap;
}
.value-banner .vb-t { font-size: 15px; font-weight: 800; color: var(--primary-ink); white-space: nowrap; }
.value-banner .vb-l { flex: 1; min-width: 260px; font-size: 13.5px; color: var(--text-dim); line-height: 1.7; }

/* 功能亮点 */
.feature-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; }
/* v0.99.28：关于我们页 EDIY 介绍 4 卡居中（原 5 列网格仅 4 卡导致靠左空 1 列，L5 修复） */
.feature-grid.about-feat { grid-template-columns: repeat(4, 1fr); }   /* R172：跟随 1440 版心，不再自缩到 920 */
.feature-card {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 20px 18px; transition: all .2s ease;
}
.feature-card:hover { border-color: rgba(47, 123, 255, .45); transform: translateY(-3px); box-shadow: var(--shadow-sm); }
.feature-card .fc-icon {
  width: 38px; height: 38px; display: flex; align-items: center; justify-content: center;
  border-radius: 10px; background: rgba(47, 123, 255, .12); color: var(--primary-ink); margin-bottom: 13px;
}
.feature-card .fc-title { font-size: 14.5px; font-weight: 700; }
.feature-card .fc-desc { margin-top: 5px; font-size: 12.5px; color: var(--text-dim); line-height: 1.55; }

/* 架构说明 */
.arch-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.arch-card {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 26px 26px; position: relative; overflow: hidden;
}
.arch-card::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
  background: linear-gradient(180deg, var(--primary), var(--accent));
}
.arch-card h3 { font-size: 17px; font-weight: 700; display: flex; align-items: center; gap: 8px; }
.arch-card .tag {
  font-size: 11px; font-weight: 700; padding: 2px 9px; border-radius: 999px;
  background: rgba(47, 123, 255, .14); color: #9cc0ff;
}
[data-theme="light"] .arch-card .tag { color: var(--primary-ink); }
.arch-card .tag.local { background: rgba(52, 211, 153, .14); color: #6ee7b7; }
[data-theme="light"] .arch-card .tag.local { color: #059669; }
.arch-card ul { margin-top: 13px; padding-left: 0; list-style: none; }
.arch-card ul li { position: relative; padding-left: 20px; margin-top: 8px; color: var(--text-dim); font-size: 13.5px; }
.arch-card ul li::before {
  content: ""; position: absolute; left: 2px; top: 8px; width: 6px; height: 6px;
  border-radius: 50%; background: var(--primary);
}
.arch-card.local ul li::before { background: var(--ok); }

/* 授权定价 */
.price-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.price-card {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 26px 24px; text-align: center; transition: all .2s ease; position: relative;
}
.price-card:hover { border-color: rgba(47, 123, 255, .45); transform: translateY(-3px); box-shadow: var(--shadow-sm); }
.price-card.hot { border-color: rgba(47, 123, 255, .55); background: linear-gradient(180deg, rgba(47, 123, 255, .08), var(--card)); }
.price-card .pc-name { font-size: 14px; font-weight: 700; color: var(--text-dim); }
.price-card .pc-price { margin-top: 10px; font-size: 30px; font-weight: 800; }
.price-card .pc-price small { font-size: 13px; font-weight: 500; color: var(--text-dim); }
.price-card .pc-note { margin-top: 6px; font-size: 12.5px; color: var(--text-dim); }
.price-card .pc-promo { display:inline-block;margin-top:8px;padding:2px 10px;border-radius:999px;background:rgba(251,191,36,.16);color:#fcd34d;font-size:11.5px;font-weight:700; }
[data-theme="light"] .price-card .pc-promo { color:#b45309; }
.price-card .pc-origin { margin-top:8px;font-size:12.5px;color:var(--text-dim);text-decoration:line-through; }
.price-card .pc-desc { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); font-size: 12.5px; color: var(--text-dim); }
.price-quota {
  margin-top: 18px; display: flex; justify-content: center; gap: 22px; flex-wrap: wrap;
  font-size: 13px; color: var(--text-dim);
}
.price-quota b { color: var(--text); }

/* 多端 */
.platform-row { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.platform-chip {
  display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px;
  border-radius: 999px; border: 1px solid var(--line-strong); background: var(--card);
  font-size: 13.5px; font-weight: 600; color: var(--text-dim);
}
.platform-chip svg { color: var(--primary-ink); }

/* 说明书 */
.manual-cols { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.manual-card {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 24px 24px;
}
.manual-card h2, .manual-card h3 { font-size: 16px; font-weight: 700; display: flex; align-items: center; gap: 8px; }
.manual-card h2 .no, .manual-card h3 .no {
  width: 26px; height: 26px; flex: none; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 8px; background: rgba(47, 123, 255, .14); color: #9cc0ff; font-size: 13px; font-weight: 700;
}
[data-theme="light"] .manual-card h2 .no, [data-theme="light"] .manual-card h3 .no { color: #2f7bff; }
.manual-card ol { margin-top: 12px; padding-left: 18px; color: var(--text-dim); font-size: 13.5px; }
.manual-card ol li { margin-top: 6px; }
.manual-note {
  margin-top: 16px; padding: 12px 16px; border-radius: var(--radius-sm);
  background: rgba(34, 211, 238, .07); border: 1px solid rgba(34, 211, 238, .22);
  color: var(--text-dim); font-size: 12.5px;
}

/* FAQ */
.faq-group { margin-bottom: 26px; }
.faq-group-title {
  display: flex; align-items: center; gap: 8px; font-size: 15.5px; font-weight: 700; margin-bottom: 12px;
}
.faq-group-title .g-tag {
  font-size: 11.5px; font-weight: 700; padding: 2px 10px; border-radius: 999px;
}
.g-tag.deploy { background: rgba(47, 123, 255, .14); color: #9cc0ff; }
[data-theme="light"] .g-tag.deploy { color: var(--primary-ink); }
.g-tag.use { background: rgba(34, 211, 238, .12); color: #67e8f9; }
[data-theme="light"] .g-tag.use { color: #0891b2; }
.g-tag.upgrade { background: rgba(251, 191, 36, .12); color: #fcd34d; }
[data-theme="light"] .g-tag.upgrade { color: #b45309; }
.g-tag.license { background: rgba(52, 211, 153, .12); color: #6ee7b7; }
[data-theme="light"] .g-tag.license { color: #059669; }
.faq-item {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  margin-bottom: 10px; overflow: hidden; transition: border-color .18s ease;
}
.faq-item:hover { border-color: rgba(47, 123, 255, .35); }
.faq-q {
  display: flex; align-items: center; gap: 10px; padding: 14px 18px; cursor: pointer; user-select: none;
  font-size: 14px; font-weight: 600;
}
.faq-q .q-icon {
  width: 20px; height: 20px; flex: none; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 6px; background: rgba(47, 123, 255, .14); color: #9cc0ff; font-size: 11.5px; font-weight: 800;
}
[data-theme="light"] .faq-q .q-icon { color: #2f7bff; }
.faq-q .chev { margin-left: auto; flex: none; color: var(--text-faint); transition: transform .2s ease; }
.faq-item.open .faq-q .chev { transform: rotate(180deg); }
.faq-a { max-height: 0; overflow: hidden; transition: max-height .25s ease; }
.faq-a-in { padding: 0 18px 14px 48px; color: var(--text-dim); font-size: 13.5px; line-height: 1.7; }

/* 资源下载 */
.dl-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.dl-card {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 22px 24px; transition: all .2s ease; display: flex; flex-direction: column;
}
.dl-card:hover { border-color: rgba(47, 123, 255, .45); box-shadow: var(--shadow-sm); }
.dl-card .dl-top { display: flex; align-items: center; gap: 10px; }
.dl-card .dl-kind {
  font-size: 11px; font-weight: 700; padding: 3px 10px; border-radius: 999px;
  background: rgba(47, 123, 255, .14); color: #9cc0ff; flex: none;
}
[data-theme="light"] .dl-card .dl-kind { color: var(--primary-ink); }
.dl-card .dl-kind.hot { background: rgba(251, 191, 36, .14); color: #fcd34d; }
[data-theme="light"] .dl-card .dl-kind.hot { color: #b45309; }
.dl-card h3 { font-size: 15.5px; font-weight: 700; flex: 1; word-break: break-all; }
.dl-meta { margin-top: 12px; display: grid; grid-template-columns: auto 1fr; gap: 5px 14px; font-size: 12.5px; color: var(--text-dim); }
.dl-meta .k { color: var(--text-faint); }
.dl-notes { margin-top: 10px; font-size: 12.5px; color: var(--text-dim); line-height: 1.6; }
.dl-act { margin-top: 16px; display: flex; gap: 10px; flex-wrap: wrap; }
.dl-empty {
  grid-column: 1 / -1; text-align: center; padding: 44px 20px; color: var(--text-faint);
  border: 1px dashed var(--line-strong); border-radius: var(--radius); font-size: 14px;
}
.dl-empty .em-title { font-size: 16px; font-weight: 700; color: var(--text-dim); margin-bottom: 6px; }

/* 资源下载库：分类明确库 + 最近发布（v5） */
.dl-cat { margin-bottom: 26px; }
.dl-cat-head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.dl-cat-icon {
  width: 38px; height: 38px; border-radius: 10px; flex: 0 0 38px;
  display: flex; align-items: center; justify-content: center;
  font-size: 18px; background: rgba(47, 123, 255, .12); border: 1px solid rgba(47, 123, 255, .25);
}
.dl-cat-icon.hot { background: rgba(251, 191, 36, .14); border-color: rgba(251, 191, 36, .35); }
.dl-cat-title { font-size: 15.5px; font-weight: 800; }
.dl-cat-desc { margin-top: 3px; font-size: 12.5px; color: var(--text-dim); }
/* v0.99.34：历史版本库统一为列表视图，容器改为块级 100% 撑满（旧卡片网格样式废弃） */
.dl-list { display: block; width: 100%; }
.dl-list .dl-card { margin-bottom: 0; }
/* v0.99.27：历史版本库列表视图（序号/文件名/大小/版本号/更新时间/下载次数/下载） */
/* R156：下载库表格重做 —— 产品方反馈「文件名被折断 / 标签与文件名没对齐 / 没有版本标记」。
   ① 外层加横向滚动容器：7 列在窄屏（手机 566px）挤不下时整表可滑动，而不是把文件名拆成两截；
   ② 列宽改按内容分配（文件名吃剩余），不再百分比等分；
   ③ 版本标记：当前版本 / 历史版本 徽标，历史行整体降透明度，避免用户下错旧包。 */
.dl-tbl-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--line); border-radius: 12px; background: var(--card); }
.dl-tbl { width: 100%; min-width: 820px; border-collapse: collapse; font-size: 13px; background: var(--card); }
/* R157：表头原写 var(--sub)，而 --sub 变量全文件不存在（只有 --text-dim）⇒ 表头文字继承正文色，
   与表体同为 --text，层级糊在一起。改用 --text-dim，并补字距让表头明显区别于数据行。 */
.dl-tbl thead th { background: rgba(47, 123, 255, .08); color: var(--text-dim); font-weight: 600; padding: 10px 12px; text-align: left; white-space: nowrap; letter-spacing: .02em; }
.dl-tbl tbody td { padding: 10px 12px; border-top: 1px solid var(--line); color: var(--text); vertical-align: middle; }
.dl-tbl tbody tr:hover { background: rgba(47, 123, 255, .06); }
.dl-tbl .c-idx { width: 54px; text-align: center; }
.dl-tbl .c-name { width: auto; }
.dl-tbl .c-size { width: 92px; white-space: nowrap; }
.dl-tbl .c-ver { width: 104px; white-space: nowrap; }
.dl-tbl .c-time { width: 130px; white-space: nowrap; }
.dl-tbl .c-cnt { width: 80px; white-space: nowrap; }
.dl-tbl .c-act { width: 88px; white-space: nowrap; }
.dl-tbl .cell-name .name-row { display: flex; align-items: center; gap: 6px; flex-wrap: nowrap; }
/* 文件名：整段不折断，超长用省略号（title 悬浮可看全量）——旧规则 word-break:break-all 会把
   tianshu-nav-docker-1.1.000-arm.zip 拆成「...-ar / m.zip」两行，正是产品方看到的错位来源。 */
.dl-tbl .dl-name { margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.45; font-family: 'SF Mono', Consolas, 'Courier New', monospace; font-size: 12.5px; }
/* R157（产品方拍板「可以，并标红」）：历史版本一律红色警示，不再用中性灰。
   原因：旧 FPK 的应用图标还是上一版（半新半旧包曾导致「桌面图标回到老的」投诉），
   灰标在暗底上几乎看不出来，产品方要求改成一眼能看见的红色，并加一行说明文字。 */
.dl-tbl tr.is-hist td { opacity: .88; }
.dl-hist, .dl-cur { display: inline-block; padding: 0 7px; border-radius: 999px; font-size: 11px; line-height: 18px; white-space: nowrap; font-weight: 600; }
.dl-hist { background: rgba(239, 68, 68, .16); color: #f87171; border: 1px solid rgba(239, 68, 68, .38); }
.dl-cur { background: rgba(16, 185, 129, .16); color: #34d399; border: 1px solid transparent; }
[data-theme="light"] .dl-hist { background: rgba(220, 38, 38, .10); color: #c81e1e; border-color: rgba(220, 38, 38, .34); }
[data-theme="light"] .dl-cur { background: rgba(16, 185, 129, .14); color: #047857; }
/* 历史版本行的红色说明：明确告诉用户「为什么不要下这一个」，不依赖用户自己比对版本号 */
.dl-tbl .dl-warn { display: block; margin-top: 4px; font-size: 11.5px; line-height: 1.5; color: #f87171; }
[data-theme="light"] .dl-tbl .dl-warn { color: #c81e1e; }
.dl-tbl .dl-kind { display: inline-block; padding: 1px 8px; border-radius: 999px; font-size: 11.5px; white-space: nowrap; }
.dl-tbl .dl-kind.fpk { background: rgba(16, 185, 129, .14); color: #34d399; }
[data-theme="light"] .dl-tbl .dl-kind.fpk { color: #047857; }
.dl-tbl .dl-kind.docker { background: rgba(99, 102, 241, .14); color: #818cf8; }
[data-theme="light"] .dl-tbl .dl-kind.docker { color: #4f46e5; }
.dl-tbl .dl-kind.upgrade { background: rgba(47, 123, 255, .14); color: #60a5fa; }
[data-theme="light"] .dl-tbl .dl-kind.upgrade { color: var(--primary-ink); }
.dl-tbl .dl-kind.docs { background: rgba(139, 92, 246, .14); color: #a78bfa; }
[data-theme="light"] .dl-tbl .dl-kind.docs { color: #7c3aed; }

/* 最近 10 次资源 */
.dl-recent { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-bottom: 34px; }
.dl-recent-card {
  display: flex; align-items: center; gap: 10px; padding: 12px 14px;
  background: var(--bg2); border: 1px solid var(--line); border-radius: var(--radius);
  transition: border-color .2s, box-shadow .2s, transform .15s;
}
.dl-recent-card:hover { border-color: rgba(47, 123, 255, .5); box-shadow: var(--shadow-sm); transform: translateY(-1px); }
.dl-r-kind {
  flex: 0 0 auto; font-size: 11px; padding: 3px 8px; border-radius: 999px;
  background: rgba(47, 123, 255, .13); color: var(--primary-ink); font-weight: 700;
}
.dl-r-kind.fpk { background: rgba(16, 185, 129, .14); color: #34d399; }
[data-theme="light"] .dl-r-kind.fpk { color: #059669; }
.dl-r-kind.docker { background: rgba(99, 102, 241, .14); color: #818cf8; }
[data-theme="light"] .dl-r-kind.docker { color: #4f46e5; }
.dl-r-kind.upgrade { background: rgba(251, 191, 36, .14); color: #fcd34d; }
[data-theme="light"] .dl-r-kind.upgrade { color: #b45309; }
.dl-r-kind.docs { background: rgba(244, 114, 182, .14); color: #f472b6; }
[data-theme="light"] .dl-r-kind.docs { color: #db2777; }
.dl-r-name { flex: 1; min-width: 0; font-size: 13px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dl-r-meta { flex: 0 0 auto; font-size: 11.5px; color: var(--text-faint); }

/* v0.99.26：下载页重构 —— 顶部最新三热卡（升级包/软件包/fpk）+ 分类选项卡历史版本库 */
.hot-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 46px; }
.hot-card {
  position: relative; display: flex; flex-direction: column;
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 22px 22px 18px; overflow: hidden; transition: all .2s ease;
}
.hot-card::before { content: ''; position: absolute; inset: 0 0 auto 0; height: 3px; background: linear-gradient(90deg, #2f7bff, #38bdf8); opacity: .9; }
.hot-card:hover { border-color: rgba(47, 123, 255, .5); box-shadow: var(--shadow-sm); transform: translateY(-2px); }
.hot-kind { display: inline-block; font-size: 11px; font-weight: 800; padding: 3px 10px; border-radius: 999px; letter-spacing: .5px; }
.hot-kind.upgrade { background: rgba(251, 191, 36, .16); color: #fcd34d; }
[data-theme="light"] .hot-kind.upgrade { color: #b45309; }
.hot-kind.docker { background: rgba(99, 102, 241, .16); color: #818cf8; }
[data-theme="light"] .hot-kind.docker { color: #4f46e5; }
.hot-kind.fpk { background: rgba(16, 185, 129, .16); color: #34d399; }
[data-theme="light"] .hot-kind.fpk { color: #047857; }
/* R156：原本是 word-break: break-all —— 它允许在任意字符间断行，
   'tianshu-nav-docker-1.1.005-x86.zip' 就被切成 'tianshu-nav-docke' + 'r-1.1.005-x86.zip'，
   卡片高度参差、文件名断在半截单词上（产品方说的「没有对齐」）。改成只在整词放不下时才断。
   同时标题只放「人类可读名 + 版本」，完整文件名不进标题，长度本身已可控。 */
.hot-name { margin-top: 14px; font-size: 16px; font-weight: 800; line-height: 1.45; word-break: keep-all; overflow-wrap: break-word; }
.hot-meta { margin-top: 6px; font-size: 12.5px; color: var(--text-dim); line-height: 1.6; }
.hot-notes { margin-top: 8px; font-size: 12px; color: var(--text-faint); }
.hot-act { margin-top: auto; padding-top: 16px; }
.dl-lib { width: 100%; }
.dl-lib-head { text-align: center; }
.dl-lib-head h2 { margin-top: 6px; font-size: 24px; font-weight: 800; }
.dl-lib-head p { margin-top: 8px; color: var(--text-dim); font-size: 13.5px; }
.dl-tabs { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 20px; justify-content: center; }
.dl-tab {
  display: inline-flex; align-items: center; gap: 7px; padding: 9px 18px;
  border-radius: 999px; border: 1px solid var(--line-strong); background: var(--card);
  color: var(--text-dim); font-size: 13.5px; font-weight: 600; cursor: pointer; transition: all .18s ease;
}
.dl-tab:hover { border-color: rgba(47, 123, 255, .5); color: var(--text); }
.dl-tab.on { background: linear-gradient(135deg, #2563eb, #1d4ed8); border-color: transparent; color: #fff; box-shadow: 0 6px 18px rgba(47, 123, 255, .35); }
.dl-tab.on .dl-tab-n { background: rgba(255, 255, 255, .25); }
.dl-tab .dl-tab-n { min-width: 18px; height: 18px; line-height: 18px; text-align: center; font-size: 11px; border-radius: 9px; background: rgba(47, 123, 255, .14); color: inherit; }
.dl-pane { margin-top: 18px; min-height: 120px; }

/* dl-kind 分类配色 */
.dl-card .dl-kind.fpk { background: rgba(16, 185, 129, .14); color: #34d399; }
[data-theme="light"] .dl-card .dl-kind.fpk { color: #059669; }
.dl-card .dl-kind.docker { background: rgba(99, 102, 241, .14); color: #818cf8; }
[data-theme="light"] .dl-card .dl-kind.docker { color: #4f46e5; }
.dl-card .dl-kind.upgrade { background: rgba(251, 191, 36, .14); color: #fcd34d; }
[data-theme="light"] .dl-card .dl-kind.upgrade { color: #b45309; }
.dl-card .dl-kind.docs { background: rgba(244, 114, 182, .14); color: #f472b6; }
[data-theme="light"] .dl-card .dl-kind.docs { color: #db2777; }

/* 页脚（v0.99.28：参考 hui-clip.cn 富页脚多栏式重设计，六页全局统一） */
.footer { padding: 52px 0 30px; background: var(--bg2); border-top: 1px solid var(--line); position: relative; overflow: hidden; }
/* R181 · footer 的 44px 方格也已取消（产品方「要去，全部」）。
   原来是横竖两组 44px 网格线 + 上缘遮罩渐隐；现在换成**单向径向光晕**——
   保留页脚上缘的通透感，但不再有重复格纹。别把 background-size 加回来。 */
.footer::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(ellipse 72% 110% at 50% 0%, rgba(47, 123, 255, .055), transparent 72%);
}
[data-theme="light"] .footer::before {
  background: radial-gradient(ellipse 72% 110% at 50% 0%, rgba(47, 123, 255, .04), transparent 72%);
}
.footer-grid { display: grid; grid-template-columns: 2.2fr 1fr 1.1fr; gap: 40px; align-items: start; position: relative; }
.footer-brand { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.footer-brand .fb-brand-link { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.footer-brand .fb-logo-img { width: 42px; height: 42px; border-radius: 12px; filter: drop-shadow(0 6px 16px rgba(47, 123, 255, .4)); }
.footer-brand .fb-name { font-size: 18px; font-weight: 800; letter-spacing: 1px; color: var(--text); }
.footer-brand .fb-sub { font-size: 11px; color: var(--text-faint); letter-spacing: 2px; text-transform: uppercase; }
.footer-brand .fb-desc { margin-top: 12px; max-width: 420px; font-size: 13px; line-height: 1.85; color: var(--text-dim); }
.footer-brand .fb-actions { margin-top: 16px; display: flex; gap: 12px; flex-wrap: wrap; }
.footer-brand .qq-group-btn, .footer-brand .wechat-qr-btn {
  display: inline-flex; align-items: center; gap: 7px; padding: 9px 18px;
  border-radius: 999px; font-size: 13px; font-weight: 600; cursor: pointer;
  border: 1px solid rgba(47, 123, 255, .35); background: linear-gradient(135deg, #2f7bff, #2563eb);
  color: #fff; text-decoration: none; box-shadow: 0 8px 22px rgba(47, 123, 255, .35); transition: all .25s ease;
}
.footer-brand .wechat-qr-btn { background: linear-gradient(135deg, #15803d, #0f5c30); border-color: rgba(21, 128, 61, .45); box-shadow: 0 8px 22px rgba(21, 128, 61, .28); }
.footer-brand .qq-group-btn:hover, .footer-brand .wechat-qr-btn:hover { transform: translateY(-2px); opacity: .94; }
.footer-col { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; font-size: 13px; position: relative; }
.footer-col .fc-title { font-size: 13.5px; font-weight: 700; color: var(--text); margin-bottom: 4px; letter-spacing: 1px; }
.footer-col a, .footer-col .fc-line { color: var(--text-dim); font-size: 13px; text-decoration: none; }
.footer-col a:hover { color: var(--primary-ink); }
.footer-copy {
  position: relative; margin-top: 30px; padding-top: 20px;
  border-top: 1px solid var(--line); text-align: center;
  font-size: 12.5px; color: var(--text-faint);
}
.footer-copy a { color: var(--text-dim); }
.footer-copy a:hover { color: var(--primary-ink); }
/* 微信客服二维码弹窗 */
.wx-mask { position: fixed; inset: 0; z-index: 999; background: rgba(10, 18, 34, .55); display: flex; align-items: center; justify-content: center; backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
.wx-box { width: 300px; background: var(--card); border: 1px solid var(--line-strong); border-radius: 16px; padding: 24px 22px 20px; text-align: center; box-shadow: var(--shadow-lg); }
.wx-box h4 { font-size: 16px; font-weight: 700; margin-bottom: 6px; }
.wx-box .wx-sub { font-size: 12.5px; color: var(--text-dim); line-height: 1.5; margin-bottom: 14px; }
.wx-box img.wx-img { width: 180px; height: 180px; object-fit: contain; border-radius: 12px; border: 1px solid var(--line); background: #fff; }
.wx-box .wx-tip { margin-top: 12px; font-size: 12px; color: var(--text-faint); line-height: 1.5; }
.wx-box .btn { margin-top: 16px; width: 100%; height: 38px; }
@media (max-width: 900px) { .footer-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .footer-grid { grid-template-columns: 1fr; } .footer-brand .fb-desc { max-width: 100%; } }

/* ---------------- 关于我们页 ---------------- */
.about-hero { padding: 56px 0 40px; text-align: center; border-bottom: 1px solid var(--line);
  background: radial-gradient(760px 340px at 50% -20%, rgba(47, 123, 255, .20), transparent 60%);
}
[data-theme="light"] .about-hero { background: radial-gradient(760px 340px at 50% -20%, rgba(47, 123, 255, .12), transparent 60%); }
.about-hero .logo { width: 72px; height: 72px; border-radius: 18px; box-shadow: 0 10px 34px rgba(47, 123, 255, .35); }
.about-hero h1 { margin-top: 18px; font-size: 28px; font-weight: 800; }
.about-hero p { margin-top: 10px; color: var(--text-dim); }
/* v0.99.27：关于我们页（about.html）正文样式 */
.about-block { max-width: 900px; margin: 0 auto; font-size: 15px; line-height: 1.9; color: var(--text); }
.about-block p + p { margin-top: 14px; }
.contact-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }   /* R172：跟随 1440 版心 */
@media (max-width: 900px) { .contact-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .contact-grid { grid-template-columns: 1fr; } }
.about-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; padding: 44px 0; }
.about-card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 26px; }
.about-card h3 { font-size: 16.5px; font-weight: 700; display: flex; align-items: center; gap: 9px; }
.about-card h3 .a-icon {
  width: 32px; height: 32px; flex: none; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 9px; background: rgba(47, 123, 255, .12); color: var(--primary-ink);
}
.about-item { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); }
.about-item .ai-k { font-size: 12px; color: var(--text-faint); }
.about-item .ai-v { margin-top: 3px; font-size: 14.5px; font-weight: 600; color: var(--text); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.copy-btn {
  border: 1px solid var(--line-strong); background: transparent; color: var(--text-dim);
  font-size: 11.5px; padding: 2px 9px; border-radius: 6px; cursor: pointer; transition: all .15s ease;
}
.copy-btn:hover { border-color: var(--primary); color: var(--primary-ink); }
.about-copy { padding: 0 0 56px; text-align: center; color: var(--text-faint); font-size: 12.5px; }

/* ---------------- 商务合作页（v0.99.36 新增） ---------------- */
.biz-ad-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.biz-ad-card {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 18px 18px 16px; display: flex; flex-direction: column; gap: 7px;
  transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease;
}
.biz-ad-card:hover { border-color: rgba(47, 123, 255, .45); transform: translateY(-2px); box-shadow: var(--shadow-sm); }
.biz-ad-tag { font-size: 14px; font-weight: 700; color: var(--text); }
.biz-ad-spec {
  font-size: 12px; color: var(--primary-ink); font-weight: 700; letter-spacing: .3px;
  background: rgba(47, 123, 255, .10); border-radius: 6px; padding: 3px 8px; width: fit-content;
}
.biz-ad-form { font-size: 11.5px; color: var(--text-faint); }
.biz-ad-desc { font-size: 12.5px; color: var(--text-dim); line-height: 1.6; }
.biz-note { margin-top: 18px; text-align: center; font-size: 13px; color: var(--text-faint); }
.biz-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.biz-step {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 20px 18px; position: relative; text-align: left;
}
.biz-step-num {
  font-size: 22px; font-weight: 800; color: var(--primary-ink); opacity: .9; letter-spacing: 1px;
}
.biz-step-title { margin-top: 10px; font-size: 14.5px; font-weight: 700; }
.biz-step-desc { margin-top: 5px; font-size: 12.5px; color: var(--text-dim); line-height: 1.6; }
@media (max-width: 900px) { .biz-ad-grid { grid-template-columns: repeat(2, 1fr); } .biz-steps { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 620px) { .biz-ad-grid { grid-template-columns: 1fr; } .biz-steps { grid-template-columns: 1fr; } }

/* ---------------- 响应式 ---------------- */
@media (max-width: 900px) {
  .page-tabs { display: none; }
  .topbar .theme-btn { display: none; }
  .topbar .btn.primary.sm { display: none; }
  .menu-btn { display: inline-flex; }
  .hero h1 { font-size: 26px; }
  .hero-in { padding: 54px 22px 44px; }
  .shot-hero { padding-bottom: 44px; }
  .feature-grid { grid-template-columns: repeat(3, 1fr); }
  .pain-grid { grid-template-columns: repeat(2, 1fr); }
  .media-row { grid-template-columns: 1fr; gap: 16px; }
  .media-row.reverse .media-txt { order: 0; }
  .shot-grid { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .container { padding: 0 16px; }
  .section { padding: 44px 0; }
  .section-head h2 { font-size: 22px; }
  .feature-grid { grid-template-columns: repeat(2, 1fr); }
  .feature-grid.about-feat { grid-template-columns: 1fr; }
  .pain-grid { grid-template-columns: 1fr; }
  .arch-grid, .price-grid, .manual-cols, .dl-grid, .about-grid { grid-template-columns: 1fr; }
  .dl-list, .dl-recent { grid-template-columns: 1fr; }
  .hero h1 { font-size: 22px; }
  .hero .slogan { font-size: 14.5px; }
  .brand-t .sub { display: none; }
  .footer-in { flex-direction: column; text-align: center; }
  .footer-contact { text-align: center; }
}
/* v0.99.53：已彻底移除截图 Lightbox 与悬停放大镜（.lb-* / .mg-* / zoom-in 全部删除），
   截图改为整图展示（object-fit: contain），不再提供点击/悬停放大交互 */
/* v1.1.000 · 下载中心徽标精细化：统一品牌蓝族（去绿/靛），架构用独立小徽标区分 */
.dl-card .dl-kind, .dl-tbl .dl-kind { background: rgba(47,123,255,.14); color: #9cc0ff; font-weight: 700; }
[data-theme="light"] .dl-card .dl-kind, [data-theme="light"] .dl-tbl .dl-kind { color: var(--primary-ink); }
.dl-tbl .dl-kind.fpk, .dl-tbl .dl-kind.docker, .dl-tbl .dl-kind.upgrade { background: rgba(47,123,255,.14); color: #9cc0ff; }
[data-theme="light"] .dl-tbl .dl-kind.fpk, [data-theme="light"] .dl-tbl .dl-kind.docker, [data-theme="light"] .dl-tbl .dl-kind.upgrade { color: var(--primary-ink); }
.dl-tbl .dl-kind.docs { background: rgba(148,163,184,.16); color: #94a3b8; }
[data-theme="light"] .dl-tbl .dl-kind.docs { color: #64748b; }
.dl-card .dl-kind.hot { background: rgba(47,123,255,.24); color: #bcd4ff; }
[data-theme="light"] .dl-card .dl-kind.hot { color: #1d4ed8; }
.dl-arch { display: inline-block; margin-left: 6px; padding: 1px 7px; border-radius: 999px; font-size: 10.5px; font-weight: 800; letter-spacing: .3px; vertical-align: 1px; }
.dl-arch.a86 { background: rgba(47,123,255,.22); color: #bcd4ff; border: 1px solid rgba(47,123,255,.45); }
[data-theme="light"] .dl-arch.a86 { color: #1d4ed8; }
.dl-arch.aarm { background: transparent; color: #9cc0ff; border: 1px solid rgba(47,123,255,.55); }
[data-theme="light"] .dl-arch.aarm { color: #2f7bff; }

/* C16 / C17：段末孤字与标题末行失衡 —— 交给浏览器排版，不改任何尺寸 */
p, li, dd { text-wrap: pretty; }
h1, h2, h3, h4 { text-wrap: balance; }