/* =========================================================================
   感尊官网 · 共用设计系统 site.css（2026-10-24 全站版）
   设计语言：白纸上的光 —— 冷白纸面做底，AI 彩光只落在焦点上，关键数字盖「代码已核对」印章。
   规矩：
   - 页面只许用这里的令牌与组件，不写裸颜色、裸圆角、裸间距；
   - 其他设计师只许在文件末尾「追加区」新增组件，不改已有组件；
   - 所有会动的东西都包在 prefers-reduced-motion: no-preference 里，减少动效时显示静止终态；
   - 手机端（≤ 760px）关掉持续动画、重模糊，只留入场一次。
   目录：
   0 令牌  1 基础  2 布局  3 签名手法  4 字与标题  5 按钮  6 标签胶囊  7 卡片
   8 设备框  9 印章  10 AI 组件  11 流程  12 Bento  13 表格  14 FAQ  15 面包屑分页筛选
   16 表单  17 收尾区  18 空态 404  19 文章排版  20 顶栏与巨型菜单  21 手机菜单  22 页脚
   23 入场与动效  24 手机适配  26 首页旧稿（.home-*）  27 首页第二轮（.hx-* 等）  28 第二轮组件  25 追加区（放在文件最末）
   ========================================================================= */

/* ===== 0 令牌 ===== */
@property --ang { syntax: "<angle>"; initial-value: 0deg; inherits: false; }

:root {
  /* —— 颜色 · 基础层（只在令牌里引用，页面不直接用） —— */
  --p-white: oklch(100% 0 0);
  --p-snow: oklch(99.2% 0.003 260);
  --p-mist: oklch(97.4% 0.007 260);
  --p-fog: oklch(95.2% 0.011 262);
  --p-line: oklch(91.5% 0.011 262);
  --p-line-2: oklch(86% 0.014 262);
  --p-ink: oklch(21% 0.028 266);
  --p-ink-2: oklch(42% 0.024 266);
  --p-ink-3: oklch(51% 0.02 266);
  --p-paper: oklch(98.4% 0.009 85);
  --p-paper-2: oklch(95.6% 0.016 82);
  --p-blue-50: oklch(97% 0.022 262);
  --p-blue-100: oklch(93.5% 0.045 262);
  --p-blue-500: oklch(56% 0.2 262);
  --p-blue-600: oklch(50% 0.21 263);
  --p-blue-700: oklch(43% 0.19 264);
  --p-sky: oklch(63% 0.17 238);
  --p-indigo: oklch(52% 0.23 276);
  --p-violet: oklch(58% 0.24 304);
  --p-amber: oklch(76% 0.15 60);
  --p-green-600: oklch(48% 0.12 158);
  --p-green-50: oklch(96.5% 0.03 160);
  --p-red-seal: oklch(46% 0.18 6);    /* 胭脂红：与房产色相差 ≥ 15°（第二轮 组件 7） */
  --p-red-50: oklch(96.5% 0.02 28);
  --p-fang: oklch(55% 0.2 27);      /* 房产中介产品色（平台 aux-red 同色相） */
  --p-wuzi: oklch(62% 0.13 170);    /* 智慧物资产品色（平台 aux-green 同色相） */

  /* —— 颜色 · 语义层（页面只用这一层） —— */
  --bg: var(--p-snow);              /* 页面底：冷白 */
  --bg-subtle: var(--p-mist);       /* 分区底：更淡一档 */
  --bg-muted: var(--p-fog);         /* 控件底、代码底 */
  --surface: var(--p-white);        /* 卡片 */
  --paper: var(--p-paper);          /* 纸感面：运行记录单、留资卡（继承 A 暖纸） */
  --paper-line: var(--p-paper-2);
  --line: var(--p-line);            /* 卡片边、分隔 */
  --line-strong: var(--p-line-2);   /* 输入框边、线稿 */
  --line-faint: oklch(25% 0.03 262 / 0.07); /* 网格与点阵底纹 */
  --line-grid: oklch(45% 0.08 262 / 0.11);  /* 首屏、内页头图的网格（静止态要看得见） */
  --ink: var(--p-ink);              /* 标题、正文 */
  --ink-2: var(--p-ink-2);          /* 次要文字 */
  --ink-3: var(--p-ink-3);          /* 辅助说明（白底 ≥ 4.5:1，不许再浅） */
  --on-brand: var(--p-white);
  --brand: var(--p-blue-600);       /* 感尊蓝：主按钮、链接、当前选中 */
  --brand-hover: var(--p-blue-700);
  --brand-ink: var(--p-blue-700);   /* 链接文字 */
  --brand-soft: var(--p-blue-50);   /* 浅底按钮、选中底 */
  --brand-soft-2: var(--p-blue-100);
  --ok: var(--p-green-600);
  --ok-soft: var(--p-green-50);
  --seal: var(--p-red-seal);        /* 印章红：只给「代码已核对」印章 */
  --seal-soft: var(--p-red-50);
  --fang: var(--p-fang);
  --wuzi: var(--p-wuzi);
  /* AI 色组：只给 AI 相关的东西（渐变字、AI 光边、AI 标记），不给按钮和普通图标 */
  --ai-1: var(--p-sky);
  --ai-2: var(--p-indigo);
  --ai-3: var(--p-violet);
  --ai-4: var(--p-amber);           /* 暖橙：只在光边和光斑里出现一小段 */
  --ai-ink: var(--p-indigo);        /* AI 小字的实色（渐变不够对比时用） */
  --ai-soft: oklch(96.4% 0.025 285);
  --hl: oklch(93% 0.07 95 / 0.9);   /* 原文高亮底 */
  --hl-ai: oklch(92% 0.05 280 / 0.85);
  --scrim: oklch(21% 0.028 266 / 0.32);

  /* —— 渐变 —— */
  --grad-ai: linear-gradient(90deg in oklch, var(--ai-1), var(--ai-2) 52%, var(--ai-3));
  --grad-ai-text: linear-gradient(78deg in oklch, var(--ai-1) 4%, var(--ai-2) 50%, var(--ai-3) 96%);
  --grad-ai-conic: conic-gradient(from var(--ang) in oklch, var(--ai-1), var(--ai-2), var(--ai-3), var(--ai-4), var(--ai-1));
  --grad-edge: linear-gradient(135deg in oklch, oklch(66% 0.17 250 / 0.6), oklch(62% 0.2 300 / 0.28) 42%, oklch(92% 0.01 262 / 0.9) 72%);
  --grad-edge-soft: linear-gradient(160deg, oklch(80% 0.08 262 / 0.7), oklch(92% 0.01 262 / 0.6) 60%);
  --grad-fade-b: linear-gradient(to bottom, transparent, var(--surface));
  --grad-paper: linear-gradient(180deg, var(--paper), var(--surface));
  --glow-blue: oklch(70% 0.16 250 / 0.30);
  --glow-violet: oklch(70% 0.19 300 / 0.24);
  --glow-amber: oklch(82% 0.12 60 / 0.22);
  --ribbon-1: oklch(72% 0.15 245 / 0.30);
  --ribbon-2: oklch(70% 0.18 290 / 0.24);
  --ribbon-3: oklch(84% 0.11 60 / 0.26);

  /* —— 字 —— */
  --font-sans: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB", "Noto Sans SC", sans-serif;
  --font-mono: ui-monospace, "Cascadia Mono", Consolas, "SF Mono", Menlo, "Microsoft YaHei", monospace;
  --fs-hero: 88px;      /* 首页第二轮居中巨型标题 */
  --stage-h: 370px;     /* 首页产品舞台高度 */
  --fs-display: 72px;   /* 首页 H1（旧稿） */
  --fs-h1: 56px;        /* 内页 H1 */
  --fs-h2: 40px;        /* 区块标题 */
  --fs-h3: 24px;        /* 卡片大标题 */
  --fs-h4: 18px;        /* 卡片标题 */
  --fs-lead: 20px;      /* 副标 */
  --fs-body: 16px;
  --fs-sm: 14px;
  --fs-xs: 13px;        /* 最小字号，不许更小 */
  --fs-ui: 15px;        /* 控件、卡片说明、FAQ 答案 */
  --fs-body-lg: 17px;   /* 长文正文、引导句 */
  --fs-h5: 20px;        /* 小标题、强调数字（原 19/21/22 归此） */
  --fs-h3l: 28px;       /* 大号小标题（原 26/28/30 归此） */
  --fs-mark: 11px;      /* 只给图形内文字：印章、占位角标、设备框模拟界面；不是正文 */
  --fs-stat: 48px;      /* 统计数字 */
  --lh-tight: 1.1;
  --lh-head: 1.25;
  --lh-body: 1.7;
  --track-display: -0.025em;
  --track-head: -0.012em;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semi: 600;
  --fw-bold: 700;

  /* —— 间距（只许用这组刻度） —— */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px;
  --s-6: 32px; --s-7: 48px; --s-8: 64px; --s-9: 96px;

  /* —— 圆角 —— */
  --r-xs: 8px; --r-sm: 12px; --r-md: 16px; --r-lg: 20px; --r-xl: 28px; --r-pill: 999px;
  --r-phone: 36px;

  /* —— 阴影：中性分层 + 彩色调（科技感） —— */
  --sh-1: 0 0 0 1px oklch(25% 0.03 262 / 0.06), 0 1px 2px -1px oklch(25% 0.03 262 / 0.08), 0 2px 4px -2px oklch(25% 0.03 262 / 0.05);
  --sh-2: 0 1px 2px oklch(30% 0.05 265 / 0.06), 0 12px 32px -10px oklch(45% 0.12 265 / 0.18);
  --sh-2-hover: 0 2px 4px oklch(30% 0.05 265 / 0.06), 0 24px 48px -14px oklch(50% 0.16 270 / 0.24);
  --sh-3: 0 3px 3px oklch(25% 0.05 265 / 0.04), 0 12px 12px -6px oklch(25% 0.06 265 / 0.06), 0 32px 48px -12px oklch(35% 0.12 265 / 0.20), 0 72px 96px -24px oklch(40% 0.14 270 / 0.16);
  --sh-pop: 0 0 0 1px oklch(25% 0.03 262 / 0.07), 0 18px 44px -12px oklch(30% 0.08 265 / 0.22);
  --sh-glow: 0 0 0 1px oklch(70% 0.12 270 / 0.18), 0 12px 40px -8px oklch(60% 0.2 280 / 0.30);
  --sh-inset-hi: inset 0 1px 0 oklch(100% 0 0 / 0.8);
  --sh-up: 0 -8px 24px -12px oklch(30% 0.05 265 / 0.18);
  --focus: 0 0 0 3px oklch(100% 0 0), 0 0 0 5px var(--brand);

  /* —— 尺寸 —— */
  --container: 1240px;
  --gutter: 32px;
  --nav-h: 64px;
  --ctl-h: 44px;
  --ctl-h-lg: 52px;
  --hit: 44px;          /* 手机可点区域 */
  --measure: 760px;     /* 正文行宽 */
  --grid-cell: 48px;    /* 网格底纹格子 */
  --dot-gap: 22px;      /* 点阵间距 */
  --icon: 20px;

  /* —— 动效 —— */
  --dur-1: 150ms;       /* 悬停、按下 */
  --dur-2: 200ms;       /* 状态切换 */
  --dur-3: 250ms;       /* 浮层出现 */
  --dur-enter: 600ms;   /* 区块入场 */
  --stagger: 70ms;
  --rise: 16px;
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in: cubic-bezier(0.4, 0, 1, 1);
  --ease-inout: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-spin: 6s;       /* AI 光边转一圈 */
  --dur-shimmer: 1.6s;  /* 扫光 */
  --dur-blink: 1.1s;    /* 光标 */
  --dur-flow: 2.4s;     /* 数据流线 */
  --dur-pulse: 2s;      /* 实时点 */
  --dur-ribbon-1: 7.2s; --dur-ribbon-2: 10.4s; --dur-ribbon-3: 12.6s;
  --dur-marquee: 40s;

  color-scheme: light;
}

/* ===== 1 基础 ===== */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: calc(var(--nav-h) + var(--s-4)); }
body {
  margin: 0; background: var(--bg); color: var(--ink);
  font-family: var(--font-sans); font-size: var(--fs-body); line-height: var(--lh-body);
  font-variant-numeric: tabular-nums; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
img, svg { display: block; max-width: 100%; }
img { height: auto; }
h1, h2, h3, h4, p, ul, ol, figure, blockquote, dl, dd { margin: 0; }
ul[role="list"], ol[role="list"] { list-style: none; padding: 0; }
a { color: var(--brand-ink); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
a, button, summary, label, .chip { touch-action: manipulation; }
.btn, .chip, .nav-link, .mega__tab, .tabs__tab { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; } /* 焦点只用 outline：按钮、卡片的投影写在 box-shadow 上，不会盖掉焦点（体检 H-02）；强制颜色模式下也看得见 */
::selection { background: var(--brand-soft-2); color: var(--ink); }
[hidden] { display: none !important; }
.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; }
.skip-link { position: absolute; left: var(--s-4); top: -100px; z-index: 100; background: var(--surface); color: var(--brand-ink); padding: var(--s-2) var(--s-4); border-radius: var(--r-xs); box-shadow: var(--sh-pop); }
.skip-link:focus { top: var(--s-3); }
.icon { width: var(--icon); height: var(--icon); flex: none; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.icon--sm { width: 16px; height: 16px; }
.icon--lg { width: 24px; height: 24px; }
.sprite { display: none; }

p, li, dd, figcaption, blockquote, .card__desc, .faq summary, .faq__a, .lead { text-wrap: pretty; }
h1, h2, h3, .h1, .h2, .h3 { text-wrap: balance; }

/* ===== 2 布局 ===== */
.wrap { width: 100%; max-width: calc(var(--container) + var(--gutter) * 2); margin-inline: auto; padding-inline: var(--gutter); }
.wrap--narrow { max-width: calc(var(--measure) + var(--gutter) * 2); }
.section { position: relative; padding-block: var(--s-9); }
.section--tight { padding-block: var(--s-8); }
.section--subtle { background: var(--bg-subtle); }
.section--paper { background: var(--paper); }
.section + .section--subtle, .section--subtle + .section { border-top: 0; }
.grid-12 { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--s-5); }
.span-3 { grid-column: span 3; } .span-4 { grid-column: span 4; } .span-5 { grid-column: span 5; }
.span-6 { grid-column: span 6; } .span-7 { grid-column: span 7; } .span-8 { grid-column: span 8; } .span-12 { grid-column: 1 / -1; }
.row-2 { grid-row: span 2; }
.stack > * + * { margin-top: var(--s-4); }
.stack-sm > * + * { margin-top: var(--s-2); }
.stack-lg > * + * { margin-top: var(--s-5); }
.cluster { display: flex; flex-wrap: wrap; gap: var(--s-3); align-items: center; }
.between { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--s-5); }

/* ===== 3 签名手法 =====
   ① 渐变字 .ai-text      ② AI 光边 .ai-frame      ③ 渐隐网格 / 点阵 .tech-grid .tech-dots
   ④ 光斑与彩带 .aurora .glow-spot      ⑤ 扫光 .shimmer      ⑥ 工程线稿与数据流线 .line-art .flow  */

/* ① 渐变字：每屏最多一处，2–8 个字 */
/* 产品页标题第二行：单独成块才能自己均衡折行（接在 <br> 后面的行内字会把最后一个字甩到下一行） */
.pp-title__sub { display: block; text-wrap: balance; }
.ai-text {
  background: var(--grad-ai-text); -webkit-background-clip: text; background-clip: text; color: transparent;
  -webkit-box-decoration-break: clone; box-decoration-break: clone;
}

/* ③ 渐隐网格 / 点阵：放在 position:relative 的容器里，作为第一个子元素 */
.tech-grid, .tech-dots { position: absolute; inset: 0; pointer-events: none; z-index: 0; }
.tech-grid {
  background-image: linear-gradient(to right, var(--line-faint) 1px, transparent 1px), linear-gradient(to bottom, var(--line-faint) 1px, transparent 1px);
  background-size: var(--grid-cell) var(--grid-cell); background-position: center top;
  -webkit-mask-image: radial-gradient(60% 62% at 50% 38%, var(--ink) 28%, transparent 76%);
          mask-image: radial-gradient(60% 62% at 50% 38%, var(--ink) 28%, transparent 76%);
}
.tech-dots {
  background-image: radial-gradient(circle, var(--line-faint) 1.2px, transparent 1.6px);
  background-size: var(--dot-gap) var(--dot-gap);
  -webkit-mask-image: radial-gradient(70% 70% at 50% 45%, var(--ink) 30%, transparent 78%);
          mask-image: radial-gradient(70% 70% at 50% 45%, var(--ink) 30%, transparent 78%);
}
.tech-grid--right { -webkit-mask-image: radial-gradient(48% 70% at 78% 40%, var(--ink) 25%, transparent 75%); mask-image: radial-gradient(48% 70% at 78% 40%, var(--ink) 25%, transparent 75%); }

/* ④ 光斑与彩带：.aurora 只放首页首屏（全站唯一持续在动的背景）；.glow-spot 内页头图、CTA 用的小光斑 */
.aurora { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 0; }
.aurora__blob { position: absolute; border-radius: 50%; }
.aurora__blob--a { width: 62%; height: 78%; right: -8%; top: -6%; background: radial-gradient(closest-side, var(--glow-blue), transparent); }
.aurora__blob--b { width: 46%; height: 60%; right: 18%; top: 30%; background: radial-gradient(closest-side, var(--glow-violet), transparent); }
.aurora__blob--c { width: 30%; height: 40%; right: -2%; top: 52%; background: radial-gradient(closest-side, var(--glow-amber), transparent); }
.aurora__ribbon { position: absolute; width: 90%; height: 22%; left: 30%; border-radius: 50%; transform: rotate(-18deg); will-change: transform; }
.aurora__ribbon--1 { top: 12%; background: linear-gradient(90deg, transparent, var(--ribbon-1) 45%, transparent); }
.aurora__ribbon--2 { top: 40%; left: 38%; background: linear-gradient(90deg, transparent, var(--ribbon-2) 50%, transparent); }
.aurora__ribbon--3 { top: 64%; left: 46%; width: 70%; background: linear-gradient(90deg, transparent, var(--ribbon-3) 50%, transparent); }
.glow-spot { position: absolute; width: 520px; height: 420px; border-radius: 50%; pointer-events: none; z-index: 0;
  background: radial-gradient(closest-side, var(--glow-blue), transparent 100%), radial-gradient(closest-side at 70% 60%, var(--glow-violet), transparent 100%); }

/* ② AI 光边：同一视口最多一个在转；.is-running 时转，否则停在静态渐变边 */
.ai-frame { position: relative; isolation: isolate; border-radius: var(--r-lg); background: var(--surface); --ang: 210deg; }
.ai-frame::before { content: ""; position: absolute; inset: -1.5px; border-radius: inherit; z-index: -1; background: var(--grad-ai-conic); }
.ai-frame::after { content: ""; position: absolute; inset: -10px; border-radius: calc(var(--r-lg) + 10px); z-index: -2; background: var(--grad-ai-conic); filter: blur(18px); opacity: 0.28; }

/* ⑤ 扫光：AI 处理中的文字 */
.shimmer { color: var(--ink-2); }

/* ⑥ 工程线稿与数据流线（内联 SVG 用这些类） */
.line-art { fill: none; stroke: var(--line-strong); stroke-width: 1.25; stroke-linecap: round; stroke-linejoin: round; }
.line-art .la-dash { stroke-dasharray: 3 4; }
.line-art .la-dot { fill: var(--brand); stroke: none; }
.line-art .la-fill { fill: var(--surface); }
.line-art .la-strong { stroke: var(--ink-3); }
.flow { fill: none; stroke: var(--brand); stroke-opacity: 0.55; stroke-width: 1.5; stroke-dasharray: 5 9; stroke-linecap: round; }
.flow--ai { stroke: var(--ai-2); }
.flow-dot { fill: var(--ai-2); filter: drop-shadow(0 0 4px var(--ai-2)); }

/* ===== 4 字与标题 ===== */
.display { font-size: var(--fs-display); line-height: var(--lh-tight); letter-spacing: var(--track-display); font-weight: var(--fw-bold); }
.h1 { font-size: var(--fs-h1); line-height: 1.15; letter-spacing: var(--track-display); font-weight: var(--fw-bold); }
.h2 { font-size: var(--fs-h2); line-height: var(--lh-head); letter-spacing: var(--track-head); font-weight: var(--fw-bold); }
.h3 { font-size: var(--fs-h3); line-height: 1.35; letter-spacing: var(--track-head); font-weight: var(--fw-semi); }
.h4 { font-size: var(--fs-h4); line-height: 1.45; font-weight: var(--fw-semi); }
.lead { font-size: var(--fs-lead); line-height: 1.65; color: var(--ink-2); }
.text-sm { font-size: var(--fs-sm); }
.text-xs { font-size: var(--fs-xs); }
.muted { color: var(--ink-2); }
.subtle { color: var(--ink-3); }
.num { font-variant-numeric: tabular-nums; font-feature-settings: "tnum"; }
.stat { font-size: var(--fs-stat); line-height: 1; font-weight: var(--fw-bold); letter-spacing: var(--track-display); }
.nowrap { white-space: nowrap; }
.mono { font-family: var(--font-mono); }

/* 章节标题组：眉题（可选）+ 标题（可含一处 .ai-text）+ 说明 */
.sec-head { position: relative; z-index: 1; max-width: 720px; margin-bottom: var(--s-7); }
.sec-head--center { margin-inline: auto; text-align: center; }
.sec-head--row { max-width: none; display: flex; justify-content: space-between; align-items: flex-end; gap: var(--s-5); }
.sec-head__eyebrow { display: inline-flex; align-items: center; gap: var(--s-2); font-size: var(--fs-sm); font-weight: var(--fw-semi); color: var(--brand-ink); margin-bottom: var(--s-3); }
.sec-head__eyebrow--ai { color: var(--ai-ink); }
.sec-head__title { font-size: var(--fs-h2); line-height: var(--lh-head); letter-spacing: var(--track-head); font-weight: var(--fw-bold); text-wrap: balance; }
.sec-head__desc { margin-top: var(--s-3); font-size: var(--fs-body-lg); color: var(--ink-2); max-width: 640px; }
.sec-head--center .sec-head__desc { margin-inline: auto; }
.link-more { display: inline-flex; align-items: center; gap: var(--s-1); font-size: var(--fs-sm); font-weight: var(--fw-semi); color: var(--brand-ink); white-space: nowrap; min-height: var(--hit); }
.link-more .icon { transition: transform var(--dur-1) var(--ease-out); }
.link-more:hover .icon { transform: translateX(3px); }

/* ===== 5 按钮 =====
   .btn--primary 实心主按钮：一屏只许一个；.btn--secondary 描边；.btn--soft 浅底（顶栏「免费咨询」）；
   .btn--ghost 文字按钮；.btn--ai AI 渐变边按钮（只给 AI 入口，不当主按钮） */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--s-2);
  min-height: var(--ctl-h); padding: 0 var(--s-5); border-radius: var(--r-pill); border: 1px solid transparent;
  font-size: var(--fs-ui); font-weight: var(--fw-semi); line-height: 1; white-space: nowrap; text-decoration: none;
  transition: background-color var(--dur-1) var(--ease-out), box-shadow var(--dur-2) var(--ease-out), transform var(--dur-1) var(--ease-out), color var(--dur-1);
}
.btn:hover { text-decoration: none; }
.btn:not(:disabled):not([aria-disabled="true"]):active { transform: scale(0.97); }
.btn--lg { min-height: var(--ctl-h-lg); padding: 0 var(--s-6); font-size: var(--fs-body); }
.btn--sm { min-height: 36px; padding: 0 var(--s-4); font-size: var(--fs-sm); }
.btn--block { width: 100%; }
.btn--primary { background: var(--brand); color: var(--on-brand); box-shadow: 0 1px 0 oklch(100% 0 0 / 0.18) inset, 0 8px 20px -8px oklch(50% 0.21 263 / 0.55); }
.btn--primary:hover { background: var(--brand-hover); box-shadow: 0 1px 0 oklch(100% 0 0 / 0.18) inset, 0 12px 28px -10px oklch(50% 0.21 263 / 0.6); }
.btn--secondary { background: var(--surface); color: var(--ink); border-color: var(--line-strong); box-shadow: var(--sh-1); }
.btn--secondary:hover { border-color: var(--ink-3); }
.btn--soft { background: var(--brand-soft); color: var(--brand-ink); }
.btn--soft:hover { background: var(--brand-soft-2); }
.btn--ghost { background: transparent; color: var(--brand-ink); padding-inline: var(--s-2); }
.btn--ghost:hover { background: var(--brand-soft); }
.btn--ai { color: var(--ink); border: 1.5px solid transparent;
  background: linear-gradient(var(--surface), var(--surface)) padding-box, var(--grad-ai) border-box; }
.btn--ai:hover { box-shadow: var(--sh-glow); }
.btn--ai .spark { color: var(--ai-ink); }
.btn[disabled], .btn[aria-disabled="true"] { opacity: 0.5; cursor: not-allowed; }

/* ===== 6 标签与胶囊 ===== */
.tag { display: inline-flex; align-items: center; gap: var(--s-1); height: 26px; padding: 0 var(--s-3); border-radius: var(--r-pill);
  font-size: var(--fs-xs); font-weight: var(--fw-medium); line-height: 1; white-space: nowrap; background: var(--bg-muted); color: var(--ink-2); }
.tag--brand { background: var(--brand-soft); color: var(--brand-ink); }
.tag--ok { background: var(--ok-soft); color: var(--ok); }
.tag--ai { background: var(--ai-soft); color: var(--ai-ink); }
.tag--fang { background: oklch(96% 0.02 27); color: oklch(46% 0.17 27); }
.tag--wuzi { background: oklch(96% 0.03 170); color: oklch(42% 0.09 170); }
.tag--line { background: var(--surface); box-shadow: inset 0 0 0 1px var(--line); }
/* 状态胶囊（首屏「AI 软件开发」那种）：渐变细边 + 实时点 */
.pill { display: inline-flex; align-items: center; gap: var(--s-2); min-height: 34px; padding: 0 var(--s-4) 0 var(--s-3); border-radius: var(--r-pill);
  font-size: var(--fs-sm); color: var(--ink-2); border: 1px solid transparent;
  background: linear-gradient(var(--surface), var(--surface)) padding-box, var(--grad-edge) border-box; box-shadow: var(--sh-1); }
.pill strong { color: var(--ink); font-weight: var(--fw-semi); }
.live-dot { position: relative; width: 8px; height: 8px; border-radius: 50%; background: var(--ok); flex: none; }
.live-dot::after { content: ""; position: absolute; inset: 0; border-radius: 50%; background: var(--ok); opacity: 0; }
.spark { width: 16px; height: 16px; flex: none; fill: currentColor; stroke: none; }
/* 能力标签行（首屏） */
.cap-row { display: flex; flex-wrap: wrap; gap: var(--s-2); }
.cap { display: inline-flex; align-items: center; gap: var(--s-2); min-height: 34px; padding: 0 var(--s-3); border-radius: var(--r-pill); font-size: var(--fs-sm); color: var(--ink-2); background: var(--surface); box-shadow: var(--sh-1); }
.cap .icon { width: 16px; height: 16px; color: var(--brand); }
.cap--ai .icon { color: var(--ai-ink); }

/* ===== 7 卡片 =====
   .card 普通卡；.card--edge 渐变细边（主卡、推荐卡、AI 卡）；.card--glow 发光卡（每屏最多一张）；
   .card--glass 玻璃卡（压在光斑上，每屏 ≤ 2）；.card--paper 纸感卡；.card--link 整卡可点，悬停上浮 */
.card { position: relative; background: var(--surface); border-radius: var(--r-lg); box-shadow: var(--sh-2); padding: var(--s-6); }
.card--flat { box-shadow: var(--sh-1); }
.card--pad-sm { padding: var(--s-5); }
.card--edge { border: 1px solid transparent; background: linear-gradient(var(--surface), var(--surface)) padding-box, var(--grad-edge) border-box; }
.card--glow { border: 1px solid transparent; background: linear-gradient(var(--surface), var(--surface)) padding-box, var(--grad-ai) border-box; box-shadow: var(--sh-glow); }
.card--glass { background: oklch(100% 0 0 / 0.66); border: 1px solid oklch(100% 0 0 / 0.75);
  -webkit-backdrop-filter: saturate(1.6) blur(18px); backdrop-filter: saturate(1.6) blur(18px); box-shadow: var(--sh-inset-hi), var(--sh-2); }
.card--paper { background: var(--grad-paper); box-shadow: 0 0 0 1px var(--paper-line), var(--sh-2); }
.card--link { transition: transform var(--dur-2) var(--ease-out), box-shadow var(--dur-2) var(--ease-out); }
.card--link:hover { box-shadow: var(--sh-2-hover); }
@media (hover: hover) and (prefers-reduced-motion: no-preference) { .card--link:hover { transform: translateY(-4px); } }
.card__title { text-wrap: pretty; font-size: var(--fs-h4); font-weight: var(--fw-semi); line-height: 1.45; color: var(--ink); }
.card__title--lg { font-size: var(--fs-h3); line-height: 1.35; letter-spacing: var(--track-head); }
.card__desc { margin-top: var(--s-2); font-size: var(--fs-ui); color: var(--ink-2); line-height: 1.65; }
.card__icon { display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: var(--r-sm); background: var(--brand-soft); color: var(--brand); flex: none; }
.card__icon--fang { background: var(--fang); color: var(--on-brand); }
.card__icon--wuzi { background: var(--wuzi); color: var(--on-brand); }
.card__icon--ai { background: var(--ai-soft); color: var(--ai-ink); }
.card__head { display: flex; align-items: center; gap: var(--s-3); }
.card__glyph { width: 22px; height: 22px; flex: none; color: var(--brand); }
.card__glyph--ai { color: var(--ai-ink); }
.card__media { position: relative; overflow: hidden; border-radius: var(--r-md); background: var(--bg-muted); }
.card__foot { margin-top: var(--s-4); display: flex; align-items: center; justify-content: space-between; gap: var(--s-3); }
.checks { display: grid; gap: var(--s-2); padding: 0; list-style: none; font-size: var(--fs-ui); color: var(--ink-2); }
.checks li { display: flex; gap: var(--s-2); align-items: flex-start; }
.checks .icon { width: 18px; height: 18px; color: var(--ok); margin-top: 3px; }

/* ===== 8 设备框 =====
   截图一律放 .shot 里用 object-position 取局部，不拉伸；--shot-w 控制放大倍数（裁局部） */
.shot { display: block; width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, left top); }
.device-browser { position: relative; border-radius: var(--r-md); background: var(--surface); box-shadow: var(--sh-3); overflow: hidden; border: 1px solid var(--line); }
.device-browser__bar { display: flex; align-items: center; gap: var(--s-2); height: 34px; padding: 0 var(--s-3); background: var(--bg-subtle); border-bottom: 1px solid var(--line); }
.device-browser__dots { display: flex; gap: 6px; }
.device-browser__dots i { width: 9px; height: 9px; border-radius: 50%; background: var(--line-strong); }
.device-browser__url { flex: 1; max-width: 300px; margin-inline: auto; height: 22px; border-radius: var(--r-pill); background: var(--surface); font-size: var(--fs-xs); color: var(--ink-3); display: grid; place-items: center; box-shadow: inset 0 0 0 1px var(--line); }
.device-browser__screen { position: relative; aspect-ratio: var(--ratio, 16 / 10); overflow: hidden; }
.device-browser__screen > img { position: absolute; left: 0; top: 0; width: var(--shot-w, 100%); max-width: none; height: auto; transform: translate(var(--shot-x, 0), var(--shot-y, 0)); }
.device-phone { position: relative; width: var(--phone-w, 240px); padding: 8px; border-radius: var(--r-phone); background: var(--ink); box-shadow: var(--sh-3), inset 0 0 0 1.5px oklch(45% 0.02 265); }
.device-phone__screen { position: relative; overflow: hidden; border-radius: calc(var(--r-phone) - 8px); aspect-ratio: 9 / 19.5; background: var(--surface); }
.device-phone__screen > img { position: absolute; left: 0; top: 0; width: 100%; max-width: none; height: auto; transform: translateY(var(--shot-y, 0)); }
.device-phone__island { position: absolute; z-index: 2; top: 14px; left: 50%; transform: translateX(-50%); width: 30%; height: 18px; border-radius: var(--r-pill); background: var(--ink); }
.device-tablet { position: relative; width: var(--tablet-w, 420px); padding: 10px; border-radius: var(--r-lg); background: var(--ink); box-shadow: var(--sh-3), inset 0 0 0 1.5px oklch(45% 0.02 265); }
.device-tablet__screen { overflow: hidden; border-radius: var(--r-xs); aspect-ratio: 2732 / 1538; background: var(--surface); }
.device-tablet__screen > img { width: 100%; height: 100%; object-fit: cover; }
/* 扇形叠放：中间主设备，左右各两层，依次缩小、后退 */
.device-fan { position: relative; display: flex; justify-content: center; align-items: flex-end; min-height: var(--fan-h, 420px); }
.device-fan > * { position: absolute; bottom: 0; transition: transform var(--dur-3) var(--ease-out); }
.device-fan__c { position: relative; z-index: 3; }
.device-fan__l1 { z-index: 2; left: 50%; transform: translateX(calc(-50% - var(--fan-step, 300px))) scale(0.92); transform-origin: bottom center; }
.device-fan__r1 { z-index: 2; left: 50%; transform: translateX(calc(-50% + var(--fan-step, 300px))) scale(0.92); transform-origin: bottom center; }
.device-fan__l2 { z-index: 1; left: 50%; transform: translateX(calc(-50% - var(--fan-step, 300px) * 1.75)) scale(0.82); transform-origin: bottom center; opacity: 0.96; }
.device-fan__r2 { z-index: 1; left: 50%; transform: translateX(calc(-50% + var(--fan-step, 300px) * 1.75)) scale(0.82); transform-origin: bottom center; opacity: 0.96; }
.figcap { margin-top: var(--s-3); font-size: var(--fs-xs); color: var(--ink-3); }

/* ===== 9 印章「代码已核对」（继承 A 暖纸编辑部） =====
   只用于「这个数是代码算的、核过了」，不许当装饰。 */
.stamp { display: inline-grid; isolation: isolate; place-items: center; width: 92px; height: 92px; border-radius: 50%; color: var(--seal);
  border: 2.5px solid currentColor; box-shadow: inset 0 0 0 4px var(--surface), inset 0 0 0 5.5px currentColor;
  transform: rotate(-12deg); font-weight: var(--fw-bold); text-align: center; line-height: 1.15; letter-spacing: 0.08em; background: var(--surface); }
.stamp__top { font-size: var(--fs-ui); }
.stamp__sub { font-size: var(--fs-mark); font-weight: var(--fw-semi); letter-spacing: 0.04em; margin-top: 2px; }
.stamp--sm { width: 64px; height: 64px; border-width: 2px; box-shadow: inset 0 0 0 3px var(--surface), inset 0 0 0 4px currentColor; }
.stamp--sm .stamp__top { font-size: var(--fs-mark); }
.stamp--sm .stamp__sub { font-size: var(--fs-mark); }
.stamp--inline { display: inline-flex; width: auto; height: auto; padding: 2px var(--s-2); border-radius: var(--r-xs); transform: rotate(-3deg); box-shadow: none; border-width: 1.5px; font-size: var(--fs-xs); letter-spacing: 0.04em; }

/* ===== 10 AI 组件 ===== */
/* 10.1 AI 运行记录 .ai-run：原文高亮 → 字段点亮 → 代码核算 → 人确认。
   结构见 styleguide.html；JS 用 data-ai-run 驱动；没有 JS / 减少动效时就是 HTML 里写好的完成态 */
.ai-run { position: relative; z-index: 1; border-radius: var(--r-lg); background: var(--surface); padding: var(--s-5); }
.ai-run__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s-2) var(--s-3); padding-bottom: var(--s-4); border-bottom: 1px dashed var(--line-strong); }
.ai-run__title { display: flex; align-items: center; gap: var(--s-2); font-weight: var(--fw-semi); font-size: var(--fs-ui); }
.ai-run__title .spark { color: var(--ai-ink); }
.ai-run__status { display: inline-flex; align-items: center; gap: var(--s-2); font-size: var(--fs-xs); color: var(--ink-3); white-space: nowrap; }
.ai-run__body { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: var(--s-5); padding-top: var(--s-4); }
.ai-run__rail { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--s-1); align-content: start; position: relative; }
.ai-run__rail::before { content: ""; position: absolute; left: 11px; top: 14px; bottom: 14px; width: 2px; background: var(--line); border-radius: 2px; }
.ai-run__rail::after { content: ""; position: absolute; left: 11px; top: 14px; width: 2px; height: calc((100% - 28px) * var(--p, 1)); background: linear-gradient(to bottom in oklch, var(--ai-1), var(--ai-2), var(--ai-3)); border-radius: 2px; transition: height 500ms var(--ease-out); }
.ai-run__rail li { position: relative; display: flex; align-items: center; gap: var(--s-3); min-height: 40px; font-size: var(--fs-sm); color: var(--ink-3); }
.ai-run__dot { position: relative; z-index: 1; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--surface); box-shadow: inset 0 0 0 1.5px var(--line-strong); font-size: var(--fs-xs); font-weight: var(--fw-semi); color: var(--ink-3); flex: none; }
.ai-run__rail li[data-state="run"] { color: var(--ink); font-weight: var(--fw-semi); }
.ai-run__rail li[data-state="run"] .ai-run__dot { box-shadow: inset 0 0 0 2px var(--ai-2); color: var(--ai-ink); }
.ai-run__rail li[data-state="done"] { color: var(--ink-2); }
.ai-run__rail li[data-state="done"] .ai-run__dot { background: var(--ok); color: var(--on-brand); box-shadow: none; }
.ai-run__main { display: grid; gap: var(--s-3); min-width: 0; }
.ai-run__main > * { min-width: 0; }
.ai-run__label { font-size: var(--fs-xs); color: var(--ink-3); margin-bottom: var(--s-2); display: flex; justify-content: space-between; gap: var(--s-2); }
.ai-run__quote { font-size: var(--fs-body); line-height: 1.75; color: var(--ink); background: var(--paper); border-radius: var(--r-sm); padding: var(--s-3) var(--s-4); box-shadow: inset 0 0 0 1px var(--paper-line); min-height: 84px; }
.src { white-space: nowrap; border-radius: 4px; padding: 1px 2px; transition: background-color var(--dur-3) var(--ease-out), box-shadow var(--dur-3) var(--ease-out); }
.src.is-hl { background: var(--hl); box-shadow: 0 0 0 1px oklch(80% 0.1 90 / 0.6); }
.caret { display: inline-block; width: 2px; height: 1.1em; margin-left: 1px; vertical-align: -0.18em; background: var(--ai-2); }
.ai-run__fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-2); }
.field-chip { display: flex; align-items: center; justify-content: space-between; gap: var(--s-2); padding: var(--s-2) var(--s-3); border-radius: var(--r-sm); background: var(--bg-subtle); box-shadow: inset 0 0 0 1px var(--line); min-height: 48px;
  transition: background-color var(--dur-3) var(--ease-out), box-shadow var(--dur-3) var(--ease-out), opacity var(--dur-3), transform var(--dur-3) var(--ease-out); }
.field-chip__k { font-size: var(--fs-xs); color: var(--ink-3); display: block; line-height: 1.3; }
.field-chip__v { font-size: var(--fs-ui); font-weight: var(--fw-semi); color: var(--ink); line-height: 1.35; }
.field-chip .tag { height: 22px; padding: 0 var(--s-2); font-size: var(--fs-xs); }
.field-chip.is-on { background: var(--surface); box-shadow: inset 0 0 0 1.5px oklch(75% 0.09 275 / 0.7), 0 4px 14px -6px oklch(55% 0.18 275 / 0.35); }
.field-chip.is-wait { opacity: 0.38; }
.term { position: relative; font-family: var(--font-mono); font-size: var(--fs-sm); line-height: 1.75; border: 1px solid transparent; background: linear-gradient(var(--bg-subtle), var(--bg-subtle)) padding-box, var(--grad-edge) border-box; border-radius: var(--r-sm); padding: var(--s-3) var(--s-4); color: var(--ink); overflow-x: auto; }
.term__line { display: block; white-space: pre; border-radius: 6px; }
.term__line.is-pending, .term__line.is-pending * { color: transparent !important; }
.term__line.is-pending { background: linear-gradient(90deg, var(--bg-muted) 25%, var(--surface) 50%, var(--bg-muted) 75%) 0 0 / 200% 100%; margin-block: 3px; }
.term__p { color: var(--ai-ink); }
.term__c { color: var(--ink-3); }
.term__ok { color: var(--ok); font-weight: var(--fw-semi); }
.ai-run__calc { position: relative; }
.ai-run__calc .stamp { position: absolute; right: var(--s-3); top: 50%; margin-top: -46px; }
.ai-run__calc .stamp--sm { margin-top: -32px; }
.ai-run__confirm { display: flex; align-items: center; gap: var(--s-3); flex-wrap: wrap; }
.mock-btn { display: inline-flex; align-items: center; gap: var(--s-1); height: 36px; padding: 0 var(--s-4); border-radius: var(--r-xs); font-size: var(--fs-sm); font-weight: var(--fw-semi); background: var(--brand-soft); color: var(--brand-ink); box-shadow: inset 0 0 0 1px var(--brand-soft-2); transition: transform var(--dur-1), background-color var(--dur-2); }
.mock-btn--plain { background: var(--surface); color: var(--ink-2); box-shadow: inset 0 0 0 1px var(--line-strong); }
.mock-btn.is-press { transform: scale(0.96); background: var(--brand-soft-2); }
.ai-run__done { display: inline-flex; align-items: center; gap: var(--s-2); font-size: var(--fs-sm); color: var(--ok); font-weight: var(--fw-semi); }
.ai-run__foot { margin-top: var(--s-4); padding-top: var(--s-3); border-top: 1px dashed var(--line-strong); display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-5); font-size: var(--fs-xs); color: var(--ink-3); }
.ai-run__foot span { display: inline-flex; align-items: center; gap: var(--s-1); }
.ai-run__foot .icon { width: 14px; height: 14px; color: var(--ok); }
.ai-run [data-stage] { transition: opacity var(--dur-3) var(--ease-out); }
.ai-run [data-stage].is-wait { opacity: 0.32; }
.stamp.is-hidden { opacity: 0; }

/* 10.1b 宽版运行记录 .ai-run--wide：步骤条横放在上，原话 + 核算在左，字段 + 确认在右（首页、AI 方案页） */
.ai-run--wide .ai-run__body { grid-template-columns: minmax(0, 1fr); gap: var(--s-4); }
.ai-run--wide .ai-run__rail { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ai-run--wide .ai-run__rail::before { left: 12px; right: 12%; top: 12px; bottom: auto; width: auto; height: 2px; }
.ai-run--wide .ai-run__rail::after { left: 12px; top: 12px; height: 2px; width: calc(88% * var(--p, 1)); background: var(--grad-ai); transition: width 500ms var(--ease-out); }
.ai-run--wide .ai-run__rail li { min-height: 24px; }
.ai-run--wide .ai-run__step { position: relative; z-index: 1; background: var(--surface); padding-right: var(--s-2); }
.ai-run--wide .ai-run__main { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: var(--s-4) var(--s-5); align-items: start; }
.ai-run--wide [data-stage="1"] { grid-column: 1; grid-row: 1; }
.ai-run--wide [data-stage="2"] { grid-column: 2; grid-row: 1; align-self: end; }
.ai-run--wide [data-stage="3"] { grid-column: 1; grid-row: 2; }
.ai-run--wide [data-stage="4"] { grid-column: 2; grid-row: 2; align-self: center; }
@media (max-width: 760px) {
  .ai-run--wide .ai-run__main { grid-template-columns: minmax(0, 1fr); }
  .ai-run--wide [data-stage] { grid-column: 1; grid-row: auto; }
  .ai-run--wide .ai-run__rail li { min-height: 0; }
}

/* 10.2 智能体步骤卡 .agent-steps（Cursor 式：思考 → 读取 → 生成 → 核对） */
.agent-steps { padding: var(--s-4) var(--s-5); border-radius: var(--r-lg); min-width: 0; }
.agent-steps__head { display: flex; align-items: center; justify-content: space-between; gap: var(--s-3); font-size: var(--fs-sm); font-weight: var(--fw-semi); margin-bottom: var(--s-2); }
.agent-steps__head .spark { color: var(--ai-ink); }
.agent-steps ol { list-style: none; padding: 0; margin: 0; display: grid; gap: 2px; }
.agent-steps li { display: grid; grid-template-columns: 20px 1fr auto; align-items: center; gap: var(--s-2); min-height: 30px; font-size: var(--fs-sm); color: var(--ink-2); }
.agent-steps li small { font-size: var(--fs-xs); color: var(--ink-3); }
.agent-steps .st { width: 16px; height: 16px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px var(--line-strong); }
.agent-steps li[data-state="done"] .st { background: var(--ok); box-shadow: none; position: relative; }
.agent-steps li[data-state="done"] .st::after { content: ""; position: absolute; left: 5px; top: 3px; width: 4px; height: 7px; border: solid var(--on-brand); border-width: 0 1.75px 1.75px 0; transform: rotate(45deg); }
.agent-steps li[data-state="run"] { color: var(--ink); font-weight: var(--fw-semi); }
.agent-steps li[data-state="run"] .st { box-shadow: inset 0 0 0 2px var(--ai-soft); border-top: 2px solid var(--ai-2); }
.agent-steps li[data-state="wait"] { color: var(--ink-3); }

/* 10.3 AI 标记：星芒 + 「AI」小胶囊（全站统一一个，不另画） */
.ai-badge { display: inline-flex; align-items: center; gap: 4px; height: 22px; padding: 0 var(--s-2); border-radius: var(--r-pill); font-size: var(--fs-xs); font-weight: var(--fw-semi); color: var(--ai-ink); background: var(--ai-soft); }
.ai-badge .spark { width: 12px; height: 12px; }

/* 10.4 需求输入框（首屏方案 B / AI 方案页）：自动打字演示，聚焦即停，变成真输入 */
.ask { position: relative; z-index: 2; width: 100%; max-width: 760px; margin-inline: auto; border-radius: var(--r-xl); }
.ask.ai-frame::after { border-radius: calc(var(--r-xl) + 10px); }
.ask__box { position: relative; border-radius: var(--r-xl); background: var(--surface); padding: var(--s-4) var(--s-4) var(--s-3) var(--s-5); }
.ask__label { display: flex; align-items: center; gap: var(--s-2); font-size: var(--fs-xs); color: var(--ink-3); }
.ask__label .spark { color: var(--ai-ink); width: 14px; height: 14px; }
.ask__input { display: block; width: 100%; border: 0; outline: 0; resize: none; background: transparent; font-size: var(--fs-h5); line-height: 1.5; min-height: 48px; padding: var(--s-2) 0; color: var(--ink); }
.ask__input::placeholder { color: var(--ink-3); }
.ask__input:focus ~ .ask__typed, .ask__input:not(:placeholder-shown) ~ .ask__typed { display: none; }
.ask__typed { position: absolute; left: var(--s-5); right: var(--s-5); top: 38px; font-size: var(--fs-h5); line-height: 1.5; padding: var(--s-2) 0; color: var(--ink); pointer-events: none; }
.ask__bar { display: flex; align-items: center; justify-content: space-between; gap: var(--s-3); }
.ask__hint { font-size: var(--fs-xs); color: var(--ink-3); }
.ask__examples { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--s-2); margin-top: var(--s-4); }
.ask__examples .chip { background: oklch(100% 0 0 / 0.7); }

/* ===== 11 流程步骤 ===== */
.steps { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(var(--steps, 6), minmax(0, 1fr)); gap: var(--s-4); position: relative; counter-reset: step; }
.steps::before { content: ""; position: absolute; left: 20px; right: calc((100% - (var(--steps, 6) - 1) * var(--s-4)) / var(--steps, 6) - 20px); top: 19px; height: 0; border-top: 1.5px dashed var(--line-strong); }
.steps__item { position: relative; }
.steps__num { position: relative; z-index: 1; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--surface); box-shadow: inset 0 0 0 1.5px var(--line-strong), var(--sh-1); font-weight: var(--fw-bold); color: var(--brand-ink); font-size: var(--fs-ui); }
.steps__item--key .steps__num { background: var(--brand); color: var(--on-brand); box-shadow: 0 6px 16px -6px oklch(50% 0.21 263 / 0.6); }
.steps__title { margin-top: var(--s-3); font-weight: var(--fw-semi); font-size: var(--fs-body); }
.steps__desc { margin-top: var(--s-1); font-size: var(--fs-sm); color: var(--ink-2); line-height: 1.6; }
.steps--vertical { grid-template-columns: 1fr; gap: var(--s-5); }
.steps--vertical::before { left: 19px; right: auto; top: 20px; bottom: 20px; height: auto; border-top: 0; border-left: 1.5px dashed var(--line-strong); }
.steps--vertical .steps__item { display: grid; grid-template-columns: 40px 1fr; column-gap: var(--s-4); }
.steps--vertical .steps__title { margin-top: var(--s-2); }
.steps--vertical .steps__desc { grid-column: 2; }

/* ===== 12 Bento 网格 ===== */
.bento { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--s-5); position: relative; z-index: 1; }
.bento > * { min-width: 0; }
.bento__cell { position: relative; overflow: hidden; border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--sh-2); padding: var(--s-6); }
.bento__cell--edge { border: 1px solid transparent; background: linear-gradient(var(--surface), var(--surface)) padding-box, var(--grad-edge) border-box; }
.bento__cell--tint { background: linear-gradient(160deg, var(--brand-soft), var(--surface) 70%); }

/* ===== 13 表格 ===== */
.table-wrap { position: relative; overflow-x: auto; border-radius: var(--r-md); box-shadow: var(--sh-1); background: var(--surface); }
.table { width: 100%; border-collapse: collapse; font-size: var(--fs-ui); }
.table caption { text-align: left; padding: var(--s-4) var(--s-5) 0; font-weight: var(--fw-semi); }
.table th, .table td { padding: var(--s-3) var(--s-5); text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }
.table thead th { font-size: var(--fs-sm); font-weight: var(--fw-semi); color: var(--ink-2); background: var(--bg-subtle); white-space: nowrap; }
.table tbody tr:last-child td { border-bottom: 0; }
.table td.n, .table th.n { text-align: right; font-variant-numeric: tabular-nums; }
.table .is-key, .table tr.is-key > * { background: var(--brand-soft); }
.table--compare th[scope="row"] { font-weight: var(--fw-semi); color: var(--ink); white-space: nowrap; }

/* ===== 14 FAQ（默认全部展开，可收起） ===== */
.faq { display: grid; gap: var(--s-3); }
.faq details { border-radius: var(--r-md); background: var(--surface); box-shadow: var(--sh-1); }
.faq summary { list-style: none; display: flex; justify-content: space-between; align-items: center; gap: var(--s-4); min-height: 60px; padding: var(--s-3) var(--s-5); font-weight: var(--fw-semi); font-size: var(--fs-body-lg); cursor: pointer; border-radius: var(--r-md); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary .icon { color: var(--ink-3); transition: transform var(--dur-2) var(--ease-out); }
.faq details[open] summary .icon { transform: rotate(180deg); }
.faq__a { padding: 0 var(--s-5) var(--s-5); color: var(--ink-2); font-size: var(--fs-ui); line-height: 1.75; }
.faq--cols { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; }

/* ===== 15 面包屑、分页、筛选胶囊 ===== */
.crumbs { font-size: var(--fs-sm); color: var(--ink-3); }
.crumbs ol { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-1) var(--s-2); }
.crumbs li { display: inline-flex; align-items: center; gap: var(--s-2); }
.crumbs li + li::before { content: ""; width: 6px; height: 6px; border: solid var(--line-strong); border-width: 1.5px 1.5px 0 0; transform: rotate(45deg); }
.crumbs a { position: relative; color: var(--ink-2); }
.crumbs a::after { content: ""; position: absolute; inset: -10px -8px; } /* 扩大点击区，不改长相 */
.crumbs [aria-current="page"] { color: var(--ink); font-weight: var(--fw-medium); }
.pager { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: var(--s-2); }
.pager a, .pager span { display: inline-grid; place-items: center; min-width: 40px; height: 40px; padding: 0 var(--s-3); border-radius: var(--r-sm); font-size: var(--fs-ui); color: var(--ink-2); background: var(--surface); box-shadow: var(--sh-1); text-decoration: none; }
.pager a:hover { color: var(--brand-ink); box-shadow: inset 0 0 0 1px var(--brand); }
.pager [aria-current="page"] { background: var(--brand-soft); color: var(--brand-ink); font-weight: var(--fw-bold); box-shadow: inset 0 0 0 1.5px var(--brand); }
.pager .pager__gap { background: transparent; box-shadow: none; min-width: 24px; }
.pager .pager__dir { padding: 0 var(--s-4); }
.pager .is-disabled { opacity: 0.45; pointer-events: none; }
.filters { display: flex; flex-wrap: wrap; gap: var(--s-2); align-items: center; }
.filters__label { font-size: var(--fs-sm); color: var(--ink-3); margin-right: var(--s-1); }
.chip { display: inline-flex; align-items: center; gap: var(--s-1); min-height: 36px; padding: 0 var(--s-4); border-radius: var(--r-pill); border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink-2); font-size: var(--fs-sm); white-space: nowrap; transition: background-color var(--dur-1), border-color var(--dur-1), color var(--dur-1); }
.chip:hover { border-color: var(--ink-3); color: var(--ink); text-decoration: none; }
.chip[aria-pressed="true"], .chip[aria-current="true"], .chip.is-on { background: var(--brand-soft); border-color: var(--brand); color: var(--brand-ink); font-weight: var(--fw-semi); }
.chip .spark { width: 14px; height: 14px; color: var(--ai-ink); }
.chip__count { font-size: var(--fs-xs); color: var(--ink-3); }

/* ===== 16 表单 ===== */
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-4) var(--s-5); }
.form-grid .full { grid-column: 1 / -1; }
.field { display: grid; gap: var(--s-2); align-content: start; }
.field__label { font-size: var(--fs-sm); font-weight: var(--fw-semi); color: var(--ink); }
.field__label .req { color: var(--seal); margin-left: 2px; }
.field__hint { font-size: var(--fs-xs); color: var(--ink-3); }
.field__error[hidden] { display: none; }
.field__error { font-size: var(--fs-xs); color: var(--seal); display: flex; gap: var(--s-1); align-items: center; }
.input, .select, .textarea { width: 100%; min-height: var(--ctl-h); padding: 0 var(--s-4); border-radius: var(--r-sm); border: 1px solid var(--line-strong); background: var(--surface); font-size: var(--fs-ui); color: var(--ink); transition: border-color var(--dur-1), box-shadow var(--dur-2); }
.textarea { padding: var(--s-3) var(--s-4); min-height: 112px; resize: vertical; line-height: 1.6; }
.textarea--sm { min-height: 84px; }
.input::placeholder, .textarea::placeholder { color: var(--ink-3); }
.input:hover, .select:hover, .textarea:hover { border-color: var(--ink-3); }
.input:focus, .select:focus, .textarea:focus { outline: 2px solid transparent; outline-offset: 2px; border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft-2); }
.input[aria-invalid="true"], .textarea[aria-invalid="true"] { border-color: var(--seal); box-shadow: 0 0 0 3px var(--seal-soft); }
.select { appearance: none; padding-right: var(--s-7); background-image: linear-gradient(45deg, transparent 50%, var(--ink-3) 50%), linear-gradient(135deg, var(--ink-3) 50%, transparent 50%); background-position: calc(100% - 22px) 50%, calc(100% - 16px) 50%; background-size: 6px 6px; background-repeat: no-repeat; }
.choice-row { display: flex; flex-wrap: wrap; gap: var(--s-2); }
.choice { position: relative; display: inline-flex; }
.choice input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.choice span { display: inline-flex; align-items: center; min-height: 40px; padding: 0 var(--s-4); border-radius: var(--r-pill); border: 1px solid var(--line-strong); font-size: var(--fs-sm); color: var(--ink-2); background: var(--surface); transition: background-color var(--dur-1), border-color var(--dur-1), color var(--dur-1); }
.choice input:checked + span { background: var(--brand-soft); border-color: var(--brand); color: var(--brand-ink); font-weight: var(--fw-semi); }
.choice input:focus-visible + span { outline: 2px solid var(--brand); outline-offset: 2px; }
.check { display: flex; gap: var(--s-2); align-items: flex-start; font-size: var(--fs-sm); color: var(--ink-2); line-height: 1.6; }
.check input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--brand); flex: none; }
/* 两步留资：第 1 步只写需求，第 2 步回显需求 + 留手机号；任何时候只有一个实心按钮 */
.lead-form { position: relative; }
.lead-form__step[hidden] { display: none; }
.lead-form__progress { display: flex; align-items: center; gap: var(--s-2); font-size: var(--fs-xs); color: var(--ink-3); white-space: nowrap; }
.lead-form__progress i { width: 24px; height: 4px; border-radius: 4px; background: var(--line); }
.lead-form__progress i.is-on { background: var(--brand); }
.lead-form__echo { display: flex; gap: var(--s-3); align-items: flex-start; padding: var(--s-3) var(--s-4); border-radius: var(--r-sm); background: var(--ok-soft); color: var(--ink); font-size: var(--fs-sm); line-height: 1.6; }
.lead-form__echo .icon { color: var(--ok); margin-top: 2px; }
.lead-form__examples { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); }
.lead-form__examples .chip { min-height: 32px; padding: 0 var(--s-3); }
.lead-form__done { text-align: center; padding: var(--s-5) 0; }

/* ===== 17 收尾区 CTA ===== */
.cta-band { position: relative; overflow: hidden; border-radius: var(--r-xl); padding: var(--s-8) var(--s-7); background: var(--surface); box-shadow: var(--sh-2); isolation: isolate; }
.cta-band .glow-spot { right: -120px; top: -160px; }
.cta-band .tech-dots { opacity: 0.8; }
.cta-band__inner { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr auto; gap: var(--s-6); align-items: center; }

/* ===== 18 空态与 404 ===== */
.empty { display: grid; justify-items: center; text-align: center; gap: var(--s-3); padding: var(--s-8) var(--s-5); }
.empty__art { width: 160px; height: 120px; }
.empty__title { font-size: var(--fs-h4); font-weight: var(--fw-semi); }
.empty__desc { color: var(--ink-2); font-size: var(--fs-ui); max-width: 420px; }
.notfound { position: relative; overflow: hidden; isolation: isolate; padding-block: var(--s-9); min-height: calc(100vh - var(--nav-h) - 280px); }
.notfound__code { display: inline-block; font-size: 160px; line-height: 1; font-weight: var(--fw-bold); letter-spacing: -0.04em; }
.nf-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr) 420px; gap: var(--s-8); align-items: center; }
.nf-copy > * + * { margin-top: var(--s-5); }
.nf-copy .lead { max-width: 520px; }
.nf-search { display: flex; align-items: center; gap: var(--s-2); max-width: 520px; min-height: var(--ctl-h-lg); padding: 0 var(--s-2) 0 var(--s-4); border-radius: var(--r-pill); background: var(--surface); box-shadow: var(--sh-2); color: var(--ink-3); }
.nf-search:focus-within { box-shadow: 0 0 0 2px var(--brand), var(--sh-2); }
.nf-search__input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font-size: var(--fs-ui); color: var(--ink); min-height: var(--hit); }
.nf-search__input::placeholder { color: var(--ink-3); }
.nf-art { width: 100%; height: auto; }
.nf-links { list-style: none; padding: 0; margin: var(--s-8) 0 0; position: relative; z-index: 1; }
.nf-link { display: flex; gap: var(--s-4); align-items: center; height: 100%; color: var(--ink); text-decoration: none; }
.nf-link:hover { text-decoration: none; }
.nf-link .card__title, .nf-link .card__desc { display: block; }
.nf-link .card__desc { margin-top: var(--s-1); }
@media (max-width: 760px) {
  .nf-grid { grid-template-columns: minmax(0, 1fr); gap: var(--s-6); }
  .nf-art { display: none; }
  .nf-links { margin-top: var(--s-6); }
}

/* ===== 19 文章排版 ===== */
.article-layout { display: grid; grid-template-columns: 200px minmax(0, var(--measure)) 280px; gap: var(--s-7); justify-content: center; align-items: start; }
.article-meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2) var(--s-4); font-size: var(--fs-sm); color: var(--ink-3); }
.article-meta strong { color: var(--ink-2); font-weight: var(--fw-medium); }
.aigc-note { display: inline-flex; align-items: center; gap: var(--s-2); padding: var(--s-1) var(--s-3); border-radius: var(--r-pill); background: var(--ai-soft); color: var(--ai-ink); font-size: var(--fs-xs); }
.aigc-note .spark { width: 14px; height: 14px; }
.answer-box { position: relative; border-radius: var(--r-lg); padding: var(--s-5) var(--s-6); border: 1px solid transparent;
  background: linear-gradient(var(--surface), var(--surface)) padding-box, var(--grad-edge) border-box; box-shadow: var(--sh-2); }
.answer-box__label { display: flex; align-items: center; gap: var(--s-2); font-size: var(--fs-sm); font-weight: var(--fw-bold); color: var(--ai-ink); margin-bottom: var(--s-2); }
.answer-box p { font-size: var(--fs-body-lg); line-height: 1.8; color: var(--ink); }
.toc { position: sticky; top: calc(var(--nav-h) + var(--s-5)); font-size: var(--fs-sm); }
.toc__title { font-weight: var(--fw-semi); margin-bottom: var(--s-3); color: var(--ink); }
.toc ol { list-style: none; padding: 0; margin: 0; display: grid; gap: 2px; border-left: 2px solid var(--line); }
.toc a { display: block; padding: var(--s-1) var(--s-3); margin-left: -2px; border-left: 2px solid transparent; color: var(--ink-2); line-height: 1.6; }
.toc a:hover { color: var(--ink); text-decoration: none; }
.toc a[aria-current="true"] { color: var(--brand-ink); border-left-color: var(--brand); font-weight: var(--fw-semi); }
.prose { font-size: var(--fs-body-lg); line-height: 1.85; color: var(--ink); }
.prose > * + * { margin-top: var(--s-5); }
.prose h2 { font-size: var(--fs-h3l); line-height: 1.35; letter-spacing: var(--track-head); margin-top: var(--s-7); }
.prose h3 { font-size: var(--fs-h5); line-height: 1.45; margin-top: var(--s-6); }
.prose ul, .prose ol { padding-left: 1.4em; }
.prose li + li { margin-top: var(--s-2); }
.prose a { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; text-decoration-color: color-mix(in oklch, currentColor 55%, transparent); }
.prose blockquote { padding: var(--s-4) var(--s-5); border-radius: var(--r-md); background: var(--paper); box-shadow: inset 0 0 0 1px var(--paper-line); color: var(--ink); font-size: var(--fs-h4); line-height: 1.8; }
.prose blockquote cite { display: block; margin-top: var(--s-2); font-size: var(--fs-sm); color: var(--ink-3); font-style: normal; }
.prose code { font-family: var(--font-mono); font-size: 0.88em; padding: 2px 6px; border-radius: 6px; background: var(--bg-muted); }
.prose pre { position: relative; font-family: var(--font-mono); font-size: var(--fs-sm); line-height: 1.75; padding: var(--s-4) var(--s-5); border-radius: var(--r-md); background: var(--bg-muted); overflow-x: auto; }
.prose pre code { padding: 0; background: none; font-size: inherit; }
.prose figure img { border-radius: var(--r-md); box-shadow: var(--sh-1); }
.prose figcaption { margin-top: var(--s-2); font-size: var(--fs-xs); color: var(--ink-3); }
.code-head { display: flex; justify-content: space-between; align-items: center; font-size: var(--fs-xs); color: var(--ink-3); margin-bottom: calc(var(--s-2) * -1); }

/* ===== 20 顶栏与巨型菜单 ===== */
.site-nav { position: sticky; top: 0; z-index: 50; background: oklch(99.2% 0.003 260 / 0.78);
  -webkit-backdrop-filter: saturate(1.8) blur(20px); backdrop-filter: saturate(1.8) blur(20px); border-bottom: 1px solid oklch(25% 0.03 262 / 0.06); }
.nav-bar { display: flex; align-items: center; gap: var(--s-6); height: var(--nav-h); }
.brand { display: inline-flex; align-items: center; gap: var(--s-2); color: var(--ink); text-decoration: none; flex: none; }
.brand:hover { text-decoration: none; }
.brand__mark { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 9px; background: var(--brand); color: var(--on-brand); font-weight: var(--fw-bold); font-size: var(--fs-body-lg); position: relative; overflow: hidden; }
.brand__mark::after { content: ""; position: absolute; right: 4px; top: 4px; width: 6px; height: 6px; border-radius: 50%; background: var(--grad-ai); box-shadow: 0 0 0 1.5px var(--brand); }
.brand__name { font-size: var(--fs-h5); font-weight: var(--fw-bold); letter-spacing: 0.02em; }
.brand__tag { font-size: var(--fs-xs); color: var(--ink-3); padding-left: var(--s-2); border-left: 1px solid var(--line); line-height: 1.2; }
.nav-links { display: flex; align-items: center; gap: var(--s-1); list-style: none; margin: 0; padding: 0; }
.nav-link { display: inline-flex; align-items: center; gap: 2px; height: 40px; padding: 0 var(--s-3); border: 0; border-radius: var(--r-xs); background: transparent; color: var(--ink); font-size: var(--fs-ui); text-decoration: none; transition: background-color var(--dur-1); }
.nav-link:hover { background: oklch(25% 0.03 262 / 0.05); text-decoration: none; }
.nav-link .icon { width: 14px; height: 14px; color: var(--ink-3); transition: transform var(--dur-2) var(--ease-out); }
.nav-link[aria-expanded="true"] { background: var(--brand-soft); color: var(--brand-ink); }
.nav-link[aria-expanded="true"] .icon { transform: rotate(180deg); color: var(--brand-ink); }
.nav-link[aria-current="page"] { color: var(--brand-ink); font-weight: var(--fw-semi); }
.nav-actions { margin-left: auto; display: flex; align-items: center; gap: var(--s-2); }
.nav-actions .nav-login { color: var(--ink-2); font-size: var(--fs-ui); padding: 0 var(--s-3); height: 40px; display: inline-flex; align-items: center; border-radius: var(--r-xs); }
.menu-btn { display: none; width: var(--hit); height: var(--hit); border: 0; border-radius: var(--r-sm); background: transparent; color: var(--ink); place-items: center; }
.mega { position: absolute; left: 0; right: 0; top: 100%; z-index: 49; background: var(--surface); box-shadow: var(--sh-pop); border-top: 1px solid var(--line); }
.mega[hidden] { display: none; }
.mega__inner { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: var(--s-6); padding-block: var(--s-6); }
.mega__inner--two { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 360px; }
.mega__inner--narrow { grid-template-columns: minmax(0, 560px) 360px; justify-content: start; }
.mega__col-title { font-size: var(--fs-xs); color: var(--ink-3); font-weight: var(--fw-semi); margin-bottom: var(--s-3); }
.mega__tabs { display: flex; gap: var(--s-1); margin-bottom: var(--s-4); }
.mega__tab { min-height: 36px; padding: 0 var(--s-4); border: 0; border-radius: var(--r-pill); background: transparent; color: var(--ink-2); font-size: var(--fs-sm); }
.mega__tab[aria-selected="true"] { background: var(--brand-soft); color: var(--brand-ink); font-weight: var(--fw-semi); }
.mega__search { display: flex; align-items: center; gap: var(--s-2); height: 40px; padding: 0 var(--s-3); border-radius: var(--r-sm); background: var(--bg-subtle); box-shadow: inset 0 0 0 1px var(--line); color: var(--ink-3); margin-bottom: var(--s-4); }
.mega__search input { border: 0; outline: 0; background: transparent; flex: 1; min-width: 0; font-size: var(--fs-sm); color: var(--ink); }
.mega__search:focus-within { box-shadow: inset 0 0 0 1.5px var(--brand); }
.mega__cats { list-style: none; padding: 0; margin: 0; display: grid; gap: 2px; }
.mega__cats a, .mega__cats button { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 40px; padding: 0 var(--s-3); border: 0; border-radius: var(--r-xs); background: transparent; color: var(--ink-2); font-size: var(--fs-ui); text-align: left; }
.mega__cats a:hover, .mega__cats button:hover { background: var(--bg-subtle); color: var(--ink); text-decoration: none; }
.mega__cats [aria-current="true"] { background: var(--brand-soft); color: var(--brand-ink); font-weight: var(--fw-semi); }
.mega__cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-4); }
.mega-card { display: grid; grid-template-rows: 132px auto; border-radius: var(--r-md); overflow: hidden; background: var(--surface); box-shadow: var(--sh-1); color: var(--ink); text-decoration: none; transition: box-shadow var(--dur-2) var(--ease-out), transform var(--dur-2) var(--ease-out); }
.mega-card:hover { text-decoration: none; box-shadow: var(--sh-2-hover); }
@media (hover: hover) and (prefers-reduced-motion: no-preference) { .mega-card:hover { transform: translateY(-2px); } }
.mega-card__media { position: relative; overflow: hidden; background: var(--bg-subtle); }
.mega-card__media img { position: absolute; left: 0; top: 0; width: var(--shot-w, 100%); max-width: none; transform: translate(var(--shot-x, 0), var(--shot-y, 0)); }
.mega-card__body { padding: var(--s-4); display: grid; gap: var(--s-1); }
.mega-card__name { display: flex; align-items: center; gap: var(--s-2); font-weight: var(--fw-semi); font-size: var(--fs-ui); }
.mega-card__desc { font-size: var(--fs-sm); color: var(--ink-2); line-height: 1.55; }
.mega-card__go { margin-top: var(--s-1); font-size: var(--fs-sm); color: var(--brand-ink); font-weight: var(--fw-semi); }
.mega-card--custom { background: linear-gradient(160deg, var(--brand-soft), var(--surface) 75%); }
.mega-card--custom .mega-card__media { background: transparent; display: grid; place-items: center; }
.mega__links { list-style: none; padding: 0; margin: 0; display: grid; gap: 2px; }
.mega__links a { display: grid; grid-template-columns: 36px 1fr; gap: 2px var(--s-3); align-items: center; padding: var(--s-2) var(--s-3); border-radius: var(--r-sm); color: var(--ink); text-decoration: none; }
.mega__links a:hover { background: var(--bg-subtle); text-decoration: none; }
.mega__links .card__icon { width: 36px; height: 36px; grid-row: span 2; border-radius: 10px; }
.mega__links .card__icon .icon { width: 18px; height: 18px; }
.mega__links b { font-weight: var(--fw-semi); font-size: var(--fs-ui); }
.mega__links small { font-size: var(--fs-xs); color: var(--ink-3); grid-column: 2; }
.mega__foot { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; padding-top: var(--s-4); border-top: 1px solid var(--line); font-size: var(--fs-sm); color: var(--ink-3); }
.mega__feature { align-self: start; border-radius: var(--r-md); padding: var(--s-5); }
.nav-scrim { position: fixed; inset: var(--nav-h) 0 0 0; z-index: 40; background: var(--scrim); }
.nav-scrim[hidden] { display: none; }

/* ===== 21 手机菜单 ===== */
.mobile-menu { position: fixed; inset: 0; z-index: 60; background: var(--surface); display: flex; flex-direction: column; }
.mobile-menu[hidden] { display: none; }
.mobile-menu__head { display: flex; align-items: center; justify-content: space-between; height: var(--nav-h); padding: 0 var(--s-4); border-bottom: 1px solid var(--line); flex: none; }
.mobile-menu__body { flex: 1; overflow-y: auto; overscroll-behavior: contain; padding: var(--s-2) var(--s-4) var(--s-5); }
.mobile-menu details { border-bottom: 1px solid var(--line); }
.mobile-menu summary, .mobile-menu__link { list-style: none; display: flex; align-items: center; justify-content: space-between; min-height: 56px; font-size: var(--fs-body-lg); font-weight: var(--fw-semi); color: var(--ink); cursor: pointer; text-decoration: none; }
.mobile-menu summary::-webkit-details-marker { display: none; }
.mobile-menu details[open] summary .icon { transform: rotate(180deg); }
.mobile-menu__link { border-bottom: 1px solid var(--line); }
.mobile-menu__sub { list-style: none; padding: 0 0 var(--s-3); margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-2); }
.mobile-menu__sub a { display: flex; align-items: center; gap: var(--s-2); min-height: var(--hit); padding: 0 var(--s-3); border-radius: var(--r-sm); background: var(--bg-subtle); color: var(--ink); font-size: var(--fs-ui); text-decoration: none; }
.mobile-menu__sub .icon { width: 18px; height: 18px; color: var(--brand); }
.mobile-menu__foot { flex: none; padding: var(--s-3) var(--s-4) calc(var(--s-3) + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); display: grid; grid-template-columns: auto 1fr; gap: var(--s-3); align-items: center; box-shadow: var(--sh-up); }
.fab-consult { position: fixed; right: var(--s-4); bottom: calc(var(--s-4) + env(safe-area-inset-bottom)); z-index: 45; display: none; align-items: center; gap: var(--s-2); min-height: 48px; padding: 0 var(--s-5); border-radius: var(--r-pill); background: var(--brand); color: var(--on-brand); font-weight: var(--fw-semi); box-shadow: 0 10px 28px -8px oklch(50% 0.21 263 / 0.6); text-decoration: none; transition: opacity var(--dur-2), transform var(--dur-2) var(--ease-out); }
.fab-consult:hover { text-decoration: none; }
.fab-consult.is-hidden { opacity: 0; transform: translateY(16px); pointer-events: none; visibility: hidden; }

/* ===== 22 页脚（浅色） ===== */
.site-footer { background: var(--bg-subtle); border-top: 1px solid var(--line); padding-top: var(--s-6); font-size: var(--fs-sm); color: var(--ink-2); }
.footer-grid { display: grid; grid-template-columns: 1.6fr repeat(5, minmax(0, 1fr)); gap: var(--s-6); }
.footer-brand p { margin-top: var(--s-3); line-height: 1.7; max-width: 300px; }
.footer-contact { margin-top: var(--s-4); display: grid; gap: var(--s-1); color: var(--ink-3); }
.footer-col h2 { font-size: var(--fs-sm); font-weight: var(--fw-semi); color: var(--ink); margin-bottom: var(--s-3); }
.footer-col ul { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--s-1); }
.footer-col a { color: var(--ink-2); display: inline-block; padding-block: 3px; }
.footer-col a:hover { color: var(--ink); }
.footer-bottom { margin-top: var(--s-5); padding-block: var(--s-4); border-top: 1px solid var(--line); display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-5); justify-content: space-between; align-items: center; color: var(--ink-3); font-size: var(--fs-xs); }
.footer-bottom__legal { display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-4); }
.footer-bottom__legal a { display: inline-flex; align-items: center; min-height: 32px; }
.footer-mark { text-align: center; padding: var(--s-3) 0 var(--s-5); font-size: var(--fs-xs); color: var(--ink-3); }
.footer-mark a { color: var(--ink-3); }

/* ===== 23 入场与动效（全部只在允许动效时启用） ===== */
@media (prefers-reduced-motion: no-preference) {
  .ai-frame.is-running::before, .ai-frame.is-running::after { animation: spin-ang var(--dur-spin) linear infinite; }
  .shimmer.is-on {
    background: linear-gradient(90deg, var(--ink-3) 30%, var(--ink) 50%, var(--ink-3) 70%) 0 0 / 200% 100%;
    -webkit-background-clip: text; background-clip: text; color: transparent; animation: shimmer var(--dur-shimmer) linear infinite;
  }
  .caret.is-blink { animation: blink var(--dur-blink) steps(1) infinite; }
  .live-dot::after { animation: pulse var(--dur-pulse) var(--ease-out) infinite; }
  .aurora.is-live .aurora__ribbon--1 { animation: drift-1 var(--dur-ribbon-1) ease-in-out infinite; }
  .aurora.is-live .aurora__ribbon--2 { animation: drift-2 var(--dur-ribbon-2) ease-in-out infinite; }
  .aurora.is-live .aurora__ribbon--3 { animation: drift-1 var(--dur-ribbon-3) ease-in-out infinite reverse; }
  .flow.is-live { animation: flow var(--dur-flow) linear infinite; }
  .flow-dot.is-live { animation: flow-dot 3.2s var(--ease-inout) infinite; }
  .stamp.is-press { animation: stamp-in 420ms var(--ease-out) both; }
  .field-chip.is-pop { animation: pop 320ms var(--ease-out) both; }
  .marquee.is-live .marquee__track { animation: marquee var(--dur-marquee) linear infinite; }
  .marquee:hover .marquee__track, .marquee:focus-within .marquee__track { animation-play-state: paused; }
  .term__line.is-pending { animation: shimmer var(--dur-shimmer) linear infinite; }
  .js-reveal [data-reveal] { opacity: 0; transform: translateY(var(--rise)); transition: opacity var(--dur-enter) var(--ease-out), transform var(--dur-enter) var(--ease-out); transition-delay: calc(var(--i, 0) * var(--stagger)); }
  .js-reveal [data-reveal].is-in { opacity: 1; transform: none; }
  .hero-enter .hero-title { animation: title-sweep 900ms var(--ease-out) both; }
  .agent-steps li[data-state="run"] .st { animation: spin 0.9s linear infinite; }
  .agent-steps li[data-state="run"] .lbl { background: linear-gradient(90deg, var(--ink-3) 30%, var(--ink) 50%, var(--ink-3) 70%) 0 0 / 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: shimmer var(--dur-shimmer) linear infinite; }
}
@keyframes spin-ang { to { --ang: 570deg; } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes shimmer { to { background-position: -200% 0; } }
@keyframes blink { 50% { opacity: 0; } }
@keyframes pulse { 0% { transform: scale(1); opacity: 0.55; } 100% { transform: scale(3); opacity: 0; } }
@keyframes drift-1 { 0%, 100% { transform: translate3d(0, 0, 0) rotate(-18deg) scale(1); } 50% { transform: translate3d(-5%, 4%, 0) rotate(-14deg) scale(1.08); } }
@keyframes drift-2 { 0%, 100% { transform: translate3d(0, 0, 0) rotate(-20deg); } 50% { transform: translate3d(4%, -4%, 0) rotate(-15deg) scale(1.05); } }
@keyframes flow { to { stroke-dashoffset: -56; } }
@keyframes flow-dot { 0% { offset-distance: 0%; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { offset-distance: 100%; opacity: 0; } }
@keyframes stamp-in { 0% { opacity: 0; transform: rotate(-12deg) scale(1.6); } 60% { opacity: 1; transform: rotate(-12deg) scale(0.94); } 100% { opacity: 1; transform: rotate(-12deg) scale(1); } }
@keyframes pop { 0% { transform: scale(0.96); } 60% { transform: scale(1.02); } 100% { transform: scale(1); } }
@keyframes marquee { to { transform: translateX(-50%); } }
@keyframes title-sweep { from { opacity: 0; transform: translateY(12px); filter: blur(4px); } to { opacity: 1; transform: none; filter: none; } }

/* 跑马灯（全站最多一处） */
.marquee { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, var(--ink) 10%, var(--ink) 90%, transparent); mask-image: linear-gradient(90deg, transparent, var(--ink) 10%, var(--ink) 90%, transparent); }
.marquee__track { display: flex; gap: var(--s-2); width: max-content; }
.marquee__track > * { flex: none; }

/* 降低透明度偏好：玻璃改实底 */
@media (prefers-reduced-transparency: reduce) {
  .card--glass, .site-nav { background: var(--surface); -webkit-backdrop-filter: none; backdrop-filter: none; }
}

/* ===== 24 手机适配（≤ 1080 平板、≤ 760 手机） ===== */
@media (max-width: 1080px) {
  :root { --gutter: 24px; --fs-hero: 64px; --fs-display: 56px; --fs-h1: 44px; --fs-h2: 34px; }
  .nav-links, .nav-actions .nav-login, .brand__tag { display: none; }
  .menu-btn { display: grid; }
  .nav-actions { gap: var(--s-1); }
  .footer-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .footer-brand { grid-column: 1 / -1; }
  .article-layout { grid-template-columns: minmax(0, 1fr); }
  .article-layout .toc { position: static; }
}
@media (max-width: 760px) {
  :root { --gutter: 16px; --fs-hero: 42px; --stage-h: 420px; --fs-display: 40px; --fs-h1: 34px; --fs-h2: 28px; --fs-h3: 21px; --fs-lead: 17px; --fs-stat: 34px; --nav-h: 56px; --grid-cell: 32px; }
  .section { padding-block: var(--s-8); }
  .section--tight { padding-block: var(--s-7); }
  .sec-head { margin-bottom: var(--s-6); }
  .sec-head--row { display: block; }
  .grid-12, .bento { grid-template-columns: minmax(0, 1fr); gap: var(--s-4); }
  .grid-12 > *, .bento > * { grid-column: 1 / -1 !important; grid-row: auto !important; }
  .card, .bento__cell { padding: var(--s-5); }
  .nav-actions .btn--soft { display: none; }
  .steps__item { display: grid; }
  .steps__desc { grid-column: 2; }
  .ai-run { padding: var(--s-4); }
  .ai-run__body { grid-template-columns: minmax(0, 1fr); gap: var(--s-3); }
  .ai-run__rail { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-1); }
  .ai-run__rail::before { left: 12%; right: 12%; top: 12px; bottom: auto; width: auto; height: 2px; }
  .ai-run__rail::after { left: 12%; top: 12px; height: 2px; width: calc(76% * var(--p, 1)); background: var(--grad-ai); transition: width 500ms var(--ease-out); }
  .ai-run__rail li { flex-direction: column; gap: var(--s-1); min-height: 0; font-size: var(--fs-xs); text-align: center; }
  .ai-run__calc .stamp { right: var(--s-2); }
  .ai-run__fields { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .ai-run__label span + span { display: none; }
  .term { font-size: var(--fs-xs); padding-right: 76px; }
  .term__line { white-space: pre-wrap; }
  .ai-run__calc .stamp { width: 64px; height: 64px; margin-top: -32px; border-width: 2px; box-shadow: inset 0 0 0 3px var(--surface), inset 0 0 0 4px currentColor; }
  .ai-run__calc .stamp__top { font-size: var(--fs-mark); }
  .ai-run__foot { display: grid; gap: var(--s-1); }
  .steps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-4) var(--s-3); }
  .steps::before { display: none; }
  .steps__item { grid-template-columns: 36px 1fr; column-gap: var(--s-3); }
  .steps__num { width: 36px; height: 36px; font-size: var(--fs-sm); }
  .steps__title { margin-top: var(--s-1); font-size: var(--fs-ui); }
  .steps__desc { font-size: var(--fs-xs); }
  .lead-form .between { flex-wrap: wrap; }
  .lead-form .between .btn { width: 100%; }
  .field-chip { flex-direction: column; align-items: flex-start; gap: var(--s-1); }
  .faq--cols, .form-grid { grid-template-columns: minmax(0, 1fr); }
  .faq summary { font-size: var(--fs-body); }
  .crumbs a, .crumbs [aria-current="page"] { display: inline-flex; align-items: center; min-height: var(--hit); }
  .crumbs a { min-width: var(--hit); justify-content: center; }
  .crumbs li:last-child { min-width: 0; flex: 1 1 0; }   /* 末级就是页面标题：手机上只占一行、超出省略，不另起一行 */
  .crumbs [aria-current="page"] { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: var(--hit); }
  .footer-bottom__legal a { min-height: var(--hit); }
  .pager a, .pager span { min-width: var(--hit); height: var(--hit); }
  .chip, .lead-form__examples .chip, .pill, .btn--sm, .brand, .toc a { min-height: var(--hit); }
  .toc a { display: flex; align-items: center; }
  .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-5); }
  .footer-col a { min-height: var(--hit); display: inline-flex; align-items: center; padding-block: 0; }
  .footer-col ul { gap: 0; }
  .footer-bottom { flex-direction: column; align-items: flex-start; }
  .fab-consult { display: inline-flex; }
  .input, .select, .textarea, .nf-search__input, .mega__search input, .searchbar input, .ask__input { font-size: 16px; } /* iOS 聚焦不放大的硬下限，固定 16px */
  .table--stack td { display: grid; grid-template-columns: minmax(5em, auto) minmax(0, 1fr); text-align: start; }
  .sec-head--center { text-align: start; }
  .sec-head--center .sec-head__desc { margin-inline: 0; }
  .cta-band { padding: var(--s-6) var(--s-5); }
  .cta-band__inner { grid-template-columns: minmax(0, 1fr); }
  .notfound__code { font-size: 96px; }
  .device-fan > :not(.device-fan__c):not(.device-fan__l1):not(.device-fan__r1) { display: none; }
  .device-fan { --fan-step: 88px !important; }
  .table--stack thead { display: none; }
  .table--stack tr { display: block; padding: var(--s-3) var(--s-4); border-bottom: 1px solid var(--line); }
  .table--stack td, .table--stack th[scope="row"] { display: flex; justify-content: space-between; gap: var(--s-4); padding: var(--s-1) 0; border: 0; text-align: right; }
  .table--stack td::before { content: attr(data-label); color: var(--ink-3); text-align: left; flex: none; }
  .table--stack th[scope="row"] { font-size: var(--fs-body); text-align: left; }
  /* 手机端降级：玻璃改实底、光斑减半、持续动画全停（入场一次保留） */
  .card--glass { background: var(--surface); -webkit-backdrop-filter: none; backdrop-filter: none; }
  .aurora__ribbon--3, .aurora__blob--c { display: none; }
  .aurora { opacity: 0.7; }
  .aurora.is-live .aurora__ribbon, .flow.is-live, .marquee.is-live .marquee__track { animation: none !important; }
  .marquee { overflow-x: auto; -webkit-mask-image: none; mask-image: none; }
  .ai-frame::after { opacity: 0.18; filter: blur(12px); }
}

/* ===== 26 首页专用（.home-*，home.html 与 home-alt.html 共用） ===== */
.home-hero { position: relative; overflow: hidden; isolation: isolate; padding-block: var(--s-7) var(--s-7); }
.home-hero__grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 580px) minmax(0, 1fr); gap: var(--s-7); align-items: center; }
.home-hero__copy > * + * { margin-top: var(--s-5); }
.home-hero__copy .lead { max-width: 540px; }
.home-hero__copy .cap-row { margin-top: var(--s-4); }
.home-hero__cta { margin-top: var(--s-6) !important; }
.home-trust { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-5); font-size: var(--fs-sm); color: var(--ink-2); }
.home-trust li { display: inline-flex; align-items: center; gap: var(--s-1); }
.home-trust .icon { width: 16px; height: 16px; color: var(--ok); }
.home-stage { position: relative; height: 520px; }
.home-stage__browser { position: absolute; left: 0; top: var(--s-2); width: 560px; }
.home-stage__browser .device-browser__screen { --ratio: 16 / 10.4; }
.home-stage__phone { position: absolute; right: 0; bottom: 0; z-index: 3; --phone-w: 212px; }
.home-stage__agent { position: absolute; left: calc(var(--s-5) * -1); bottom: var(--s-6); z-index: 4; width: 312px; }
.home-stage__tag { position: absolute; z-index: 4; left: 176px; top: 248px; }
.home-s2 { padding-block: var(--s-7); }
.home-s2 .sec-head { margin-bottom: var(--s-5); }
.sec-head--row .sec-head__desc { max-width: none; }
.home-bento { grid-template-rows: auto auto; }
.home-ai { grid-column: span 8; }
.home-ai .ai-run { height: 100%; display: flex; flex-direction: column; }
.home-ai .ai-run > div[aria-hidden] { display: flex; flex-direction: column; flex: 1; }
.home-ai .ai-run__body { flex: 1; }
.home-ai .ai-run__main { align-content: space-between; }
.home-ai .ai-run__quote { font-size: var(--fs-body-lg); }
.home-ai .field-chip { min-height: 54px; }
.home-ai .field-chip__v { font-size: var(--fs-body); }
.home-ai .term { font-size: var(--fs-ui); }
.home-dev, .home-cap { grid-column: span 4; display: flex; flex-direction: column; }
.home-dev > svg { margin-block: auto; padding-block: var(--s-4); width: 100%; height: auto; }
.home-dev .marquee { margin-top: 0; overflow: visible; -webkit-mask-image: none; mask-image: none; }
.home-dev .marquee__track { flex-wrap: wrap; width: auto; animation: none !important; }
.home-dev .link-more { margin-top: var(--s-2); }
.home-dev > svg text { font-family: var(--font-sans); font-size: var(--fs-xs); fill: var(--ink-2); stroke: none; }
.home-dev > svg .t-ai { fill: var(--ai-ink); font-weight: var(--fw-semi); }
.home-dev > svg .t-strong { fill: var(--ink); font-weight: var(--fw-semi); }
.home-dev .node-ai { stroke: var(--ai-2); stroke-opacity: 0.55; fill: var(--ai-soft); }
.home-dev .node-core { stroke: var(--brand); stroke-opacity: 0.6; fill: var(--brand-soft); }
.home-cap__list { list-style: none; padding: 0; margin: var(--s-4) 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-2); }
.home-cap__list li { display: flex; align-items: center; gap: var(--s-2); min-height: 40px; padding: 0 var(--s-3); border-radius: var(--r-sm); background: var(--bg-subtle); font-size: var(--fs-sm); color: var(--ink); }
.home-cap__list .icon { width: 18px; height: 18px; color: var(--ai-ink); }
.home-cap__off { margin-top: auto; padding-top: var(--s-4); display: flex; align-items: center; justify-content: space-between; gap: var(--s-3); font-size: var(--fs-sm); color: var(--ink-2); }
.home-cap__off span { display: inline-flex; align-items: center; gap: var(--s-2); }
.home-cap__off .icon { width: 16px; height: 16px; color: var(--ok); }
.home-prod { grid-column: span 4; display: grid; grid-template-columns: minmax(0, 1fr) 132px; gap: var(--s-3); padding-bottom: 0; min-height: 244px; padding-top: var(--s-5); }
.home-prod__text { padding-bottom: var(--s-5); display: flex; flex-direction: column; }
.home-prod__text .checks { margin-top: var(--s-3); font-size: var(--fs-sm); }
.home-prod__text .link-more { margin-top: auto; }
.home-prod__media { position: relative; align-self: end; height: 100%; min-height: 220px; }
.home-prod__media .device-phone { position: absolute; left: 0; top: 0; --phone-w: 150px; padding: 6px; border-radius: 28px; }
.home-prod__media .device-phone__screen { border-radius: 22px; }
.home-prod__media .device-phone__island { top: 10px; height: 14px; }
.home-ind { grid-column: span 4; display: flex; flex-direction: column; }
.home-ind .marquee { margin-top: var(--s-4); }
.home-ind .link-more { margin-top: auto; }
.home-s3 { padding-block: var(--s-7) var(--s-8); }
.home-s3__grid { margin-top: var(--s-6); align-items: stretch; }
.home-news { display: flex; flex-direction: column; }
.home-posts { list-style: none; padding: 0; margin: var(--s-4) 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-4); flex: 1; }
.home-posts .post-cover { padding: var(--s-3); }
.home-posts .post-cover__title { font-size: var(--fs-body-lg); }
.home-posts .post-card__title { font-size: var(--fs-ui); }
.news-list { list-style: none; padding: 0; margin: 0; }
.news-list li + li { border-top: 1px solid var(--line); }
.news-list a { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--s-1) var(--s-5); padding: var(--s-3) 0; color: var(--ink); text-decoration: none; }
.news-list a:hover .news-list__title { color: var(--brand-ink); }
.news-list__meta { display: flex; align-items: center; gap: var(--s-2); font-size: var(--fs-xs); color: var(--ink-3); }
.news-list__title { text-wrap: pretty; font-size: var(--fs-body-lg); font-weight: var(--fw-semi); line-height: 1.5; transition: color var(--dur-1); }
.news-list__sum { font-size: var(--fs-sm); color: var(--ink-2); grid-column: 1; }
.news-list time { font-size: var(--fs-xs); color: var(--ink-3); grid-row: 1 / span 3; grid-column: 2; align-self: center; }
/* 首屏方案 B：需求框 + 设备扇形 */
.home-hero--ask { padding-top: var(--s-6); padding-bottom: 0; text-align: center; }
.home-hero--ask .display { font-size: 64px; }
.home-hero--ask .home-hero__copy > * + * { margin-top: var(--s-4); }
.home-hero--ask .home-hero__copy { max-width: 880px; margin-inline: auto; }
.home-hero--ask .lead { margin-inline: auto; max-width: none; font-size: var(--fs-h4); }
.home-hero--ask .home-trust { justify-content: center; }
.home-hero--ask .ask { margin-top: var(--s-5); text-align: left; }
.home-hero--ask .ask__examples { margin-top: var(--s-3); }
.home-fan { position: relative; z-index: 1; margin-top: var(--s-5); height: 192px; overflow: hidden; --fan-h: 440px; --fan-step: 300px;
  -webkit-mask-image: linear-gradient(to bottom, var(--ink) 62%, transparent); mask-image: linear-gradient(to bottom, var(--ink) 62%, transparent); }
.home-fan .device-fan { position: absolute; left: 0; right: 0; top: 0; align-items: flex-start; }
.home-fan .device-fan > * { bottom: auto; top: 0; }
.home-fan .device-fan__c { width: 560px; }
.home-fan .device-fan__l1, .home-fan .device-fan__r1 { top: 28px; }
.home-fan .device-fan__l2, .home-fan .device-fan__r2 { top: 56px; }
@media (max-width: 1080px) {
  .home-hero__grid { grid-template-columns: minmax(0, 1fr); }
  .home-stage { max-width: 640px; }
}
@media (max-width: 760px) {
  .home-hero { padding-block: var(--s-6) var(--s-7); }
  .home-hero__copy > * + * { margin-top: var(--s-4); }
  .home-hero__cta .btn { flex: 1 1 0; padding-inline: var(--s-3); }
  .home-stage { height: 470px; margin-top: var(--s-2); }
  .home-stage__browser { display: none; }
  .home-stage__phone { left: 50%; transform: translateX(-50%); top: 0; bottom: auto; --phone-w: 216px; }
  .home-stage__agent { left: 0; right: 0; width: auto; bottom: 0; }
  .home-stage__tag { display: none; }
  .home-cap__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-dev .marquee { overflow: visible; }
  .home-dev .marquee__track { flex-wrap: wrap; width: auto; }
  .home-prod { grid-template-columns: minmax(0, 1fr) 128px; min-height: 0; }
  .home-prod__media .device-phone { --phone-w: 128px; }
  .home-prod__media { min-height: 230px; }
  .home-prod__text { padding-bottom: var(--s-5); }
  .news-list a { grid-template-columns: minmax(0, 1fr); }
  .news-list time { grid-row: auto; grid-column: 1; }
  .home-fan { height: 250px; margin-top: var(--s-6); }
  .home-hero--ask .display { font-size: var(--fs-display); }
  .home-fan .device-fan__c { display: none; }
  .home-fan .device-fan__l1, .home-fan .device-fan__r1 { top: 12px; --phone-w: 160px !important; }
  .home-fan .device-fan__r1 { z-index: 3; top: 36px; }
  .home-hero--ask .ask__typed, .home-hero--ask .ask__input { font-size: var(--fs-body-lg); }
  .home-hero--ask .ask__input { min-height: 64px; }
  .ask__bar { flex-wrap: wrap; }
  .ask__bar .btn { width: 100%; min-height: var(--ctl-h-lg); }
  .ask__box { padding: var(--s-4); }
  .ask__typed { left: var(--s-4); right: var(--s-4); top: 34px; }
}

/* ===== 27 首页第二轮首屏（.hx-*）：居中巨型标题 + 彩虹光边需求框（全站主符号）+ 房产 AI 录房产品舞台 ===== */
.hx { position: relative; isolation: isolate; overflow: hidden; padding-top: var(--s-5); }
.hx__bg { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.hx__grid { background-image: linear-gradient(to right, var(--line-grid) 1px, transparent 1px), linear-gradient(to bottom, var(--line-grid) 1px, transparent 1px);
  -webkit-mask-image: radial-gradient(70% 56% at 50% 30%, var(--ink) 20%, transparent 78%); mask-image: radial-gradient(70% 56% at 50% 30%, var(--ink) 20%, transparent 78%); }
.hx__aurora .aurora__blob--a { width: 46%; height: 52%; left: -18%; right: auto; top: -12%; opacity: 0.55; }
.hx__aurora .aurora__blob--b { width: 44%; height: 56%; left: auto; right: -16%; top: -8%; opacity: 0.6; }
.hx__aurora .aurora__blob--c { width: 40%; height: 46%; right: 30%; top: 46%; }
.hx__aurora .aurora__ribbon--1 { left: -30%; top: 0; width: 62%; height: 22%; transform: rotate(14deg); opacity: 0.4; }
.hx__aurora .aurora__ribbon--2 { left: 62%; top: -4%; width: 62%; height: 22%; transform: rotate(-16deg); opacity: 0.45; }
.hx__aurora .aurora__ribbon--3 { left: 18%; top: 50%; width: 64%; height: 22%; transform: rotate(-6deg); }
.hx__top { position: relative; text-align: center; }
.hx__title { font-size: var(--fs-hero); line-height: 1.06; letter-spacing: -0.03em; font-weight: var(--fw-bold); }
.hx__lead { margin: var(--s-4) auto 0; font-size: var(--fs-h5); color: var(--ink-2); max-width: 880px; text-wrap: balance; word-break: keep-all; overflow-wrap: anywhere; } /* 只在标点、空格处折行，不把「行业」「小程序」拆开（体检 H-04）；放不下时 anywhere 兜底不溢出 */
.hx__form { margin: var(--s-5) auto 0; max-width: 800px; text-align: left; }
.ask--hero::before { inset: -2px; }
.ask--hero::after { inset: -18px; filter: blur(28px); opacity: 0.6; border-radius: calc(var(--r-xl) + 18px); }
.ask--hero .ask__box { padding: var(--s-4) var(--s-4) var(--s-4) var(--s-5); }
.ask__label { font-size: var(--fs-sm); color: var(--ink-2); font-weight: var(--fw-semi); }
.ask__note { font-size: var(--fs-ui); color: var(--ink-2); display: inline-flex; align-items: center; gap: var(--s-2); }
.ask__note .icon { width: 16px; height: 16px; color: var(--ok); }
.hx__examples { justify-content: center; margin-top: var(--s-4); }
.hx__stage-wrap { position: relative; margin-top: var(--s-6); }
.hx__stage { position: relative; height: var(--stage-h); max-width: var(--container); margin-inline: auto;
  -webkit-mask-image: linear-gradient(to bottom, var(--ink) 66%, transparent 100%); mask-image: linear-gradient(to bottom, var(--ink) 66%, transparent 100%); }
.hx__halo { position: absolute; left: 50%; top: 4%; width: 980px; height: 420px; transform: translateX(-50%); border-radius: 50%; z-index: 0;
  background: conic-gradient(from 200deg in oklch, var(--ai-1), var(--ai-2), var(--ai-3), var(--ai-4), var(--ai-1)); filter: blur(72px); opacity: 0.32; }
.hx__browser { position: absolute; z-index: 1; left: 50%; top: 0; width: 800px; transform: translateX(-50%); }
.hx__browser .device-browser__screen { --ratio: 8 / 5; }
.hx__phone-l { position: absolute; z-index: 2; left: 96px; top: 64px; --phone-w: 224px; }
.hx__phone-r { position: absolute; z-index: 2; right: 72px; top: 72px; --phone-w: 212px; opacity: 0.96; }
.hx__agent { position: absolute; z-index: 4; left: 272px; top: 118px; width: 300px; border-radius: var(--r-lg); }
.hx__agent .agent-steps { background: var(--surface); }
.hx__flow { position: absolute; z-index: 3; left: 0; top: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.hx__ping { fill: var(--ai-2); }
.hx__ping-ring { fill: none; stroke: var(--ai-2); stroke-width: 1.5; transform-box: fill-box; transform-origin: center; }
.hx__tag { position: absolute; z-index: 5; display: inline-flex; align-items: center; gap: var(--s-1); height: 28px; padding: 0 var(--s-3); border-radius: var(--r-pill); background: var(--surface); box-shadow: var(--sh-2); font-size: var(--fs-xs); font-weight: var(--fw-semi); color: var(--ink); white-space: nowrap; }
.hx__tag .spark { width: 13px; height: 13px; color: var(--ai-ink); }
.hx__tag--l { left: 84px; top: 28px; }
.hx__tag--r { right: 84px; top: 16px; }
.hx .hx__trust { list-style: none; margin: 0; padding: var(--s-2) var(--gutter) 0; display: flex; flex-wrap: wrap; justify-content: center; gap: var(--s-1) var(--s-5); font-size: var(--fs-xs); color: var(--ink-2); }
.hx__trust li { display: inline-flex; align-items: center; gap: var(--s-1); }
.hx__trust .icon { width: 14px; height: 14px; color: var(--ok); }
.hx__note { position: relative; margin: 0; padding: var(--s-2) 0 0; text-align: center; font-size: var(--fs-xs); color: var(--ink-3); }
@media (prefers-reduced-motion: no-preference) {
  .hx__ping-ring.is-live { animation: ping 2s var(--ease-out) infinite; }
}
@keyframes ping { 0% { transform: scale(1); opacity: 0.8; } 100% { transform: scale(3.2); opacity: 0; } }
@media (max-width: 1280px) {
  .hx__phone-l { left: 40px; } .hx__phone-r { right: 40px; } .hx__agent { left: 212px; } .hx__tag--l { left: 28px; } .hx__tag--r { right: 28px; }
}
@media (max-width: 1080px) {
  .hx__browser { width: 640px; } .hx__phone-r, .hx__tag--r { display: none; }
}
@media (max-width: 760px) {
  .hx { padding-top: var(--s-6); }
  .hx__title { letter-spacing: -0.02em; }
  .hx__lead { font-size: var(--fs-body); }
  .hx__form { margin-top: var(--s-5); }
  .hx .ask__input { min-height: 88px; }
  .hx .ask__note { font-size: var(--fs-sm); }
  .ask--hero::after { inset: -8px; filter: blur(14px); opacity: 0.35; }
  .hx__stage-wrap { margin-top: var(--s-6); }
  .hx__stage { -webkit-mask-image: linear-gradient(to bottom, var(--ink) 90%, transparent 100%); mask-image: linear-gradient(to bottom, var(--ink) 90%, transparent 100%); }
  .hx__browser, .hx__phone-r, .hx__tag--r, .hx__flow { display: none; }
  .hx__halo { width: 360px; height: 300px; filter: blur(48px); opacity: 0.3; }
  .hx__phone-l { left: 50%; top: 32px; transform: translateX(-50%); --phone-w: 210px; }
  .hx__tag--l { left: 50%; top: 0; transform: translateX(-50%); }
  .hx__agent { left: var(--s-4); right: var(--s-4); top: 200px; width: auto; }
  .hx__phone-l .device-phone__screen { aspect-ratio: 9 / 13; }
  .home-posts { grid-template-columns: minmax(0, 1fr); }
  .home-posts .post-cover { display: none; }
  .home-posts { gap: 0; }
  .home-posts li + li { border-top: 1px solid var(--line); }
  .home-posts .post-card { padding-block: var(--s-3); gap: var(--s-1); }
  .steps__item { row-gap: var(--s-1); }
  .steps__title { margin-top: 0; }
  .hx__examples { display: flex; flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; scrollbar-width: none; margin-inline: calc(var(--gutter) * -1); padding-inline: var(--gutter); -webkit-mask-image: linear-gradient(90deg, var(--ink) 85%, transparent); mask-image: linear-gradient(90deg, var(--ink) 85%, transparent); }
  .hx__examples::-webkit-scrollbar { display: none; }
  .hx__examples > * { flex: none; }
  .hx__trust { justify-content: flex-start; }
  .hx__note { position: static; margin-top: var(--s-2); }
}

/* 第二、三屏第二轮加强 */
.ai-actions { list-style: none; padding: 0; margin: var(--s-4) 0 0; display: flex; flex-wrap: wrap; gap: var(--s-2); }
.ai-action { display: inline-flex; align-items: center; gap: var(--s-2); min-height: 38px; padding: 0 var(--s-4) 0 var(--s-3); border-radius: var(--r-pill); background: var(--bg-subtle); box-shadow: inset 0 0 0 1px var(--line); font-size: var(--fs-sm); color: var(--ink); white-space: nowrap; }
.ai-action .icon { width: 17px; height: 17px; color: var(--ai-ink); }
.ai-action.is-active { border: 1.5px solid transparent; box-shadow: var(--sh-glow); background: linear-gradient(var(--surface), var(--surface)) padding-box, var(--grad-ai) border-box; }
.steps--ai .steps__num { width: 44px; height: 44px; background: linear-gradient(90deg in oklch, var(--brand), var(--ai-2) 50%, var(--ai-3)) 0 0 / 600% 100%; box-shadow: 0 8px 20px -8px oklch(52% 0.23 276 / 0.55); }
.steps--ai .steps__item:nth-child(2) .steps__num { background-position: 20% 0; } .steps--ai .steps__item:nth-child(3) .steps__num { background-position: 40% 0; }
.steps--ai .steps__item:nth-child(4) .steps__num { background-position: 60% 0; } .steps--ai .steps__item:nth-child(5) .steps__num { background-position: 80% 0; } .steps--ai .steps__item:nth-child(6) .steps__num { background-position: 100% 0; }
.steps--ai .steps__num span { color: var(--on-brand); font-size: var(--fs-h5); font-weight: var(--fw-bold); }
.steps--ai::before { top: 21px; border-top: 2px solid; border-image: var(--grad-ai) 1; opacity: 0.55; }
.lead-card { position: relative; overflow: hidden; isolation: isolate; }
.lead-card > .tech-dots { z-index: -1; background-image: radial-gradient(circle, var(--line-grid) 1.4px, transparent 1.8px); -webkit-mask-image: radial-gradient(80% 60% at 100% 0%, var(--ink) 10%, transparent 70%); mask-image: radial-gradient(80% 60% at 100% 0%, var(--ink) 10%, transparent 70%); }


/* ===== 28 第二轮组件（内页首屏、价格、案例、文章封面、搜索筛选、数字条、时间线、团队、联系、做/不做、定义框、常见误解、标签页、放大镜） ===== */
:root {
  /* 资讯栏目色：只用于文章封面和栏目标签的淡底，不当按钮色 */
  --col-tech: oklch(56% 0.15 238);
  --col-ai: var(--ai-3);
  --col-price: oklch(60% 0.14 68);
  --col-industry: oklch(54% 0.1 192);
  --col-company: oklch(50% 0.04 265);
}

/* 28.1 内页首屏 .page-hero：每个内页首屏至少用「网格 + 光斑 + 一处渐变字」，再按变体加一个产品或 AI 画面 */
.page-hero { position: relative; isolation: isolate; overflow: hidden; padding-block: var(--s-6) var(--s-8); }
.page-hero > .tech-grid { background-image: linear-gradient(to right, var(--line-grid) 1px, transparent 1px), linear-gradient(to bottom, var(--line-grid) 1px, transparent 1px); z-index: -1; }
.page-hero > .glow-spot { z-index: -1; right: -6%; top: -30%; width: 640px; height: 520px; }
.page-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--s-7); align-items: center; margin-top: var(--s-6); }
.page-hero__copy > * + * { margin-top: var(--s-4); }
.page-hero__copy .lead { max-width: 560px; }
.page-hero__facts { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: var(--s-2); }
.page-hero__media { position: relative; min-height: 360px; }
.page-hero--news { padding-bottom: var(--s-6); }
.page-hero--news .page-hero__grid { grid-template-columns: minmax(0, 1fr); margin-top: var(--s-4); }
.page-hero--news .h1 { font-size: var(--fs-stat); max-width: 900px; }
.page-hero--about .page-hero__media svg { width: 100%; height: auto; }

/* 28.2 价格卡 .price-card（--featured 推荐款）与套餐对比；数字只写价格页给定的真实价 */
.price-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-5); align-items: stretch; }
.price-card { position: relative; display: flex; flex-direction: column; gap: var(--s-4); padding: var(--s-6); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--sh-2); }
.price-card--featured { border: 1.5px solid transparent; background: linear-gradient(var(--surface), var(--surface)) padding-box, var(--grad-ai) border-box; box-shadow: var(--sh-glow); }
.price-card__badge { position: absolute; top: calc(var(--s-3) * -1); left: var(--s-6); }
.price-card__name { font-size: var(--fs-h4); font-weight: var(--fw-semi); }
.price-card__price { display: flex; align-items: baseline; gap: var(--s-1); flex-wrap: wrap; }
.price-card__num { font-size: var(--fs-stat); line-height: 1; font-weight: var(--fw-bold); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.price-card__unit { font-size: var(--fs-ui); color: var(--ink-2); }
.price-card__extra { font-size: var(--fs-sm); color: var(--ink-2); }
.price-card .checks { margin-top: var(--s-1); }
.price-card .btn { margin-top: auto; }

/* 28.3 案例卡 .case-card 与案例详情头 .case-hero；客户未授权一律用「某连锁中介」类匿名名 */
.case-card { display: grid; grid-template-rows: 180px auto; overflow: hidden; border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--sh-2); color: var(--ink); text-decoration: none; transition: transform var(--dur-2) var(--ease-out), box-shadow var(--dur-2) var(--ease-out); }
.case-card:hover { box-shadow: var(--sh-2-hover); text-decoration: none; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) { .case-card:hover { transform: translateY(-4px); } }
.case-card__media { position: relative; overflow: hidden; background: linear-gradient(160deg, var(--brand-soft), var(--bg-subtle)); }
.case-card__media .device-phone { position: absolute; right: var(--s-5); top: var(--s-4); --phone-w: 140px; padding: 5px; border-radius: 24px; }
.case-card__media .device-phone__screen { border-radius: 20px; }
.case-card__media .device-phone__island { display: none; }
.case-card__body { padding: var(--s-5); display: grid; gap: var(--s-2); }
.case-card__meta { display: flex; flex-wrap: wrap; gap: var(--s-2); }
.case-card__title { font-size: var(--fs-h4); font-weight: var(--fw-semi); line-height: 1.45; text-wrap: pretty; }
.case-card__result { font-size: var(--fs-sm); color: var(--ink-2); }
.case-hero__facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-4); margin-top: var(--s-6); padding: var(--s-5); border-radius: var(--r-md); background: oklch(100% 0 0 / 0.8); box-shadow: var(--sh-1); }
.case-hero__facts dt { font-size: var(--fs-xs); color: var(--ink-3); }
.case-hero__facts dd { margin: var(--s-1) 0 0; font-weight: var(--fw-semi); }

/* 28.4 文章卡 .post-card + 模板化封面 .post-cover（品牌浅底 + 栏目色光斑 + 短标题，由代码按栏目生成，不用杂图） */
.post-card { display: grid; gap: var(--s-3); color: var(--ink); text-decoration: none; }
.post-card:hover { text-decoration: none; }
.post-card:hover .post-card__title { color: var(--brand-ink); }
.post-cover { --col: var(--col-tech); position: relative; overflow: hidden; isolation: isolate; aspect-ratio: 16 / 9; border-radius: var(--r-md); padding: var(--s-5); display: flex; flex-direction: column; justify-content: space-between;
  background: radial-gradient(70% 90% at 100% 0%, color-mix(in oklch, var(--col) 34%, transparent), transparent 70%), radial-gradient(60% 70% at 0% 100%, color-mix(in oklch, var(--ai-2) 14%, transparent), transparent 70%), var(--bg-subtle); box-shadow: inset 0 0 0 1px var(--line); }
.post-cover::before { content: ""; position: absolute; inset: 0; z-index: -1; background-image: radial-gradient(circle, var(--line-faint) 1.2px, transparent 1.6px); background-size: var(--dot-gap) var(--dot-gap); }
.post-cover__col { align-self: flex-start; display: inline-flex; align-items: center; gap: var(--s-1); height: 24px; padding: 0 var(--s-2); border-radius: var(--r-pill); font-size: var(--fs-xs); font-weight: var(--fw-semi); color: var(--ink); background: oklch(100% 0 0 / 0.75); }
.post-cover__col::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--col); }
.post-cover__title { font-size: var(--fs-h5); line-height: 1.35; font-weight: var(--fw-bold); letter-spacing: -0.01em; color: var(--ink); max-width: 18em; text-wrap: balance; }
.post-cover--tech { --col: var(--col-tech); } .post-cover--ai { --col: var(--col-ai); } .post-cover--price { --col: var(--col-price); } .post-cover--industry { --col: var(--col-industry); } .post-cover--company { --col: var(--col-company); }
.post-card__meta { display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-3); font-size: var(--fs-xs); color: var(--ink-3); }
.post-card__title { font-size: var(--fs-h4); font-weight: var(--fw-semi); line-height: 1.5; text-wrap: pretty; transition: color var(--dur-1); }
.post-card__sum { font-size: var(--fs-sm); color: var(--ink-2); line-height: 1.65; }

/* 28.5 搜索与筛选条 .filter-bar（左筛选胶囊，右搜索框；筛选结果页 noindex） */
.filter-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s-4); padding: var(--s-3) var(--s-4); border-radius: var(--r-md); background: var(--surface); box-shadow: var(--sh-1); }
.searchbar { display: flex; align-items: center; gap: var(--s-2); min-width: 280px; min-height: var(--ctl-h); padding: 0 var(--s-2) 0 var(--s-4); border-radius: var(--r-pill); background: var(--bg-subtle); box-shadow: inset 0 0 0 1px var(--line); color: var(--ink-3); }
.searchbar:focus-within { box-shadow: inset 0 0 0 1.5px var(--brand), 0 0 0 3px var(--brand-soft-2); }
.searchbar input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font-size: var(--fs-ui); color: var(--ink); min-height: 40px; }
.searchbar input::placeholder { color: var(--ink-3); }

/* 28.6 数字条 .stat-strip：只放能证实的事实（产品数、端数、步骤数、日期），每项带来源说明；不放客户数、营收 */
.stat-strip { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--sh-1); }
.stat-strip li { padding: var(--s-5); display: grid; gap: var(--s-1); }
.stat-strip li + li { box-shadow: inset 1px 0 0 var(--line); }
.stat-strip__num { font-size: 36px; line-height: 1.1; font-weight: var(--fw-bold); font-variant-numeric: tabular-nums; letter-spacing: -0.02em; }
.stat-strip__label { font-size: var(--fs-ui); color: var(--ink); font-weight: var(--fw-medium); }
.stat-strip__src { font-size: var(--fs-xs); color: var(--ink-3); }

/* 28.7 时间线 .timeline、团队占位卡 .team-card、联系方式块 .contact-block */
.timeline { list-style: none; padding: 0; margin: 0; position: relative; display: grid; gap: var(--s-5); }
.timeline::before { content: ""; position: absolute; left: 7px; top: 8px; bottom: 8px; width: 2px; background: linear-gradient(to bottom in oklch, var(--ai-1), var(--ai-3)); opacity: 0.4; border-radius: 2px; }
.timeline li { position: relative; padding-left: var(--s-6); }
.timeline li::before { content: ""; position: absolute; left: 0; top: 6px; width: 16px; height: 16px; border-radius: 50%; background: var(--surface); box-shadow: inset 0 0 0 3px var(--ai-2); }
.timeline time { font-size: var(--fs-sm); color: var(--ai-ink); font-weight: var(--fw-semi); }
.timeline__title { font-weight: var(--fw-semi); margin-top: var(--s-1); }
.timeline__desc { font-size: var(--fs-sm); color: var(--ink-2); margin-top: var(--s-1); }
.team-card { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: var(--s-4); align-items: center; padding: var(--s-5); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--sh-1); }
.team-card__avatar { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--brand-soft); color: var(--brand-ink); font-weight: var(--fw-bold); font-size: var(--fs-h5); }
.team-card__name { font-weight: var(--fw-semi); }
.team-card__role { font-size: var(--fs-sm); color: var(--ink-2); }
.contact-block { display: grid; gap: var(--s-2); }
.contact-block__row { display: grid; grid-template-columns: 40px 88px minmax(0, 1fr); align-items: center; gap: var(--s-3); min-height: 56px; padding: 0 var(--s-4); border-radius: var(--r-md); background: var(--surface); box-shadow: var(--sh-1); }
.contact-block__row .card__icon { width: 40px; height: 40px; }
.contact-block__k { font-size: var(--fs-sm); color: var(--ink-3); }
.contact-block__v { font-weight: var(--fw-semi); }

/* 28.8 做 / 不做 .dodont、定义框 .define-box、常见误解 .myth（事实页、AI 方案页） */
.dodont { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-5); }
.dodont__col { padding: var(--s-5) var(--s-6); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--sh-1); }
.dodont__col h3 { display: flex; align-items: center; gap: var(--s-2); font-size: var(--fs-h4); margin-bottom: var(--s-3); }
.dodont__col ul { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--s-2); font-size: var(--fs-ui); color: var(--ink-2); }
.dodont__col li { display: flex; gap: var(--s-2); }
.dodont__col li .icon { width: 18px; height: 18px; margin-top: 3px; flex: none; }
.dodont__col--do h3 .icon, .dodont__col--do li .icon { color: var(--ok); }
.dodont__col--dont h3 .icon, .dodont__col--dont li .icon { color: var(--ink-3); }
.define-box { position: relative; padding: var(--s-5) var(--s-6); border-radius: var(--r-lg); border: 1px solid transparent; background: linear-gradient(var(--surface), var(--surface)) padding-box, var(--grad-edge) border-box; box-shadow: var(--sh-2); }
.define-box__term { display: flex; align-items: baseline; gap: var(--s-3); flex-wrap: wrap; }
.define-box__term dfn { font-style: normal; font-size: var(--fs-h3); font-weight: var(--fw-bold); }
.define-box__alias { font-size: var(--fs-sm); color: var(--ink-3); }
.define-box p { margin-top: var(--s-2); font-size: var(--fs-body-lg); line-height: 1.8; }
.myth { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--s-3); }
.myth li { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: var(--s-5); padding: var(--s-4) var(--s-5); border-radius: var(--r-md); background: var(--surface); box-shadow: var(--sh-1); }
.myth__wrong { color: var(--ink-2); font-size: var(--fs-ui); }
.myth__wrong b, .myth__right b { display: block; font-size: var(--fs-xs); color: var(--ink-3); font-weight: var(--fw-semi); margin-bottom: var(--s-1); }
.myth__right { font-size: var(--fs-ui); color: var(--ink); }
.myth__right cite { display: block; margin-top: var(--s-1); font-size: var(--fs-xs); color: var(--ink-3); font-style: normal; }

/* 28.9 页内标签页 .tabs（[data-tabs]，role=tablist；方向键切换） */
.tabs__list { display: inline-flex; gap: var(--s-1); padding: var(--s-1); border-radius: var(--r-pill); background: var(--bg-muted); max-width: 100%; overflow-x: auto; scrollbar-width: none; }
.tabs__list::-webkit-scrollbar { display: none; }
.tabs__tab { flex: none; white-space: nowrap; }
.tabs__tab { min-height: 40px; padding: 0 var(--s-5); border: 0; border-radius: var(--r-pill); background: transparent; color: var(--ink-2); font-size: var(--fs-ui); transition: background-color var(--dur-1), color var(--dur-1); }
.tabs__tab[aria-selected="true"] { background: var(--surface); color: var(--ink); font-weight: var(--fw-semi); box-shadow: var(--sh-1); }
.tabs__panel { margin-top: var(--s-5); }

/* 28.10 截图放大镜 .shot-zoom：设备框里的字渲染后 < 11px 时，用它把关键一块放大到能读 */
.shot-zoom { position: absolute; z-index: 5; width: var(--zoom-w, 260px); height: var(--zoom-h, 150px); overflow: hidden; border-radius: var(--r-md); border: 1.5px solid transparent;
  background: linear-gradient(var(--surface), var(--surface)) padding-box, var(--grad-ai) border-box; box-shadow: var(--sh-glow), var(--sh-3); }
.shot-zoom > img { position: absolute; left: 0; top: 0; width: var(--shot-w, 200%); max-width: none; transform: translate(var(--shot-x, 0), var(--shot-y, 0)); }
.shot-zoom__label { position: absolute; left: var(--s-2); bottom: var(--s-2); z-index: 1; }

@media (max-width: 1080px) {
  .page-hero__grid { grid-template-columns: minmax(0, 1fr); }
  .price-grid { grid-template-columns: minmax(0, 1fr); max-width: 520px; }
}
@media (max-width: 760px) {
  .page-hero { padding-block: var(--s-5) var(--s-7); }
  .page-hero__media { min-height: 0; }
  .page-hero--news .h1 { font-size: var(--fs-h1); }
  .case-hero__facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stat-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stat-strip li + li { box-shadow: none; }
  .stat-strip li:nth-child(n+3) { box-shadow: inset 0 1px 0 var(--line); }
  .dodont, .myth li { grid-template-columns: minmax(0, 1fr); }
  .contact-block__row { grid-template-columns: 40px minmax(0, 1fr); padding-block: var(--s-3); }
  .contact-block__row .contact-block__v { grid-column: 2; }
  .filter-bar { padding: var(--s-3); }
  .searchbar { min-width: 0; width: 100%; }
  .shot-zoom { display: none; }
  .tabs__tab { min-height: var(--hit); }
}

/* ===== 29 预览提示 .preview-toast（第四轮：设计稿预览里点到还没画的页面时出现；正式站不会出现） ===== */
.preview-toast { position: fixed; left: 50%; bottom: calc(var(--s-6) + env(safe-area-inset-bottom)); z-index: 90; max-width: calc(100vw - var(--s-6)); transform: translate(-50%, var(--s-4)); padding: var(--s-3) var(--s-5); border-radius: var(--r-pill); background: var(--surface); color: var(--ink); font-size: var(--fs-sm); box-shadow: var(--sh-pop); opacity: 0; pointer-events: none; transition: opacity var(--dur-2) var(--ease-out), transform var(--dur-2) var(--ease-out); }
.preview-toast.is-on { opacity: 1; transform: translate(-50%, 0); }
@media (max-width: 760px) {
  .skip-link { display: inline-flex; align-items: center; min-height: var(--hit); }
}

/* ===== 30 产品卡 .prod-card（规模化展示：首页、巨型菜单、产品中心共用同一张卡；字段来自产品清单，见 README「产品规模化展示规则」） =====
   长卡 .prod-card（产品中心、首页）：图标、名称、新、一句话、行业、终端、含 AI、主入口（免费试用 / 预约演示）；可选截图 __media
   短卡 .prod-card--short（巨型菜单、手机端）：图标、名称、新、含 AI、一句话
   占位卡 .prod-card--placeholder：只用于规模示意稿，虚线边 + 「规模示意」角标 */
.prod-card { position: relative; display: grid; gap: var(--s-3); align-content: start; padding: var(--s-5); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--sh-2); color: var(--ink); text-decoration: none; transition: transform var(--dur-2) var(--ease-out), box-shadow var(--dur-2) var(--ease-out); }
a.prod-card:hover { box-shadow: var(--sh-2-hover); text-decoration: none; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) { a.prod-card:hover { transform: translateY(-3px); } }
.prod-card__head { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: var(--s-3); align-items: center; }
.prod-card__name { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-1) var(--s-2); font-size: var(--fs-body); font-weight: var(--fw-semi); line-height: 1.4; }
.prod-card__new { display: inline-flex; align-items: center; height: 20px; padding: 0 var(--s-2); border-radius: var(--r-pill); background: var(--ok-soft); color: var(--ok); font-size: var(--fs-xs); font-weight: var(--fw-semi); }
.prod-card__line { font-size: var(--fs-sm); color: var(--ink-2); line-height: 1.6; }
.prod-card__meta { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); }
.prod-card__clients { display: inline-flex; gap: var(--s-1); color: var(--ink-3); }
.prod-card__clients .icon { width: 16px; height: 16px; }
.prod-card__media { position: relative; overflow: hidden; height: 140px; border-radius: var(--r-md); background: var(--bg-subtle); }
.prod-card__media img { position: absolute; left: 0; top: 0; width: 100%; max-width: none; transform: translateY(var(--shot-y, 0)); }
.prod-card__go { display: inline-flex; align-items: center; gap: var(--s-1); font-size: var(--fs-sm); font-weight: var(--fw-semi); color: var(--brand-ink); margin-top: auto; }
.prod-card--short { grid-template-columns: 36px minmax(0, 1fr); gap: 2px var(--s-3); padding: var(--s-3); border-radius: var(--r-md); box-shadow: none; background: transparent; }
.prod-card--short:hover { background: var(--bg-subtle); box-shadow: none; transform: none; }
.prod-card--short .card__icon { width: 36px; height: 36px; grid-row: span 2; border-radius: 10px; }
.prod-card--short .prod-card__name { font-size: var(--fs-ui); }
.prod-card--short .prod-card__line { font-size: var(--fs-xs); color: var(--ink-3); grid-column: 2; }
.prod-card--placeholder { background: var(--bg-subtle); box-shadow: inset 0 0 0 1.5px var(--line-strong); }
.prod-card--placeholder .prod-card__name { color: var(--ink-2); }
.prod-card--placeholder::after { content: "规模示意"; position: absolute; right: var(--s-4); bottom: var(--s-5); height: 20px; padding: 0 var(--s-2); border-radius: var(--r-pill); font-size: var(--fs-mark); line-height: 20px; color: var(--ink-3); background: var(--surface); box-shadow: inset 0 0 0 1px var(--line-strong); }
.prod-card--short.prod-card--placeholder::after { display: none; }
.prod-card--short.prod-card--placeholder { background: transparent; box-shadow: none; }
.prod-card--short.prod-card--placeholder .prod-card__name::after { content: "占位"; font-size: var(--fs-mark); font-weight: var(--fw-regular); color: var(--ink-3); padding: 0 6px; border-radius: var(--r-pill); box-shadow: inset 0 0 0 1px var(--line-strong); }
.prod-grid { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr)); gap: var(--s-4); }
.prod-grid > li { display: grid; }
@media (max-width: 1080px) { .prod-grid { --cols: 2; } }
@media (max-width: 760px) { .prod-grid { grid-template-columns: minmax(0, 1fr); } }

/* ===== 31 规模示意页专用（.scale-*，只 scale.html 用） ===== */
.scale-tier { position: relative; padding-block: var(--s-8); }
.scale-tier:nth-of-type(even) { background: var(--bg-subtle); }
.scale-tier__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--s-3) var(--s-5); margin-bottom: var(--s-6); }
.scale-tier__n { font-size: 64px; line-height: 1; font-weight: var(--fw-bold); letter-spacing: -0.03em; }
.scale-tier__rules { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: var(--s-2); }
.scale-block { margin-top: var(--s-6); }
.scale-block__label { display: flex; align-items: center; gap: var(--s-2); margin-bottom: var(--s-3); font-weight: var(--fw-semi); }
.scale-block__label .tag { font-weight: var(--fw-medium); }
.scale-frame { position: relative; overflow: hidden; border-radius: var(--r-lg); background: var(--bg); box-shadow: var(--sh-1), 0 0 0 1px var(--line); padding: var(--s-5); }
.scale-frame__bar { display: flex; align-items: center; gap: var(--s-4); margin: calc(var(--s-5) * -1) calc(var(--s-5) * -1) var(--s-5); padding: 0 var(--s-5); height: 52px; background: oklch(100% 0 0 / 0.85); border-bottom: 1px solid var(--line); font-size: var(--fs-sm); color: var(--ink-2); }
.scale-frame__bar b { color: var(--brand-ink); }
.scale-menu { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: var(--s-5); }
.scale-menu--wide { grid-template-columns: 200px minmax(0, 1fr) 240px; }
.scale-menu__list { list-style: none; padding: 0; margin: 0; display: grid; gap: 2px; }
.scale-menu__list li { display: flex; justify-content: space-between; align-items: center; min-height: 36px; padding: 0 var(--s-3); border-radius: var(--r-xs); font-size: var(--fs-sm); color: var(--ink-2); }
.scale-menu__list li.is-on { background: var(--brand-soft); color: var(--brand-ink); font-weight: var(--fw-semi); }
.scale-menu__list small { font-size: var(--fs-xs); color: var(--ink-3); }
.scale-menu__cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-1) var(--s-3); align-content: start; }
.scale-menu__cards--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 640px; }
.scale-menu__foot { display: flex; justify-content: space-between; align-items: center; margin-top: var(--s-4); padding-top: var(--s-3); border-top: 1px solid var(--line); font-size: var(--fs-sm); color: var(--ink-3); }
.scale-center { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: var(--s-6); align-items: start; }
.scale-side { display: grid; gap: var(--s-5); padding: var(--s-4); border-radius: var(--r-md); background: var(--surface); box-shadow: var(--sh-1); font-size: var(--fs-sm); }
.scale-side fieldset { border: 0; padding: 0; margin: 0; display: grid; gap: var(--s-1); }
.scale-side legend { font-weight: var(--fw-semi); margin-bottom: var(--s-2); }
.scale-side label { display: flex; align-items: center; gap: var(--s-2); min-height: 32px; color: var(--ink-2); }
.scale-side input { accent-color: var(--brand); }
.scale-group + .scale-group { margin-top: var(--s-6); }
.scale-group__head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: var(--s-3); }
.scale-more { display: flex; align-items: center; justify-content: center; min-height: 48px; border-radius: var(--r-md); box-shadow: inset 0 0 0 1.5px var(--line-strong); color: var(--brand-ink); font-size: var(--fs-sm); font-weight: var(--fw-semi); }
.scale-rules-table td, .scale-rules-table th { font-size: var(--fs-sm); }
@media (max-width: 1080px) {
  .scale-menu, .scale-menu--wide, .scale-center { grid-template-columns: minmax(0, 1fr); }
  .scale-menu__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .scale-tier { padding-block: var(--s-7); }
  .scale-tier__n { font-size: var(--fs-stat); }
  .scale-frame { padding: var(--s-3); }
  .scale-frame__bar { margin: calc(var(--s-3) * -1) calc(var(--s-3) * -1) var(--s-3); padding: 0 var(--s-3); gap: var(--s-2); overflow: hidden; white-space: nowrap; }
  .scale-menu__cards, .scale-menu__cards--2 { grid-template-columns: minmax(0, 1fr); }
  .scale-menu__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ===== 32 返回顶部 .to-top、阅读进度条 .read-progress（最终版公共组件，site.js 自动挂载） =====
   返回顶部：页面高于 3 屏时由脚本插入，滚过 2 屏出现；手机端在咨询浮钮上方，接近页脚时收起，不压底部标识。
   阅读进度条：页面里有 [data-read-progress]（放在长文 <article> 上）时，顶栏下方出现 2px 进度条；只改宽度变量，不做动画。 */
.to-top { position: fixed; right: var(--s-5); bottom: calc(var(--s-5) + env(safe-area-inset-bottom)); z-index: 44; display: grid; place-items: center; width: var(--hit); height: var(--hit); border: 0; border-radius: 50%; background: var(--surface); color: var(--ink); box-shadow: var(--sh-pop); transition: opacity var(--dur-2) var(--ease-out), transform var(--dur-2) var(--ease-out); }
.to-top .icon { transform: rotate(-90deg); }
.to-top.is-hidden { opacity: 0; transform: translateY(var(--s-3)); pointer-events: none; visibility: hidden; }
.read-progress { position: fixed; left: 0; right: 0; top: var(--nav-h); z-index: 49; height: 2px; pointer-events: none; }
.read-progress::before { content: ""; display: block; height: 100%; width: calc(var(--read, 0) * 100%); background: var(--grad-ai); }
@media (max-width: 760px) {
  .to-top { right: var(--s-4); bottom: calc(var(--s-4) + 56px + env(safe-area-inset-bottom)); }
  /* 手机端所有输入框 16px（放在文件靠后，盖过后面章节组件里的 15px） */
  .input, .select, .textarea, .nf-search__input, .mega__search input, .searchbar input, .ask__input { font-size: 16px; }
}

/* ===== 33 页脚手机端折叠（site.js 给每组标题加按钮；没有脚本时照常全部展开） ===== */
.footer-col__toggle { display: contents; }
.footer-col__toggle .icon { display: none; }
@media (max-width: 760px) { .footer-grid.is-foldable .footer-col__toggle .icon { display: block; } }
@media (max-width: 760px) {
  .footer-grid.is-foldable { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .footer-grid.is-foldable .footer-brand { margin-bottom: var(--s-4); }
  .footer-grid.is-foldable .footer-col { border-top: 1px solid var(--line); }
  .footer-grid.is-foldable .footer-col h2 { margin: 0; }
  .footer-grid.is-foldable .footer-col__toggle { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: var(--hit); padding: 0; border: 0; background: transparent; color: var(--ink); font: inherit; font-weight: var(--fw-semi); text-align: start; }
  .footer-grid.is-foldable .footer-col__toggle .icon { width: 16px; height: 16px; color: var(--ink-3); transition: transform var(--dur-2) var(--ease-out); }
  .footer-grid.is-foldable .footer-col__toggle[aria-expanded="true"] .icon { transform: rotate(180deg); }
  .footer-grid.is-foldable .footer-col ul { padding-bottom: var(--s-3); }
  .footer-grid.is-foldable .footer-col ul[hidden] { display: none; }
}

/* ===== 34 终审补丁（手机端六步条、标题断行、规模示意页） ===== */
.scale-filter { display: none; }
.scale-menu--wide .scale-menu__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 760px) {
  /* 六步条：标题与圆点同高居中，说明紧跟标题 */
  .steps { --step-num: 36px; }
  .steps--ai { --step-num: 44px; }
  .steps .steps__item { grid-template-columns: var(--step-num) minmax(0, 1fr); grid-template-rows: auto auto; row-gap: 2px; align-items: start; align-content: start; }
  .steps .steps__num { grid-row: 1 / span 2; }
  .steps .steps__title { display: block; min-height: 0; margin: calc((var(--step-num) - 1.5em) / 2) 0 0; line-height: 1.5; }
  .scale-menu--wide .scale-menu__cards { grid-template-columns: minmax(0, 1fr); }
  .steps .steps__desc { grid-column: 2; margin: 0; }
  /* 标题：手机上不用 balance（会在词中间断开），改 pretty + 尽量在标点处换行 */
  h1, h2, h3, h4, .h1, .h2, .h3, .display, .sec-head__title, .hx__title { text-wrap: pretty; word-break: keep-all; overflow-wrap: anywhere; }
  /* 规模示意页 */
  .scale-frame__bar span:nth-child(n+5) { display: none; }
  .scale-side--desk { display: none; }
  .scale-filter { display: block; }
}
.scale-filter { border-radius: var(--r-md); background: var(--surface); box-shadow: var(--sh-1); margin-bottom: var(--s-4); }
.scale-filter summary { display: flex; align-items: center; justify-content: space-between; min-height: var(--hit); padding: 0 var(--s-4); font-weight: var(--fw-semi); cursor: pointer; list-style: none; }
.scale-filter summary::-webkit-details-marker { display: none; }
.scale-filter .scale-side { box-shadow: none; padding-top: 0; }
.scale-side input { width: 20px; height: 20px; }
.scale-side label { min-height: 40px; }

/* ===== 25 追加区（其他设计师只在下面追加，写明页面与作者） ===== */

/* ===== 第二轮（D-112）：版式示意稿顶部说明条（不上线的稿用；正式站不出现） ===== */
.draft-banner { position: relative; z-index: 2; background: var(--brand-soft); border-bottom: 1px solid var(--brand-soft-2); color: var(--ink); }
.draft-banner__inner { display: flex; align-items: flex-start; gap: var(--s-3); padding-block: var(--s-3); font-size: var(--fs-sm); line-height: 1.6; }
.draft-banner__inner .icon { flex: none; width: 20px; height: 20px; margin-top: 1px; color: var(--brand-ink); }
.draft-banner__inner p { margin: 0; }

/* ===== 99 开发还原追加（第 1 次迭代前台；只追加，不改上面的组件） ===== */
/* 表单蜜罐字段：对人、对读屏都隐藏，机器人会填（规划 8.6 防刷） */
.hp-field { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
/* 分页下方「第 n 页，共 m 页」 */
.pager__note { margin-top: var(--s-2); text-align: center; font-size: var(--fs-xs); color: var(--ink-3); }
/* 图形验证码位（线索接口要求时显示） */
.lead-captcha { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--s-3); }
.lead-captcha img { border-radius: var(--r-xs); border: 1px solid var(--line); background: var(--surface); }
.lead-captcha__label { display: grid; gap: var(--s-1); }
.lead-captcha__input { width: 120px; }
/* 后台预览提示条（草稿预览页才有；不收录、不缓存） */
.preview-bar { position: sticky; top: var(--nav-h); z-index: 40; background: var(--seal-soft); color: var(--seal); font-size: var(--fs-sm); font-weight: var(--fw-semi); padding-block: var(--s-2); border-bottom: 1px solid var(--line); }

/* ===== 2026-11-01 官网体检修复（工人 A：全站公共层、首页、搜索、网站地图） ===== */
/* H-01 双层边框：带外框的搜索框、需求框，聚焦提示只由外框给，里面的输入框自己不再出一圈 */
.nf-search__input:focus-visible, .co-search-box input:focus-visible, .mega__search input:focus-visible, .searchbar input:focus-visible, .ask__input:focus-visible { outline: none; box-shadow: none; }
/* 外框保留原来的描边，另加透明 outline：平时看不见，Windows 高对比度下会显示成系统色 */
.nf-search:focus-within, .co-search-box:focus-within, .mega__search:focus-within, .searchbar:focus-within { outline: 2px solid transparent; outline-offset: 2px; }
/* 首页 / 定制开发页需求框：彩虹光边换成品牌色实边 + 浅光晕，表示「正在输入」 */
.ask__box:has(.ask__input:focus) { box-shadow: 0 0 0 1.5px var(--brand), 0 0 0 5px var(--brand-soft-2); outline: 2px solid transparent; outline-offset: 4px; }
/* 搜索框里 Chrome 自带的蓝色粗叉不和整体风格搭，去掉（清空用全选删除即可） */
input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }
/* 横切 H-06：段落里的链接不只靠颜色区分，一律带下划线（导航、按钮、卡片这类带 class 的链接不受影响） */
:where(p, dd, td, figcaption, blockquote, .check) a:not([class]) { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; text-decoration-color: color-mix(in oklch, currentColor 55%, transparent); }
:where(p, dd, td, figcaption, blockquote, .check) a:not([class]):hover { text-decoration-color: currentColor; }
/* 勾选框：未勾提交时标红（H-05） */
.check input[aria-invalid="true"] { outline: 2px solid var(--seal); outline-offset: 2px; }
/* H-16 首屏「试试这样说」和胶囊垂直居中；H-17 已记下的勾号与首行对齐 */
.hx__examples { align-items: center; }
.lead-form__echo { align-items: center; }
.lead-form__echo .icon { margin-top: 0; flex: none; }
/* 首屏第二条路「先看现成产品」：只是文字链，主按钮仍只有一个 */
.hx__alt { margin-top: var(--s-3); display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 0 var(--s-1); font-size: var(--fs-sm); color: var(--ink-2); }
/* H-06 行业方案下拉中间列在没有方案文章时放「大家常问」，下面不留白 */
.mega__search + .mega__col-title { margin-top: var(--s-2); }
/* H-18 手机菜单：长名称一格占满一行；Logo 右上的装饰点在手机菜单里像通知红点，去掉 */
.mobile-menu__sub .mobile-menu__wide { grid-column: 1 / -1; }
.mobile-menu .brand__mark::after { display: none; }
/* 搜索页（H-09、H-10）：超长关键词只占一行；零结果时不出侧栏，空态占满 */
.sr-h1 { display: flex; align-items: baseline; min-width: 0; }
.sr-h1__q { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.co-search-layout.sr-layout--solo { grid-template-columns: minmax(0, 1fr); }
.co-results mark { background: var(--hl); color: inherit; border-radius: 2px; padding-inline: 1px; }
/* 网站地图（H-07）：头部与搜索页同一节奏；每组一张卡，按列流式排 */
.sm-hero { padding-bottom: var(--s-6); }
.sm-hero__copy { margin-top: var(--s-5); max-width: var(--measure); }
.sm-hero__copy .lead { max-width: none; }
.sm-sec { padding-top: var(--s-5); }
.sm-grid { columns: 3 320px; column-gap: var(--s-5); }
.sm-card { break-inside: avoid; display: block; margin-bottom: var(--s-5); padding: var(--s-5); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--sh-1); }
.sm-card__title { display: flex; align-items: center; gap: var(--s-3); font-size: var(--fs-h4); font-weight: var(--fw-semi); line-height: var(--lh-head); }
.sm-card__title .card__icon { width: 32px; height: 32px; border-radius: var(--r-xs); }
.sm-card__title .icon { width: 18px; height: 18px; }
.sm-card__n { margin-left: auto; font-size: var(--fs-xs); font-weight: var(--fw-regular); color: var(--ink-3); }
.sm-list { list-style: none; margin: var(--s-4) 0 0; padding: 0; display: grid; gap: var(--s-1); font-size: var(--fs-sm); }
.sm-list--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--s-4); }
.sm-list a { display: inline-flex; align-items: center; min-height: 32px; color: var(--ink-2); line-height: 1.5; padding-block: var(--s-1); }
.sm-list a:hover { color: var(--brand-ink); }
.sm-list .sm-list__head { color: var(--ink); font-weight: var(--fw-semi); }
.sm-sub { list-style: none; margin: 0 0 var(--s-2); padding: 0 0 0 var(--s-3); border-left: 1.5px solid var(--line); display: grid; }
@media (max-width: 760px) {
  .sm-list a { min-height: var(--hit); }
  .sm-card { padding: var(--s-4); margin-bottom: var(--s-4); }
  .hx__alt { margin-top: var(--s-2); }
}
@media (forced-colors: active) {
  .ask__box:has(.ask__input:focus), .nf-search:focus-within, .co-search-box:focus-within, .mega__search:focus-within, .searchbar:focus-within { outline-color: Highlight; }
}