/* ══════════════════════════════════════════════════════════ 00-tokens.css · 设计变量 / Reset / 基础排版 / 区块语境 实现依据：docs/design-tokens.md 注意：--ease-* 与 --d-* 由 10-motion.css 定义，此处不重复。 ══════════════════════════════════════════════════════════ */ /* ── 变量 ── */ :root{ /* 基色 · 二元 */ --black:#000000; --white:#FFFFFF; /* 中性阶 */ --g10:#101010; --g21:#212121; --g57:#575757; --g92:#929292; --gc7:#C7C7C7; --gea:#EAEAEA; --gf5:#F5F5F5; /* 品牌强调 · 超序AI VI 增强版（取自 Logo 实际色值 · 三冷一暖） 浅底用原色，深底在 .sec-dark 中替换为提亮版，对比度均 ≥4.5 */ --brand:#2D73AA; /* 企业钢蓝 · 工程可靠、组织执行 */ --brand-d:#215B87; /* 三个价值层次 */ --tier-1:#7654A5; /* 治理靛紫 · AI 认知与突破 */ --tier-2:#2E8279; /* 系统深青 · 知识系统与人的连接 */ --tier-3:#2D73AA; /* 企业钢蓝 · 工程可靠与持续运行 */ /* 业务成果 · 全站唯一暖色 */ --value:#9E6C25; /* 价值古铜 */ /* ── 2026-10-15 第二次改版（首页 K2+ / D2 / G2 / O2）共用令牌 ── 样稿 mockups-v2 里用到、此前只以裸值写在 15-effects.css / 20-shell.js 里的颜色，集中在这里登记，三个视图共用，各自不再另加。 */ --cta:#2E6BE6; /* 按钮蓝：DESIGN.md colors.action（15-effects.css .fx-button 现值） */ --cta-deep:#1F4FB8; /* 按钮蓝悬停：DESIGN.md colors.action-deep */ --ink:#181c1a; /* 正文墨色：DESIGN.md colors.ink */ --shell:#13271f; /* 壳层深绿（滚动态导航、手机菜单、页脚）：DESIGN.md colors.shell-green */ --shell-text:#adb6b0; /* 深绿上的次级文字：15-effects.css 现值 */ --line:#E5E6E2; /* 样稿卡片描边（K2 / K2+ 同值，比 --gea 略暖） */ --hub-soft:#EAF1F7; /* 超序中枢段标签底：--brand 10% 叠白（样稿 K2+ 注释） */ --shot-bg:#F5F6FD; /* 自媒体运营智能平台截图页面底色（取自截图四角像素，17-industry.css .gw-cap-shot 同值） */ /* 深底上的行业 / 维度色：与 .sec-dark 里的提亮版同值；样稿在浅色页里的深色卡片上直接引用 */ --dk-brand:#3689CA; --dk-tier-1:#9377BA; --dk-tier-2:#349287; --dk-value:#B77D2B; /* 「明证」报告稿五色标注：取自方案界面截图（media/industry/appraisal-report.webp）的标注色，图例须与截图一致 */ --mark-ok:#2E9E6B; /* 绿 已核验 */ --mark-calc:#2D73AA; /* 蓝 程序算的 */ --mark-check:#E08A2E; /* 橙 待对照 */ --mark-conflict:#D9483B;/* 红 有冲突 */ --mark-missing:#E3B935; /* 黄 没找到 */ /* 字体族 */ --font-sans: "Geist","Inter", "Source Han Sans SC","HarmonyOS Sans SC","Noto Sans CJK SC", "PingFang SC","Hiragino Sans GB","Microsoft YaHei", system-ui,-apple-system,sans-serif; /* 10-15 修订：等宽栈末尾补思源黑体（站点加载的子集）。等宽字体都没有中文，标签里的中文原先落到系统 PingFang， 与正文字形不一；数字与英文仍先用前面的等宽字体，渲染不变 */ --font-mono: "JetBrains Mono","SF Mono","Roboto Mono", ui-monospace,Menlo,Consolas,"Source Han Sans SC",monospace; /* 字阶 · 变量存尺寸，完整排版见下方 .t-* 类与元素默认样式 */ --t-display:clamp(2.6rem,6vw,5rem); --t-h1:clamp(2.1rem,4.4vw,3.6rem); --t-h2:clamp(1.9rem,3.6vw,3rem); --t-h3:clamp(1.1rem,1.8vw,1.4rem); --t-lede:clamp(1rem,1.3vw,1.18rem); --t-body:16px; --t-small:14px; --t-eyebrow:12px; --t-mono:13px; /* 间距 */ --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; --s-10:128px; /* 布局 */ --wrap-max:1280px; --wrap-pad:clamp(20px,5vw,48px); --nav-h:64px; /* 右侧常驻联系栏安全区（2026-10-16 xiao 拍板方案①“右侧留安全区、内容居中”，20-shell.js #shell-dock）： --dock-safe = 联系栏离视口右边所占宽 + 与版心的间距，版心与出血容器都不进这条线；≤767 联系栏隐藏，为 0（手机版心不变）。 --dock-w / --dock-right 是竖条外框宽与距右（master f310074 ≤1379 档图标条 44px 的做法）；数值按断点见文件末尾。 --wrap-out：.fx-wrap（15-effects.css，max-width 1440）外侧留白；--gut：.fx-wrap 与顶栏的左右内边距 = max(--pad, --dock-safe - 外侧留白)，两侧对称； --bleed-x：向两侧出血的容器（横滑区、筛选条）最多出血到安全线 = max(0, --pad + 外侧留白 - --dock-safe)。--pad 由 15-effects.css 按断点定义。 */ --dock-safe:0px; --dock-w:44px; --dock-right:var(--s-2); --wrap-out:max(0px,(100vw - 1440px) / 2); --gut:max(var(--pad), var(--dock-safe) - var(--wrap-out)); --bleed-x:max(0px, var(--pad) + var(--wrap-out) - var(--dock-safe)); /* 圆角 */ --r-1:4px; --r-2:8px; --r-3:12px; --r-4:16px; --r-5:24px; --r-6:32px; --r-pill:999px; /* ── 区块语境（默认 = 浅色）── 所有组件一律引用 --local-*，不直接引用具体色值， 这样同一个组件放进 .sec-dark 就自动切换配色，无需写两套。 */ --local-bg:var(--white); --local-text:var(--black); --local-text-2:var(--g57); --local-line:var(--gea); --local-card-bg:var(--white); --local-card-border:var(--gea); } /* 联系栏安全区按断点（见 :root 布局段注释）：768–1023 竖条 36 宽、距右 4，占 40，与版心隔 8 → 48（--s-7）； ≥1024 竖条 44 宽、距右 8，占 52，与版心隔 12 → 64（--s-8）。 */ @media (min-width:768px){ :root{ --dock-safe:var(--s-7); --dock-w:36px; --dock-right:var(--s-1); } } @media (min-width:1024px){ :root{ --dock-safe:var(--s-8); --dock-w:44px; --dock-right:var(--s-2); } } /* ── Reset ── */ *,*::before,*::after{box-sizing:border-box} *{margin:0;padding:0} html{scroll-behavior:smooth;-webkit-text-size-adjust:100%} body{ background:var(--white); color:var(--black); font-family:var(--font-sans); font-size:var(--t-body); line-height:1.7; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; text-rendering:optimizeLegibility; overflow-x:hidden; } img,svg,video,canvas{max-width:100%;display:block} a{color:inherit;text-decoration:none} button,input,textarea,select{font:inherit;color:inherit;background:none;border:none} button{cursor:pointer} ul,ol{list-style:none} table{border-collapse:collapse;width:100%} ::selection{background:var(--brand);color:var(--white)} /* ── 标题排版 ── 统一 500 字重：CJK 落到系统字体时 600+ 会被渲染成伪粗体，笔画糊成一团。 */ h1,h2,h3,h4,.t-display,.t-h1,.t-h2,.t-h3{ font-weight:500; text-wrap:balance; } h1,.t-h1{font-size:var(--t-h1);letter-spacing:-0.022em;line-height:1.15} h2,.t-h2{font-size:var(--t-h2);letter-spacing:-0.02em;line-height:1.2} h3,.t-h3{font-size:var(--t-h3);letter-spacing:-0.01em;line-height:1.4} h4{font-size:var(--t-body);letter-spacing:-0.005em;line-height:1.5} .t-display{font-size:var(--t-display);letter-spacing:-0.025em;line-height:1.12} .lede{ font-size:var(--t-lede); line-height:1.65; letter-spacing:-0.005em; color:var(--local-text-2); max-width:46em; /* 中文没有词边界，text-wrap:pretty 的孤字保护不起作用；balance 把各行拉到等长， 消掉「末行只剩三四个字」的尾巴。全站 12 处受影响，行数均不变。 */ text-wrap:balance; } .lede strong{color:var(--local-text);font-weight:500} .t-small{font-size:var(--t-small);line-height:1.6} .t-mono{font-family:var(--font-mono);font-size:var(--t-mono);letter-spacing:0.02em;line-height:1.5} .t-dim{color:var(--local-text-2)} /* ── 区块语境 ── */ .sec-light{ --local-bg:var(--white); --local-text:var(--black); --local-text-2:var(--g57); --local-line:var(--gea); --local-card-bg:var(--white); --local-card-border:var(--gea); } .sec-tint{ --local-bg:var(--gf5); --local-text:var(--black); --local-text-2:var(--g57); --local-line:var(--gea); --local-card-bg:var(--white); --local-card-border:var(--gea); } .sec-dark{ --local-bg:var(--black); --local-text:var(--white); --local-text-2:var(--g92); --local-line:var(--g21); --local-card-bg:var(--g10); --local-card-border:var(--g21); /* 深底提亮版 */ --brand:#3689CA; --brand-d:#5BA3DC; --tier-1:#9377BA; --tier-2:#349287; --tier-3:#3689CA; --value:#B77D2B; } .sec-light,.sec-tint,.sec-dark{ background:var(--local-bg); color:var(--local-text); } /* ── 布局 ── */ .wrap{ max-width:var(--wrap-max); margin-inline:auto; /* 10-16 联系栏安全区：外侧留白不足 --dock-safe 时内边距补足（两侧对称） */ padding-inline:max(var(--wrap-pad), var(--dock-safe) - max(0px,(100vw - var(--wrap-max)) / 2)); } .sec{padding-block:clamp(64px,10vh,128px)} .sec-sm{padding-block:clamp(40px,6vh,72px)} .grid{display:grid;gap:clamp(16px,2vw,24px)} .g2{grid-template-columns:repeat(2,minmax(0,1fr))} .g3{grid-template-columns:repeat(3,minmax(0,1fr))} .g4{grid-template-columns:repeat(4,minmax(0,1fr))} .stack-v{display:flex;flex-direction:column} .row{display:flex;flex-wrap:wrap;align-items:center} .gap-2{gap:var(--s-2)} .gap-3{gap:var(--s-3)} .gap-4{gap:var(--s-4)} .gap-5{gap:var(--s-5)} .gap-6{gap:var(--s-6)} .mt-4{margin-top:var(--s-4)} .mt-5{margin-top:var(--s-5)} .mt-6{margin-top:var(--s-6)} .mt-7{margin-top:var(--s-7)} .mt-8{margin-top:var(--s-8)} /* 锚点定位避开吸顶导航 */ [id]{scroll-margin-top:calc(var(--nav-h) + var(--s-5))} /* ── 无障碍 ── */ :focus-visible{ outline:2px solid var(--brand); outline-offset:2px; border-radius:var(--r-1); } :focus:not(:focus-visible){outline:none} .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:calc(-1 * var(--s-10)); z-index:100; padding:var(--s-3) var(--s-5); background:var(--brand);color:var(--white); border-radius:var(--r-2); font-size:var(--t-small); } .skip-link:focus{top:var(--s-4)} /* ── 响应式降列 ── */ @media (max-width:959px){ .g3,.g4{grid-template-columns:repeat(2,minmax(0,1fr))} } @media (max-width:639px){ :root{--nav-h:56px} .g2,.g3,.g4{grid-template-columns:minmax(0,1fr)} } /* v3 统一组件令牌：来自已接受的 mockups-v3/v3.css；具体依据随项登记。 */ :root{ --pad:48px; /* 现网 15-effects.css :root（版心内边距），--gut 依赖它 */ --cx-nav-h:88px; /* 顶栏高：DESIGN.md navigation.height 88（xiao 10-16 拍板）；00-tokens 的 --nav-h 64 现网被 15-effects 覆盖，这里不改原令牌 */ --cx-ice:#dce8f3; /* 收尾浅蓝：现网 15-effects.css --ice（.ix-close 底色） */ --cx-wrap:1440px; /* 版心外框：.fx-wrap max-width 1440（与 --wrap-out 的 1440 一致）；内容 = 1440 - 2 × --gut = 1312 */ --cx-read:720px; /* 详情阅读栏：审计“详情阅读栏 720”（21-news.css 文章页） */ /* 标题阶梯（审计 4：首页 Display 64/34 · 栏目 h1 56/34 · 详情 h1 32/24 · h2 44/30 · h3 22/19 · 卡片小标题 18/16 · 导语 18/16 · 正文 16/15） */ --cx-display:64px; --cx-h1:56px; --cx-dh1:32px; --cx-h2:44px; --cx-h3:22px; --cx-card-t:18px; --cx-lede:18px; --cx-text:16px; --cx-num:52px; /* 数字带大数字：现网 --hm-t-num 上限 52 */ --cx-num-m:34px; /* 卡片“前 → 后”大数字：DESIGN.md 案例卡 34px */ --cx-btn-t:15px; /* 按钮字号：审计 4“主按钮 15px”（现网 --hm-t-md） */ --cx-chip-t:13.5px; /* 筛选胶囊：审计 4“13.5px”（现网 .op-chip / --hm-t-sm2） */ /* 尺寸 */ --cx-sec-y:var(--s-9); /* 区段上下留白 96：现网 10 月新版是 112，首页压到约 5.8 屏时取令牌 --s-9（差 16，见规划说明） */ --cx-close-y:var(--s-9); /* 收尾上下留白 96（现网 .ix-close 120，与区段同取 --s-9） */ --cx-btn-h:48px; /* 按钮高：审计 4“h48”（.ix-btn） */ --cx-r-btn:6px; /* 按钮圆角：DESIGN.md rounded.action */ --cx-r-shot:10px; /* 截图框圆角：审计 4“圆角 10”（.hm-win） */ --cx-bar-h:34px; /* 截图框标题栏：审计 4“34px 三点标题栏” */ --cx-grid:48px; /* 页头细网格：现网 .ix-hero::before 48px（= --s-7） */ /* 混色（只由令牌混出） */ --cx-bar-bg:color-mix(in srgb,var(--gf5) 40%,var(--white)); /* 截图框标题栏底：现网 --hm-bar-bg */ --cx-bar-dot:color-mix(in srgb,var(--gc7) 40%,var(--gea)); /* 标题栏三点：现网 --hm-bar-dot */ --cx-grid-line:color-mix(in srgb,var(--ink) 5%,transparent); /* 页头网格线：现网 .ix-hero::before */ --cx-dk-line:color-mix(in srgb,var(--white) 14%,transparent); /* 深绿带上的细线：现网 --hm-dk-line 同取向 */ --cx-dk-fill:color-mix(in srgb,var(--white) 7%,transparent); /* 深绿带上的标签底 */ --cx-ink-2:color-mix(in srgb,var(--brand-d) 30%,var(--g21)); /* 收尾导语：现网 .ix-close-lede #3d4a55 */ } @media (max-width:1023px){ :root{ --pad:32px; --cx-display:48px; --cx-h1:44px; --cx-dh1:28px; --cx-h2:36px; --cx-num:44px; } /* 平板档：现网 15-effects ≤1023 的 h1 44 / h2 36 */ } @media (max-width:767px){ :root{ --pad:var(--s-5); --cx-nav-h:72px; --cx-display:34px; --cx-h1:34px; --cx-dh1:24px; --cx-h2:30px; --cx-h3:19px; --cx-card-t:16px; --cx-lede:16px; --cx-text:15px; --cx-num:36px; --cx-num-m:28px; --cx-btn-t:14px; --cx-btn-h:46px; --cx-sec-y:var(--s-8); --cx-close-y:72px; } /* 手机档：审计4与已接受样稿的字号、按钮和72px壳层。 */ } :root{--error:#ae2b36;--textile:#527B8A;} /* 纺织业钢蓝青灰：与动作蓝区分，延续制造/医疗/评估的低饱和行业色。 */ /* 壳层导航动作几何与占位图。页面组件统一由 05-system.css 提供。 v3 删除已替换的旧按钮、方块眉标、卡片、标签、数字带、表单、面包屑与对照组件。 导航尺寸保持原样；动作颜色由 17-industry.css 的 --cta 统一。 */ .nav-cta,.nav-cta-mobile{ display:inline-flex; align-items:center; justify-content:center; gap:var(--s-2); padding:14px 28px; border-radius:var(--r-2); font-size:var(--t-small); font-weight:500; line-height:1.2; white-space:nowrap; border:1px solid transparent; } .ph{ display:block; width:100%; border-radius:var(--r-4); overflow:hidden; background:var(--local-card-bg); border:1px solid var(--local-card-border); } .ph svg{width:100%;height:auto;display:block} /* v3 共用组件，依据已接受样稿 v3.css。令牌集中于 00-tokens；壳层交互沿用20-shell。 */ /* 行业 / 维度 / 栏目色：data-tone → --acc（色值都是 00-tokens 的令牌） */ [data-tone]{--acc:var(--brand)} [data-tone="value"]{--acc:var(--value)} [data-tone="t1"]{--acc:var(--tier-1)} [data-tone="t2"]{--acc:var(--tier-2)} [data-tone="t3"],[data-tone="brand"]{--acc:var(--brand)} [data-tone="textile"]{--acc:var(--textile)} [data-tone="shell"]{--acc:var(--shell)} [data-tone="cta"]{--acc:var(--cta)} /* ── 4. 版心与区段 ── */ .cx-wrap{max-width:var(--cx-wrap);margin-inline:auto;padding-inline:var(--gut)} .cx-read{max-width:calc(var(--cx-read) + 2 * var(--gut));margin-inline:auto;padding-inline:var(--gut)} .cx-sec{padding-block:var(--cx-sec-y);background:var(--white);color:var(--ink)} .cx-sec.is-tint{background:var(--gf5)} .cx-sec.is-shell{background:var(--shell);color:var(--white)} .cx-sec.is-tight{padding-block:var(--s-8)} /* 窄区段（动态条、数字带一类）：64 */ .cx-sec.is-line{border-top:1px solid var(--gea)} /* 白接白时的分隔细线 */ .cx-band{border-block:1px solid var(--gea);background:var(--white)} /* 上下细线的窄带（数字带） */ .cx-grid{display:grid;gap:var(--s-5);grid-template-columns:repeat(var(--cols,3),minmax(0,1fr))} .cx-grid.is-2{--cols:2}.cx-grid.is-3{--cols:3}.cx-grid.is-4{--cols:4} .cx-gap{margin-top:var(--s-7)} /* 区段内块与块之间 48 */ .cx-gap.is-l{margin-top:var(--s-8)} /* 同一区段里两块业务之间 64 */ .cx-gap-s{margin-top:var(--s-4)} /* 块内小间距 16 */ .cx-sep{padding-top:var(--s-3);border-top:1px solid var(--gea)} /* 卡内分隔细线（老板话 / 技术一行、常见做法 / 中枢） */ .cx-ink{color:var(--ink)} /* ── 5. 标题阶梯 ── */ .cx-display{font-size:var(--cx-display);line-height:1.16;letter-spacing:-.022em} /* 现网首页 .hm-h1 字距 */ .cx-h1{font-size:var(--cx-h1);line-height:1.14} .cx-dh1{font-size:var(--cx-dh1);line-height:1.3} .cx-h2{font-size:var(--cx-h2);line-height:1.22} .cx-h3{font-size:var(--cx-h3);line-height:1.4} .cx-card-t{font-size:var(--cx-card-t);line-height:1.5} .cx-lede{font-size:var(--cx-lede);line-height:1.7;color:var(--g57);max-width:36em} .cx-p{font-size:var(--cx-text);line-height:1.75;color:var(--g57)} .cx-small{font-size:var(--t-small);line-height:1.65;color:var(--g57)} .cx-lede b,.cx-p b,.cx-small b{color:var(--ink)} .is-shell .cx-lede,.is-shell .cx-p,.is-shell .cx-small{color:var(--shell-text)} .is-shell .cx-lede b,.is-shell .cx-p b,.is-shell .cx-small b{color:var(--white)} /* ── 6. 小件 ── */ /* 眉标：一种（6px 圆点 + 13px --g57），不带编号徽章 / 方块 / 横线 */ .cx-eyebrow{display:flex;align-items:center;gap:var(--s-2);font-size:var(--t-mono);font-weight:500;line-height:1.5;color:var(--g57)} .cx-eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--acc,var(--brand));flex-shrink:0} .is-shell .cx-eyebrow{color:var(--shell-text)} .is-shell .cx-eyebrow::before{background:color-mix(in srgb,var(--acc,var(--brand)) 55%,var(--white))} /* 按钮：主（--cta）/ 次（描边）各一种，48 高、6 圆角、15px、换位箭头 */ .cx-btn{min-height:var(--cx-btn-h);padding:var(--s-3) var(--s-5);display:inline-flex;align-items:center;justify-content:space-between;gap:var(--s-6);border:1px solid transparent;border-radius:var(--cx-r-btn);font-size:var(--cx-btn-t);font-weight:500;line-height:1.4;white-space:nowrap;cursor:pointer;transition:background-color var(--d-fast),border-color var(--d-fast),color var(--d-fast)} .cx-btn.is-pri{background:var(--cta);color:var(--white)} .cx-btn.is-pri:hover{background:var(--cta-deep)} .cx-btn.is-sec{background:transparent;border-color:var(--gc7);color:var(--ink)} .cx-btn.is-sec:hover{border-color:var(--ink);background:var(--white)} .is-shell .cx-btn.is-sec{border-color:var(--cx-dk-line);color:var(--white)} .cx-btn.is-bare{justify-content:center} /* 无箭头（顶栏、表单提交） */ .cx-arr{position:relative;display:block;overflow:hidden;width:16px;height:16px;flex-shrink:0} .cx-arr svg{position:absolute;inset:0;width:16px;height:16px;transition:transform var(--d-slow) var(--ease-out)} /* 现网 .arrow-window 0.55s */ .cx-arr svg+svg{transform:translate(-20px,20px)} .cx-btn:hover .cx-arr svg:first-child{transform:translate(20px,-20px)} .cx-btn:hover .cx-arr svg+svg{transform:none} .cx-arr.is-down svg+svg{transform:translateY(-20px)} .cx-btn:hover .cx-arr.is-down svg:first-child{transform:translateY(20px)} .cx-acts{display:flex;flex-wrap:wrap;gap:var(--s-3)} /* 文字链：一种，14px + →（箭头写在文案里），品牌钢蓝 */ .cx-link{display:inline-flex;align-items:center;gap:var(--s-1);font-size:var(--t-small);font-weight:500;line-height:1.5;color:var(--brand);white-space:nowrap} .cx-link:hover{text-decoration:underline;text-underline-offset:.25em} .is-shell .cx-link{color:color-mix(in srgb,var(--cta) 45%,var(--white))} /* 深绿上的链接：现网 .ix-gcard .go #9fc0f5 */ /* 标签两种：状态标签（12px 胶囊，色 10% 底 + 6px 圆点）/ 筛选胶囊（13.5px，1px 线白底，选中墨底白字） */ .cx-tag{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 var(--s-2);border-radius:var(--r-pill);font-size:var(--t-eyebrow);line-height:1;white-space:nowrap;color:color-mix(in srgb,var(--acc,var(--brand)) 85%,var(--black));background:color-mix(in srgb,var(--acc,var(--brand)) 10%,var(--white))} .cx-tag::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--acc,var(--brand));flex-shrink:0} .is-shell .cx-tag{height:28px;padding:0 var(--s-3);font-size:var(--t-mono);color:var(--white);background:var(--cx-dk-fill)} .is-shell .cx-tag::before{background:color-mix(in srgb,var(--acc,var(--brand)) 55%,var(--white))} .cx-chip{display:inline-flex;align-items:center;height:32px;padding:0 var(--s-3);border:1px solid var(--gea);border-radius:var(--r-pill);background:var(--white);font-size:var(--cx-chip-t);line-height:1;color:var(--ink);white-space:nowrap} .cx-chip.is-on{background:var(--ink);border-color:var(--ink);color:var(--white)} .cx-tags{display:flex;flex-wrap:wrap;gap:var(--s-2)} /* 步骤序号：等宽编号只用在这里（步骤），不进眉标、不进卡片角 */ .cx-steps{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-2) var(--s-3);counter-reset:none} .cx-steps li{display:inline-flex;align-items:center;gap:var(--s-2);font-size:var(--cx-text);color:var(--ink);white-space:nowrap} .cx-steps li+li::before{content:"";width:var(--s-5);height:1px;background:var(--gc7);margin-right:var(--s-1)} .cx-steps i,.cx-no{font-style:normal;font-family:var(--font-mono);font-size:var(--t-eyebrow);font-weight:500;color:var(--acc,var(--brand))} /* ── 7. 块 ── */ /* 区段标题：左眉标 + h2，右导语与链接；窄屏上下排 */ .cx-shead{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:var(--s-5) var(--s-8);align-items:end;margin-bottom:var(--s-7)} .cx-shead .cx-h2{margin-top:var(--s-4)} .cx-shead .cx-h3{margin-top:var(--s-3)} .cx-shead-side{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s-3)} .cx-shead-side .cx-p{max-width:34em} .cx-shead.is-compact{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:var(--s-2) var(--s-5);padding-bottom:var(--s-4);margin-bottom:0;border-bottom:1.5px solid var(--ink)} /* 动态区：1.5px 墨线（现网 hm-nw） */ .cx-shead.is-compact>div{display:flex;align-items:baseline;flex-wrap:wrap;gap:var(--s-1) var(--s-3)} /* 卡片：一种（白底 1px 线 圆角 16 无阴影），可选顶边 3px 色线 */ .cx-card{position:relative;display:flex;flex-direction:column;gap:var(--s-4);padding:var(--s-6);min-width:0;background:var(--white);border:1px solid var(--gea);border-radius:var(--r-4);color:var(--ink);transition:border-color var(--d-fast)} a.cx-card:hover,.cx-card.is-hover:hover{border-color:var(--ink)} .cx-card.has-line::before{content:"";position:absolute;left:var(--s-6);right:var(--s-6);top:-1px;height:3px;border-radius:0 0 3px 3px;background:var(--acc,var(--brand))} .cx-card.is-acc{border-color:color-mix(in srgb,var(--acc,var(--brand)) 40%,var(--white))} .cx-card-top{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3)} .cx-card-meta{display:flex;align-items:center;flex-wrap:wrap;gap:var(--s-2) var(--s-3);font-size:var(--t-mono);color:var(--g57)} .cx-card-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);flex-wrap:wrap} /* 卡底：截图或链接贴底，三张同高 */ .cx-q{font-style:normal;color:var(--acc,var(--brand))} /* 句中强调名字（「超序中枢」） */ .cx-hang{text-indent:-.5em} /* 以「开头的标题：直角引号前半格空白挂出去，与左边线对齐 */ .cx-card-foot>.cx-shot{flex:1} .cx-card-foot.cx-gap{margin-top:var(--s-7)} .cx-kv{display:flex;flex-direction:column;gap:var(--s-1);font-size:var(--cx-text);line-height:1.7;color:var(--ink)} .cx-kv>small{font-size:var(--t-mono);color:var(--g57)} .cx-meta{display:flex;align-items:center;gap:var(--s-2);font-size:var(--t-small);font-weight:500;color:var(--ink)} .cx-meta::before{content:"";width:14px;height:1.5px;background:var(--acc,var(--cta))} /* 现网 .hm-coop .hm-meta */ /* 前 → 后大数字 */ .cx-ba{display:flex;flex-direction:column;gap:var(--s-1);padding-block:var(--s-4);border-block:1px solid var(--gea)} .cx-ba>b{display:flex;align-items:baseline;flex-wrap:wrap;gap:0 var(--s-2);font-size:var(--cx-num-m);line-height:1.2;font-weight:500;color:var(--ink)} .cx-ba>b s{text-decoration:none;color:var(--g57)} .cx-ba>b i{font-style:normal;color:var(--brand)} .cx-ba>small{font-size:var(--t-mono);color:var(--g57)} /* 截图框：一种（1px 细线 + 圆角 10 + 34px 三点标题栏）；图有三种放法：原比例 / 固定比例裁上左 / 按原图像素取局部 */ .cx-shot{margin:0;border:1px solid var(--gea);border-radius:var(--cx-r-shot);overflow:hidden;background:var(--white);min-width:0} .cx-shot-bar{height:var(--cx-bar-h);display:flex;align-items:center;gap:5px;padding:0 var(--s-3);border-bottom:1px solid var(--gea);background:var(--cx-bar-bg);font-size:var(--t-eyebrow);color:var(--g57);white-space:nowrap;overflow:hidden} .cx-shot-bar>i{width:7px;height:7px;border-radius:50%;background:var(--cx-bar-dot);flex-shrink:0} .cx-shot-bar>span{margin-left:var(--s-2);overflow:hidden;text-overflow:ellipsis} .cx-shot-bar b{color:var(--ink)} .cx-shot-bar .cx-no{margin-right:var(--s-1)} .cx-shot-body{position:relative;background:var(--white)} .cx-shot-body>img{width:100%;height:auto} .cx-shot-body.is-fit{aspect-ratio:var(--ar,16/10);overflow:hidden} .cx-shot-body.is-fit>img{width:100%;height:100%;object-fit:cover;object-position:var(--pos,left top)} .cx-shot-body.is-crop{aspect-ratio:var(--w)/var(--h);overflow:hidden} /* 数据里给原图宽 --iw 与裁切框 --x --y --w --h（与 25-content.js visual.crop 同口径） */ .cx-shot-body.is-crop>img{position:absolute;max-width:none;width:calc(var(--iw) / var(--w) * 100%);height:auto;left:calc(var(--x) / var(--w) * -100%);top:calc(var(--y) / var(--h) * -100%)} .cx-shot-list{padding:var(--s-2) var(--s-4)} /* 没有截图的行业：窗口里放文字列表（制造业“出图三件事”） */ .cx-shot-list li{display:grid;grid-template-columns:var(--s-5) minmax(0,1fr);gap:0 var(--s-2);padding-block:var(--s-2)} .cx-shot-list li+li{border-top:1px dashed var(--gea)} .cx-shot-list i{grid-row:span 2;font-style:normal;font-family:var(--font-mono);font-size:var(--t-eyebrow);color:var(--acc,var(--brand));padding-top:3px} .cx-shot-list b{font-size:var(--t-small);line-height:1.5} .cx-shot-list span{font-size:var(--t-eyebrow);line-height:1.6;color:var(--g57)} /* 数字带：同色大数字 + 一行说明，竖细线分格 */ .cx-nums{display:grid;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr))} .cx-nums>div{padding:var(--s-5) var(--s-5) var(--s-5) 0} .cx-nums>div+div{padding-left:var(--s-6);border-left:1px solid var(--gea)} .cx-nums b{display:flex;align-items:baseline;gap:6px;font-size:var(--cx-num);line-height:1;font-weight:500;color:var(--ink);white-space:nowrap} .cx-nums b small{font-size:var(--cx-btn-t);font-weight:400;color:var(--g57)} .cx-nums span{display:block;margin-top:var(--s-3);font-size:var(--t-small);line-height:1.55;color:var(--g57)} .cx-nums.is-2{--cols:2}.cx-nums.is-4{--cols:4} .cx-card .cx-nums b,.cx-phead .cx-nums b{font-size:var(--cx-num-m)} /* 卡内 / 页头里的数字小一档：34 */ /* 说明列表：粗体一行 + 说明一行，上细线（方案咨询“你会得到”、中枢“中枢里还有”） */ .cx-dl>div{padding-block:var(--s-4);border-top:1px solid var(--gea)} .cx-dl>div:last-child{border-bottom:1px solid var(--gea)} .cx-dl b{display:block;font-size:var(--cx-text);line-height:1.6;color:var(--ink)} .cx-dl span{display:block;margin-top:2px;font-size:var(--t-small);line-height:1.65;color:var(--g57)} .cx-dl.is-row{display:grid;grid-template-columns:repeat(var(--cols,4),minmax(0,1fr));gap:0 var(--s-5)} .cx-dl.is-row>div:last-child{border-bottom:0} .is-shell .cx-dl>div{border-color:var(--cx-dk-line)} .is-shell .cx-dl b{color:var(--white)} .is-shell .cx-dl span{color:var(--shell-text)} .cx-stepline{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-3) var(--s-5);padding-top:var(--s-5);border-top:1px solid var(--gc7)} /* 一行“进门后四步”：说明 + 步骤序号 */ /* 动态条目：缩略图 16:10 + 标签 · 日期 + 标题（两行内），三格竖分隔 */ .cx-news{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))} .cx-news>a{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:var(--s-4);align-items:start;padding:var(--s-5) var(--s-5) var(--s-5) 0} .cx-news>a+a{padding-left:var(--s-5);border-left:1px solid var(--gea)} .cx-news img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:var(--r-2);background:var(--gf5)} .cx-news-meta{display:flex;align-items:center;gap:var(--s-2);font-family:var(--font-mono);font-size:var(--t-eyebrow);color:var(--g57)} .cx-news-meta .cx-tag{font-family:'Source Han Sans SC',sans-serif} .cx-news b{display:block;margin-top:var(--s-2);font-size:var(--cx-text);line-height:1.55;color:var(--ink)} .cx-news>a:hover b{text-decoration:underline;text-underline-offset:.2em} /* ── 8. 页头 ── */ /* 栏目页头：浅灰 + 48px 细网格向下渐隐 + 面包屑 + 眉标 + h1 + 导语 + 主次按钮 | 右侧媒体位 */ .cx-phead{position:relative;isolation:isolate;overflow:hidden;background:var(--gf5);color:var(--ink);padding:var(--s-8) 0 var(--s-9)} .cx-phead::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:linear-gradient(var(--cx-grid-line) 1px,transparent 1px),linear-gradient(90deg,var(--cx-grid-line) 1px,transparent 1px);background-size:var(--cx-grid) var(--cx-grid); -webkit-mask-image:linear-gradient(180deg,var(--black),transparent 80%);mask-image:linear-gradient(180deg,var(--black),transparent 80%)} .cx-phead-in{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);grid-template-areas:"copy media";gap:var(--s-8);align-items:center} .cx-phead-in.is-even{grid-template-columns:minmax(0,1fr) minmax(0,1fr)} .cx-phead-copy{grid-area:copy;min-width:0} .cx-phead-in.has-more{grid-template-areas:"copy media" "more media";row-gap:var(--s-7);align-items:start} /* 页头左栏下半（要点、联系方式）：手机排到媒体位之后 */ .cx-phead-more{grid-area:more;min-width:0} .cx-phead .cx-eyebrow{margin-top:var(--s-6)} .cx-phead .cx-h1{margin-top:var(--s-3)} .cx-phead .cx-lede{margin-top:var(--s-5)} .cx-phead .cx-acts{margin-top:var(--s-6)} .cx-phead-media{grid-area:media;min-width:0} .cx-photo{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:var(--r-4)} /* 媒体位放照片（关于、动态）：不套截图框；HTML尺寸只声明固有比例。 */ .cx-crumb{display:flex;align-items:center;flex-wrap:wrap;gap:var(--s-2);font-size:var(--t-mono);line-height:1.5;color:var(--g57)} .cx-crumb a:hover{color:var(--ink)} .cx-crumb i{font-style:normal;color:var(--gc7)} .cx-crumb b{color:var(--ink)} /* 详情页头（场景详情、文章）：白底、面包屑、元信息、h1 32、导语，阅读栏宽 */ .cx-dhead{padding:var(--s-7) 0 var(--s-6);background:var(--white);color:var(--ink)} .cx-dhead .cx-card-meta{margin-top:var(--s-6)} .cx-dhead .cx-dh1{margin-top:var(--s-3)} .cx-dhead .cx-lede{margin-top:var(--s-4)} /* 首页首屏：唯一例外，白底居中 */ .cx-hero{padding:var(--s-7) 0 var(--s-8);background:var(--white);color:var(--ink);text-align:center} .cx-brandtag{display:inline-flex;align-items:center;gap:10px;padding:6px var(--s-4) 6px var(--s-2);border:1px solid var(--gea);border-radius:var(--r-pill);font-size:var(--cx-text);line-height:1.5} .cx-brandtag img{width:var(--s-5);height:var(--s-5)} .cx-hero .cx-display{margin-top:var(--s-5)} .cx-hero .cx-lede{margin:var(--s-3) auto 0;color:var(--g57)} .cx-hero .cx-acts{justify-content:center;margin-top:var(--s-6)} /* 首页分层图：01 行业方案 / 02 通用能力 / 03 超序中枢（深绿底座条） */ .cx-layers{margin-top:var(--s-6);display:grid;gap:var(--s-3);text-align:left} .cx-layer{display:grid;grid-template-columns:200px minmax(0,1fr);border:1px solid var(--gea);border-radius:var(--r-4);background:var(--white)} .cx-layer.is-tint{background:var(--gf5)} .cx-layer.is-shell{background:var(--shell);border-color:var(--shell);color:var(--white)} .cx-layer-l{display:flex;flex-direction:column;justify-content:center;gap:2px;padding:var(--s-4) var(--s-5);border-right:1px solid var(--gea)} .cx-layer.is-shell .cx-layer-l{border-right-color:var(--cx-dk-line)} .cx-layer-l b{display:flex;align-items:baseline;gap:var(--s-2);font-size:var(--cx-card-t);line-height:1.4} .cx-layer-l small{font-size:var(--t-mono);color:var(--g57)} .cx-layer.is-shell .cx-layer-l small{color:var(--shell-text)} .cx-layer-c{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-3) var(--s-4);padding:var(--s-4) var(--s-5);min-width:0} .cx-layer.is-shell .cx-layer-c>.cx-tags{margin-left:auto} .cx-layer-c>p{font-size:var(--cx-text)} .cx-layer-c>.cx-layer-hint{flex-basis:100%;font-size:var(--t-mono);color:var(--g57)} .cx-layer-hint a{color:var(--brand)} .cx-layer-hint a:hover{text-decoration:underline} .cx-layer-dot{display:inline-flex;align-items:center;gap:var(--s-2);font-size:var(--cx-text);font-weight:500;white-space:nowrap} .cx-layer-dot::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--acc,var(--brand))} .cx-inds{flex:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-3)} .cx-ind{display:flex;flex-direction:column;gap:6px;min-width:0} .cx-ind>a{display:flex;align-items:center;justify-content:space-between;gap:var(--s-2);height:48px;padding:0 var(--s-4);border-radius:var(--cx-r-shot);background:var(--acc);color:var(--white);font-size:var(--cx-card-t);font-weight:500} .cx-ind>a small{font-size:var(--t-eyebrow);font-weight:400;opacity:.85} .cx-ind>span{font-size:var(--t-mono);color:var(--g57)} /* ── 9. 收尾：浅蓝带 + 左 h2 44 + 导语 + 主按钮 | 右线稿视频（减少动态与加载失败回落环形图） ── */ .cx-close{position:relative;overflow:hidden;background:var(--cx-ice);padding-block:var(--cx-close-y);color:var(--ink)} .cx-close-in{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:var(--s-7);align-items:center} .cx-close .cx-eyebrow{--acc:var(--cta)} .cx-close .cx-h2{margin-top:var(--s-4)} .cx-close .cx-lede{margin-top:var(--s-4);color:var(--cx-ink-2);max-width:30em} .cx-close .cx-acts{margin-top:var(--s-6)} .cx-facts{margin-top:var(--s-5);display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-5);font-size:var(--t-mono);color:var(--cx-ink-2)} .cx-facts li{display:inline-flex;align-items:center;gap:var(--s-2)} .cx-facts li::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--brand)} .cx-close-media{position:relative;display:grid;place-items:center;justify-self:end;width:min(100%,440px);aspect-ratio:4/3;overflow:hidden;border-radius:var(--r-4)} .cx-close-media>video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;opacity:0;pointer-events:none} .cx-close-media>.cx-ring{justify-self:center;width:min(73%,320px)} .cx-close-media.video-ready>video{opacity:1} .cx-close-media.video-ready>.cx-ring{visibility:hidden} .cx-close-media.video-unavailable>video{opacity:0} .cx-close-media.video-unavailable>.cx-ring{visibility:visible} .cx-ring{position:relative;justify-self:end;width:min(100%,320px);aspect-ratio:1} .cx-ring svg{width:100%;height:100%} .cx-ring img{position:absolute;left:40.91%;top:40.91%;width:18.18%;height:18.18%} /* 现网 .ix-art：logo 在 440 画布中心 80 宽 */ .cx-ring .r1{stroke:color-mix(in srgb,var(--brand) 40%,var(--white));opacity:.55} .cx-ring .r2{stroke:color-mix(in srgb,var(--brand) 28%,var(--white));opacity:.55} .cx-ring .a1{stroke:var(--tier-1)}.cx-ring .a2{stroke:var(--tier-2)}.cx-ring .a3{stroke:var(--value)}.cx-ring .a4{stroke:var(--brand)} @media (prefers-reduced-motion:reduce){ .cx-close-media>video{display:none} .cx-close-media.video-ready>.cx-ring{visibility:visible} } /* ── 10. 专用：中枢示意（只放在深绿带里，企业边界是全站唯一一处虚线） ── */ .cx-map{position:relative;margin-top:var(--s-7);padding:var(--s-7) var(--s-6) var(--s-5);border:1px dashed var(--cx-dk-line);border-radius:var(--r-4)} .cx-map-edge{position:absolute;left:var(--s-6);top:0;transform:translateY(-50%);display:flex;align-items:center;gap:var(--s-2);padding:0 var(--s-3);background:var(--shell);font-size:var(--t-mono);color:var(--shell-text);white-space:nowrap} .cx-map-edge b{color:var(--white)} .cx-map-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.5fr) minmax(0,1fr);gap:var(--s-6);align-items:center} .cx-map-col>p{font-size:var(--t-mono);color:var(--shell-text);margin-bottom:var(--s-3)} .cx-map-col li{position:relative;display:flex;align-items:center;min-height:44px} .cx-map-col li+li{margin-top:var(--s-2)} .cx-map-col.is-in li>span{padding:6px var(--s-3);border:1px solid var(--cx-dk-line);border-radius:var(--r-2);font-size:var(--t-small);background:var(--cx-dk-fill)} .cx-map-col.is-in li::after{content:"";flex:1;height:1px;margin-left:var(--s-3);background:var(--cx-dk-line)} .cx-map-col.is-out li{flex-direction:column;align-items:flex-start;justify-content:center;padding-left:var(--s-5)} .cx-map-col.is-out li::before{content:"";position:absolute;left:0;top:50%;width:var(--s-4);height:1px;background:var(--cx-dk-line)} .cx-map-col.is-out b{font-size:var(--cx-text);line-height:1.4} .cx-map-col.is-out span{font-size:var(--t-eyebrow);color:var(--shell-text)} .cx-map-core{border-radius:var(--r-4);background:var(--white);color:var(--ink);overflow:hidden} .cx-map-core>header{padding:var(--s-4) var(--s-5);border-bottom:1px solid var(--gea)} .cx-map-core>header small{display:block;font-size:var(--t-eyebrow);color:var(--g57)} .cx-map-core>header b{font-size:var(--cx-h3);color:var(--brand)} .cx-map-core li{display:grid;grid-template-columns:28px 92px minmax(0,1fr);gap:var(--s-3);align-items:center;padding:var(--s-3) var(--s-5)} .cx-map-core li+li{border-top:1px solid var(--gea)} .cx-map-core li b{font-size:var(--cx-text)} .cx-map-core li span{font-size:var(--t-mono);line-height:1.55;color:var(--g57)} .cx-map-through{margin-top:var(--s-6);padding-top:var(--s-4);border-top:1px solid var(--cx-dk-line);display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-2) var(--s-3)} .cx-map-through>b{font-size:var(--t-mono);font-weight:400;color:var(--shell-text);margin-right:var(--s-2)} /* ── 11. 专用：表单（方案咨询），白底表单卡 ── */ .cx-form{display:grid;gap:var(--s-5);padding:var(--s-6);background:var(--white);border:1px solid var(--gea);border-radius:var(--r-4)} .cx-field{display:grid;gap:var(--s-2)} .cx-field label{font-size:var(--t-small);line-height:1.5;color:var(--ink)} .cx-field label em{font-style:normal;color:var(--g92);margin-left:2px} .cx-field input,.cx-field select,.cx-field textarea{width:100%;min-height:var(--cx-btn-h);padding:var(--s-3) var(--s-4);border:1px solid var(--gea);border-radius:var(--r-2);background:var(--white);font-size:var(--t-small);line-height:1.5;color:var(--ink);transition:border-color var(--d-fast)} .cx-field input:hover,.cx-field select:hover,.cx-field textarea:hover{border-color:var(--gc7)} .cx-field input:focus,.cx-field select:focus,.cx-field textarea:focus{outline:none;border-color:var(--cta)} .cx-field ::placeholder{color:var(--g92)} .cx-field select{appearance:none;padding-right:var(--s-7);background:var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23575757' stroke-width='1.5'%3E%3Cpath d='m4 6 4 4 4-4'/%3E%3C/svg%3E") no-repeat right var(--s-4) center/16px} .cx-field textarea{min-height:120px;resize:vertical} .cx-form-2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s-5)} .cx-form .cx-btn{width:100%} .cx-form-note{font-size:var(--t-eyebrow);line-height:1.6;color:var(--g92)} .cx-qr{display:flex;align-items:center;gap:var(--s-5)} .cx-qr figure{flex:none;width:132px;padding:var(--s-2);border:1px solid var(--gea);border-radius:var(--r-3);background:var(--white);text-align:center;font-size:var(--t-eyebrow);color:var(--g57)} .cx-qr figure b{display:block;font-size:var(--t-mono);color:var(--ink)} .cx-qr figure img{margin:var(--s-1) auto} /* ── 13. 响应式 ── */ @media (max-width:1180px){ .cx-news{grid-template-columns:minmax(0,1fr)} .cx-news>a,.cx-news>a+a{grid-template-columns:200px minmax(0,1fr);padding:var(--s-4) 0;border-left:0} .cx-news>a+a{border-top:1px solid var(--gea)} } @media (max-width:1023px){ .cx-phead-in,.cx-phead-in.is-even{grid-template-columns:minmax(0,1fr);grid-template-areas:"copy" "media";gap:var(--s-7)} .cx-phead-in.has-more{grid-template-areas:"copy" "media" "more"} .cx-shead{grid-template-columns:minmax(0,1fr)} .cx-grid.is-4{--cols:2} .cx-map-grid{grid-template-columns:minmax(0,1fr)} .cx-map-col.is-in ul{display:flex;flex-wrap:wrap;gap:var(--s-2)} .cx-map-col.is-in li+li{margin-top:0} .cx-map-col.is-in li::after,.cx-map-col.is-out li::before{display:none} .cx-map-col.is-out li{padding-left:0} .cx-layer{grid-template-columns:160px minmax(0,1fr)} } @media (max-width:767px){ .cx-grid,.cx-grid.is-2,.cx-grid.is-3,.cx-grid.is-4{--cols:1} .cx-grid.is-rail{display:flex;gap:var(--s-3);overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gut);margin-inline:calc(-1 * var(--gut));padding-inline:var(--gut);scrollbar-width:none} /* 手机横滑：首页行业卡、精选三张、四步截图 */ .cx-grid.is-rail>*{flex:0 0 84%;scroll-snap-align:start} .cx-card{padding:var(--s-5)} .cx-card.has-line::before{left:var(--s-5);right:var(--s-5)} .cx-nums{grid-template-columns:repeat(3,minmax(0,1fr))} .cx-nums>div{padding:var(--s-4) var(--s-2) var(--s-4) 0} .cx-nums>div+div{padding-left:var(--s-3)} .cx-nums span{font-size:var(--t-eyebrow)} .cx-news>a,.cx-news>a+a{grid-template-columns:112px minmax(0,1fr);gap:var(--s-3)} .cx-news b{font-size:var(--t-small)} .cx-phead{padding:var(--s-6) 0 var(--s-8)} .cx-phead .cx-eyebrow{margin-top:var(--s-5)} .cx-phead .cx-acts .cx-btn{flex:1 1 100%} .cx-hero{padding:var(--s-6) 0 var(--s-7)} .cx-hero .cx-acts .cx-btn{flex:1 1 100%} .cx-brandtag{font-size:var(--t-small)} .cx-layer{grid-template-columns:minmax(0,1fr)} .cx-layer-l{flex-direction:row;align-items:baseline;justify-content:space-between;padding:var(--s-3) var(--s-4);border-right:0;border-bottom:1px solid var(--gea)} .cx-layer.is-shell .cx-layer-l{border-bottom-color:var(--cx-dk-line)} .cx-layer-c{padding:var(--s-3) var(--s-4)} .cx-layer-c>.cx-tags{margin-left:0} .cx-inds{grid-template-columns:minmax(0,1fr)} .cx-ind{flex-direction:row;align-items:center;gap:var(--s-3)} .cx-ind>a{flex:none;width:40%;height:42px;font-size:var(--cx-text)} .cx-ind>a small{display:none} .cx-close-in{grid-template-columns:minmax(0,1fr)} .cx-close-media{display:none} .cx-ring{display:none} .cx-close .cx-acts .cx-btn{flex:1 1 100%} .cx-dl.is-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 var(--s-4)} .cx-form{padding:var(--s-5)} .cx-form-2{grid-template-columns:minmax(0,1fr)} .cx-steps li+li::before{width:var(--s-3)} .cx-map{padding:var(--s-7) var(--s-4) var(--s-4)} .cx-map-edge{left:var(--s-4);right:var(--s-4);max-width:calc(100% - 2 * var(--s-4));white-space:normal;flex-wrap:wrap;row-gap:0;line-height:1.5} .cx-map-core li{grid-template-columns:24px minmax(0,1fr);row-gap:0} .cx-map-core li span{grid-column:2} } /* v3 标题字重和字距不受旧效果切片的通用规则影响。 */ .cx-display,.cx-h1,.cx-dh1,.cx-h2,.cx-h3,.cx-card-t{font-weight:500} .cx-display,.cx-display *{letter-spacing:-.022em!important} .cx-btn:focus-visible,.cx-link:focus-visible{outline:2px solid var(--cta);outline-offset:var(--s-1)} .cx-field [aria-invalid="true"]{border-color:var(--error,var(--mark-conflict))} .cx-field .err{font-size:var(--t-eyebrow);color:var(--mark-conflict)} .cx-preset{margin-top:var(--s-5);font-size:var(--t-small);color:var(--cx-ink-2)} .cx-preset small{margin-left:var(--s-3)} /* 产品体系专用：资产 → 两大核心能力 / 数据支撑 → 业务形态。 */ .ps-map{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr) minmax(0,1fr);gap:var(--s-7);align-items:center} .ps-map-label{margin-bottom:var(--s-4);font-size:var(--t-small);line-height:1.5;color:var(--g57)} .is-shell .ps-map-label{color:var(--shell-text)} .ps-map-assets,.ps-map-forms,.ps-relationship{position:relative;min-width:0} .ps-map-assets ul,.ps-map-forms ul{display:grid} .ps-map-assets li,.ps-map-forms li{display:flex;align-items:center;gap:var(--s-3);padding-block:var(--s-4);border-bottom:1px solid var(--gea)} .ps-map-assets li:first-child,.ps-map-forms li:first-child{border-top:1px solid var(--gea)} .is-shell .ps-map-assets li,.is-shell .ps-map-forms li{border-color:var(--cx-dk-line)} .ps-map-assets li>svg,.ps-map-forms li>svg{width:20px;height:20px;flex-shrink:0;color:var(--brand)} .is-shell .ps-map-assets li>svg,.is-shell .ps-map-forms li>svg{color:var(--cx-ice)} .ps-map-assets li b,.ps-map-forms li b{display:block;font-size:var(--cx-text);font-weight:500;line-height:1.5} .ps-map-assets li span,.ps-map-forms li span{display:block;margin-top:var(--s-1);font-size:var(--t-small);line-height:1.7;color:var(--g57)} .is-shell .ps-map-assets li span,.is-shell .ps-map-forms li span{color:var(--shell-text)} .ps-core-pair{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-3)} .ps-core-pair::after{content:'↔';position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:var(--s-5);height:var(--s-5);border:1px solid var(--gea);border-radius:50%;background:var(--white);color:var(--brand);font-size:var(--t-small);pointer-events:none} .ps-map-product{display:flex;flex-direction:column;min-width:0;padding:var(--s-5);border:1px solid var(--gea);border-radius:var(--cx-r-shot);background:var(--white);color:var(--ink);transition:border-color var(--d-fast)} .ps-map-product:hover{border-color:var(--brand)} .ps-map-product h3{font-size:var(--cx-h3);font-weight:500;line-height:1.4;color:var(--brand)} .ps-map-product p{margin-top:var(--s-2);font-size:var(--cx-text);line-height:1.65} .ps-map-product>span{display:block;margin-top:var(--s-4);font-size:var(--t-small);line-height:1.75;color:var(--g57)} .ps-map-support{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--s-1) var(--s-3);margin-top:var(--s-4);padding:var(--s-4) var(--s-5);border:1px solid var(--gea);border-radius:var(--cx-r-shot);color:var(--ink)} .ps-map-support .ps-support-label{width:100%;font-size:var(--t-eyebrow);line-height:1.5;color:var(--g57)} .ps-map-support b{font-size:var(--cx-card-t);font-weight:500;line-height:1.5} .ps-map-support>span:last-child{font-size:var(--t-small);line-height:1.65;color:var(--g57)} .ps-map-support:hover{border-color:var(--brand)} .is-shell .ps-map-support{border-color:var(--cx-dk-line);color:var(--white)} .is-shell .ps-map-support .ps-support-label,.is-shell .ps-map-support>span:last-child{color:var(--shell-text)} .ps-map-assets::after,.ps-map>.ps-relationship::after{content:'→';position:absolute;top:50%;right:calc(var(--s-7) * -.7);color:var(--g92);font-size:var(--cx-h3);line-height:1} .is-shell .ps-map-assets::after,.is-shell .ps-map>.ps-relationship::after{color:var(--shell-text)} .ps-map.is-compact .ps-map-assets li,.ps-map.is-compact .ps-map-forms li{padding-block:var(--s-3)} .ps-map.is-compact .ps-map-product{padding:var(--s-4) var(--s-5)} .ps-map.is-compact .ps-map-product h3{font-size:var(--cx-card-t)} .ps-map.is-compact .ps-map-product p{font-size:var(--t-small)} .ps-summary-foot{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s-5);margin-top:var(--s-7);padding-top:var(--s-5);border-top:1px solid var(--cx-dk-line)} .ps-summary-foot>p{max-width:58em} .ps-summary-foot>a{flex-shrink:0} .ps-hero .ps-relationship{padding:var(--s-6);border:1px solid var(--gea);border-radius:var(--r-4);background:var(--white)} .ps-hero .ps-map-product{padding:var(--s-5) var(--s-4);background:var(--gf5);border-color:transparent} .ps-hero .ps-map-support{background:var(--gf5);border-color:transparent} .ps-hero .ps-map-product:hover,.ps-hero .ps-map-support:hover{border-color:var(--brand)} .ps-page .ps-hero .cx-phead-copy>.cx-h1{max-width:none;width:100%;text-wrap:wrap} .ps-title-line{display:block} .ps-title-phrase{white-space:nowrap} .ps-form-list{border-top:1px solid var(--gea)} .ps-form-list>article{display:grid;grid-template-columns:24px minmax(0,.55fr) minmax(0,1.45fr);align-items:baseline;gap:var(--s-5);padding:var(--s-5) 0;border-bottom:1px solid var(--gea)} .ps-form-list>article>svg{width:24px;height:24px;align-self:center;color:var(--brand)} .ps-form-list>article>p{max-width:45em} .ps-form-examples{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-3);margin-top:var(--s-6)} .ps-form-examples>a{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:var(--s-3);align-items:baseline;padding:var(--s-4);border:1px solid var(--gea);border-radius:var(--cx-r-shot);font-size:var(--t-small);line-height:1.7} .ps-form-examples b{color:var(--brand);font-weight:500} .ps-form-examples>a:hover{border-color:var(--brand)} .ps-example-arrow{color:var(--brand)} .ps-product{border-top:1px solid var(--gea)} .ps-product-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:var(--s-8)} .ps-product-intro .cx-h2{margin-top:var(--s-4)} .ps-capabilities{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-6);margin-top:var(--s-6)} .ps-capabilities>div{padding-top:var(--s-4);border-top:1px solid var(--gc7)} .ps-capabilities p{margin-top:var(--s-3);font-size:var(--cx-text)} .ps-product-note{margin-top:var(--s-5);padding-left:var(--s-4);border-left:2px solid var(--brand)} .ps-product-intro .cx-link{margin-top:var(--s-5)} .ps-nexus-detail{margin-top:var(--s-7)} .ps-disclosure{border:1px solid var(--gea);border-radius:var(--cx-r-shot);overflow:hidden} .ps-disclosure>summary{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr) 16px;gap:var(--s-4);align-items:center;padding:var(--s-5);cursor:pointer;list-style:none;background:var(--gf5)} .ps-disclosure>summary::-webkit-details-marker,.ps-governance-item>summary::-webkit-details-marker{display:none} .ps-disclosure>summary>span:first-child{font-size:var(--t-small);color:var(--g57)} .ps-disclosure>summary>b{font-size:var(--cx-card-t);font-weight:500} .ps-disclosure-mark{position:relative;width:16px;height:16px;flex-shrink:0} .ps-disclosure-mark::before,.ps-disclosure-mark::after{content:'';position:absolute;top:7px;left:2px;width:12px;height:1px;background:currentColor} .ps-disclosure-mark::after{transform:rotate(90deg)} [open]>.ps-disclosure-mark::after,details[open]>summary>.ps-disclosure-mark::after{display:none} .ps-disclosure-body{padding:var(--s-5)} .ps-runtime{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-5)} .ps-runtime li{padding-left:var(--s-4);border-left:1px solid var(--gea)} .ps-runtime h4{font-size:var(--cx-text);font-weight:500;line-height:1.5} .ps-runtime p{margin-top:var(--s-2)} .ps-through{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-5);margin-top:var(--s-5);padding-top:var(--s-4);border-top:1px solid var(--gea);font-size:var(--t-small);line-height:1.7} .ps-through b{font-weight:500;color:var(--brand)} .ps-through span{color:var(--g57)} .ps-governance{margin-top:var(--s-6)} .ps-governance>p{margin-top:var(--s-2)} .ps-governance-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--s-6);margin-top:var(--s-5)} .ps-governance-item{border-top:1px solid var(--gea)} .ps-governance-item>summary{display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);min-height:56px;padding-block:var(--s-4);list-style:none;cursor:pointer;font-size:var(--cx-text);line-height:1.5} .ps-governance-item>div{padding-bottom:var(--s-5)} .ps-governance-item>div>p+p{margin-top:var(--s-3)} .ps-principle-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-6) var(--s-8)} .ps-principle-list>article{padding-top:var(--s-5);border-top:1px solid var(--gc7)} .ps-principle-list p{margin-top:var(--s-3)} .ps-boundary{margin-top:var(--s-7);max-width:70em;padding-left:var(--s-4);border-left:2px solid var(--brand)} @media(max-width:1180px){ .ps-map{gap:var(--s-6);grid-template-columns:minmax(0,.75fr) minmax(0,1.6fr) minmax(0,1fr)} .ps-map-product{padding:var(--s-4)} .ps-map-assets::after,.ps-map>.ps-relationship::after{right:calc(var(--s-6) * -.75)} .ps-product-intro{gap:var(--s-7)} } @media(min-width:1024px) and (max-width:1180px){.ps-page .ps-hero .cx-phead-copy>.cx-h1{font-size:var(--cx-h2)}} @media(max-width:1023px){ .ps-map{grid-template-columns:minmax(0,1fr);gap:var(--s-7)} .ps-map-assets ul{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-5)} .ps-map-assets li{align-items:flex-start;border-top:1px solid var(--cx-dk-line)} .ps-map-forms ul{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--s-5)} .ps-map-forms li{border-top:0} .ps-map-forms li:nth-child(2){border-top:1px solid var(--cx-dk-line)} .ps-map-assets::after,.ps-map>.ps-relationship::after{content:'↓';top:auto;right:auto;bottom:calc(var(--s-7) * -.72);left:50%;transform:translateX(-50%)} .ps-hero .ps-relationship{max-width:760px;width:100%;margin-inline:auto} .ps-product-intro{grid-template-columns:minmax(0,1fr);gap:var(--s-6)} .ps-runtime{grid-template-columns:repeat(2,minmax(0,1fr))} .ps-summary-foot{align-items:flex-start} } @media(max-width:639px){ .ps-map-assets ul,.ps-map-forms ul{grid-template-columns:minmax(0,1fr);gap:0} .ps-map-assets li{border-top:0} .ps-map-forms li:nth-child(2){border-top:0} .ps-map-label{margin-bottom:var(--s-3)} .ps-core-pair{grid-template-columns:minmax(0,1fr);gap:var(--s-3)} .ps-core-pair::after{content:'↕';left:50%;top:50%} .ps-map-product{padding:var(--s-5)} .ps-hero .ps-relationship{padding:var(--s-5)} .ps-hero .ps-core-pair{grid-template-columns:repeat(2,minmax(0,1fr))} .ps-hero .ps-map-product h3{font-size:var(--cx-card-t)} .ps-hero .ps-map-product p{font-size:var(--t-small)} .ps-hero .ps-core-pair::after{content:'↔'} .ps-map-support{padding:var(--s-4)} .ps-summary-foot{flex-direction:column;gap:var(--s-4);margin-top:var(--s-6)} .ps-form-list>article{grid-template-columns:24px minmax(0,1fr);gap:var(--s-3)} .ps-form-list>article>svg{align-self:start} .ps-form-list>article>p{grid-column:2} .ps-form-examples{grid-template-columns:minmax(0,1fr)} .ps-form-examples>a{grid-template-columns:minmax(0,1fr) auto;gap:var(--s-1) var(--s-3)} .ps-form-examples>a>span:not(.ps-example-arrow){grid-column:1} .ps-example-arrow{grid-column:2;grid-row:1/span 2;align-self:center} .ps-capabilities,.ps-governance-grid,.ps-principle-list,.ps-runtime{grid-template-columns:minmax(0,1fr)} .ps-disclosure>summary{grid-template-columns:minmax(0,1fr) 16px;padding:var(--s-4);gap:var(--s-2) var(--s-3)} .ps-disclosure>summary>span:first-child{grid-column:1} .ps-disclosure>summary>b{grid-column:1} .ps-disclosure>summary>.ps-disclosure-mark{grid-column:2;grid-row:1/span 2} .ps-disclosure-body{padding:var(--s-4)} .ps-runtime{gap:var(--s-4)} .ps-hero .cx-h1{max-width:none} } @media(min-width:640px){ .ps-product[data-product-id="algorithms"] .ps-capabilities>div:last-child:nth-child(odd){grid-column:1/-1} } /* ══════════════════════════════════════════════════════════════════════════ 动效引擎 · 样式层（Agent C） 配套 11-motion.js。D 系列只写 motion-spec.md 第 11 节的类名/属性。 2026-09-09：原设计的 html.m-js / html.m-gsap 三态降级从未落地。11-motion.js 是后来 重写的简化引擎，不打这两个标记，也没有实现 M1 逐词点亮、M2/M3 Pin 分层、M4 视差、 M7 桌面横滑。对应的门控规则已全部删除，避免后续误判这些效果仍然存在。 当前实际形态：进场由 mountReveals 用 GSAP ScrollTrigger 直接驱动 [data-reveal] / .m-in（写内联样式，故 .m-in 不能再挂 CSS transition，否则两者互相拖慢）；横向滚动 区为原生 overflow-x 加 __hsInit 箭头；M6 hover 与 M8 数字是纯 CSS / JS。 静态形态仍写在无前缀选择器里，JS 不可用时页面保持 opacity:1 / transform:none。 ══════════════════════════════════════════════════════════════════════════ */ /* ══ M0 全局常量 ══ */ /* 全站唯一允许出现的 2 条曲线 + 4 档时长，其余 CSS 文件一律引用这些变量 */ :root{ /* 位移 / 进场 / 透明度 —— 全站主曲线 */ --ease-out: cubic-bezier(0, 0, 0.2, 1); /* 颜色 / 微交互 */ --ease-inout: cubic-bezier(0.4, 0, 0.2, 1); --d-fast: 150ms; --d-base: 300ms; --d-slow: 600ms; --d-xslow: 1000ms; } /* ══ 降级基线 ══ */ /* 这些容器现在只有静态形态。31-view-platform.js 的「技术选择」段仍输出 .m-pin / .m-stack / .m-layer 标记，靠下面几条呈现为普通的纵向排布。 */ .m-pin{ position:relative; height:auto; } .m-pin-stage{ position:relative; height:auto; overflow:visible; } .m-stack{ position:relative; } .m-layer{ position:relative; inset:auto; opacity:1; transform:none; } .m-stack > .m-layer + .m-layer{ margin-top:var(--s-8, 64px); } /* ══ 大标题排版 ══ */ /* balance 让多行标题各行长度接近，消掉「末行只剩三四个字」的尾巴。 中文没有词边界，pretty 的孤字保护对中文不起作用，实测必须用 balance： 技术能力页 h1 由 1153/224px 变为 711/666px。浏览器对超过约 6 行的块自动忽略。 */ .m-text{ text-wrap:balance; } /* ══ M3 PullApart 3D 层叠 ══ */ /* 只有位于 .m-pin 内部的 .m-stack 才转成绝对定位层叠； pin 之外的 .m-stack 保持自然纵向排布（由 JS 补 M5 进场），不会塌成 0 高。 */ /* ══ M4 parallaxOut ══ */ /* ══ 进场淡入上移 ══ */ /* 由 11-motion.js 的 mountReveals 用 GSAP ScrollTrigger 驱动 [data-reveal] 与 .m-in， 逐帧写内联 opacity / transform。这里刻意不写 CSS transition：两者同时存在会互相拖慢。 视图里的 data-stagger 目前不被处理，加进场请用 data-reveal 或 .m-in。 */ /* ══ M6 hover 微交互 ══ */ /* 按钮：只做色彩，永不位移 */ .btn, .btn-primary, .btn-invert, .btn-ghost{ transition:background-color var(--d-base) var(--ease-inout) 20ms, color var(--d-base) var(--ease-inout) 20ms, border-color var(--d-base) var(--ease-inout) 20ms; } /* 可点击卡片：位移固定 -4px + 边框提亮 */ .card.is-link{ transition:transform var(--d-base) var(--ease-out), border-color var(--d-base) var(--ease-out), background-color var(--d-base) var(--ease-out); } .card.is-link:hover, .card.is-link:focus-visible{ transform:translateY(-4px); } /* 正文链接：下划线从左展开 + 文字转 --brand 规格 M6 表写的是 250ms，但第 1 节硬性约束只允许 4 档时长，此处取最近档 --d-base */ .link, .m-link, .prose a:not(.btn):not(.card):not(.btn-primary):not(.btn-invert):not(.btn-ghost){ background-image:linear-gradient(currentColor, currentColor); background-repeat:no-repeat; background-position:0 100%; background-size:0 1px; text-decoration:none; transition:background-size var(--d-base) var(--ease-inout), color var(--d-base) var(--ease-inout); } .link:hover, .m-link:hover, .prose a:not(.btn):not(.card):hover{ background-size:100% 1px; color:var(--brand); } /* 导航项：只做 color */ .nav a, .nav-link{ transition:color var(--d-fast) var(--ease-inout); } /* 图片容器：内部 img 轻微放大 */ .m-zoom, .media, .img-wrap{ overflow:hidden; } .m-zoom img, .media img, .img-wrap img{ display:block; transition:transform var(--d-slow) var(--ease-out); } .m-zoom:hover img, .media:hover img, .img-wrap:hover img, .card.is-link:hover .m-zoom img, .card.is-link:hover .media img, .card.is-link:hover .img-wrap img{ transform:scale(1.03); } /* ══ M7 横向轮播 ══ */ /* 默认形态 = 原生横向滚动（移动端形态，也是无 GSAP 时的降级形态）。 桌面 + GSAP 时才关掉原生滚动、改由纵向滚动进度驱动 translateX。 */ .m-hscroll{ position:relative; overflow-x:auto; overflow-y:hidden; /* 纵向留白：hover 描边与阴影不被 overflow-y:hidden 裁掉 */ padding-block:10px; margin-block:-10px; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; scrollbar-width:none; -ms-overflow-style:none; } .m-hscroll::-webkit-scrollbar{ display:none; } .m-track{ display:flex; width:max-content; gap:clamp(16px, 2vw, 24px); } .m-track > *{ flex:0 0 auto; scroll-snap-align:start; } @media (min-width:768px){ } /* 绑定失败时立刻还原原生横向滚动，避免 overflow:hidden 把卡片裁没 */ .m-hscroll.is-degraded{ overflow-x:auto !important; scroll-snap-type:x mandatory !important; } .m-hscroll.is-degraded .m-track{ transform:none !important; will-change:auto !important; } /* ══ M8 数字 count-up ══ */ [data-count]{ font-variant-numeric:tabular-nums; font-feature-settings:"tnum" 1; } .m-count-num{ color:var(--brand); } .m-count-suffix{ color:inherit; } /* ══ 移动端降级（<768px）══ */ /* pin 行程按 300vh→180vh 的比例压缩；关 3D；M7 回到原生横向滚动 */ @media (max-width:767px){ } /* ══ prefers-reduced-motion 降级 ══ */ /* 四档时长整体归零 → 所有引用 --d-* 的过渡（含 B/D 系列写的）自动变瞬时； 再用 !important 把逐词文本、进场元素、pin 容器强行拉回可读的静态形态。 */ @media (prefers-reduced-motion: reduce){ :root{ --d-fast:0ms; --d-base:0ms; --d-slow:0ms; --d-xslow:0ms; } *, *::before, *::after{ transition-duration:0s !important; transition-delay:0s !important; animation-duration:0s !important; animation-delay:0s !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; } .card.is-link:hover{ transform:none !important; } .m-zoom:hover img, .media:hover img, .img-wrap:hover img{ transform:none !important; } } /* 全局排版、壳层、图库放大层与表单错误态。v3 已删除无渲染入口的旧首页、旧按钮、旧卡片、视频收尾及其响应式样式。 */ :root{--nav-h:88px;--t-display:80px;--t-h1:56px;--t-h2:44px;--t-h3:24px;--t-lede:18px;--pad:48px;--wrap:1344px;--evergreen:#203e31;--action-light:#dce6fa;--ice:#dce8f3;--font-sans:'Source Han Sans SC',sans-serif} *,*::before,*::after{letter-spacing:0!important} html{scroll-behavior:auto} body{overflow-x:clip;background:#fff;color:#181c1a} button,a{-webkit-tap-highlight-color:transparent} button{font:inherit} a{color:inherit} button:focus-visible,a:focus-visible{outline:2px solid #2e6be6;outline-offset:5px} svg.lucide{width:20px;height:20px;stroke-width:1.6;flex-shrink:0} img{max-width:100%} [hidden]{display:none!important} .fx-wrap{max-width:1440px;padding-inline:var(--pad);margin-inline:auto} .icon-button{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border:1px solid #ccd2ce;background:transparent;color:inherit;border-radius:50%;cursor:pointer;transition:background .2s,color .2s} .icon-button:hover{background:#203e31;color:#fff} @font-face{font-family:'Source Han Sans SC';src:url('../fonts/SourceHanSansSC-Regular.subset.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap} #shell-nav{height:0;position:relative;z-index:100} #shell-nav .nav{position:fixed;height:88px;left:0;right:0;top:0;background:#fff;color:#182c21;border:0;transition:transform .3s ease,background .2s ease,color .2s ease} #shell-nav .nav.is-hidden{transform:translateY(-100%)} #shell-nav .nav.is-scrolled{background:#13271f;color:#fff} #shell-nav .nav-brand{color:inherit;font-size:24px} #shell-nav .nav-mark{display:block} #shell-nav .nav-link{color:inherit} #shell-nav .nav-link.is-active::after{background:currentColor} #shell-nav .nav-logo{display:none} body:not(.is-home) #app{padding-top:88px} #shell-footer .footer{background:#13271f;color:#fff} #shell-footer .footer-brand-name{font-size:36px} #shell-footer .footer-bottom{color:#adb6b0} .gallery-dialog{margin:auto;inset:0;width:min(1450px,94vw);max-width:94vw;height:min(900px,94dvh);max-height:94dvh;border:0;border-radius:8px;padding:24px;background:#f8faf9;color:#233c2d} .gallery-dialog::backdrop{background:#05130cd9} .gallery-toolbar{display:flex;justify-content:space-between;gap:24px;align-items:center;margin-bottom:16px} .gallery-toolbar h2{font-size:18px;margin:0} .gallery-image{width:100%;height:calc(100% - 130px);object-fit:contain} .gallery-controls{display:flex;justify-content:center;gap:24px;align-items:center;margin-top:16px;font-size:13px} .ct-form [aria-invalid=true]{border-color:#ae2b36} .ct-form .err{color:#ae2b36} @media(max-width:1023px){ :root{--pad:32px;--t-h1:44px;--t-h2:36px} .gallery-dialog{padding:16px} } @media(max-width:767px){ :root{--pad:24px;--nav-h:72px;--t-h1:36px;--t-h2:30px;--t-display:48px;--t-lede:17px} #shell-nav .nav{height:72px} body:not(.is-home) #app{padding-top:72px} .gallery-toolbar h2{font-size:15px} .gallery-toolbar{gap:12px} } #shell-nav .nav-brand-cn{font-size:24px;font-weight:600;color:inherit} #shell-nav .nav-inner{max-width:1440px;padding-inline:var(--pad)} @media(prefers-reduced-motion:reduce){ *,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important} } /* Only the additions and alignment changes approved on 2026-09-08. */ .cx-solution,.cx-value-card{display:flex;flex-direction:column;gap:var(--s-4);min-width:0} .cx-solution>.text-link{margin-top:auto} .cx-solution>p{color:var(--local-text-2)} .cx-solutions h3{overflow-wrap:anywhere} .cx-value-benefits{display:grid;gap:var(--s-4)} .cx-value-benefits>div{display:grid;grid-template-columns:auto 1fr;gap:var(--s-3);font-size:var(--t-small)} .cx-value-benefits strong{font-weight:500;color:var(--brand)} .cx-examples{display:flex;flex-wrap:wrap;gap:var(--s-3);padding-top:var(--s-4);border-top:1px solid var(--local-line);margin-top:auto;font-size:var(--t-small)} /* 三个层次下方的总结句同样放开行宽（实测单行需 936px，.wrap 内容区 1184px） */ .cx-value-note{max-width:none} .cx-filters{display:flex;flex-wrap:wrap;gap:var(--s-3);margin-bottom:var(--s-6)} .cx-filter{border:1px solid var(--local-line);border-radius:var(--r-pill);padding:var(--s-3) var(--s-5);font-size:var(--t-small)} .cx-filter.is-on{background:var(--local-text);color:var(--local-bg);border-color:var(--local-text)} .cx-filter:focus-visible,.cx-app-open:focus-visible,.cx-dlg-close:focus-visible{outline:2px solid var(--brand);outline-offset:var(--s-1)} [data-app-group][hidden]{display:none!important} .cx-app-list{margin-top:var(--s-7)} /* 应用场景：三列卡片 + 详情弹层（2026-09-09 方案 C，替代原 14 条等宽手风琴） */ .cx-app-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-4);margin-top:var(--s-5)} .cx-app-card{min-width:0;scroll-margin-top:calc(var(--nav-h) + var(--s-6))} .cx-app-card[data-tier="t1"],.cx-app-dialog[data-tier="t1"]{--tier-color:var(--tier-1)} .cx-app-card[data-tier="t2"],.cx-app-dialog[data-tier="t2"]{--tier-color:var(--tier-2)} .cx-app-card[data-tier="t3"],.cx-app-dialog[data-tier="t3"]{--tier-color:var(--tier-3)} .cx-app-open{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s-2);width:100%;height:100%;padding:var(--s-5);text-align:left;cursor:pointer;background:var(--local-card-bg);color:inherit;border:1px solid var(--local-card-border);border-radius:var(--r-3);transition:border-color .2s ease,transform .2s ease} .cx-app-open:hover{border-color:var(--tier-color,var(--brand));transform:translateY(-2px)} .cx-app-meta{display:flex;align-items:center;gap:var(--s-2);font-size:var(--t-eyebrow);color:var(--local-text-2)} .cx-app-dot{flex:none;width:6px;height:6px;border-radius:2px;background:var(--tier-color,var(--brand))} .cx-app-name{font-size:var(--t-h3);font-weight:500;line-height:1.35} .cx-app-one{font-size:var(--t-small);color:var(--local-text-2);line-height:1.65} .cx-app-more{display:inline-flex;align-items:center;gap:var(--s-2);margin-top:auto;padding-top:var(--s-3);font-size:var(--t-small);color:var(--tier-color,var(--brand))} /* 00-tokens.css 的 *{margin:0} 会覆盖 UA 的 dialog{margin:auto}，不显式写回弹层会贴到左上角 */ .cx-app-dialog{display:none;margin:auto;inset:0;width:min(920px,92vw);max-height:88dvh;padding:0;background:var(--local-bg);color:var(--local-text);border:1px solid var(--local-card-border);border-radius:var(--r-3);overflow:hidden} .cx-app-dialog[open]{display:flex;flex-direction:column} .cx-app-dialog::backdrop{background:#08131fd9} .cx-dlg-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s-5);padding:var(--s-6) var(--s-6) var(--s-5);border-bottom:1px solid var(--local-line)} .cx-dlg-head h3{margin-top:var(--s-2)} .cx-dlg-one{margin-top:var(--s-2);font-size:var(--t-small);color:var(--local-text-2)} .cx-dlg-close{flex:none;display:grid;place-items:center;width:36px;height:36px;cursor:pointer;background:transparent;color:var(--local-text-2);border:1px solid var(--local-line);border-radius:var(--r-pill)} .cx-dlg-close:hover{border-color:var(--brand);color:var(--brand)} .cx-dlg-close svg{width:18px;height:18px} /* 模态打开期间锁住文档滚动，配合 11-motion.js 的 lockScroll() */ /* 数字条：+ / % 归数字，同色同字号；单位词保持灰色小字。 data-tone 绑定指标语义（10+个=钢蓝 / 3类=靛紫 / 3种=深青 / 40+成员=古铜 / 100%=靛紫），跨页一致。 */ .stat .n .sign{font-size:1em;color:inherit;margin-left:0} .stat[data-tone="t1"] .n{color:var(--tier-1)} .stat[data-tone="t2"] .n{color:var(--tier-2)} .stat[data-tone="t3"] .n{color:var(--tier-3)} .stat[data-tone="value"] .n{color:var(--value)} html.is-modal{overflow:hidden} .cx-dlg-body:focus{outline:none} .cx-dlg-body:focus-visible{outline:2px solid var(--brand);outline-offset:-2px} /* flex 列里的子项默认 min-height:auto，不会收缩到内容以下，弹窗顶到 max-height 后正文只会被 overflow:hidden 裁掉而不滚动； flex:1 1 auto + min-height:0 让它在弹窗内被约束，overflow-y:auto 才真正接管。 */ .cx-dlg-body{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;gap:var(--s-5);padding:var(--s-6);overflow-y:auto;overscroll-behavior:contain} /* 真因：正文是 flex 列容器，高度被限住后子项会被 flex 收缩——.cx-app-shot 带 overflow:hidden，最小尺寸为 0， 溢出量全被它吞掉（截图被压扁裁切），scrollHeight==clientHeight，浏览器认为无可滚动。子项一律不收缩，让内容真正溢出。 */ .cx-dlg-body>*{flex:none} .cx-dlg-body h4{margin-bottom:var(--s-2)} .cx-app-shot{width:100%;border:1px solid var(--local-line);border-radius:var(--r-2);overflow:hidden;cursor:zoom-in} .cx-app-shot img{width:100%;height:auto;display:block} .cx-group-summary{display:grid;gap:var(--s-4);margin-top:var(--s-6)} .cx-group-summary p{font-size:var(--t-small);color:var(--local-text-2)} .cx-group-summary strong{font-weight:500;color:var(--local-text)} .gp-kpi .badge{white-space:normal;line-height:1.7} #app .gp-siblings{grid-template-columns:repeat(2,minmax(0,1fr))} .ab-head .stats-row .stat,.ab-group-kpis .stat{text-align:center;align-items:center;padding-inline:var(--s-4);min-width:0} .ab-head .stats-row .stat .n,.ab-group-kpis .stat .n{display:flex;align-items:baseline;justify-content:center;flex-wrap:wrap;row-gap:var(--s-2);width:100%;min-height:1.5em} .ab-head .stats-row .stat .label,.ab-group-kpis .stat .k{width:100%} .ab-head .stats-row .stat .suffix{margin-left:var(--s-1)} /* The nav's backdrop filter makes it the fixed-position containing block. 含 var() 的声明不能靠同一规则里前一行回退，dvh 只在支持时用 @supports 覆盖 */ #shell-nav .nav-overlay{height:calc(100vh - var(--nav-h));bottom:auto} @supports (height:100dvh){#shell-nav .nav-overlay{height:calc(100dvh - var(--nav-h))}} .nav-overlay-inner{max-height:100%;overflow-y:auto;overscroll-behavior:contain;padding-bottom:var(--s-8)} /* ── 手机菜单 · 方案B 深绿面板（2026-10-11 用户选定，见 docs/plan/手机菜单修复-2026-10-11-plan.md）── 覆盖层是 .nav 的子节点，必须自带前景色，否则继承 15-effects.css:15 顶栏的 #182c21，压在深底上看不见。 #13271f 沿用 15-effects.css:15 滚动态顶栏和页脚的底色（00-tokens 没有对应 token）；文字颜色用 token。 15-effects.css 的 #shell-nav .nav-link{color:inherit} 是 (1,1,0)，这里统一带 #shell-nav 前缀。 */ #shell-nav .nav-overlay{background:#13271f;color:var(--white);--local-text:var(--white);--local-text-2:var(--gc7);--local-line:var(--g57)} /* 菜单打开时顶栏同步转深绿，与面板连成一个面；与 .is-scrolled 同为 (1,2,0)，本文件后加载所以胜出 */ #shell-nav .nav.nav--menu-open{background:#13271f;color:var(--white)} /* 面板淡入淡出与顶栏底色过渡同步（15-effects.css:15 顶栏为 background .2s ease），开合途中不出现接缝； 减少动态效果时 SHELL_CSS 的 transition-duration:0ms !important 仍然生效 */ #shell-nav .nav-overlay{transition:opacity .2s ease,visibility 0s linear .2s} #shell-nav .nav-overlay.is-open{transition-delay:0s} /* 面板可滚动时上下边缘渐隐：滑动后首行不会被顶栏"切一刀"，内容溢出时底部渐隐提示还有更多。 渐隐区小于上下内边距，未滚动时的首行、滚到底时的「方案咨询」都不受影响 */ #shell-nav .nav-overlay-inner{ -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 var(--s-4),#000 calc(100% - var(--s-6)),transparent 100%); mask-image:linear-gradient(to bottom,transparent 0,#000 var(--s-4),#000 calc(100% - var(--s-6)),transparent 100%)} /* 汉堡图标跟随顶栏字色（顶部 #182c21、滚动后与菜单打开时为白），不再依赖 .nav--light 取样 */ #shell-nav .nav-burger span{background:currentColor} /* 当前项底线只画在文字下方：弹性项默认被拉满整行 */ #shell-nav .nav-link-mobile{align-self:flex-start} /* 左边距与顶栏 .nav-inner 一致（logo 对齐） */ #shell-nav .nav-overlay-inner{max-width:1440px;padding-inline:var(--pad)} /* 手机与横屏矮视口收紧间距，让「方案咨询」尽量落在首屏；字号保持 --t-h3 */ @media (max-width:767px),(max-width:899px) and (max-height:640px){ #shell-nav .nav-overlay-inner{padding-block:var(--s-5) var(--s-6);gap:var(--s-4)} #shell-nav .nav-link-mobile{line-height:1.3;padding-block:var(--s-1)} } [id^="depth-"],#value-depth,#team{scroll-margin-top:calc(var(--nav-h) + var(--s-6))} @media(max-width:1023px){.cx-app-grid{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:767px){ .cx-filter{padding:var(--s-3) var(--s-4)} .cx-app-grid{grid-template-columns:minmax(0,1fr)} .cx-dlg-body .ba{grid-template-columns:minmax(0,1fr)} .cx-app-dialog{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border:0;border-radius:0} .cx-dlg-head,.cx-dlg-body{padding:var(--s-5)} } @media(max-width:639px){#app .gp-siblings{grid-template-columns:minmax(0,1fr)}} /* 分组页场景网格：两列；.cx-app-cell 为网格单元并承载旧 #s- 锚点 */ .cx-app-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))} .cx-app-cell{display:grid;scroll-margin-top:calc(var(--nav-h) + var(--s-6))} @media(max-width:767px){.cx-app-grid--2{grid-template-columns:minmax(0,1fr)}} /* 业务分类封面：Logo 配色图标面板（方案 B）。--tier-color 由 .sl-dom / .gp-head 的 data-tier 提供 */ .tier-icons{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center;justify-items:center;gap:var(--s-3);aspect-ratio:16/9;padding:0 var(--s-5);border-radius:var(--r-3);background:color-mix(in srgb,var(--tier-color,var(--brand)) 14%,var(--local-bg))} .tier-icons img{width:clamp(48px,80%,108px);height:auto;aspect-ratio:1;object-fit:contain;display:block} .gp-head .tier-icons{background:color-mix(in srgb,var(--tier-color,var(--brand)) 22%,var(--local-bg))} @media(max-width:767px){.tier-icons{padding:0 var(--s-4)}} /* ══════════════════════════════════════════════════════════ 17-industry.css · 2026-10-12 官网按行业改版 · 公共样式 行业方案四页、获客增长、企业智能经营（含案例详情）、首页新段落与导航“行业方案”下拉共用； 各页独有的版式写在对应视图切片的私有 CSS 数组里。 依据：已认可样稿 docs/plan/官网按行业改版/mockups/mock.css 与 DESIGN.md「行业改版新增组件」。 颜色、字号、间距只用 00-tokens.css 的变量（另含 15-effects.css :root 已有的 --evergreen / --ice）； 样稿里没有令牌的字号用令牌 calc 表达并注明样稿值。样稿的浅绿 #f1f3f2 收为 --gf5，细线 #cdd4d0 收为 --gc7。 样稿的橙色虚线框、橙色小标签只是样稿标注，不进正式样式。 ══════════════════════════════════════════════════════════ */ /* ── 导航 · “行业方案”下拉（桌面）── 15-effects.css 用 #shell-nav 前缀改写顶栏，这里同样带前缀；SHELL_CSS 在本文件之后注入。 */ #shell-nav .nav-drop{position:relative;display:flex;align-items:center} #shell-nav .nav-drop-btn{display:inline-flex;align-items:center;gap:var(--s-1);font:inherit;font-size:var(--t-small);line-height:inherit;color:inherit;background:none;border:0;cursor:pointer;white-space:nowrap} #shell-nav .nav-caret{width:14px;height:14px;flex:none;transition:transform var(--d-base) var(--ease-out)} /* 当前页底线只画在文字下方，不压到箭头上（箭头 14px + 间距 --s-1） */ #shell-nav .nav-drop-btn.is-active::after{right:calc(14px + var(--s-1))} #shell-nav .nav-drop-panel{ position:absolute;top:calc(100% + var(--s-3));left:calc(-1 * var(--s-4));z-index:2; min-width:240px;padding:10px;display:flex;flex-direction:column; background:var(--white);color:var(--g10); border:1px solid var(--gea);border-radius:var(--r-2); /* 已有的导航浮层柔影（DESIGN.md 行业方案下拉）；tokens 没有阴影档位 */ box-shadow:0 20px 24px #0001; opacity:0;visibility:hidden;transform:translateY(-4px);pointer-events:none; transition:opacity var(--d-base) var(--ease-out),transform var(--d-base) var(--ease-out),visibility 0s linear var(--d-base); } /* 按钮与面板之间的空隙补一条透明桥，鼠标移过去不丢悬停 */ #shell-nav .nav-drop-panel::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:var(--s-3)} /* 开合只看 .is-open：悬停、点击、↓ 键都由 20-shell.js 的 bindNavDrops 置类并同步 aria-expanded； 不再用 :hover / :focus-visible 直接撑开，否则 Escape 关不掉、读屏状态与画面不一致（2026-10-12 修订） */ #shell-nav .nav-drop.is-open .nav-drop-panel{opacity:1;visibility:visible;transform:none;pointer-events:auto;transition-delay:0s} #shell-nav .nav-drop.is-open .nav-caret{transform:rotate(180deg)} #shell-nav .nav-drop-head{padding:6px var(--s-3) var(--s-2);font-size:var(--t-eyebrow);line-height:1.5;color:var(--g57);letter-spacing:.08em} #shell-nav .nav-drop-link{display:flex;align-items:center;padding:10px var(--s-3);border-radius:6px;font-size:var(--t-small);line-height:1.5;color:var(--g10);white-space:nowrap;transition:background-color var(--d-fast) var(--ease-inout)} #shell-nav .nav-drop-link:hover{background:var(--gf5)} #shell-nav .nav-drop-link.is-active{color:var(--brand);font-weight:500} /* 10-15 修订（样稿 D2 .drop a em：12px --g92、右对齐）：当前行业项右侧小标“当前”，文字读 data-here（CONTENT.ui.navCurrent）； 第二条 content 带替代文本 ""，支持的浏览器读屏不重复播报（链接已有 aria-current） */ #shell-nav .nav-drop-link.is-active[data-here]::after{content:attr(data-here);content:attr(data-here) / "";margin-left:auto;padding-left:var(--s-5);font-size:var(--t-eyebrow);font-weight:400;color:var(--g92)} #shell-nav .nav-drop-link:focus-visible{outline:2px solid var(--brand);outline-offset:-2px} /* 2026-10-15 K2+：行业色圆点（7px，样稿 .drop a i）与底部一行“其他行业从一个场景开始，方案咨询”（样稿 .drop-foot：12px --g92，链接按钮蓝） */ #shell-nav .nav-drop-dot{width:7px;height:7px;flex:none;margin-right:10px;border-radius:50%;background:var(--acc,var(--gc7))} #shell-nav .nav-drop-link[data-tone="value"]{--acc:var(--value)} #shell-nav .nav-drop-link[data-tone="t1"]{--acc:var(--tier-1)} #shell-nav .nav-drop-link[data-tone="t2"]{--acc:var(--tier-2)} #shell-nav .nav-drop-link[data-tone="t3"]{--acc:var(--tier-3)} #shell-nav .nav-drop-foot{margin-top:6px;padding:10px var(--s-3) var(--s-1);border-top:1px solid var(--gea);font-size:var(--t-eyebrow);line-height:1.6;color:var(--g92);white-space:nowrap} #shell-nav .nav-drop-foot a{color:var(--cta)} #shell-nav .nav-drop-foot a:hover{text-decoration:underline} #shell-nav .nav-drop-foot a:focus-visible{outline:2px solid var(--brand);outline-offset:2px} /* 2026-10-15：顶栏“方案咨询”与页内主按钮同为按钮蓝（DESIGN.md colors.action = --cta；K2+ / D2 / G2 / O2 样稿 .nav-cta） */ #shell-nav .nav-cta,#shell-nav .nav-cta-mobile{background:var(--cta);color:var(--white)} #shell-nav .nav-cta:hover,#shell-nav .nav-cta-mobile:hover{background:var(--cta-deep)} /* 手机顶栏常驻“方案咨询”（K2+ 注释“手机端顶栏常驻方案咨询”）：899px 及以下汉堡左侧保留小号按钮（样稿 13px 字、6px 12px 内距、36px 高）； 菜单展开时隐藏，菜单底部另有同名按钮 */ @media (max-width:899px){ #shell-nav .nav-actions{gap:var(--s-2)} #shell-nav .nav-actions .nav-cta{display:inline-flex;align-items:center;min-height:36px;padding:6px var(--s-3);font-size:var(--t-mono)} #shell-nav .nav.nav--menu-open .nav-cta{visibility:hidden} } /* 七项一级菜单 + 按钮在 900–1279 一行放得下：样稿 1279 以下间距 16px，再窄收到 12px */ @media (max-width:1279px){ #shell-nav .nav-links{gap:var(--s-4)} #shell-nav .nav-inner{gap:var(--s-4)} } @media (max-width:1023px) and (min-width:900px){ #shell-nav .nav-links{gap:var(--s-3)} #shell-nav .nav-cta{padding-inline:var(--s-5)} } /* ── 手机深绿菜单 · 行业方案分组（沿用 2026-10-11 方案B，配色继承 16-content-update.css 的面板）── */ #shell-nav .nav-group-mobile{display:flex;flex-direction:column;gap:var(--s-2)} #shell-nav .nav-group-label{align-self:flex-start;font-size:var(--t-h3);line-height:1.3;color:var(--white)} #shell-nav .nav-group-links{display:flex;flex-wrap:wrap;gap:var(--s-1) var(--s-5)} #shell-nav .nav-overlay .nav-link-sub{font-size:var(--t-body);line-height:1.5;color:var(--gc7);padding-block:var(--s-1)} #shell-nav .nav-overlay .nav-link-sub.is-active{color:var(--white)} @media (max-width:767px),(max-width:899px) and (max-height:640px){ #shell-nav .nav-group-label{padding-block:var(--s-1)} #shell-nav .nav-group-mobile{gap:var(--s-1)} } /* 2026-10-15 第二次改版：首页 / 行业页 / 获客增长 / 企业智能经营的版式已移到 18 / 19 / 20， 这里原有的页头、速览卡、序号圆点、三格数字条、截图框、能力块缩略图、行业卡、案例卡整卡、筛选条、黑色链接卡渲染后已无元素使用，删去； 下面只留仍在用的公共样式。 */ /* ── 截图放大层 · 界面截图模式（2026-10-13 第三轮核验修订）：data-gallery-srcs 打开时 dialog 带 .is-shot，图片包在 .gallery-stage 里。 桌面（≥1024px）照旧整图适配（与 15-effects.css 的 .gallery-image 同尺寸算法：高度减去工具条与翻页条 130px），说明小字约 10px。 1023px 以下 1600 宽截图整图适配后太小（390 只剩约 330×176、768 约 690×369，说明小字 3–6px 看不清）：改为按原图像素尺寸显示、 框内上下左右拖动查看，图下一行提示。团队风采等照片（data-gallery-keys）不带 .is-shot，不受影响。 ── */ .gallery-dialog.is-shot .gallery-stage{height:calc(100% - 130px);overflow:hidden} .gallery-dialog.is-shot .gallery-image{display:block;width:100%;height:100%;object-fit:contain} .gallery-hint{display:none} @media (max-width:1023px){ /* 158px = 原 130px + 提示行（12px 字 × 1.6 行高 ≈ 20px）+ 间距 8px */ .gallery-dialog.is-shot .gallery-stage{height:calc(100% - 158px);overflow:auto;overscroll-behavior:contain;border:1px solid var(--gea);border-radius:var(--r-1);background:var(--white)} .gallery-dialog.is-shot .gallery-image{width:auto;height:auto;max-width:none;max-height:none;object-fit:fill} .gallery-dialog.is-shot .gallery-hint{display:block;margin-top:var(--s-2);text-align:center;font-size:var(--t-eyebrow);line-height:1.6;color:var(--g57)} } /* ── 案例编号与封面（企业智能经营案例详情沿用；DESIGN.md「案例卡」） ── */ /* 封面：2:1 浅灰底框，图已在 media/cases/ 预先裁好打码，contain 放进去；没有图时是同尺寸中性浅灰框，不写字（DESIGN.md） */ .ix-case-cover{position:relative;margin:var(--s-4) var(--s-5) 0;aspect-ratio:2;border-radius:6px;overflow:hidden;background:var(--gf5);border:1px solid var(--gea)} .ix-case-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain} .ix-metric{font-size:calc(var(--t-h3) + var(--s-3)) /* 样稿 34px */;line-height:1;font-weight:500;color:var(--brand)} .ix-ba{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-1) 10px;font-size:var(--t-lede);line-height:1.45} .ix-ba .from,.ix-ba .arr{color:var(--g57)} .ix-ba .to{color:var(--brand);font-weight:500} .ix-big-l{font-size:var(--t-mono);color:var(--g57)} /* ── 右侧联系栏安全区（2026-10-16 xiao 拍板方案①）：版心 .fx-wrap 与顶栏左右内边距取 --gut（00-tokens.css）， 联系栏显示的宽度档两侧对称留出 --dock-safe，内容仍水平居中；手机 --gut = --pad，不变 ── */ .fx-wrap{padding-inline:var(--gut)} #shell-nav .nav-inner,#shell-nav .nav-overlay-inner{padding-inline:var(--gut)} /* 手机菜单面板与 logo 同一左边线（768–899 汉堡档 --gut = 48） */ /* ── 页脚 · 行业栏末尾“其他行业方案咨询 →”（K2+ .foot-col .soft：小一档） ── */ #shell-footer .footer-link.is-soft{font-size:var(--t-mono)} /* v3 首页只保留专属布局；眉标、卡片、截图、按钮、收尾都在05-system。 */ body.is-home #app{padding-top:var(--nav-h)} .hm-hero .cx-display{font-size:var(--cx-display)} .hm-emphasis{font-style:normal;color:var(--cta)} .hm-hero .cx-brandtag{max-width:100%;text-align:left} .hm-hero .cx-brandtag>img{flex-shrink:0} .hm-products{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-5)} .hm-products>a{min-width:0;display:block;padding-block:var(--s-1)} .hm-products>a+a{padding-left:var(--s-5);border-left:1px solid var(--cx-dk-line)} .hm-products b{display:block;font-size:var(--cx-card-t);font-weight:500;line-height:1.4} .hm-products span{display:block;margin-top:var(--s-1);font-size:var(--t-mono);line-height:1.6;color:var(--shell-text)} .hm-products>a:hover b{text-decoration:underline;text-underline-offset:.2em} .hm-level{font-size:var(--t-mono);color:var(--g57);font-weight:400} .is-shell .hm-level{color:var(--shell-text)} .cx-inds{grid-template-columns:repeat(4,minmax(0,1fr)) auto;gap:var(--s-3)} .cx-ind>a{padding-inline:var(--s-3);font-size:var(--cx-text)} /* 首屏行业卡采用已选 A 版：整卡链接、两列场景胶囊，不渲染卡外收益说明。 */ .hm-hero .cx-layers,.hm-hero .cx-acts{margin-top:var(--s-5)} .hm-hero .cx-ind:not(.hm-more-ind){display:block} .hm-hero .cx-ind:not(.hm-more-ind)>a{width:100%;height:calc(var(--s-10) + var(--s-7) + var(--s-1));padding:var(--s-4) var(--s-3);flex-direction:column;align-items:stretch;justify-content:flex-start;gap:calc(var(--s-3) * 1.5);border:1px solid transparent} .hm-ind-head{display:flex;align-items:center;justify-content:space-between;gap:var(--s-2)} .hm-ind-head>b{font-size:var(--t-body);line-height:1.5;font-weight:500;white-space:nowrap} .hm-hero .hm-ind-head>small{font-size:var(--t-eyebrow);line-height:1.5;font-weight:400;opacity:.8;white-space:nowrap} .hm-ind-scenes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:calc(var(--s-2) + var(--s-1) / 2) calc(var(--s-3) / 2);font-size:var(--t-eyebrow);font-weight:400;line-height:1.6} .hm-ind-scenes>li{border-radius:var(--r-pill);padding:calc(var(--s-3) / 2) var(--s-1);text-align:center;white-space:nowrap;background:color-mix(in srgb,var(--white) 12%,transparent);border:1px solid color-mix(in srgb,var(--white) 24%,transparent)} .hm-hero .hm-more-ind{align-self:start} .cx-layer{grid-template-columns:180px minmax(0,1fr)} /* 分层图左列依据推荐样稿200收紧到180，为四行业入口留位。 */ .hm-directions{flex-basis:100%;display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-2);min-width:0} .hm-directions-label{font-size:var(--t-eyebrow);color:var(--g57);white-space:nowrap} .hm-capabilities .cx-layer-c{flex-wrap:nowrap} .hm-depts{flex:1;flex-wrap:nowrap;justify-content:space-between} .hm-growth{display:flex;align-items:center;gap:var(--s-3);padding-left:var(--s-4);border-left:1px solid var(--gc7);white-space:nowrap} .hm-hub-brand{display:grid;gap:var(--s-1)} .hm-hub-brand>p{font-size:var(--cx-h3);font-weight:500;line-height:1.4} .hm-hub-brand>span{font-size:var(--t-mono);color:var(--shell-text);line-height:1.6} .hm-more-ind>a{background:var(--white);color:var(--ink);border:1px solid var(--gc7);min-width:var(--s-8);justify-content:center} .hm-more-ind>a:hover{border-color:var(--ink)} .hm-ind-card{padding:var(--s-5);gap:var(--s-4)} .hm-ind-card .cx-card-top{flex-wrap:wrap;gap:var(--s-2)} .hm-ind-card .cx-card-t{font-size:var(--cx-card-t)} .hm-ind-card .cx-kv{font-size:var(--t-small)} .hm-ind-card .cx-shot{width:100%} .hm-swipe-hint{display:none;font-size:var(--t-eyebrow);color:var(--g57);margin-top:var(--s-3)} .hm-nw-actions{display:flex;align-items:center;gap:var(--s-5)} .hm-nw-controls{display:flex;gap:var(--s-2)} .hm-nw-controls .cx-btn{width:44px;min-height:44px;padding:0;justify-content:center} .hm-nw-controls .cx-btn svg{width:18px;height:18px} .hm-nw-controls .cx-btn:disabled{opacity:.35;cursor:default} .hm-nw-controls[hidden],.hm-nw-hint[hidden]{display:none} .hm-nw-list{position:relative;display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 2 * var(--s-5)) / 3);gap:var(--s-5);overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none} .hm-nw-list::-webkit-scrollbar{display:none} .hm-nw-list:focus-visible{outline:2px solid var(--cta);outline-offset:var(--s-1)} .hm-nw-item{min-width:0;position:relative;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:var(--s-4);padding:var(--s-5) 0;scroll-snap-align:start} .hm-nw-item+.hm-nw-item{border-left:1px solid var(--gea);padding-left:var(--s-5)} .hm-nw-hint{font-size:var(--t-eyebrow);color:var(--g57);margin-top:var(--s-1)} .hm-nw-thumb img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:var(--r-2)} .hm-nw-thumb{position:relative;z-index:1} /* 图链高于标题铺满的热区，两个真实入口均可点击。 */ .hm-nw-item h3{margin-top:var(--s-2);font-size:var(--cx-text);line-height:1.55;font-weight:500} .hm-nw-item h3 a::after{content:"";position:absolute;inset:0} .hm-nw-item h3 a:hover{text-decoration:underline;text-underline-offset:.2em} .hm-nw-item h3 a:focus-visible::after{outline:2px solid var(--cta);outline-offset:-2px} .hm-case .ix-kpis{margin-top:0} @media(min-width:1024px){.hm-hero .cx-layers,.hm-hero .cx-acts{margin-top:var(--s-4)}} @media(max-width:1180px){ .hm-capabilities .cx-layer-c{flex-wrap:wrap} .hm-depts{flex:initial;flex-wrap:wrap;justify-content:flex-start} .hm-growth{margin-left:auto} .hm-nw-list{grid-auto-columns:calc((100% - var(--s-5)) / 2)} .hm-nw-item{grid-template-columns:112px minmax(0,1fr);padding-block:var(--s-4)} .cx-layer{grid-template-columns:160px minmax(0,1fr)} .cx-inds{grid-template-columns:repeat(2,minmax(0,1fr)) auto} .hm-more-ind{grid-column:3;grid-row:1/span 2} .hm-more-ind>a{height:100%} } @media(max-width:767px){ .hm-products{grid-template-columns:minmax(0,1fr);gap:var(--s-3)} .hm-products>a{display:grid;grid-template-columns:6em minmax(0,1fr);gap:var(--s-3);align-items:baseline} .hm-products>a+a{padding-left:0;padding-top:var(--s-3);border-left:0;border-top:1px solid var(--cx-dk-line)} .hm-products span{margin-top:0} .hm-hero .cx-brandtag{font-size:var(--t-mono)} .hm-hero .cx-ind:not(.hm-more-ind)>a{height:auto;min-height:var(--s-10);padding:calc(var(--s-3) + var(--s-1) / 2);gap:var(--s-3)} .hm-hero .hm-ind-head>small{display:block} .hm-ind-scenes{gap:var(--s-2);font-size:var(--t-mono)} .hm-ind-scenes>li{padding:calc(var(--s-1) * 1.25) var(--s-2)} .hm-hero .hm-more-ind{display:block} .hm-hero .hm-more-ind>a{width:100%} .hm-growth{margin-left:0;padding-left:0;border-left:0;white-space:normal;flex-wrap:wrap} .cx-hero .cx-display .cx-nb{display:block;white-space:nowrap} .cx-layer{grid-template-columns:minmax(0,1fr)} .cx-inds{grid-template-columns:minmax(0,1fr)} .hm-more-ind{grid-column:auto;grid-row:auto} .hm-more-ind>a{height:42px} .hm-nw-list{grid-auto-columns:88%;gap:var(--s-4)} .hm-nw-item,.hm-nw-item+.hm-nw-item{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:var(--s-3);padding-left:0;border-left:0} .hm-nw-head .hm-nw-actions{width:100%;justify-content:space-between;align-items:center} .hm-nw-item h3{font-size:var(--t-small)} .hm-swipe-hint{display:block} .cx-grid.is-4.is-rail>*{flex-basis:84%} } /* 小于验收主档390时保留34px字阶，长句自然换行，避免移动布局视口被撑宽。 */ @media(max-width:389px){ .cx-hero .cx-display .cx-nb{white-space:normal} .hm-hero .cx-brandtag{gap:var(--s-2);padding-inline:var(--s-1) var(--s-3)} } /* 行业方案与获客增长的专用布局 / 业务界面。公共组件见 05-system.css。 */ /* 保留的 --ix-* 来自已接受样稿 mockups-v2/pages/D2.html、G2.html 的界面几何与小字号； 2/3/5/6/7/9/10/11/13/14/18/20/22/26/28/30/34/36/40/44/56/72px 是原样稿间距，非标准字阶为原样稿小字。 标题、页头、区段尺寸、动作与卡片统一引用 00-tokens.css 的 --cx-*；本页不新增配色。 */ :root{--ix-s-2:2px; --ix-s-3:3px; --ix-s-5:5px; --ix-s-6:6px; --ix-s-7:7px; --ix-s-9:9px; --ix-s-10:10px; --ix-s-11:11px; --ix-s-13:13px; --ix-s-14:14px; --ix-s-18:18px; --ix-s-20:20px; --ix-s-22:22px; --ix-s-26:26px; --ix-s-28:28px; --ix-s-30:30px; --ix-s-34:34px; --ix-s-36:36px; --ix-s-40:40px; --ix-s-44:44px; --ix-s-56:56px; --ix-s-72:72px; --ix-t-10h5:calc(var(--t-eyebrow) - 1.5px); --ix-t-11:calc(var(--t-eyebrow) - 1px); --ix-t-11h5:calc(var(--t-eyebrow) - .5px); --ix-t-12h5:calc(var(--t-eyebrow) + .5px); --ix-t-13h5:calc(var(--t-small) - .5px); --ix-t-14h5:calc(var(--t-small) + .5px); --ix-t-15:calc(var(--t-body) - 1px); --ix-t-15h5:calc(var(--t-body) - .5px); --ix-t-16h5:calc(var(--t-body) + .5px); --ix-t-lede-p1:calc(var(--t-lede) + 1px); --ix-t-lede-p2:calc(var(--t-lede) + 2px); --ix-t-22:calc(var(--t-h3) - 2px);} .ix-page,.gw-page{--acc:var(--brand);--acc-d:var(--dk-brand); --ix-edge:color-mix(in srgb,var(--brand) 7%,var(--gea)); --ix-paper:color-mix(in srgb,var(--brand) 4%,var(--white)); --ix-sk:color-mix(in srgb,var(--brand) 9%,var(--gea)); --ix-sk-blue:color-mix(in srgb,var(--brand) 22%,var(--white)); --ix-grid-line:color-mix(in srgb,var(--brand) 7%,transparent); --ix-slate:color-mix(in srgb,var(--brand-d) 30%,var(--g21)); --ix-warm:color-mix(in srgb,var(--value) 10%,var(--white)); --ix-warm-2:color-mix(in srgb,var(--value) 24%,var(--white)); --ix-warm-line:color-mix(in srgb,var(--value) 50%,var(--white)); --ix-warm-ink:color-mix(in srgb,var(--value) 72%,var(--black)); --ix-ok-bg:color-mix(in srgb,var(--tier-2) 10%,var(--white)); --ix-ok-ink:color-mix(in srgb,var(--tier-2) 80%,var(--black)); --ix-night:color-mix(in srgb,var(--brand-d) 22%,var(--g10)); --ix-shade:color-mix(in srgb,var(--ink) 30%,transparent); --ix-shade-s:color-mix(in srgb,var(--ink) 8%,transparent); color:var(--ink);background:var(--white);} .ix-page[data-tone="value"]{--acc:var(--value);--acc-d:var(--dk-value)} .ix-page[data-tone="t1"]{--acc:var(--tier-1);--acc-d:var(--dk-tier-1)} .ix-page[data-tone="t2"]{--acc:var(--tier-2);--acc-d:var(--dk-tier-2)} .ix-page[data-tone="t3"]{--acc:var(--tier-3);--acc-d:var(--dk-brand)} .ix-seg>span{display:inline-block} .ix-hero{--peek:26px;--shift:40px;--bar:var(--cx-bar-h);--thumbs:74px;--hero-h:calc(min(100svh,960px) - var(--nav-h));} .ix-hero>.fx-wrap{width:100%} .ix-stage{min-width:0} .ix-p3{margin-top:var(--ix-s-30)}.ix-p3 ol{margin-top:var(--ix-s-10);border-top:1px solid var(--line)} .ix-p3 li{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--ix-s-6);padding:var(--ix-s-11) 0;border-bottom:1px solid var(--line);font-size:var(--ix-t-15h5);line-height:1.55;color:var(--ink)} .ix-stack{position:relative;margin-left:auto;padding-top:calc(var(--peek) * 2); width:min(100%,calc((var(--hero-h) - 40px - var(--peek) * 2 - var(--bar) - var(--thumbs)) * var(--arn) + var(--shift)))} .ix-stack-sizer{margin-right:var(--shift);padding-top:calc(var(--bar) + 100% / var(--arn))} .ix-sheet{position:absolute;left:0;top:calc(var(--peek) * 2);width:calc(100% - var(--shift));overflow:hidden; will-change:transform} .ix-sheet[data-pos="0"]{z-index:3} .ix-sheet[data-pos="1"]{z-index:2;transform:translate(calc(var(--shift) / 2),calc(var(--peek) * -1));cursor:pointer;} .ix-sheet[data-pos="2"]{z-index:1;transform:translate(var(--shift),calc(var(--peek) * -2));cursor:pointer;} .ix-sheet-bar{position:relative;} .ix-sheet[data-pos="1"] .ix-sheet-bar{background:color-mix(in srgb,var(--ix-edge) 40%,var(--white))} .ix-sheet[data-pos="2"] .ix-sheet-bar{background:color-mix(in srgb,var(--ix-edge) 70%,var(--white))} .ix-sheet-bar span{margin-left:var(--s-2);overflow:hidden;text-overflow:ellipsis} .ix-sheet-bar span b,.ix-media-bar span b{color:var(--ink);font-weight:500} .ix-sheet-bar em,.ix-media-bar em{margin-left:auto;padding-left:var(--s-3);font-style:normal;font-family:var(--font-mono);font-size:var(--ix-t-11h5);color:var(--acc);letter-spacing:.04em} .ix-sheet-body{position:relative;aspect-ratio:var(--ar);overflow:hidden;background:var(--ix-paper)} .ix-sheet-body::after{content:"";position:absolute;inset:0;pointer-events:none;background:transparent;transition:background var(--d-slow) var(--ease-out)} .ix-sheet[data-pos="1"] .ix-sheet-body::after{background:color-mix(in srgb,var(--ix-edge) 35%,transparent)} .ix-sheet[data-pos="2"] .ix-sheet-body::after{background:color-mix(in srgb,var(--ix-edge) 55%,transparent)} .ix-sheet-shot{position:absolute;left:0;top:0;width:100%} .ix-sheet-shot>img{width:100%;height:auto} .ix-ring{position:absolute;z-index:2;border:2px solid var(--acc);border-radius:10px;box-shadow:0 0 0 4px color-mix(in srgb,var(--acc) 16%,transparent);pointer-events:none;transition:opacity var(--d-base) var(--ease-out) var(--d-fast),transform var(--d-slow) var(--ease-out) var(--d-fast)} .ix-sheet:not([data-pos="0"]) .ix-ring,.ix-sheet:not([data-pos="0"]) .ix-legend5{opacity:0;transform:scale(.985);transition-delay:0s} .ix-tag{position:absolute;z-index:3;left:-2px;bottom:calc(100% + 6px);display:inline-flex;align-items:center;gap:var(--ix-s-6);height:24px;padding:0 var(--ix-s-11) 0 var(--ix-s-9);border-radius:var(--r-2);background:var(--ink);color:var(--white);font-size:var(--ix-t-12h5);font-weight:400;line-height:1;white-space:nowrap;box-shadow:0 8px 18px -8px color-mix(in srgb,var(--black) 45%,transparent)} .ix-tag::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--acc-d);flex-shrink:0} .ix-ring .ix-tag.is-below{bottom:auto;top:calc(100% + 6px)} .ix-ring .ix-tag.is-inside{bottom:auto;top:var(--s-2);left:var(--s-2)} .ix-ring .ix-tag.is-right{left:auto;right:-2px} .ix-legend5{position:absolute;z-index:2;left:var(--s-3);bottom:var(--s-3);display:flex;flex-wrap:wrap;gap:var(--ix-s-6);padding:var(--ix-s-7) var(--ix-s-9);border-radius:10px;background:color-mix(in srgb,var(--white) 94%,transparent);box-shadow:0 10px 26px -12px var(--ix-shade);font-size:var(--t-eyebrow);line-height:1;transition:opacity var(--d-base) var(--ease-out) var(--d-fast)} .ix-legend5 span,.ix-legend-row span{display:inline-flex;align-items:center;gap:var(--ix-s-5);height:22px;padding:0 var(--s-2);border-radius:6px;background:var(--gf5)} .ix-legend5 i,.ix-legend-row i{width:8px;height:8px;border-radius:2px;background:var(--c,var(--gc7))} .ix-page .is-green{--c:var(--mark-ok)} .ix-page .is-blue{--c:var(--mark-calc)} .ix-page .is-orange{--c:var(--mark-check)} .ix-page .is-red{--c:var(--mark-conflict)} .ix-page .is-yellow{--c:var(--mark-missing)} .ix-thumbs{height:var(--thumbs);display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s-4);margin-right:var(--shift)} .ix-thumbs-hint{min-width:0;font-size:var(--t-mono);line-height:1.5;color:var(--g57);padding-bottom:var(--ix-s-10)} .ix-thumbs-hint b{font-weight:500;color:var(--ink)} .ix-thumbs-list{display:flex;gap:var(--s-2);flex-shrink:0} .ix-stage.has-many .ix-thumbs-hint{display:none} .ix-stage.has-many .ix-thumbs-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));min-width:0;width:100%} .ix-stage.has-many .ix-thumb{min-width:0;gap:var(--s-2);padding-right:var(--s-2)} .ix-stage.has-many .ix-thumb-i{width:44px;height:34px} .ix-stage.has-many .ix-thumb-t{min-width:0} .ix-stage.has-many .ix-thumb-t span{overflow:hidden;text-overflow:ellipsis} .ix-thumb{display:flex;align-items:center;gap:var(--ix-s-10);height:56px;padding:var(--ix-s-6) var(--ix-s-14) var(--ix-s-6) var(--ix-s-6);border-radius:var(--r-3);background:color-mix(in srgb,var(--white) 55%,transparent);border:1px solid var(--line);text-align:left;transition:background var(--d-base) var(--ease-out),border-color var(--d-base) var(--ease-out),box-shadow var(--d-base) var(--ease-out)} .ix-thumb:hover{background:var(--white);border-color:var(--gc7)} .ix-thumb-i{width:58px;height:42px;flex-shrink:0;border-radius:7px;overflow:hidden;border:1px solid var(--gea);background:var(--ix-paper)} .ix-thumb-i img{width:100%;height:100%;object-fit:cover;object-position:left top} .ix-thumb-i svg{width:100%;height:100%} .ix-thumb-t b{display:block;font-family:var(--font-mono);font-size:var(--ix-t-11);font-weight:500;line-height:1.2;color:var(--g92);letter-spacing:.04em} .ix-thumb-t span{display:block;font-size:var(--t-mono);font-weight:500;line-height:1.35;color:var(--ink);white-space:nowrap} .ix-thumb.is-on{background:var(--white);border-color:var(--acc);box-shadow:inset 0 0 0 1px var(--acc),0 10px 22px -14px color-mix(in srgb,var(--acc) 70%,transparent)} .ix-thumb.is-on b{color:var(--acc)} .ix-th .bg{fill:var(--ix-paper)} .ix-th .bg.is-white{fill:var(--white)} .ix-th .pc{fill:var(--white);stroke:var(--ix-slate)} .ix-th .ar{stroke:var(--brand)} .ix-th .l-in{fill:var(--g92)} .ix-th .l-pg{fill:var(--brand)} .ix-th .l-en{fill:var(--value)} .ix-th .l-out{fill:var(--ink)} .ix-th .sk rect{fill:var(--ix-sk)} .ix-th .hl{fill:var(--ix-warm-2)} .ix-th .dt circle{fill:var(--gc7)} .ix-th .on{fill:var(--value)} .ix-mfg{position:absolute;inset:0;display:flex;flex-direction:column;gap:var(--s-3);padding:var(--s-4) var(--ix-s-18);font-size:var(--t-mono);line-height:1.5;color:var(--ix-slate); background-color:var(--ix-paper);background-image:linear-gradient(var(--ix-grid-line) 1px,transparent 1px),linear-gradient(90deg,var(--ix-grid-line) 1px,transparent 1px);background-size:14px 14px} .ix-mtabs{display:flex;flex-wrap:wrap;gap:var(--ix-s-6)} .ix-mtabs span{height:30px;padding:0 var(--ix-s-13);border-radius:var(--r-pill);border:1px solid var(--ix-edge);background:var(--white);display:inline-flex;align-items:center;font-size:var(--ix-t-12h5);color:var(--g57)} .ix-mtabs span.is-on{background:var(--ink);border-color:var(--ink);color:var(--white)} .ix-mdraw{position:relative;flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding:var(--ix-s-18) var(--s-4) var(--s-3);border-radius:var(--r-3);background:var(--white);box-shadow:0 0 0 1px var(--ix-shade-s),0 14px 28px -14px var(--ix-shade)} .ix-mdraw svg{width:100%;max-width:600px;height:100%;max-height:100%} .ix-mlegend{display:flex;flex-wrap:wrap;gap:var(--s-1) var(--ix-s-14);font-size:var(--t-eyebrow);color:var(--g57)} .ix-mlegend span{display:inline-flex;align-items:center;gap:var(--ix-s-6)} .ix-mlegend i{width:10px;height:10px;border-radius:3px;background:var(--lc)} .ix-mflow{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--s-2)} .ix-mflow li{position:relative;padding:var(--s-2) var(--ix-s-9) var(--ix-s-9);border-radius:9px;background:var(--white);border:1px solid var(--ix-edge);box-shadow:inset 0 3px 0 var(--lc)} .ix-mflow li b{display:block;font-size:var(--ix-t-12h5);font-weight:500;line-height:1.35;color:var(--ink);text-wrap:balance} .ix-mflow li span{display:block;margin-top:var(--ix-s-3);font-size:var(--ix-t-11);line-height:1.45;color:var(--g57)} .ix-mflow li+li::before{content:"";position:absolute;left:calc(-1 * var(--s-2));top:50%;width:var(--s-2);border-top:1px solid var(--g92)} .ix-page .is-in{--lc:var(--g92)} .ix-page .is-pg{--lc:var(--brand)} .ix-page .is-en{--lc:var(--value)} .ix-page .is-out{--lc:var(--ink)} .ix-mnote{display:flex;align-items:center;gap:var(--s-2);padding:var(--s-2) var(--s-3);border-radius:9px;background:var(--ix-warm);color:var(--ix-warm-ink);font-size:var(--ix-t-12h5);box-shadow:inset 3px 0 0 var(--value)} .ix-msteps{position:absolute;inset:0;display:flex;flex-direction:column;padding:var(--s-3) var(--s-4) var(--ix-s-14);background:var(--white)} .ix-ms-head,.ix-ms-list li{display:grid;grid-template-columns:34px minmax(0,1fr) minmax(0,1.5fr) minmax(0,1.3fr);gap:var(--s-3);align-items:center;padding:0 var(--s-3)} .ix-ms-head{padding-bottom:var(--s-2);font-size:var(--ix-t-11h5);color:var(--g92);border-bottom:1px solid var(--gea)} .ix-ms-list{flex:1;display:grid;grid-template-rows:repeat(7,minmax(0,1fr))} .ix-ms-list li{position:relative;border-bottom:1px solid var(--gf5);font-size:var(--t-mono);line-height:1.4} .ix-ms-list li:last-child{border-bottom:0} .ix-ms-list li b{font-family:var(--font-mono);font-size:var(--t-eyebrow);font-weight:500;color:var(--g92)} .ix-ms-list li strong{font-weight:500;color:var(--ink)} .ix-ms-list li span{color:var(--g57);font-size:var(--ix-t-12h5)} .ix-ms-list li em{justify-self:start;font-style:normal;font-size:var(--t-eyebrow);line-height:1.4;padding:var(--ix-s-3) var(--s-2);border-radius:6px;background:var(--gf5);color:var(--g21)} .ix-ms-list li.is-focus{background:color-mix(in srgb,var(--value) 6%,var(--white));border-radius:9px;box-shadow:inset 3px 0 0 var(--value)} .ix-ms-list li.is-focus b{color:var(--value)} .ix-ms-list li.is-focus span i{font-style:normal;display:inline-flex;align-items:center;height:20px;padding:0 var(--ix-s-7);margin-right:var(--ix-s-6);border-radius:5px;background:var(--value);color:var(--white);font-size:var(--ix-t-11h5)} .ix-ms-list li.is-focus em{background:var(--ix-warm-2);color:var(--ix-warm-ink)} .ix-ms-foot{margin-top:var(--s-2);display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);padding:var(--s-2) var(--s-3);border-radius:9px;background:var(--gf5);font-size:var(--ix-t-12h5);color:var(--g57)} .ix-ms-foot b{font-weight:500;color:var(--ink)} .ix-dg{font-family:var(--font-sans)} .ix-dg .ln{stroke:var(--ix-slate)} .ix-dg .f0{fill:var(--white)} .ix-dg .f1{fill:var(--ix-paper)} .ix-dg .f2{fill:color-mix(in srgb,var(--brand) 9%,var(--gea))} .ix-dg .f3{fill:color-mix(in srgb,var(--brand) 14%,var(--gc7))} .ix-dg .hole{fill:var(--ix-slate);stroke:none} .ix-dg .tx{fill:var(--g57)} .ix-dg .bl{stroke:var(--brand)} .ix-dg .bf{fill:color-mix(in srgb,var(--brand) 10%,var(--white))} .ix-dg .bt{fill:var(--brand-d)} .ix-dg .cl{stroke:var(--tier-1)} .ix-dg .vl{stroke:var(--value)} .ix-dg .vf{fill:var(--value)} .ix-dg .wf{fill:var(--ix-warm);stroke:var(--ix-warm-line)} .ix-dg .wt{fill:var(--ix-warm-ink)} .ix-dg .wk{stroke:var(--ix-warm-ink)} .ix-dg .sk{fill:var(--ix-sk)} .ix-rows{display:flex;flex-direction:column} .ix-row{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--ix-s-72);align-items:center;padding:var(--s-7) 0;border-top:1px solid var(--gea)} .ix-row:last-child{border-bottom:1px solid var(--gea)} .ix-row.is-flip{grid-template-columns:minmax(0,7fr) minmax(0,5fr)} .ix-row.is-flip .ix-row-text{order:2} .ix-rstep+.ix-rstep{margin-top:var(--ix-s-28);padding-top:var(--ix-s-28);border-top:1px solid var(--line)} .ix-rstep-k{display:flex;align-items:center;flex-wrap:wrap;gap:var(--s-2) var(--ix-s-10)} .ix-rstep-k .n{font-family:var(--font-mono);font-size:var(--t-mono);font-weight:500;color:var(--acc);letter-spacing:.04em}.ix-rstep h3{margin-top:var(--s-2);font-size:var(--cx-h3);line-height:1.35;letter-spacing:-.015em} .ix-rstep>p{margin-top:var(--ix-s-10);font-size:var(--t-body);line-height:1.8;color:var(--g57);text-wrap:balance} .ix-human{margin-top:var(--ix-s-14);display:flex;align-items:flex-start;gap:var(--ix-s-10);padding:var(--ix-s-10) var(--ix-s-14);border-radius:10px;background:var(--ix-warm);font-size:var(--t-small);line-height:1.6;color:var(--ix-warm-ink)} .ix-rstep>p.ix-human{margin-top:var(--ix-s-14);font-size:var(--t-small);line-height:1.6;color:var(--ix-warm-ink);text-wrap:wrap} .ix-human b{flex-shrink:0;font-weight:500} .ix-video{border-bottom:1px solid var(--gea)} .ix-video-in{max-width:960px;margin-inline:auto} .ix-video .cx-shead{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:var(--s-5) var(--s-7);align-items:end} .ix-video .cx-shead .cx-h2{max-width:13em} .ix-video-frame{position:relative;aspect-ratio:16/9;background:var(--white)} .ix-video-frame>video{display:block;width:100%;height:100%;object-fit:contain} .ix-video-start{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:center;width:100%;padding:var(--s-8) var(--s-6);background:transparent;cursor:pointer} .ix-video-start-in{display:inline-flex;align-items:center;justify-content:center;gap:var(--s-3);min-height:var(--cx-btn-h);padding:var(--s-3) var(--s-5);border:1px solid var(--gea);border-radius:var(--cx-r-btn);background:var(--white);color:var(--ink);font-size:var(--t-body);font-weight:500;line-height:1.5;transition:border-color var(--d-fast),color var(--d-fast)} .ix-video-start-in>svg{width:20px;height:20px;flex-shrink:0;color:var(--cta)} .ix-video-duration{font-family:var(--font-mono);font-size:var(--t-small);font-weight:400;color:var(--g57)} .ix-video-start:hover .ix-video-start-in{border-color:var(--cta);color:var(--cta)} .ix-video-start:focus-visible{outline-offset:-5px} .ix-video-error{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--s-4);padding:var(--s-5);background:color-mix(in srgb,var(--white) 96%,transparent);text-align:center} .ix-video-error p{max-width:30em;font-size:var(--cx-text);line-height:1.75;color:var(--g57)} .ix-inspection{padding:var(--s-7) 0;border-top:1px solid var(--gea)} .ix-inspection:last-child{border-bottom:1px solid var(--gea)} .ix-inspection-head{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--s-5) var(--ix-s-72);align-items:end;margin-bottom:var(--s-6)} .ix-inspection-head .cx-h3{margin-top:var(--s-3)} .ix-inspection-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-7) var(--s-6)} .ix-inspection-item{min-width:0;display:flex;flex-direction:column;gap:var(--s-5)} .ix-inspection-title{display:flex;align-items:baseline;gap:var(--s-3)} .ix-inspection-title>span{flex-shrink:0;color:var(--acc);font-family:var(--font-mono);font-size:var(--t-mono)} .ix-inspection-copy>p{margin-top:var(--s-2);font-size:var(--cx-text);line-height:1.8;color:var(--g57)} .ix-inspection-shot{display:block;width:100%;padding:0;color:inherit;text-align:left;cursor:zoom-in;transition:border-color var(--d-fast)} .ix-inspection-shot:hover{border-color:var(--acc)} .ix-inspection-shot .cx-shot-body{display:block} .ix-inspection-shot img{display:block;width:100%;height:auto} .ix-inspection-zoom{width:16px;height:16px;margin-left:auto;flex-shrink:0;color:var(--g57)} .ix-inspection-item.is-main .ix-inspection-shot{margin-top:auto} .ix-inspection-item.is-detail{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);align-items:center;gap:var(--s-5);padding-top:var(--s-6);border-top:1px solid var(--gea)} .ix-inspection-item.is-detail .ix-inspection-title{display:block} .ix-inspection-item.is-detail .cx-card-t{margin-top:var(--s-2)} .ix-inspection-item.is-detail .cx-shot-bar>i{display:none} .ix-inspection-item.is-detail .cx-shot-bar>span{margin-left:0} .ix-inspection-note{margin-top:var(--s-6);padding-left:var(--s-4);border-left:2px solid var(--acc);font-size:var(--t-small);line-height:1.75;color:var(--g57)} /* 制造业设计：总览保留六步，一次阅读一个步骤，小图可放大。 */ .ix-chain{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:var(--s-4);margin-bottom:var(--s-6)} .ix-chain li{border-top:1px solid var(--gea);padding-top:var(--s-3);min-width:0} .ix-chain li>a,.ix-chain li>div{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s-1)} .ix-chain span{font-family:var(--font-mono);font-size:var(--t-eyebrow);color:var(--acc)} .ix-chain b{font-size:var(--t-small);font-weight:500;color:var(--ink)} .ix-chain small{font-size:var(--t-eyebrow);line-height:1.65;color:var(--g57)} .ix-chain a b{color:var(--brand)} .ix-chain a:hover b{text-decoration:underline;text-underline-offset:4px} .ix-dflow{padding:var(--s-6) 0;border-top:1px solid var(--gea)} .ix-dflow .ix-inspection-head{margin-bottom:var(--s-4)} .ix-dflow-nav{margin-bottom:var(--s-4)} .ix-dflow-nav ol{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--s-3)} .ix-dflow-nav button{display:flex;align-items:baseline;gap:var(--s-2);width:100%;min-height:48px;padding:var(--s-3) 0;border-bottom:2px solid var(--gea);color:var(--g57);font-size:var(--t-small);line-height:1.5;text-align:left;transition:color var(--d-fast),border-color var(--d-fast)} .ix-dflow-nav button:hover,.ix-dflow-nav button.is-on{color:var(--ink);border-color:var(--acc)} .ix-dflow-nav span{flex-shrink:0;font-family:var(--font-mono);font-size:var(--t-eyebrow);color:var(--acc)} .ix-dflow-nav b{font-weight:500} .ix-dflow-steps{max-width:960px;margin-inline:auto} .ix-dflow-step{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,400px);gap:var(--s-6);align-items:center;min-height:390px;padding:var(--s-4) 0} .ix-dflow-step:not(.is-on){display:none} .ix-dflow-copy{min-width:0;max-width:36em} .ix-dflow-copy h4{margin-top:var(--s-2)} .ix-dflow-copy>p{margin-top:var(--s-3);font-size:var(--cx-text);line-height:1.8;color:var(--g57)} .ix-dflow-flag{font-size:var(--t-eyebrow);line-height:1.5;color:var(--ix-warm-ink)} .ix-dflow-copy>p.ix-human{margin-top:var(--s-4);font-size:var(--t-small);line-height:1.7;color:var(--ix-warm-ink)} .ix-dflow-copy>p.ix-dflow-note{font-size:var(--t-small);line-height:1.7} .ix-dflow-media{width:100%;max-width:400px;min-width:0} .ix-dflow-choices{display:flex;flex-wrap:wrap;gap:0 var(--s-3);margin-bottom:var(--s-2)} .ix-dflow-choices button{min-height:44px;padding:var(--s-2) 0;border-bottom:2px solid transparent;color:var(--g57);font-size:var(--t-eyebrow);font-weight:500;text-align:left} .ix-dflow-choices button:hover,.ix-dflow-choices button.is-on{color:var(--ink);border-color:var(--brand)} .ix-dflow-image{margin:0} .ix-dflow-image[data-pane]:not(.is-on){display:none} .ix-dflow-shot{display:block;width:100%;padding:0;color:inherit;text-align:left;cursor:zoom-in;transition:border-color var(--d-fast)} .ix-dflow-shot:hover{border-color:var(--acc)} .ix-dflow-shot .cx-shot-body{display:block;--ar:8 / 5} .ix-dflow-shot .cx-shot-body.is-contain>img{object-fit:contain;object-position:center} .ix-dflow-shot img{display:block} .ix-dflow-image figcaption{margin-top:var(--s-2);font-size:var(--t-eyebrow);line-height:1.65;color:var(--g57)} .ix-dflow-boundary{margin-top:var(--s-3);font-size:var(--t-small);line-height:1.75;color:var(--g57)} .ix-dflow-nav button:focus-visible,.ix-dflow-choices button:focus-visible,.ix-dflow-shot:focus-visible{outline:2px solid var(--cta);outline-offset:4px} .ix-coop-links{margin-top:var(--s-3)} .ix-coop-links a{display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);min-height:54px;border-bottom:1px solid var(--gea);font-size:var(--t-body);color:var(--ink)} .ix-coop-links a:hover{color:var(--brand)} .ix-related-links{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-5);margin-top:var(--s-5)} .ix-related-links a{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);height:100%;padding-top:var(--s-3);border-top:1px solid var(--gea)} .ix-related-links b{display:block;font-size:var(--t-small);font-weight:500} .ix-related-links small{display:block;margin-top:var(--s-1);font-size:var(--t-eyebrow);line-height:1.65;color:var(--g57)} .ix-related-links a:hover b{color:var(--brand)} .ix-page[data-industry="manufacturing"]>.cx-sec{padding-block:var(--s-7)} .ix-page[data-industry="manufacturing"] .ix-inspection-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-5)} .ix-page[data-industry="manufacturing"] .ix-inspection-item,.ix-page[data-industry="manufacturing"] .ix-inspection-item.is-detail{display:flex;flex-direction:column;align-items:stretch;gap:var(--s-3);padding-top:0;border-top:0} .ix-page[data-industry="manufacturing"] .ix-inspection-title,.ix-page[data-industry="manufacturing"] .ix-inspection-item.is-detail .ix-inspection-title{display:flex;align-items:baseline;gap:var(--s-2)} .ix-page[data-industry="manufacturing"] .ix-inspection-title .cx-card-t{margin-top:0;font-size:var(--t-body)} .ix-page[data-industry="manufacturing"] .ix-inspection-copy>p{font-size:var(--t-small);line-height:1.7} .ix-page[data-industry="manufacturing"] .ix-inspection-item .ix-inspection-shot{margin-top:auto} .ix-page[data-industry="manufacturing"] .ix-inspection-shot .cx-shot-body{aspect-ratio:8 / 5;overflow:hidden} .ix-page[data-industry="manufacturing"] .ix-inspection-shot .cx-shot-bar>i{display:none} .ix-page[data-industry="manufacturing"] .ix-inspection-shot .cx-shot-bar>span{margin-left:0} @media(max-width:1023px){ .ix-chain{grid-template-columns:repeat(4,minmax(0,1fr))} .ix-dflow-step{grid-template-columns:minmax(0,1fr) minmax(0,360px);gap:var(--s-5)} .ix-dflow-nav ol{grid-template-columns:repeat(3,minmax(0,1fr))} .ix-related-links{grid-template-columns:repeat(2,minmax(0,1fr))} .ix-page[data-industry="manufacturing"] .ix-inspection-grid{grid-template-columns:repeat(2,minmax(0,1fr))} } @media(max-width:639px){ .ix-chain{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-3)} .ix-chain li:last-child{grid-column:1 / -1} .ix-chain small{font-size:var(--t-eyebrow)} .ix-dflow{padding:var(--s-5) 0} .ix-dflow-nav ol{gap:var(--s-1) var(--s-3)} .ix-dflow-nav button{flex-direction:column;gap:var(--s-1);min-height:60px;padding-block:var(--s-2);font-size:var(--t-eyebrow)} .ix-dflow-step{grid-template-columns:minmax(0,1fr);gap:var(--s-4);min-height:0;padding-block:var(--s-3)} .ix-dflow-copy>p{font-size:var(--ix-t-15)} .ix-dflow-copy>p.ix-human{display:block} .ix-dflow-copy .ix-human b{display:block;margin-bottom:var(--s-1)} .ix-dflow-media{max-width:280px;margin-inline:auto} .ix-dflow-shot .cx-shot-bar>i{display:none} .ix-dflow-shot .cx-shot-bar>span{margin-left:0} .ix-related-links{gap:var(--s-4)} .ix-page[data-industry="manufacturing"]>.cx-sec{padding-block:var(--s-6)} .ix-page[data-industry="manufacturing"] .ix-inspection-grid{gap:var(--s-5) var(--s-3)} .ix-page[data-industry="manufacturing"] .ix-inspection-title>span{display:none} .ix-page[data-industry="manufacturing"] .ix-inspection-title .cx-card-t{font-size:var(--t-small)} } .ix-rlink{margin-top:var(--s-4);display:inline-flex;align-items:center;gap:var(--s-2);font-size:var(--t-small);font-weight:500;color:var(--cta)} .ix-sub3{margin-top:var(--ix-s-18);display:grid;gap:var(--s-2)} .ix-sub3 li{display:grid;grid-template-columns:26px minmax(0,1fr);gap:var(--s-2);padding:var(--s-3) var(--ix-s-14);border-radius:10px;background:var(--gf5)} .ix-sub3 li>b{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--value);color:var(--white);font-family:var(--font-mono);font-size:var(--ix-t-11h5);font-weight:500} .ix-sub3 h4{font-size:var(--ix-t-15h5);line-height:1.5} .ix-sub3 p{margin-top:var(--ix-s-2);font-size:var(--ix-t-13h5);line-height:1.7;color:var(--g57)} .ix-sub3 p em{font-style:normal;color:var(--ix-warm-ink)} .ix-media{position:relative;min-width:0;overflow:hidden;} .ix-media-bar{position:relative;} .ix-media-bar span{margin-left:var(--s-2);overflow:hidden;text-overflow:ellipsis} .ix-media-body{position:relative;display:flex;flex-direction:column;align-items:flex-start;padding:46px var(--s-6) var(--s-6)} .ix-media-body.is-grid{background-color:var(--ix-paper);background-image:linear-gradient(var(--ix-grid-line) 1px,transparent 1px),linear-gradient(90deg,var(--ix-grid-line) 1px,transparent 1px);background-size:14px 14px} .ix-ghost{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:left top;opacity:.16;filter:blur(3px) saturate(.5);pointer-events:none} .ix-media-body>*:not(.ix-ghost){position:relative;z-index:1} .ix-media-body>.is-main{width:min(100%,calc(var(--w,9999) * 1px))} .ix-media-body>.is-main.is-w11{max-width:92%} .ix-media-body>.is-main.is-w10{max-width:84%} .ix-media-body>.is-inset{align-self:flex-end;width:min(62%,calc(var(--w,9999) * 1px));margin-top:-22px;z-index:2} .ix-media-body>.is-inset.is-w8{width:min(70%,calc(var(--w,9999) * 1px))} .ix-media-body>.is-inset.is-left{align-self:flex-start} .ix-media-body>.ix-below{width:100%;margin-top:var(--ix-s-40)} .ix-crop{position:relative;margin:0;border-radius:0 10px 10px 10px;background:var(--white);box-shadow:0 0 0 1px var(--ix-shade-s),0 18px 36px -16px color-mix(in srgb,var(--ink) 34%,transparent)} .ix-crop.is-gap{margin-top:var(--ix-s-40)} .ix-crop-v{position:relative;overflow:hidden;border-radius:inherit;aspect-ratio:var(--w) / var(--h)} .ix-crop-v img{position:absolute;max-width:none;height:auto;width:calc(var(--iw) / var(--w) * 100%);left:calc(var(--x) / var(--w) * -100%);top:calc(var(--y) / var(--h) * -100%)} .ix-flag{bottom:100%;left:0;height:24px;border-radius:var(--r-2) var(--r-2) 0 0;box-shadow:none} .ix-crop.is-dark{background:var(--ix-night)} .ix-crop+.ix-crop.is-cont{margin-top:var(--ix-s-10)} .ix-legend-row{display:flex;flex-wrap:wrap;gap:var(--ix-s-6);font-size:var(--ix-t-12h5)} .ix-legend-row span{height:28px;padding:0 var(--ix-s-10);border-radius:7px;background:var(--white);box-shadow:0 0 0 1px var(--ix-shade-s)} .ix-legend-row i{width:9px;height:9px} .ix-docs3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--ix-s-10)} .ix-docs3 div{display:flex;align-items:center;gap:var(--ix-s-10);padding:var(--s-3) var(--ix-s-14);border-radius:10px;background:var(--white);box-shadow:0 0 0 1px var(--ix-shade-s),0 12px 24px -16px var(--ix-shade);font-size:var(--ix-t-13h5);line-height:1.4;font-weight:500} .ix-docs3 svg{width:26px;height:30px;flex-shrink:0;color:var(--acc)} .ix-docs3 .ix-doc-fill{fill:var(--white)} .ix-docs3-k{grid-column:1 / -1;font-size:var(--ix-t-12h5);color:var(--g57)} .ix-mock{position:relative;margin:0;border-radius:0 var(--r-3) var(--r-3) var(--r-3);background:var(--white);box-shadow:0 0 0 1px var(--ix-shade-s),0 18px 36px -16px var(--ix-shade);padding:var(--s-4) var(--ix-s-18);font-size:var(--t-mono);line-height:1.5;color:var(--ix-slate)} .ix-mock-h{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);padding-bottom:var(--ix-s-10);border-bottom:1px solid var(--gea)} .ix-mock-h b{font-size:var(--t-small);font-weight:500;color:var(--ink)} .ix-mock-h>span{font-size:var(--t-eyebrow);color:var(--g57)} .ix-mock-dg{padding:var(--ix-s-6) var(--s-1) var(--ix-s-2)} .ix-sk{display:block;height:7px;border-radius:var(--r-1);background:var(--ix-sk)} .ix-sk.is-blue{background:var(--ix-sk-blue)} .ix-mt{width:100%;border-collapse:collapse;margin-top:var(--ix-s-6)} .ix-mt th{padding:var(--s-2) var(--ix-s-6);text-align:left;font-size:var(--ix-t-11h5);font-weight:400;color:var(--g92)} .ix-mt td{padding:var(--ix-s-9) var(--ix-s-6);border-top:1px solid var(--gf5)} .ix-mock-f{margin-top:var(--s-3);display:flex;align-items:center;justify-content:space-between;gap:var(--s-3)} .ix-ok{display:inline-flex;align-items:center;gap:var(--ix-s-6);height:26px;padding:0 var(--ix-s-10);border-radius:7px;background:var(--ix-ok-bg);color:var(--ix-ok-ink);font-size:var(--t-eyebrow)} .ix-ok svg{width:13px;height:13px} .ix-warn{display:inline-flex;align-items:center;gap:var(--ix-s-6);min-height:26px;padding:var(--ix-s-3) var(--ix-s-10);border-radius:7px;background:var(--ix-warm);color:var(--ix-warm-ink);font-size:var(--t-eyebrow);line-height:1.45} .ix-btn-s{display:inline-flex;align-items:center;height:30px;padding:0 var(--s-3);border-radius:7px;background:var(--ink);color:var(--white);font-size:var(--t-eyebrow);white-space:nowrap} .ix-segc{display:inline-flex;gap:var(--ix-s-2);padding:var(--ix-s-2);border-radius:var(--r-2);background:var(--gf5)} .ix-segc span{height:24px;display:inline-flex;align-items:center;padding:0 var(--ix-s-9);border-radius:6px;font-size:var(--ix-t-11h5);color:var(--g57)} .ix-segc span.is-on{background:var(--white);color:var(--ink);box-shadow:0 1px 2px color-mix(in srgb,var(--black) 12%,transparent)} .ix-gantt{margin-top:var(--s-3);display:grid;gap:var(--ix-s-10)} .ix-g-row{display:grid;grid-template-columns:44px minmax(0,1fr);gap:var(--ix-s-10);align-items:center} .ix-g-track{position:relative;height:22px;border-radius:6px;background:repeating-linear-gradient(90deg,var(--ix-paper) 0 calc(100% / 7 - 1px),var(--ix-sk) calc(100% / 7 - 1px) calc(100% / 7))} .ix-g-track i{position:absolute;top:3px;bottom:3px;border-radius:var(--r-1);background:var(--brand)} .ix-g-track i.is-b2,.ix-cost .c2,.ix-cost-l .c2{background:color-mix(in srgb,var(--brand) 50%,var(--white))} .ix-g-track i.is-b3{background:var(--value)} .ix-g-today{position:absolute;top:-6px;bottom:-6px;width:0;border-left:1.5px solid var(--acc)} .ix-price{margin-top:var(--s-2)} .ix-price .ln{stroke:var(--brand)} .ix-price .ar{fill:color-mix(in srgb,var(--brand) 8%,transparent)} .ix-price .mk{stroke:var(--value)} .ix-price .dt{fill:var(--value)} .ix-cam{position:relative;aspect-ratio:16 / 10;border-radius:10px;background:radial-gradient(80% 80% at 50% 40%,color-mix(in srgb,var(--ix-night) 70%,var(--g57)),var(--ix-night));overflow:hidden} .ix-cam svg{position:absolute;inset:0;width:100%;height:100%} .ix-cam .cn{stroke:color-mix(in srgb,var(--white) 55%,transparent)} .ix-cam .pt{stroke:color-mix(in srgb,var(--brand) 14%,var(--gc7));fill:color-mix(in srgb,var(--white) 6%,transparent)} .ix-cam .ok{stroke:color-mix(in srgb,var(--mark-ok) 75%,var(--white))} .ix-cam .hit{stroke:var(--mark-check)} .ix-cam-chip{position:absolute;display:inline-flex;align-items:center;gap:var(--ix-s-6);height:24px;padding:0 var(--ix-s-9);border-radius:6px;font-size:var(--t-eyebrow);white-space:nowrap} .ix-cam-chip.is-ok{left:27%;top:10%;background:color-mix(in srgb,var(--mark-ok) 75%,var(--white));color:var(--ix-night)} .ix-cam-chip.is-cap{left:50%;bottom:14px;transform:translateX(-50%);background:color-mix(in srgb,var(--white) 12%,transparent);color:var(--white)} .ix-cost{margin-top:var(--ix-s-14);display:flex;height:16px;border-radius:5px;overflow:hidden} .ix-cost i{display:block;height:100%} .ix-cost .c1,.ix-cost-l .c1{background:var(--brand)} .ix-cost .c3,.ix-cost-l .c3{background:var(--value)} .ix-cost-l{margin-top:var(--s-2);display:flex;gap:var(--ix-s-14);font-size:var(--t-eyebrow);color:var(--g57)} .ix-cost-l span{display:inline-flex;align-items:center;gap:var(--ix-s-6)} .ix-cost-l i{width:9px;height:9px;border-radius:2px} .ix-recon{margin-top:var(--s-3);display:grid;gap:var(--ix-s-6)} .ix-recon li{display:grid;grid-template-columns:minmax(0,1fr) 60px 56px;gap:var(--ix-s-10);align-items:center;padding:var(--s-2) var(--ix-s-10);border-radius:var(--r-2);background:var(--gf5);font-size:var(--t-eyebrow)} .ix-recon li em{font-style:normal;justify-self:end;color:var(--ix-ok-ink)} .ix-recon li.is-diff{background:var(--ix-warm);box-shadow:inset 3px 0 0 var(--value)} .ix-recon li.is-diff .ix-sk{background:color-mix(in srgb,var(--value) 30%,var(--white))} .ix-recon li.is-diff em{color:var(--ix-warm-ink)} .ix-after{margin-top:var(--s-7);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s-5)} .ix-after.is-one{grid-template-columns:minmax(0,1fr)} .ix-band{padding:var(--ix-s-30) var(--s-6);border-radius:var(--r-4);background:var(--white)} .ix-band h3{font-size:var(--ix-t-22);line-height:1.4} .ix-band>p{margin-top:var(--ix-s-10);font-size:var(--ix-t-15);line-height:1.8;color:var(--g57)} .ix-band>p.is-lead{margin-top:0;font-size:var(--ix-t-15h5);color:var(--g21)}.ix-pills3{margin-top:var(--s-4);display:flex;flex-wrap:wrap;gap:var(--ix-s-10)} .ix-pills3 span{display:inline-flex;align-items:center;gap:var(--s-2);height:40px;padding:0 var(--s-4);border-radius:var(--r-pill);background:var(--white);border:1px solid var(--gea);font-size:var(--ix-t-15);font-weight:500} .ix-pills3 span b{font-family:var(--font-mono);font-size:var(--t-eyebrow);font-weight:500;color:var(--acc)} .ix-band.is-phase{display:flex;align-items:center;justify-content:space-between;gap:var(--s-5);flex-wrap:wrap} .ix-band.is-phase .ix-pills3{margin-top:0} .ix-nexts{margin-top:var(--ix-s-14);display:grid;gap:var(--s-2)} .ix-nexts li{display:flex;gap:var(--ix-s-10);font-size:var(--ix-t-15);line-height:1.7;color:var(--g21)} .ix-nexts li::before{content:"";flex-shrink:0;width:6px;height:6px;margin-top:var(--ix-s-10);border-radius:50%;background:var(--value)} .ix-minis{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s-4);align-items:start;padding-top:var(--ix-s-44)} .ix-minis .ix-mock{padding:var(--ix-s-14) var(--ix-s-14) var(--s-3)} .ix-minis h4{font-size:var(--ix-t-12h5);font-weight:500;color:var(--g57)} .ix-doc{display:grid;gap:var(--ix-s-6)} .ix-doc i{display:block;height:6px;border-radius:3px;background:var(--ix-sk)} .ix-doc i:last-child{width:64%} .ix-doc em.is-red{padding:var(--s-1) var(--s-2);border-radius:5px;background:color-mix(in srgb,var(--mark-conflict) 12%,var(--white));color:color-mix(in srgb,var(--mark-conflict) 85%,var(--black));font-style:normal;font-size:var(--t-eyebrow);line-height:1.45;box-shadow:inset 2px 0 0 var(--mark-conflict)} .ix-fix{margin-top:var(--s-2);padding:var(--ix-s-6) var(--ix-s-9);border-radius:7px;background:var(--ix-ok-bg);color:var(--ix-ok-ink);font-size:var(--t-eyebrow);line-height:1.45} .ix-pay{margin-top:var(--s-2);display:grid;gap:var(--ix-s-6)} .ix-pay li{display:grid;grid-template-columns:42px minmax(0,1fr) 30px;align-items:center;gap:var(--s-2);font-size:var(--t-eyebrow);line-height:1.3;color:var(--g57)} .ix-pay li i{display:block;width:100%;height:9px;border-radius:2px;background:var(--value)} .ix-pay li b{font-weight:500;color:var(--ink);text-align:right} .ix-pay li.is-wait i{background:repeating-linear-gradient(135deg,var(--ix-warm-2) 0 4px,var(--ix-warm-line) 4px 8px);box-shadow:inset 0 0 0 1px var(--ix-warm-line)} .ix-pay li.is-wait span,.ix-pay li.is-wait b{color:var(--ix-warm-ink);font-weight:500} .ix-pay li.is-off i{width:33.3%;background:var(--ix-sk)} .ix-scope{margin-top:var(--s-5);display:flex;gap:var(--s-3);padding:var(--s-4) var(--ix-s-20);border-radius:var(--r-3);border:1px solid var(--gc7);font-size:var(--ix-t-14h5);line-height:1.75;color:var(--g57)} .ix-scope b{flex-shrink:0;font-weight:500;color:var(--ink)} .ix-outs{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:var(--ix-s-20)} .ix-out{padding:var(--s-5) 0;border-top:1px solid var(--cx-dk-line)} .ix-out ul{margin-top:var(--ix-s-14);display:grid;gap:var(--ix-s-10)} .ix-out li{display:grid;grid-template-columns:20px minmax(0,1fr);gap:var(--s-2);font-size:var(--ix-t-16h5);line-height:1.65;color:color-mix(in srgb,var(--white) 88%,var(--shell))} .ix-out li svg{width:16px;height:16px;margin-top:var(--ix-s-5);color:var(--acc-d)} .ix-duo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--ix-s-72)} .ix-duo h2{margin-top:var(--s-4);font-size:var(--cx-h2);line-height:1.3;letter-spacing:-.02em} .ix-sits{margin-top:var(--s-6);display:grid;gap:var(--ix-s-14)} .ix-sit{display:block} .ix-sit>b{font-family:var(--font-mono);font-size:var(--t-mono);font-weight:500;color:var(--acc);padding-top:var(--ix-s-3)} .ix-sit h3{font-size:var(--cx-card-t);line-height:1.5} .ix-sit p{font-size:var(--ix-t-15h5);line-height:1.8;color:var(--g21)} .ix-sit h3+p{margin-top:var(--s-1);color:var(--g57)} .ix-painl{margin-top:var(--s-6);border-top:1px solid var(--gea)} .ix-painl li{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--ix-s-14);padding:var(--ix-s-18) 0;border-bottom:1px solid var(--gea);font-size:var(--t-body);line-height:1.75;color:var(--g21)} .ix-painl li b{font-family:var(--font-mono);font-size:var(--t-mono);font-weight:500;color:var(--g92);padding-top:var(--ix-s-3)} .ix-painl li.is-hot{color:var(--ink)} .ix-painl li.is-hot b{color:var(--acc)} .ix-start{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:var(--ix-s-72);align-items:start} .ix-start h2{margin-top:var(--s-4);font-size:var(--cx-h2);line-height:1.3;letter-spacing:-.02em} .ix-opts{margin-top:var(--ix-s-28);display:grid;gap:var(--s-3)} .ix-opt{display:grid;grid-template-columns:40px minmax(0,1fr);gap:var(--ix-s-14);align-items:start;padding:var(--ix-s-22) var(--s-5);} .ix-opt>b{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--acc);color:var(--white);font-family:var(--font-mono);font-size:var(--t-small);font-weight:500} .ix-opt p{font-size:var(--ix-t-16h5);line-height:1.8;color:var(--ink)} .ix-opt.is-solo{grid-template-columns:minmax(0,1fr)} .ix-first-note{margin-top:var(--s-4);font-size:var(--t-small);line-height:1.75;color:var(--g57)} .ix-coops{margin-top:var(--ix-s-20);display:grid;gap:var(--s-3)} .ix-coop{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s-4);align-items:center;padding:var(--ix-s-22) var(--s-5) var(--ix-s-22) var(--ix-s-26);overflow:hidden;} .ix-coop::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--tone)} .ix-coop:hover{border-color:var(--gc7);} .ix-coop h3{font-size:var(--cx-card-t);line-height:1.4} .ix-coop p{margin-top:var(--s-1);font-size:var(--t-small);line-height:1.7;color:var(--g57)} .ix-coop p.meta{margin-top:var(--s-2);display:flex;align-items:center;gap:var(--ix-s-6);font-size:var(--ix-t-13h5);font-weight:500;color:var(--ink)} .ix-coop p.meta svg{width:15px;height:15px;color:var(--tone)} :is(.ix-page,.gw-page) .tone-t1{--tone:var(--tier-1)} :is(.ix-page,.gw-page) .tone-t2{--tone:var(--tier-2)} :is(.ix-page,.gw-page) .tone-t3{--tone:var(--tier-3)} :is(.ix-page,.gw-page) .tone-value{--tone:var(--value)} .ix-coop-note{margin-top:var(--ix-s-14);font-size:var(--t-small);color:var(--g57)} .ix-coop-note a{color:var(--cta);font-weight:500} .ix-rels{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--ix-s-20)} .ix-rels.is-3{grid-template-columns:repeat(3,minmax(0,1fr))} .ix-rcase{display:flex;flex-direction:column;overflow:hidden;} .ix-rcase-cover{display:block;aspect-ratio:16 / 9;overflow:hidden;background:var(--gf5);border-bottom:1px solid var(--gea)} .ix-rcase-cover img{width:100%;height:100%;object-fit:cover;object-position:left top} .ix-rcase-body{padding:var(--ix-s-20) var(--ix-s-22);display:flex;flex-direction:column;flex:1} .ix-rcase-meta{display:flex;align-items:center;justify-content:space-between;gap:var(--s-2);font-size:var(--t-eyebrow);color:var(--g57)} .ix-rcase-meta>span:first-child{display:inline-flex;align-items:center;gap:var(--ix-s-7);min-width:0} .ix-rcase-meta>span:first-child i{width:6px;height:6px;border-radius:50%;background:var(--tone);flex-shrink:0} .ix-rcase-name{margin-top:var(--ix-s-14);font-size:var(--t-mono);color:var(--g92)} .ix-rcase h3{margin-top:var(--ix-s-2);font-size:var(--cx-card-t);line-height:1.45} .ix-nobr{display:inline-block} .ix-rcase-big{margin-top:var(--s-4);padding-top:var(--ix-s-14);border-top:1px solid var(--gea)} .ix-rcase-big b{display:block;font-size:var(--ix-t-22);line-height:1.3;font-weight:500;letter-spacing:-.01em;color:var(--value)} .ix-rcase-big span{font-size:var(--ix-t-12h5);color:var(--g57)} .ix-rcase-foot{margin-top:auto;padding-top:var(--ix-s-18);display:flex;justify-content:space-between;gap:var(--s-3);font-size:var(--ix-t-13h5)} .ix-rcase-foot a:first-child{font-weight:500} .ix-rcase-foot a:last-child{color:var(--cta)} .ix-gcard{display:flex;flex-direction:column;overflow:hidden;} .ix-gcard-cover{display:block;aspect-ratio:16 / 9;overflow:hidden;border-bottom:1px solid color-mix(in srgb,var(--white) 8%,transparent);background:var(--white)} .ix-gcard-cover img{width:100%;height:100%;object-fit:cover;object-position:left top} .ix-gcard-body{padding:var(--ix-s-20) var(--ix-s-22);display:flex;flex-direction:column;flex:1} .ix-gcard h3{margin-top:var(--ix-s-14);font-size:var(--cx-card-t);line-height:1.45} .ix-gcard p{margin-top:var(--s-2);font-size:var(--t-small);line-height:1.75;color:var(--g57)} .ix-gcard .go{margin-top:auto;padding-top:var(--ix-s-18);display:inline-flex;align-items:center;gap:var(--s-2);font-size:var(--ix-t-13h5);font-weight:500;color:var(--brand)} .gw-pin{position:absolute;z-index:3;left:var(--x);top:var(--y);width:0;height:0;pointer-events:none} .gw-pin::before{content:"";position:absolute;left:-5px;top:-5px;width:10px;height:10px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 3px color-mix(in srgb,var(--white) 95%,transparent),0 2px 6px color-mix(in srgb,var(--ink) 35%,transparent)} .gw-pin>span{position:absolute;left:-3px;bottom:9px;display:inline-flex;align-items:center;gap:var(--ix-s-6);height:24px;padding:0 var(--ix-s-10) 0 var(--ix-s-9);border-radius:7px 7px 7px 2px;background:var(--ink);color:var(--white);font-size:var(--t-eyebrow);line-height:1;white-space:nowrap;box-shadow:0 8px 18px -8px color-mix(in srgb,var(--ink) 50%,transparent)} .gw-pin>span::before{content:"";width:6px;height:6px;border-radius:50%;background:color-mix(in srgb,var(--brand) 55%,var(--white))} .gw-pin.is-r>span{left:auto;right:-3px;border-radius:7px 7px 2px 7px} .gw-pin.is-b>span{bottom:auto;top:9px;border-radius:2px 7px 7px 7px} .gw-pin.is-r.is-b>span{border-radius:7px 2px 7px 7px} .gw-wbar>span{margin-left:var(--s-2);min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .gw-wbar>span b{color:var(--ink);font-weight:500} .gw-wbar .gw-wtitle{display:none} .gw-wbar .gw-wtitle.is-on{display:block} .gw-show{align-self:center;min-width:0} .gw-points{margin-top:var(--ix-s-30);display:grid;gap:var(--s-1);border-top:1px solid var(--line)} .gw-points li{display:grid;grid-template-columns:40px minmax(0,1fr);align-items:start;padding:var(--ix-s-14) 0 var(--ix-s-13);border-bottom:1px solid var(--line)} .gw-points li>i{font-style:normal;font-family:var(--font-mono);font-size:var(--t-eyebrow);color:var(--brand);padding-top:var(--ix-s-5);letter-spacing:.04em} .gw-points b{display:block;font-size:var(--t-lede);font-weight:500;line-height:1.5;color:var(--ink)} .gw-points span{display:block;margin-top:var(--ix-s-2);font-size:var(--ix-t-14h5);line-height:1.6;color:var(--g57)} .gw-wbody{position:relative;aspect-ratio:1600 / 740;background:var(--shot-bg);overflow:hidden; -webkit-mask-image:linear-gradient(180deg,var(--black) calc(100% - 26px),color-mix(in srgb,var(--black) 25%,transparent));mask-image:linear-gradient(180deg,var(--black) calc(100% - 26px),color-mix(in srgb,var(--black) 25%,transparent))} .gw-fig{position:absolute;inset:0;margin:0;opacity:0;visibility:hidden;transform:scale(1.015);transform-origin:50% 0;transition:opacity var(--d-slow) var(--ease-out),transform var(--d-slow) var(--ease-out),visibility 0s linear var(--d-slow)} .gw-fig.is-on{opacity:1;visibility:visible;transform:none;transition:opacity var(--d-slow) var(--ease-out),transform var(--d-slow) var(--ease-out),visibility 0s} .gw-shot{position:relative} .gw-shot>img{width:100%;height:auto} .gw-fig>.gw-shot{width:var(--z,100%);transform:translateY(var(--ty,0))} .gw-thumbs{margin-top:var(--s-4);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--ix-s-14)} .gw-thumb{display:flex;flex-direction:column;border-radius:var(--cx-r-shot);overflow:hidden;background:var(--white);border:1px solid var(--ix-edge);text-align:left;box-shadow:0 12px 26px -20px color-mix(in srgb,var(--ink) 35%,transparent);transition:transform var(--d-slow) var(--ease-out),border-color var(--d-base) var(--ease-out),box-shadow var(--d-slow) var(--ease-out)} .gw-thumb.is-on{display:none} .gw-thumb:hover{border-color:color-mix(in srgb,var(--brand) 45%,var(--ix-edge));} .gw-th-img{position:relative;display:block;aspect-ratio:16 / 9;overflow:hidden;background:var(--shot-bg);border-bottom:1px solid var(--gea)} .gw-th-img img{position:absolute;left:0;top:0;width:100%;height:auto;transition:transform var(--d-slow) var(--ease-out)} .gw-th-cap{display:flex;align-items:center;gap:var(--s-2);padding:var(--ix-s-9) var(--s-3) var(--ix-s-10);font-size:var(--ix-t-13h5);font-weight:500;color:var(--ink);line-height:1.3} .gw-th-cap em{font-style:normal;font-family:var(--font-mono);font-size:var(--ix-t-11);font-weight:400;color:var(--g92);letter-spacing:.03em} .gw-th-cap svg{width:14px;height:14px;margin-left:auto;color:var(--g92);flex-shrink:0;transition:color var(--d-base) var(--ease-out),transform var(--d-slow) var(--ease-out)} .gw-thumb:hover .gw-th-cap svg{color:var(--brand);} .gw-rail{flex-shrink:0;margin-top:var(--ix-s-20);display:flex;align-items:center;justify-content:space-between;gap:var(--s-4) var(--s-5);padding-top:var(--s-4);border-top:1px solid var(--line)} .gw-rail-side{display:flex;align-items:center;gap:var(--ix-s-14);min-width:0;font-size:var(--t-mono);color:var(--g57)} .gw-rail-side>span{white-space:nowrap} .gw-rail-steps{display:flex;align-items:center;gap:var(--ix-s-6)} .gw-rail-steps li{display:flex;align-items:center;gap:var(--ix-s-6)} .gw-rail-steps li+li::before{content:"";width:var(--s-4);height:1px;background:var(--gc7)} .gw-rail-steps a{display:inline-flex;align-items:center;gap:var(--ix-s-7);height:34px;padding:0 var(--ix-s-13);border-radius:var(--r-pill);background:var(--white);border:1px solid var(--gea);font-size:var(--ix-t-13h5);color:var(--ink);white-space:nowrap;transition:border-color var(--d-base) var(--ease-out),box-shadow var(--d-base) var(--ease-out)} .gw-rail-steps a:hover{border-color:var(--ink);box-shadow:0 6px 18px color-mix(in srgb,var(--ink) 8%,transparent)} .gw-rail-steps b{font-family:var(--font-mono);font-size:var(--ix-t-11);font-weight:500;color:var(--brand)} .gw-rail-down{display:inline-flex;align-items:center;gap:var(--ix-s-10);font-size:var(--ix-t-13h5);color:var(--ink);white-space:nowrap} .gw-rail-ico{width:32px;height:32px;border-radius:50%;border:1px solid var(--gc7);display:grid;place-items:center} .gw-zig{position:relative;display:grid;gap:var(--ix-s-72);padding-left:88px} .gw-zig::before{content:"";position:absolute;left:23px;top:var(--s-5);bottom:var(--s-5);width:1px;background:repeating-linear-gradient(180deg,var(--gc7) 0 6px,transparent 6px 12px)} .gw-zrow{position:relative;display:grid;grid-template-columns:minmax(0,1.42fr) minmax(0,1fr);gap:var(--ix-s-56);align-items:center} .gw-zrow:nth-child(even){grid-template-columns:minmax(0,1fr) minmax(0,1.42fr)} .gw-zrow:nth-child(even) .gw-zshot{order:2} .gw-znode{position:absolute;left:-88px;top:50%;transform:translateY(-50%);width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--white);border:1px solid var(--gc7);font-family:var(--font-mono);font-size:var(--t-mono);font-weight:500;color:var(--ink);box-shadow:0 0 0 var(--s-2) var(--white)} .gw-znode.is-last{background:var(--ink);border-color:var(--ink);color:var(--white)} .gw-zshot{min-width:0;margin:0} .gw-ztext{max-width:440px} .gw-zrow:nth-child(even) .gw-ztext{justify-self:end} .gw-ztext h3{margin-top:var(--s-2);font-size:var(--cx-h3);line-height:1.3;letter-spacing:-.02em} .gw-zwhat{margin-top:var(--s-3);font-size:var(--ix-t-lede-p1);line-height:1.65;color:var(--g21);text-wrap:pretty} .gw-zui-k{margin-top:var(--ix-s-26);font-size:var(--ix-t-12h5);color:var(--g92)} .gw-zui{margin-top:var(--ix-s-10);display:flex;flex-wrap:wrap;gap:var(--s-2)} .gw-zui li{display:inline-flex;align-items:center;height:30px;padding:0 var(--s-3);border-radius:var(--r-pill);background:var(--gf5);border:1px solid var(--gea);font-size:var(--t-mono);color:var(--g21);white-space:nowrap} .gw-capmap{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-areas:"c1 c2 c3" "base base base";gap:var(--ix-s-20)} .gw-capc{--cap-tone:var(--brand);position:relative;display:flex;flex-direction:column;overflow:hidden;min-width:0} .gw-capc::before{content:"";position:absolute;left:var(--s-5);right:var(--s-5);top:0;height:3px;border-radius:0 0 3px 3px;background:var(--cap-tone);z-index:2} .gw-capc-1{grid-area:c1} .gw-capc-2{grid-area:c2} .gw-capc-3{grid-area:c3} .gw-capc-shot{position:relative;margin:var(--ix-s-18) var(--ix-s-18) 0;border-radius:var(--cx-r-shot);overflow:hidden;border:1px solid var(--ix-edge);background:var(--shot-bg);aspect-ratio:16 / 9} .gw-capc-shot>img{position:absolute;left:0;top:0;width:100%;height:auto} .gw-capc-cap,.gw-pip em{position:absolute;left:10px;top:10px;display:inline-flex;align-items:center;gap:var(--ix-s-5);height:22px;padding:0 var(--ix-s-9) 0 var(--s-2);border-radius:6px;background:var(--ink);color:var(--white);font-style:normal;font-size:var(--ix-t-11h5);line-height:1} .gw-capc-cap::before,.gw-pip em::before{content:"";width:5px;height:5px;border-radius:50%;background:color-mix(in srgb,var(--brand) 55%,var(--white))} .gw-pip{position:absolute;right:10px;bottom:10px;width:46%;border-radius:var(--r-2);overflow:hidden;background:var(--white);border:1px solid var(--ix-edge);box-shadow:0 14px 28px -12px color-mix(in srgb,var(--ink) 40%,transparent)} .gw-pip>span{display:block;aspect-ratio:16 / 9.5;overflow:hidden} .gw-pip img{width:100%;height:auto} .gw-pip em{left:6px;top:6px;height:20px;font-size:var(--ix-t-11)} .gw-capc-body{padding:var(--ix-s-20) var(--s-5) var(--s-5);display:flex;flex-direction:column;flex:1} .gw-capc-h{display:flex;align-items:baseline;gap:var(--ix-s-10)} .gw-capc-h b{font-family:var(--font-mono);font-size:var(--t-eyebrow);font-weight:500;color:var(--cap-tone,var(--g92));letter-spacing:.04em} .gw-capc-h h3{font-size:var(--cx-card-t);line-height:1.35;letter-spacing:-.01em} .gw-chips{margin-top:var(--ix-s-14);display:flex;flex-wrap:wrap;gap:var(--s-2)} .gw-capbase{grid-area:base;position:relative;display:flex;align-items:center;gap:var(--s-5);padding:var(--ix-s-26) var(--s-6);border-radius:var(--r-4);background:var(--white);color:var(--ink);overflow:hidden;border:1px solid var(--gea)} .gw-capbase::after{display:none} .gw-capbase svg{width:44px;height:44px;flex-shrink:0;color:color-mix(in srgb,var(--cta) 45%,var(--white))} .gw-capbase h3{font-size:var(--ix-t-22);line-height:1.35} .gw-capbase .t{font-size:var(--ix-t-15);color:var(--g57)} .gw-aud{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-5)} .gw-aud-card{--tone:var(--brand);position:relative;display:flex;flex-direction:column;padding:var(--ix-s-34) var(--ix-s-30) var(--ix-s-28);overflow:hidden;} .gw-aud-card::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--tone)} .gw-aud-card::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(70% 40% at 0% 0%,color-mix(in srgb,var(--tone) 8%,transparent),transparent 72%)} .gw-aud-card>*{position:relative;z-index:1} .gw-aud-ico{width:36px;height:36px;color:var(--tone)} .gw-aud-card h3{margin-top:var(--ix-s-22);font-size:var(--cx-h3);line-height:1.4} .gw-aud-card p{margin-top:var(--ix-s-10);font-size:var(--ix-t-15h5);line-height:1.75;color:var(--g57)} .gw-aud-card .go{margin-top:auto;padding-top:var(--s-5);display:inline-flex;align-items:center;gap:var(--ix-s-10);font-size:var(--t-small);font-weight:500;color:var(--ink)} .gw-edge{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-5)} .gw-bound{position:relative;display:flex;flex-direction:column;padding:var(--ix-s-40) var(--ix-s-40) var(--ix-s-36);border-radius:var(--r-4);background:var(--shell);color:var(--white);overflow:hidden} .gw-bound::after{content:"";position:absolute;right:-80px;bottom:-120px;width:360px;height:360px;border-radius:50%;border:1px solid color-mix(in srgb,var(--white) 8%,transparent);box-shadow:0 0 0 48px color-mix(in srgb,var(--white) 2%,transparent),0 0 0 96px color-mix(in srgb,var(--white) 1.5%,transparent);pointer-events:none} .gw-bound-line{margin-top:var(--ix-s-18);font-size:calc(var(--t-h3) + 6px);line-height:1.5;letter-spacing:-.01em;font-weight:500;text-wrap:balance} .gw-bound-line>span{display:block} .gw-bound-line i{font-style:normal;display:inline-block} .gw-bound-list{position:relative;z-index:1;margin-top:auto;padding-top:var(--s-6);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--ix-s-10)} .gw-bound-list li{display:flex;align-items:center;gap:var(--ix-s-10);height:48px;padding:0 var(--s-4);border-radius:10px;background:color-mix(in srgb,var(--white) 6%,transparent);border:1px solid color-mix(in srgb,var(--white) 10%,transparent);font-size:var(--ix-t-15)} .gw-bound-list svg{width:16px;height:16px;flex-shrink:0} .gw-bound-list .is-yes svg{color:color-mix(in srgb,var(--dk-tier-2) 55%,var(--white))} .gw-bound-list .is-no svg{color:color-mix(in srgb,var(--mark-conflict) 35%,var(--gc7))} @media (min-width:1024px){ .gw-edge.is-solo .gw-bound{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;column-gap:var(--ix-s-56)} .gw-edge.is-solo .gw-bound-list{margin-top:0;padding-top:0} } @media (min-width:1024px) and (max-height:820px){ .ix-hero{--peek:26px;--shift:40px;--bar:var(--cx-bar-h);--thumbs:74px;--hero-h:calc(min(100svh,960px) - var(--nav-h));} .ix-p3{margin-top:var(--ix-s-18)} .ix-p3 li{padding:var(--ix-s-7) 0;font-size:var(--ix-t-14h5)} .ix-thumb{height:50px} .ix-thumb-i{width:50px;height:36px} .gw-points{margin-top:var(--ix-s-20)} .gw-points li{padding:var(--ix-s-10) 0 var(--ix-s-9)} .gw-points b{font-size:var(--ix-t-16h5)} .gw-points span{font-size:var(--ix-t-13h5)} .gw-thumbs{margin-top:var(--s-3)} .gw-th-img{aspect-ratio:16 / 7} .gw-rail{margin-top:var(--ix-s-14);padding-top:var(--s-3)} } @media (max-width:1240px){ /* 七步表按内容撑高当前叠放框；图片卡仍保持数据中的比例。 */ .ix-stack:has(>.ix-sheet.is-steps.is-on)>.ix-stack-sizer{display:none} .ix-sheet.is-steps.is-on{position:relative;top:0} .ix-sheet.is-steps.is-on .ix-sheet-body{aspect-ratio:auto} .ix-sheet.is-steps.is-on .ix-msteps{position:relative;inset:auto} .ix-sheet.is-steps.is-on .ix-ms-list{flex:0 0 auto} .ix-thumbs-hint{display:none} .ix-thumbs{justify-content:flex-end} .ix-stage.has-many .ix-thumbs{height:auto;margin-top:var(--s-4)} .ix-stage.has-many .ix-thumbs-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))} .ix-mfg .ix-mflow li span,.ix-mfg .ix-mnote{display:none} .ix-row{gap:var(--s-7)} .ix-rels{grid-template-columns:repeat(2,minmax(0,1fr))} .ix-rels.is-3{grid-template-columns:repeat(3,minmax(0,1fr))} .gw-rail-side>span{display:none} } @media (max-width:1023px){ .ix-hero{--peek:26px;--shift:40px;--bar:var(--cx-bar-h);--thumbs:74px;--hero-h:calc(min(100svh,960px) - var(--nav-h));} .ix-video .cx-shead{grid-template-columns:minmax(0,1fr);gap:var(--s-4)} .ix-inspection-head{grid-template-columns:minmax(0,1fr);gap:var(--s-4)} .ix-inspection-item.is-detail{grid-template-columns:minmax(0,1fr);gap:var(--s-4);align-items:start} .ix-inspection-item.is-detail .ix-inspection-title{display:flex} .ix-inspection-item.is-detail .cx-card-t{margin-top:0} .ix-inspection-item.is-detail .ix-inspection-shot{margin-top:auto} .ix-stack{width:100%} .ix-row,.ix-row.is-flip{grid-template-columns:minmax(0,1fr);gap:var(--s-6)} .ix-row.is-flip .ix-row-text{order:0} .ix-after,.ix-duo,.ix-start{grid-template-columns:minmax(0,1fr)} .ix-duo,.ix-start{gap:var(--ix-s-56)} .gw-points{margin-top:0} .gw-rail{display:none} .gw-zig{padding-left:0;gap:var(--ix-s-56)} .gw-zig::before,.gw-znode{display:none} .gw-zrow,.gw-zrow:nth-child(even){grid-template-columns:minmax(0,1fr);gap:var(--s-5)} .gw-zrow:nth-child(even) .gw-zshot{order:0} .gw-zrow:nth-child(even) .gw-ztext{justify-self:start} .gw-ztext{max-width:none} .gw-capmap{grid-template-columns:minmax(0,1fr);grid-template-areas:"c1" "c2" "c3" "base"} .gw-aud{grid-template-columns:minmax(0,1fr)} } @media (min-width:640px) and (max-width:1023px){ .gw-capc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center} .gw-capc-shot{margin:var(--ix-s-18) 0 var(--ix-s-18) var(--ix-s-18)} } @media (max-width:639px){ .ix-hero{--peek:26px;--shift:40px;--bar:var(--cx-bar-h);--thumbs:74px;--hero-h:calc(min(100svh,960px) - var(--nav-h));} .ix-video .cx-shead{margin-bottom:var(--s-5)} .ix-video-start-in{gap:var(--s-2);padding:var(--s-2) var(--s-4);font-size:var(--t-small)} .ix-video-start{padding:var(--s-5) var(--s-4)} .ix-video-duration{font-size:var(--t-eyebrow)} .ix-inspection{padding:var(--ix-s-36) 0} .ix-inspection-grid{grid-template-columns:minmax(0,1fr);gap:var(--s-6)} .ix-inspection-item{gap:var(--s-4)} .ix-inspection-item.is-detail{grid-template-columns:minmax(0,1fr);gap:var(--s-4);align-items:start;padding-top:var(--s-5)} .ix-inspection-item.is-detail .ix-inspection-title{display:flex} .ix-inspection-item.is-detail .cx-card-t{margin-top:0} .ix-inspection-item.is-detail .ix-inspection-shot{margin-top:0} .ix-inspection-note{margin-top:var(--s-5)} .ix-sheet-bar{position:relative;} .ix-sheet-bar span{margin-left:var(--s-1)} .ix-sheet-bar em{font-size:var(--ix-t-10h5)} .ix-tag{height:21px;font-size:var(--ix-t-11);padding:0 var(--s-2) 0 var(--ix-s-7);border-radius:6px} .ix-ring{border-width:1.5px;border-radius:7px;box-shadow:0 0 0 3px color-mix(in srgb,var(--acc) 16%,transparent)} .ix-ring .ix-tag.is-right{left:-2px;right:auto} .ix-ring+.ix-ring .ix-tag{display:none} .ix-legend5{display:none} .ix-thumbs{height:auto;margin-top:var(--s-3);margin-right:var(--shift);display:block} .ix-thumbs-list{gap:var(--ix-s-6);overflow-x:auto;scrollbar-width:none;padding-bottom:var(--ix-s-2)} .ix-thumbs-list::-webkit-scrollbar{display:none} .ix-stage.has-many .ix-thumbs-list{display:flex;justify-content:flex-start} .ix-thumb{height:50px;padding-right:var(--ix-s-10);flex-shrink:0} .ix-thumb-i{width:44px;height:34px} .ix-thumb-t span{font-size:var(--ix-t-12h5)} .ix-mfg{padding:var(--ix-s-10);gap:var(--s-2);font-size:var(--ix-t-11)} .ix-mtabs span{height:22px;padding:0 var(--s-2);font-size:var(--ix-t-10h5)} .ix-mtabs span:not(.is-on){display:none} .ix-mdraw{padding:var(--s-3) var(--s-2) var(--s-2)} .ix-mlegend{display:none} .ix-mflow{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--ix-s-5)} .ix-mflow li{padding:var(--ix-s-5) var(--ix-s-6)} .ix-mflow li b{font-size:var(--ix-t-10h5)} .ix-mflow li span{display:none} .ix-below-flow .ix-mflow{gap:var(--s-2)} .ix-below-flow .ix-mflow li{padding:var(--s-2)} .ix-below-flow .ix-mflow li b{font-size:var(--t-eyebrow)} .ix-mock-h{flex-wrap:wrap} .ix-mflow li:nth-child(4)::before{display:none} .ix-mnote{display:none} .ix-msteps{padding:var(--s-2) var(--ix-s-10)} .ix-ms-head{display:none} .ix-ms-list li{grid-template-columns:22px minmax(0,1fr) minmax(0,1.2fr);gap:var(--s-2);padding:0 var(--ix-s-6);font-size:var(--ix-t-11h5)} .ix-ms-list li span{display:none} .ix-ms-list li em{font-size:var(--ix-t-10h5);padding:var(--ix-s-2) var(--ix-s-6)} .ix-ms-foot{display:none} .ix-p3 li{font-size:var(--ix-t-15)} .ix-row{padding:var(--ix-s-36) 0;gap:var(--s-5)} .ix-rstep h3{font-size:var(--cx-h3)} .ix-rstep>p{font-size:var(--ix-t-15)} .ix-media-body{padding:var(--ix-s-34) var(--ix-s-14) var(--s-4)} .ix-media-body>.is-inset,.ix-media-body>.is-inset.is-w8{width:min(84%,calc(var(--w,9999) * 1px));margin-top:calc(-1 * var(--s-4))} .ix-flag{font-size:var(--ix-t-11);height:21px} .ix-media-body>.ix-below{margin-top:var(--ix-s-30)} .ix-docs3{grid-template-columns:minmax(0,1fr)} .ix-mock{padding:var(--s-3)} .ix-mt th:nth-child(2),.ix-mt td:nth-child(2){display:none} .ix-minis{grid-template-columns:minmax(0,1fr)} .ix-band{padding:var(--s-5) var(--ix-s-20)} .ix-minis.ix-band{padding-top:var(--ix-s-44)} .ix-duo h2,.ix-start h2{font-size:var(--cx-h2)} .ix-sit{display:block} .ix-painl li{grid-template-columns:minmax(0,1fr);gap:var(--s-2);font-size:var(--ix-t-15)} .ix-out{padding:var(--s-5) 0;border-top:1px solid var(--cx-dk-line)} .ix-out li{font-size:var(--ix-t-15h5)} .ix-opt{padding:var(--ix-s-18);grid-template-columns:34px minmax(0,1fr)} .ix-opt>b{width:30px;height:30px} .ix-opt p{font-size:var(--ix-t-15h5)} .ix-coop{grid-template-columns:minmax(0,1fr) auto;padding:var(--ix-s-20) var(--ix-s-20) var(--ix-s-20) var(--s-5);gap:var(--ix-s-6)} .ix-rels,.ix-rels.is-3{grid-template-columns:minmax(0,1fr)} .gw-wbar>span{margin-left:var(--s-1)} .gw-pin::before{left:-4px;top:-4px;width:8px;height:8px;box-shadow:0 0 0 2px color-mix(in srgb,var(--white) 95%,transparent),0 2px 4px color-mix(in srgb,var(--ink) 30%,transparent)} .gw-pin>span{height:20px;font-size:var(--ix-t-10h5);padding:0 var(--ix-s-7) 0 var(--ix-s-6);gap:var(--s-1);bottom:7px} .gw-pin.is-b>span{top:7px} .gw-pin>span::before{width:4px;height:4px} .gw-thumbs{gap:var(--s-2);margin-top:var(--ix-s-10)} .gw-thumb{border-radius:var(--cx-r-shot)} .gw-th-cap{padding:var(--ix-s-7) var(--s-2) var(--s-2);font-size:var(--t-eyebrow);flex-wrap:wrap;gap:0 var(--ix-s-6)} .gw-th-cap em{font-size:calc(var(--t-eyebrow) - 2px);flex-basis:100%} .gw-th-cap svg{display:none} .gw-points li{grid-template-columns:32px minmax(0,1fr);padding:var(--s-3) 0 var(--ix-s-11)} .gw-points b{font-size:var(--ix-t-16h5)} .gw-points span{font-size:var(--t-small)} .gw-zig{gap:var(--s-7)} .gw-ztext h3{font-size:var(--cx-h3)} .gw-zwhat{font-size:var(--ix-t-16h5)} .gw-zui-k{margin-top:var(--s-4)} .gw-zui li{height:28px;font-size:var(--ix-t-12h5);padding:0 var(--ix-s-10)} .gw-zig .gw-pin{display:none} .gw-capmap{gap:var(--ix-s-14)} .gw-capc-shot{margin:var(--ix-s-14) var(--ix-s-14) 0} .gw-capc-body{padding:var(--s-4) var(--ix-s-18) var(--ix-s-20)} .gw-capc-h h3{font-size:var(--cx-card-t)} .gw-capbase{flex-wrap:wrap;gap:var(--ix-s-14);padding:var(--ix-s-22) var(--ix-s-20);border:1px solid var(--gea)} .gw-capbase svg{width:36px;height:36px} .gw-aud-card{padding:var(--ix-s-28) var(--ix-s-22) var(--s-5)} .gw-aud-card h3{font-size:var(--cx-h3);margin-top:var(--s-4)} .gw-bound{padding:var(--ix-s-28) var(--ix-s-22) var(--ix-s-26);border-radius:var(--r-4)} .gw-bound-line{font-size:var(--ix-t-22)} .gw-bound-list{gap:var(--s-2)} .gw-bound-list li{height:44px;padding:0 var(--s-3);font-size:var(--t-small)} } @media (prefers-reduced-motion:reduce){ .ix-sheet,.ix-ring,.ix-legend5,.gw-fig,.gw-thumb,.gw-th-img img{transition:none} } /* v3：仅保留行业布局与业务界面；组件由 05-system.css 统一。 */ .ix-page[data-tone="textile"],.ix-page[data-industry="textile"]{--acc:var(--textile);--acc-d:color-mix(in srgb,var(--textile) 65%,var(--white))} .ix-hero .ix-stack{width:100%} .ix-hero .cx-phead-more .ix-p3{margin-top:0} .ix-p3 li{grid-template-columns:minmax(0,1fr)} .ix-sheet .cx-shot-bar em,.ix-media .cx-shot-bar em{margin-left:auto;font-style:normal;font-size:var(--t-eyebrow);color:var(--acc)} .ix-sheet-body{padding:0} .ix-sheet,.ix-media,.gw-thumb{box-shadow:none} .ix-rcase,.ix-gcard,.gw-capc{padding:0} .ix-coop{grid-template-columns:minmax(0,1fr) auto} .ix-coop::before{width:3px} .ix-sit{background:var(--white)} .ix-gcard{color:var(--ink)} .ix-gcard p{color:var(--g57)} .ix-gcard .go{color:var(--brand)} .gw-show{align-self:center;min-width:0} .gw-points{margin-top:0} .gw-points li{grid-template-columns:minmax(0,1fr)} .gw-bound{border-radius:var(--r-4)} .gw-bound .cx-eyebrow{color:var(--shell-text)} .gw-bound .cx-eyebrow::before{background:var(--dk-brand)} @media(max-width:1023px){.ix-hero{--hero-h:880px}.ix-stack{max-width:760px;margin-inline:auto}} @media(max-width:767px){.ix-hero{--hero-h:720px;--peek:18px;--shift:24px}.ix-stack{max-width:100%}.ix-sit{padding:var(--s-5)}.ix-coop{grid-template-columns:minmax(0,1fr) auto}} /* 企业智能经营专用布局。页头、字号、卡片、按钮、截图框与收尾均由 05-system.css 提供。 */ [data-t="t1"]{--acc:var(--tier-1)} [data-t="t2"]{--acc:var(--tier-2)} [data-t="t3"]{--acc:var(--tier-3)} .op-nb{display:inline-block} .op-arr{display:inline-flex;width:var(--s-4);height:var(--s-4);overflow:hidden} .op-arr svg{flex:none;width:var(--s-4);height:var(--s-4)} .op-arr svg+svg{display:none} .op-hero-shot{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--gf5)} .op-hero-shot>img{width:100%;height:100%;object-fit:cover;object-position:left top} .op-feat{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-5)} .op-fcard{display:flex;flex-direction:column;min-width:0;padding:var(--s-5);position:relative;overflow:hidden} .op-fcard::before,.op-dim::before{content:"";position:absolute;top:0;left:var(--s-5);right:var(--s-5);height:3px;background:var(--acc)} .op-fhead{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s-2)} .op-fname{font-size:var(--cx-card-t);line-height:1.5} .op-fdim{display:inline-flex;align-items:center;gap:var(--s-2);font-size:var(--t-eyebrow);color:var(--g57)} .op-fdim i{width:6px;height:6px;flex:none;border-radius:50%;background:var(--acc)} /* 共用眉标点径 */ .op-fcover{margin-top:var(--s-4)} .op-fshot{position:relative;height:240px;overflow:hidden;background:var(--gf5)} /* 精选卡可读截图位：沿用 O2 的竖向空间，脱离首屏高度 */ .op-fshot>img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:left top} .op-fshot.is-zoom>img{width:calc(var(--zoom,1) * 100%);height:auto;object-fit:fill} .op-fshot.is-fade>img{-webkit-mask-image:linear-gradient(90deg,var(--black) 62%,transparent 82%);mask-image:linear-gradient(90deg,var(--black) 62%,transparent 82%)} .op-ftag{position:absolute;bottom:var(--s-3);left:var(--s-3);padding:var(--s-1) var(--s-2);background:var(--white);border:1px solid var(--gea);border-radius:var(--r-pill);font-size:var(--t-eyebrow)} .op-fshot.is-poster,.op-case-cover.is-poster,.op-thumb.is-poster{display:grid;place-items:center;padding:var(--s-3);background:var(--gf5)} .op-poster{position:relative;display:block;height:100%;max-height:100%;aspect-ratio:var(--pw) / var(--ph);overflow:hidden;border-radius:var(--cx-r-shot);background:var(--white)} .op-poster img{position:absolute;max-width:none;height:auto;width:calc(var(--iw) / var(--pw) * 100%);left:calc(var(--px) / var(--pw) * -100%);top:calc(var(--py) / var(--ph) * -100%)} .op-fbody{display:flex;flex:1;flex-direction:column;padding-top:var(--s-5)} .op-fk{font-size:var(--t-eyebrow);color:var(--g57)} .op-ftitle{margin-top:var(--s-2);font-size:var(--cx-card-t);line-height:1.5} .op-fbig{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--s-2);margin-top:var(--s-4);padding-top:var(--s-4);border-top:1px solid var(--gea)} .op-fbig b{font-size:var(--cx-num-m);line-height:1.3;color:var(--value)} .op-fbig span{font-size:var(--t-mono);color:var(--g57)} .op-fscene{margin-top:var(--s-3);font-size:var(--t-small);line-height:1.7;color:var(--g57)} .op-fscene em,.op-case-scene em{font-style:normal;margin-right:var(--s-2);color:var(--g92)} .op-ffoot{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);margin-top:auto;padding-top:var(--s-5)} .op-fgo{display:inline-flex;align-items:center;gap:var(--s-2);font-size:var(--t-small);color:var(--brand)} .op-block{padding-block:var(--cx-sec-y);background:var(--white);color:var(--ink)} .op-tint{background:var(--gf5)} .op-head{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:end;gap:var(--s-8);margin-bottom:var(--s-7)} .op-head h2{font-size:var(--cx-h2);line-height:1.22;margin-top:var(--s-4)} .op-lede{font-size:var(--cx-text);color:var(--g57);line-height:1.75;max-width:34em} .op-lede b{color:var(--ink);font-weight:500} .op-dims,.op-cases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-5)} .op-dim{position:relative;display:flex;flex-direction:column;min-width:0;overflow:hidden} .op-dim h3{margin-top:var(--s-2);font-size:var(--cx-h3);line-height:1.4} .op-dim-t{margin-top:var(--s-2);font-size:var(--cx-text);color:var(--ink)} .op-dim-p{margin-top:var(--s-3);font-size:var(--t-small);line-height:1.8;color:var(--g57)} .op-dim-list{margin-top:var(--s-5);padding-top:var(--s-3);border-top:1px solid var(--gea);display:grid;gap:var(--s-2)} .op-dim-list a{display:grid;grid-template-columns:80px minmax(0,1fr) var(--s-4);gap:var(--s-3);align-items:center;padding-block:var(--s-2)} /* 维度列表缩略图沿用 O2 的手机 80px */ .op-thumb{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;border:1px solid var(--gea);border-radius:var(--cx-r-shot);background:var(--gf5)} .op-thumb>img{width:100%;height:100%;object-fit:cover;object-position:left top} .op-thumb.is-poster{padding:var(--s-1)} .op-tx{min-width:0;display:flex;flex-direction:column} .op-tx b{font-size:var(--t-small);font-weight:500;line-height:1.5} .op-tx>span{font-size:var(--t-eyebrow);color:var(--g57);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .op-dim-list svg{width:var(--s-4);height:var(--s-4);color:var(--g92)} .op-dim-link{margin-top:auto;padding-top:var(--s-5)} .op-dim-link a{font-size:var(--t-small);color:var(--brand)} .op-cover-line{margin-top:var(--s-5);font-size:var(--t-small);color:var(--g57)} .op-cover-line b{margin-left:var(--s-2);font-weight:500;color:var(--ink)} .op-filters{padding:var(--s-5);border:1px solid var(--gea);border-radius:var(--r-4);background:var(--white);margin-bottom:var(--s-6);display:grid;gap:var(--s-3)} .op-frow{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-2)} .op-frow-k{width:var(--s-7);font-size:var(--t-mono);color:var(--g57)} .op-chip{cursor:pointer;gap:var(--s-2)} .op-chip i{width:6px;height:6px;border-radius:50%;background:var(--acc)} .op-chip:disabled{opacity:.4;cursor:default} .op-case{padding:0;display:flex;flex-direction:column;overflow:hidden;min-width:0} .op-case[hidden]{display:none} .op-case-cover{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;border-bottom:1px solid var(--gea);background:var(--gf5)} .op-case-cover::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--acc);z-index:1} .op-case-cover>img{width:100%;height:100%;object-fit:cover;object-position:left top} .op-case-cover.is-contain>img,.op-thumb.is-contain>img{object-fit:contain;object-position:center} .op-case-cover.is-contain>img{padding:var(--s-3)} .op-case-body{padding:var(--s-5);display:flex;flex:1;flex-direction:column} .op-case-meta{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--s-2);font-size:var(--t-eyebrow);color:var(--g57)} .op-case-meta>span:first-child{display:inline-flex;gap:var(--s-2);align-items:center} .op-case-meta i{width:6px;height:6px;border-radius:50%;background:var(--acc)} .op-case-name{margin-top:var(--s-4);font-size:var(--t-mono);color:var(--g57)} .op-case h3{margin-top:var(--s-1);font-size:var(--cx-card-t);line-height:1.5} .op-case h3 a:hover{color:var(--brand)} .op-big{margin-top:var(--s-4);padding-top:var(--s-4);border-top:1px solid var(--gea)} .op-big b{display:block;font-size:var(--cx-h3);font-weight:500;line-height:1.4;color:var(--value)} .op-big span{font-size:var(--t-mono);color:var(--g57)} .op-mets{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s-3);margin-top:var(--s-3)} .op-mets>div{padding:var(--s-3);background:var(--gf5);border-radius:var(--cx-r-shot)} .op-mets b{display:block;font-size:var(--cx-text);line-height:1.5;font-weight:500} .op-mets span{display:block;font-size:var(--t-eyebrow);color:var(--g57)} .op-mets .is-tx b{font-size:var(--t-mono)} .op-case-scene{margin-top:var(--s-4);font-size:var(--t-small);line-height:1.7;color:var(--g57)} .op-case-foot{display:flex;justify-content:space-between;gap:var(--s-3);margin-top:auto;padding-top:var(--s-5);font-size:var(--t-small);color:var(--brand)} .op-sec-foot{margin-top:var(--s-6);font-size:var(--t-mono);color:var(--g57)} /* 详情与文章同为 720 阅读栏，保留每个场景的前后流程、人工确认与结果。 */ .op-read{max-width:calc(var(--cx-read) + 2 * var(--gut))} .op-meta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-3);font-size:var(--t-mono);color:var(--g57)} .op-detail-sec{padding-top:var(--s-5)} .op-detail{display:grid;gap:var(--s-6)} .op-detail .ix-case-cover{margin:0;border:0} .op-detail .ix-case-cover img{width:100%;height:auto} .op-sec ol{margin-top:var(--s-4);display:grid;gap:var(--s-3)} .op-sec li{font-size:var(--cx-text);line-height:1.85;color:var(--g57)} .op-sec li b{font-weight:500;color:var(--ink);margin-right:var(--s-2)} .op-sign p+p{margin-top:var(--s-3);font-size:var(--cx-text);line-height:1.8} .op-results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-4);margin-top:var(--s-4)} .op-res{display:grid;gap:var(--s-2);padding:var(--s-5)} .op-res .ix-metric{font-size:var(--cx-num-m)} .op-res-text{font-size:var(--cx-card-t);font-weight:500} .op-scene{font-size:var(--t-small);line-height:1.8;color:var(--g57)} .op-scene b{display:block;font-weight:500} @media(max-width:1199px){.op-fdim{display:none}.op-dims,.op-cases{grid-template-columns:repeat(2,minmax(0,1fr))}.op-dims .op-dim:last-child{grid-column:1/-1}} @media(max-width:1023px){.op-head{grid-template-columns:minmax(0,1fr);gap:var(--s-5)}.op-feat{grid-template-columns:minmax(0,1fr)}.op-fcard{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s-5)}.op-fhead{grid-column:1/-1}.op-fcover{margin-top:0}.op-fbody{padding-top:0}} @media(max-width:767px){.op-fcard{display:flex;gap:0}.op-fcover{margin-top:var(--s-4)}.op-fbody{padding-top:var(--s-4)}.op-dims,.op-cases{grid-template-columns:minmax(0,1fr)}.op-dims .op-dim:last-child{grid-column:auto}.op-frow-k{width:100%}.op-filters{padding:var(--s-4)}.op-results{grid-template-columns:minmax(0,1fr)}} /* 最新动态专用列表 / 阅读排版；公共组件见 05-system.css。 --nw-* 延续已接受的 mockups-v2/pages/N1.html、N1-article.html：720 阅读栏、880 配图出血、480 竖页； 正文 18、小标题 22、引语 20、摘要 15.5、图说 13.5、日期 12.5，手机按样稿缩小； 非标准间距由 --s-* 派生，列表使用统一图文行与轻分隔线。 */ :root{--nw-col:var(--cx-read); --nw-wide:880px; --nw-portrait:480px; --nw-body:18px; --nw-h2:22px; --nw-quote:20px; --nw-sum:15.5px; --nw-cap:13.5px; --nw-xs:12.5px; --nw-s-2:calc(var(--s-1) / 2); --nw-s-6:calc(var(--s-1) + var(--nw-s-2)); --nw-s-10:calc(var(--s-2) + var(--nw-s-2)); --nw-s-14:calc(var(--s-3) + var(--nw-s-2)); --nw-s-18:calc(var(--s-4) + var(--nw-s-2)); --nw-s-20:calc(var(--s-4) + var(--s-1)); --nw-s-22:calc(var(--s-5) - var(--nw-s-2)); --nw-s-26:calc(var(--s-5) + var(--nw-s-2)); --nw-s-28:calc(var(--s-5) + var(--s-1)); --nw-s-36:calc(var(--s-6) + var(--s-1)); --nw-s-40:calc(var(--s-6) + var(--s-2)); --nw-s-44:calc(var(--s-6) + var(--s-3)); --nw-s-52:calc(var(--s-7) + var(--s-1)); --nw-s-72:calc(var(--s-8) + var(--s-2));} [data-nw-tone]{--c:var(--brand);--acc:var(--c)} [data-nw-tone="t1"]{--c:var(--tier-1)} [data-nw-tone="t2"]{--c:var(--tier-2)} [data-nw-tone="t3"]{--c:var(--tier-3)} [data-nw-tone="value"]{--c:var(--value)} .nw-meta{display:flex;align-items:center;flex-wrap:wrap;gap:var(--nw-s-6) var(--nw-s-10);font-size:var(--t-mono);line-height:22px;color:var(--g57)} .nw-date{font-family:var(--font-mono);font-size:var(--nw-xs);color:var(--g57)} .nw-date,.nw-date *{letter-spacing:.02em!important} .nw-go{display:inline-flex;align-items:center;gap:var(--nw-s-6);font-size:var(--t-small);font-weight:500;color:var(--cta);white-space:nowrap} .nw-seg>span{display:inline-block} /* 动态列表：以行和分隔线组织内容，图片、标题和日期始终对齐。 */ .nw-index-inner{max-width:1120px;margin-inline:auto} .nw-index-head{padding-block:var(--s-7)} .nw-index-head .cx-h1{margin-top:var(--s-5)} .nw-index-head .cx-lede{margin-top:var(--s-4);max-width:48em} .nw-index{padding-block:var(--s-7) var(--s-8)} .nw-index:focus{outline:none} .nw-index-bar{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s-4);padding-bottom:var(--s-4);border-bottom:1px solid var(--gea)} .nw-total{font-size:var(--t-small);font-weight:500;color:var(--ink)} .nw-sort,.nw-page-status{font-size:var(--t-small);color:var(--g57);line-height:1.6} .nw-rows{list-style:none;padding:0;margin:0} .nw-row{display:grid;grid-template-columns:224px minmax(0,1fr) var(--s-5);gap:var(--s-6);align-items:center;padding-block:var(--s-6);border-bottom:1px solid var(--gea);color:var(--ink)} .nw-row.is-text{grid-template-columns:minmax(0,1fr) var(--s-5)} .nw-row-image{display:block;aspect-ratio:16/10;overflow:hidden;border:1px solid var(--gea);border-radius:var(--cx-r-shot);background:var(--gf5)} .nw-row-image img{display:block;width:100%;height:100%;object-fit:cover} .nw-row-body{min-width:0} .nw-row h2{margin-top:var(--s-3);font-size:var(--t-h3);font-weight:500;line-height:1.5;overflow-wrap:anywhere;transition:color var(--d-fast)} .nw-row-summary{margin-top:var(--s-2);font-size:var(--nw-sum);line-height:1.75;color:var(--g57);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere} .nw-row-arrow{display:grid;place-items:center;color:var(--g57);transition:transform var(--d-fast),color var(--d-fast)} .nw-row-arrow svg{width:var(--s-5);height:var(--s-5)} .nw-row:hover h2,.nw-row:focus-visible h2{color:var(--cta)} .nw-row:hover .nw-row-arrow{color:var(--cta);transform:translateX(var(--s-1))} .nw-row:focus-visible{outline:2px solid var(--cta);outline-offset:var(--s-1);border-radius:var(--r-2)} .nw-empty{padding-block:var(--s-8);text-align:center;color:var(--g57);font-size:var(--t-body);border-bottom:1px solid var(--gea)} .nw-index-footer{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--s-5);padding-top:var(--s-6)} .nw-pagination{display:grid;grid-template-columns:auto auto auto;align-items:center;gap:var(--s-4);color:var(--ink);font-size:var(--t-small)} .nw-page-numbers{display:flex;align-items:center;gap:var(--s-1)} .nw-page,.nw-page-control{display:inline-flex;min-width:44px;min-height:44px;justify-content:center;align-items:center;border:1px solid var(--gea);border-radius:var(--r-2);transition:color var(--d-fast),border-color var(--d-fast),background-color var(--d-fast)} .nw-page-control{padding-inline:var(--s-3);gap:var(--s-2);white-space:nowrap} .nw-page-control svg{width:var(--s-4);height:var(--s-4)} .nw-page.is-current{color:var(--white);border-color:var(--cta);background:var(--cta);font-weight:500} .nw-pagination a:hover{color:var(--cta);border-color:var(--cta)} .nw-pagination a:focus-visible{outline:2px solid var(--cta);outline-offset:var(--s-1)} .nw-page-control.is-disabled{color:var(--g92)} .nw-page-gap{display:inline-flex;justify-content:center;align-items:center;width:var(--s-3);color:var(--g57)} .nw-art{padding:var(--nw-s-44) 0 var(--s-9)} .nw-art-wrap{container-type:inline-size} .nw-col{max-width:var(--nw-col);margin-inline:auto} .nw-wide{max-width:var(--nw-wide);margin-inline:auto} .nw-art .cx-crumb{min-width:0} .nw-art .cx-crumb [aria-current]{min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink)} .nw-ahead{padding:var(--s-6) 0 0} .nw-ahead h1{margin-top:var(--s-3);font-size:var(--cx-dh1);line-height:1.3;font-weight:500} .nw-ahead h1,.nw-ahead h1 *{letter-spacing:-.015em!important} .nw-asum{margin-top:var(--nw-s-14);font-size:var(--nw-body);line-height:1.75;color:var(--g57);text-wrap:pretty} .nw-fig{margin-block:var(--nw-s-40)} .nw-col>.nw-fig,.nw-body .nw-fig{width:min(var(--nw-wide),100cqw);margin-inline:calc((100% - min(var(--nw-wide),100cqw)) / 2)} .nw-hero-fig{margin-bottom:0} .nw-fig img{width:100%;height:auto;border-radius:var(--cx-r-shot);border:1px solid var(--gea);background:var(--gf5)} .nw-fig figcaption{margin-top:var(--nw-s-10);font-size:var(--nw-cap);line-height:1.6;color:var(--g57)} .nw-body .nw-fig.nw-fig--col{width:auto;margin-inline:0} .nw-body .nw-fig.nw-fig--portrait{width:auto;margin-inline:0} .nw-fig--portrait .nw-zoom{max-width:var(--nw-portrait);margin-inline:auto} .nw-fig--portrait figcaption{text-align:center} .nw-col>.nw-fig.nw-fig--page{width:auto;margin-inline:0} .nw-fig--page .nw-zoom{display:grid;place-items:center;padding:var(--s-6) var(--s-5);border-radius:var(--cx-r-shot);background:var(--gf5);border:1px solid var(--gea)} .nw-fig--page img{width:min(100%,var(--nw-portrait));border-radius:3px;border-color:color-mix(in srgb,var(--ink) 6%,transparent);background:var(--white); box-shadow:0 1px 2px color-mix(in srgb,var(--ink) 6%,transparent),0 26px 50px -30px color-mix(in srgb,var(--ink) 40%,transparent)} .nw-fig--page figcaption{text-align:center} .nw-zoom{position:relative;display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in;text-align:left} .nw-zoom-ic{position:absolute;right:var(--nw-s-10);bottom:var(--nw-s-10);display:grid;place-items:center;width:var(--s-6);height:var(--s-6);border-radius:50%; background:color-mix(in srgb,var(--white) 94%,transparent);color:var(--ink);box-shadow:0 2px 8px color-mix(in srgb,var(--ink) 16%,transparent);opacity:0;transition:opacity var(--d-base) var(--ease-out)} .nw-zoom-ic svg{width:var(--s-4);height:var(--s-4)} .nw-zoom:hover .nw-zoom-ic,.nw-zoom:focus-visible .nw-zoom-ic{opacity:1} @media (hover:none),(max-width:1023px){ .nw-zoom-ic{opacity:1} } .nw-body{margin-top:var(--nw-s-44);font-size:var(--nw-body);line-height:1.85;color:var(--g21);text-wrap:pretty} .nw-body p+p,.nw-body p+.nw-list,.nw-body .nw-list+p{margin-top:var(--nw-s-20)} .nw-body p b{font-weight:500;color:var(--ink)} .nw-body p a{color:var(--cta);border-bottom:1px solid color-mix(in srgb,var(--cta) 40%,transparent)} .nw-body p a:hover{border-bottom-color:var(--cta)} .nw-body h2{margin:var(--nw-s-52) 0 var(--nw-s-14);font-size:var(--nw-h2);line-height:1.45;font-weight:500;color:var(--ink)} .nw-body h2,.nw-body h2 *{letter-spacing:-.01em!important} .nw-body h2+p,.nw-body h2+.nw-list{margin-top:0} .nw-body .nw-fig+p,.nw-body .nw-quote+p{margin-top:0} .nw-list{display:flex;flex-direction:column;gap:var(--s-2);padding-left:1.6em} .nw-list>li{list-style:none;position:relative} ol.nw-list{counter-reset:nw} ol.nw-list>li{counter-increment:nw} ol.nw-list>li::before{content:counter(nw) ".";position:absolute;left:-1.6em;width:1.4em;font-family:var(--font-mono);font-size:.85em;line-height:2.18;color:var(--c)} ul.nw-list>li::before{content:"";position:absolute;left:-1.1em;top:.8em;width:var(--nw-s-6);height:var(--nw-s-6);border-radius:50%;background:var(--c)} .nw-list b{font-weight:500;color:var(--ink)} .nw-quote{margin:var(--nw-s-28) 0;padding:var(--s-1) 0 var(--s-1) var(--s-5);border-left:2px solid var(--c)} .nw-quote p{font-size:var(--nw-quote);line-height:1.65;color:var(--ink)} .nw-quote cite{display:block;margin-top:var(--nw-s-10);font-style:normal;font-size:var(--nw-cap);color:var(--g57)} .nw-rel{margin-top:var(--nw-s-72)} .nw-rel-grid{margin-top:var(--nw-s-18);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-4)} .nw-rc{position:relative;display:flex;flex-direction:column;gap:var(--s-2)} .nw-rc small{font-size:var(--t-eyebrow);line-height:18px;color:var(--g92)} .nw-rc small,.nw-rc small *{letter-spacing:.04em!important} .nw-rc b{font-size:var(--nw-body);line-height:1.4;font-weight:500;color:var(--ink)} .nw-rc-d{font-size:var(--nw-cap);line-height:1.6;color:var(--g57)} .nw-rc .nw-go{margin-top:auto;padding-top:var(--s-3);font-size:var(--t-mono)} .nw-rc.is-cta{background:var(--ice);border-color:var(--ice)} .nw-rc.is-cta:hover{border-color:color-mix(in srgb,var(--cta) 40%,var(--ice))} .nw-pager{margin-top:var(--s-7);padding-top:var(--nw-s-28);border-top:1px solid var(--gea);display:grid;grid-template-columns:1fr 1fr;gap:var(--s-4)} .nw-pg{display:flex;flex-direction:column;gap:var(--s-2);padding:var(--nw-s-18) var(--nw-s-22) var(--nw-s-20);border-radius:var(--r-4);border:1px solid var(--line);color:var(--ink);transition:border-color var(--d-base) var(--ease-out)} .nw-pg:hover{border-color:var(--ink)} .nw-pg>small{display:inline-flex;align-items:center;gap:var(--nw-s-6);font-size:var(--nw-xs);color:var(--g92)} .nw-pg>small svg{width:14px;height:14px} .nw-pg b{font-size:var(--t-body);line-height:1.55;font-weight:500;color:var(--ink);text-wrap:balance} .nw-pg.is-next{align-items:flex-end;text-align:right} .nw-pg.is-next .nw-meta{justify-content:flex-end} .nw-pg.is-empty{visibility:hidden;border:0} .nw-back{margin-top:var(--s-5);display:flex;justify-content:center} .nw-back a{display:inline-flex;align-items:center;gap:var(--s-2);font-size:var(--t-small);color:var(--g57);border-bottom:1px solid var(--gc7);padding-bottom:var(--nw-s-2)} .nw-back a:hover{color:var(--ink);border-color:var(--ink)} @media (max-width:1023px){ .nw-row{grid-template-columns:192px minmax(0,1fr) var(--s-5);gap:var(--s-5)} .nw-index-footer{flex-direction:column;align-items:flex-start} :root{--nw-h2:20px;--nw-quote:19px} .nw-rel-grid{grid-template-columns:1fr 1fr} .nw-rc.is-cta{grid-column:1 / -1} } @media (max-width:639px){ .nw-index-head{padding-block:var(--s-6)} .nw-index-head .cx-h1{margin-top:var(--s-5)} .nw-index-head .cx-lede{margin-top:var(--s-3)} .nw-index{padding-block:var(--s-6) var(--s-7)} .nw-index-bar{gap:var(--s-3)} .nw-total,.nw-sort,.nw-page-status{font-size:var(--t-mono)} .nw-row{grid-template-columns:104px minmax(0,1fr);gap:var(--s-4);align-items:start;padding-block:var(--s-5)} .nw-row.is-text{grid-template-columns:minmax(0,1fr)} .nw-row-image{margin-top:var(--s-1)} .nw-row h2{margin-top:var(--s-2);font-size:var(--t-body);line-height:1.55} .nw-row-summary{font-size:var(--t-mono);line-height:1.65} .nw-row-arrow{display:none} .nw-index-footer{gap:var(--s-4);padding-top:var(--s-5)} .nw-pagination{width:100%;grid-template-columns:1fr 1fr;gap:var(--s-3)} .nw-page-numbers{grid-column:1 / -1;grid-row:1;justify-content:center} .nw-page-control.is-prev{grid-column:1;grid-row:2;justify-self:start} .nw-page-control.is-next{grid-column:2;grid-row:2;justify-self:end} .nw-meta{gap:var(--nw-s-6) var(--s-2)} .nw-art{padding:var(--s-5) 0 var(--nw-s-72)} .nw-ahead{padding:var(--s-6) 0 0} .nw-ahead h1{margin-top:var(--s-3);font-size:var(--cx-dh1);line-height:1.3;font-weight:500} .nw-asum{font-size:var(--t-body)} .nw-fig{margin-block:var(--nw-s-28)} .nw-fig img{border-radius:var(--r-2)} .nw-fig figcaption{font-size:var(--t-mono)} .nw-fig--page .nw-zoom{padding:var(--s-4) var(--s-3)} .nw-body{margin-top:var(--s-6);font-size:var(--t-body)} :root{--nw-h2:18px;--nw-quote:17px} .nw-body h2{margin:var(--nw-s-40) 0 var(--nw-s-10)} .nw-quote{padding-left:var(--s-4)} .nw-rel{margin-top:var(--s-8)} .nw-rel-grid{grid-template-columns:minmax(0,1fr);gap:var(--s-3)} .nw-pager{grid-template-columns:minmax(0,1fr);gap:var(--s-3)} .nw-pg.is-next{align-items:flex-start;text-align:left} .nw-pg.is-next .nw-meta{justify-content:flex-start} .nw-pg.is-empty{display:none} } .nw-meta .cx-tag{--acc:var(--c)} .nw-pg{border-radius:var(--r-4)} .nw-art .cx-crumb [aria-current]{white-space:normal} /* ══ 20-shell.js · 壳层样式（导航 / 页脚 / 汉堡菜单 / 降级占位区块） ══ */ #app{ outline:none; } /* ── 导航 · design-tokens.md 5.1 ── */ .nav{ position:sticky; top:0; left:0; right:0; z-index:60; height:var(--nav-h); background:transparent; border-bottom:1px solid transparent; transition:background-color var(--d-base) var(--ease-inout), border-color var(--d-base) var(--ease-inout); } .nav.is-scrolled{ background:rgba(0,0,0,.72); -webkit-backdrop-filter:blur(16px) saturate(160%); backdrop-filter:blur(16px) saturate(160%); border-bottom:1px solid var(--g21); } .nav-inner{ height:var(--nav-h); display:flex; align-items:center; justify-content:space-between; gap:var(--s-5); } .nav-brand{ display:flex; align-items:center; gap:var(--s-3); color:var(--white); min-width:0; } .nav-mark{ width:34px; height:34px; flex:none; display:block; object-fit:contain; } .hs-wrap{ position:relative; } .hs-wrap::before,.hs-wrap::after{ content:""; position:absolute; top:0; bottom:0; width:56px; pointer-events:none; z-index:2; opacity:0; transition:opacity .25s ease; } .hs-wrap::before{ left:0; background:linear-gradient(90deg,var(--local-bg,#fff),transparent); } .hs-wrap::after{ right:0; background:linear-gradient(270deg,var(--local-bg,#fff),transparent); } .hs-wrap.can-prev::before{ opacity:1; } .hs-wrap.can-next::after{ opacity:1; } .hs-btn{ position:absolute; top:50%; transform:translateY(-50%); z-index:3; width:44px; height:44px; border-radius:50%; border:1px solid var(--local-line); background:var(--local-bg,#fff); color:var(--local-text); display:grid; place-items:center; cursor:pointer; box-shadow:0 6px 20px rgba(11,29,51,.12); transition:opacity .25s ease, background .2s ease; } .hs-btn:hover{ background:var(--local-card-bg,#f4f7fa); } .hs-btn svg{ width:18px; height:18px; } .hs-btn[data-hs-prev]{ left:-8px; } .hs-btn[data-hs-next]{ right:-8px; } .hs-btn[disabled]{ opacity:0; pointer-events:none; } @media (max-width:767px){ .hs-btn{ display:none; } .hs-wrap::before,.hs-wrap::after{ width:32px; } } @media (max-width:639px){ .nav-mark{ width:30px; height:30px; } } .footer-mark{ width:40px; height:40px; display:block; object-fit:contain; margin-bottom:var(--s-3); } .nav-logo-col{ display:flex; flex-direction:column; align-items:center; gap:2px; flex:none; } /* 38×38 为 page-map.md 字面规格，design-tokens.md 无对应 token，按文档字面写死 */ .nav-logo{ width:38px; height:38px; border-radius:var(--r-2); background:linear-gradient(135deg, var(--g57), var(--black)); color:var(--white); display:flex; align-items:center; justify-content:center; font-size:var(--t-h3); font-weight:500; line-height:1; flex:none; } .nav-logo-tag{ font-size:var(--t-eyebrow); line-height:1.2; color:var(--gc7); white-space:nowrap; } /* "极小" 标注：--t-eyebrow 已是最小字号 token，用 scale() 再缩小，不新造字号数值 */ .nav-logo-tag > span{ display:inline-block; transform:scale(.72); } .nav-brand-text{ display:flex; flex-direction:column; justify-content:center; min-width:0; } .nav-brand-cn{ font-size:var(--t-small); font-weight:500; color:var(--white); line-height:1.3; white-space:nowrap; } .nav-brand-en{ font-size:var(--t-eyebrow); color:var(--gc7); letter-spacing:.06em; line-height:1.3; white-space:nowrap; } .nav-links{ display:flex; align-items:center; gap:var(--s-6); } .nav-link{ position:relative; font-size:var(--t-small); color:var(--gc7); padding-block:var(--s-2); white-space:nowrap; } .nav-link:hover{ color:var(--white); } .nav-link.is-active{ color:var(--white); } .nav-link.is-active::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--brand); } .nav-actions{ display:flex; align-items:center; gap:var(--s-4); flex:none; } .nav-cta{ white-space:nowrap; } /* 初始态"文字随所在区块明暗自适应"（5.1）：滚动到底色实体化之前， 导航文字按当前页面第一个区块的 .sec-light/.sec-tint/.sec-dark 语境切换深浅两套配色， 全部复用既有 token，不新造颜色。一旦滚动出现实体底色（.is-scrolled）则恢复标准深色底配色。 */ .nav.nav--light:not(.is-scrolled) .nav-brand-cn{ color:var(--black); } .nav.nav--light:not(.is-scrolled) .nav-brand-en, .nav.nav--light:not(.is-scrolled) .nav-logo-tag{ color:var(--g57); } /* 注意：15-effects.css 用 #shell-nav 前缀把顶栏改为白底 #182c21 字、滚动后 #13271f 底白字， 其中 #shell-nav .nav-link{color:inherit} 压过本段所有 .nav-link 配色，下面几条 nav--light 规则大多已不生效。 .nav-overlay 是 .nav 的子节点，会继承顶栏字色，所以手机菜单的配色写在 16-content-update.css（方案B 深绿面板）。 */ .nav.nav--light:not(.is-scrolled) .nav-links .nav-link{ color:var(--g57); } .nav.nav--light:not(.is-scrolled) .nav-links .nav-link:hover, .nav.nav--light:not(.is-scrolled) .nav-links .nav-link.is-active{ color:var(--black); } .nav.nav--light:not(.is-scrolled) .nav-burger span{ background:var(--black); } /* ── 汉堡按钮：<900px（page-map.md 字面规格，design-tokens.md 断点表未含该值） ── */ .nav-burger{ display:none; width:36px; height:36px; flex:none; position:relative; } .nav-burger span{ position:absolute; left:7px; right:7px; height:2px; background:var(--white); transition:transform var(--d-base) var(--ease-inout), opacity var(--d-base) var(--ease-inout), top var(--d-base) var(--ease-inout); } .nav-burger span:nth-child(1){ top:12px; } .nav-burger span:nth-child(2){ top:17px; } .nav-burger span:nth-child(3){ top:22px; } .nav-burger.is-open span:nth-child(1){ top:17px; transform:rotate(45deg); } .nav-burger.is-open span:nth-child(2){ opacity:0; } .nav-burger.is-open span:nth-child(3){ top:17px; transform:rotate(-45deg); } /* ── 移动端全屏覆盖菜单 ── */ .nav-overlay{ position:fixed; top:var(--nav-h); left:0; right:0; bottom:0; z-index:55; background:var(--black); overflow-y:auto; opacity:0; visibility:hidden; transition:opacity var(--d-base) var(--ease-inout), visibility 0s linear var(--d-base); } .nav-overlay.is-open{ opacity:1; visibility:visible; transition-delay:0s; } .nav-overlay-inner{ display:flex; flex-direction:column; gap:var(--s-5); padding-block:var(--s-8); } .nav-link-mobile{ font-size:var(--t-h3); display:inline-block; } .nav-cta-mobile{ margin-top:var(--s-4); align-self:flex-start; } body.shell-no-scroll{ overflow:hidden; } @media (max-width:899px){ .nav-links, .nav-cta{ display:none; } .nav-burger{ display:flex; align-items:center; justify-content:center; } } /* ── 页脚 · page-map.md 全局壳层章节 ── */ .footer{ background:var(--black); color:var(--white); } .footer-top{ display:grid; grid-template-columns:1.4fr repeat(3, 1fr); gap:var(--s-6); padding-block:var(--s-8); border-bottom:1px solid var(--g21); } .footer-brand-name{ color:var(--white); } .footer-group{ margin-top:var(--s-1); } .footer-tagline{ margin-top:var(--s-4); max-width:32em; color:var(--g92); } .footer-cols{ display:contents; } .footer-col-title{ color:var(--white); font-weight:500; margin-bottom:var(--s-3); } .footer-link{ font-size:var(--t-small); color:var(--g92); transition:color var(--d-fast) var(--ease-inout); } .footer-link:hover{ color:var(--white); } .footer-bottom{ display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:var(--s-3) var(--s-6); padding-block:var(--s-5); color:var(--g57); } .footer-bottom-group{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--s-2); } .footer-bottom-item{ display:inline-flex; align-items:center; gap:var(--s-2); white-space:nowrap; } .footer-bottom-filings{ justify-self:end; justify-content:flex-end; } .footer-bottom-link{ color:inherit; text-underline-offset:.2em; transition:color var(--d-fast) var(--ease-inout); } .footer-bottom-link:hover{ color:var(--white); text-decoration:underline; } .footer-bottom-link:focus-visible{ color:var(--white); outline:1px solid currentColor; outline-offset:3px; } .footer-dot{ color:var(--g21); } @media (max-width:959px){ .footer-top{ grid-template-columns:1fr 1fr; } .footer-bottom{ grid-template-columns:1fr; } .footer-bottom-filings{ justify-self:start; justify-content:flex-start; } } @media (max-width:639px){ .footer-top{ grid-template-columns:1fr; } .footer-bottom .footer-dot{ display:none; } } /* ── VIEWS 缺失 / 渲染异常时的降级占位区块 ── */ .shell-fallback-inner{ text-align:center; max-width:640px; margin-inline:auto; align-items:center; } .shell-fallback-actions{ justify-content:center; } #shell-dock{ position:fixed; right:var(--dock-right); top:50%; transform:translateY(-50%); z-index:90; } .dock{ display:flex; flex-direction:column; border-radius:var(--r-4); background:var(--local-card-bg); border:1px solid var(--local-card-border); box-shadow:0 20px 44px -20px rgba(16,32,52,.28), 0 2px 6px rgba(16,32,52,.06); } .dock-item{ position:relative; width:calc(var(--dock-w) - 2px); padding:11px 5px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:0; cursor:pointer; border:0; background:none; color:var(--local-text-2); font:inherit; text-decoration:none; transition:background var(--d-base) var(--ease-inout), color var(--d-base) var(--ease-inout); } .dock > * + *{ border-top:1px solid var(--local-line); } .dock-entry{ position:relative; } .dock > :first-child{ border-radius:calc(var(--r-4) - 1px) calc(var(--r-4) - 1px) 0 0; } .dock-entry:first-child > .dock-item{ border-radius:calc(var(--r-4) - 1px) calc(var(--r-4) - 1px) 0 0; } .dock > :last-child{ border-radius:0 0 calc(var(--r-4) - 1px) calc(var(--r-4) - 1px); } .dock-item:hover, .dock-entry.is-open > .dock-item{ background:color-mix(in srgb, var(--brand) 7%, var(--white)); color:var(--brand); } .dock-item:focus-visible{ outline:2px solid var(--brand); outline-offset:-2px; } .dock-item svg{ width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; } .dock-label{ position:absolute; right:calc(100% + var(--s-2)); white-space:nowrap; padding:5px 10px; border-radius:var(--r-pill); background:var(--local-card-bg); border:1px solid var(--local-card-border); color:var(--local-text-2); font-size:var(--t-eyebrow); line-height:1.2; letter-spacing:.02em; box-shadow:0 8px 20px -10px rgba(16,32,52,.3); opacity:0; transform:translateX(6px); pointer-events:none; transition:opacity var(--d-base) var(--ease-out), transform var(--d-base) var(--ease-out); } .dock-item:hover .dock-label, .dock-item:focus-visible .dock-label{ opacity:1; transform:translateX(0); } .dock-entry.is-open .dock-label{ opacity:0; } .dock-top{ width:calc(var(--dock-w) - 2px); padding:9px 5px; display:grid; place-items:center; cursor:pointer; border-left:0; border-right:0; border-bottom:0; background:none; color:var(--g92); transition:background var(--d-base) var(--ease-inout), color var(--d-base) var(--ease-inout); } .dock-top:hover{ background:color-mix(in srgb, var(--brand) 7%, var(--white)); color:var(--brand); } .dock-top:focus-visible{ outline:2px solid var(--brand); outline-offset:-2px; } .dock-top svg{ width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; } .dock-pop{ position:absolute; right:calc(100% + 12px); top:50%; transform:translateY(-50%) translateX(6px); width:188px; padding:14px; border-radius:var(--r-3); text-align:center; background:var(--local-card-bg); border:1px solid var(--local-card-border); box-shadow:0 20px 46px -18px rgba(16,32,52,.3); opacity:0; visibility:hidden; pointer-events:none; transition:opacity var(--d-base) var(--ease-out), transform var(--d-base) var(--ease-out); } .dock-entry.is-open > .dock-pop{ opacity:1; visibility:visible; transform:translateY(-50%) translateX(0); pointer-events:auto; } .dock-pop::after{ content:""; position:absolute; left:100%; top:0; bottom:0; width:12px; } .dock-pop img{ width:100%; height:auto; display:block; border-radius:var(--r-2); background:var(--white); } .dock-pop .who{ display:block; margin-bottom:var(--s-2); font-size:var(--t-small); font-weight:600; line-height:1.4; color:var(--local-text); } .dock-pop .cap{ display:block; margin-top:var(--s-2); font-size:var(--t-eyebrow); line-height:1.5; color:var(--local-text-2); } .dock-mail{ width:366px; padding:var(--s-5); border-radius:var(--r-4); text-align:left; } .dock-mail::before{ content:""; position:absolute; right:-5px; top:50%; width:8px; height:8px; background:var(--white); border-right:1px solid var(--local-line); border-top:1px solid var(--local-line); transform:translateY(-50%) rotate(45deg); } .dock-mail-heading{ display:flex; align-items:center; justify-content:space-between; gap:var(--s-3); } .dock-mail-heading h2{ font-size:calc(var(--t-body) + 2px); line-height:1.4; font-weight:500; color:var(--g21); } .dock-mail-heading svg{ width:20px; height:20px; fill:none; stroke:var(--brand); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; } .dock-mail-description{ margin-top:var(--s-2); margin-bottom:var(--s-5); font-size:var(--t-eyebrow); color:var(--g57); } .dock-mail-address{ color:var(--g21); font-size:var(--t-body); font-weight:500; line-height:1.6; letter-spacing:-.2px; white-space:nowrap; user-select:all; } .dock-mail-actions{ display:flex; align-items:center; gap:var(--s-3); margin-top:var(--s-4); padding-top:var(--s-4); border-top:1px solid var(--local-line); } .dock-copy, .dock-send{ display:flex; align-items:center; justify-content:center; gap:var(--s-2); flex:1; min-height:40px; padding:var(--s-2); border-radius:var(--r-2); font-size:var(--t-small); line-height:1.4; } .dock-copy{ background:var(--brand); color:var(--white); border:0; cursor:pointer; } .dock-copy:hover{ background:var(--brand-d); } .dock-copy:disabled{ cursor:wait; } .dock-copy.is-copied{ background:color-mix(in srgb, var(--tier-2) 9%, var(--white)); color:var(--tier-2); } .dock-send{ color:var(--brand); text-decoration:none; } .dock-send:hover{ background:color-mix(in srgb, var(--brand) 5%, var(--white)); } .dock-copy svg, .dock-send svg{ width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; } .dock-copy:focus-visible, .dock-send:focus-visible{ outline:2px solid var(--brand); outline-offset:3px; } .dock-mail-status{ margin-top:var(--s-3); min-height:1.6em; color:var(--g57); font-size:var(--t-eyebrow); line-height:1.6; } @media (max-width:1023px){ .dock-item, .dock-top{ padding-inline:var(--s-1); } .dock-item{ padding-block:9px; } .dock-item svg{ width:18px; height:18px; } } @media (max-width:767px){ #shell-dock{ display:none; } } @media (prefers-reduced-motion:reduce){ .nav, .nav-burger span, .nav-overlay{ transition-duration:0ms !important; } .dock-item, .dock-top, .dock-pop{ transition-duration:0ms !important; } } .ab-section-head .cx-h2{margin-top:var(--s-4)} .ab-section-head .cx-lede{margin-top:var(--s-4);max-width:46em} .ab-group-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:var(--s-8);border-top:1px solid var(--gea)} .ab-group-kpis .stat{display:flex;flex-direction:column;gap:var(--s-2);padding-block:var(--s-6);border-right:1px solid var(--gea)} .ab-group-kpis .stat:last-child{border-right:0} .ab-group-kpis .n{font-size:var(--cx-num);font-weight:500;line-height:1;color:var(--value)} .ab-group-kpis .n em{font-style:normal} .ab-group-kpis .stat .n{flex-wrap:nowrap;white-space:nowrap} .ab-group-kpis .k{font-size:var(--t-small);line-height:1.6;color:var(--g57)} .ab-group-kpis .stat-note{display:block;margin-top:var(--s-1);font-size:var(--t-eyebrow);line-height:1.6;color:var(--g57)} .ab-team{display:grid;grid-template-columns:1.6fr repeat(4,minmax(0,1fr));grid-template-rows:auto auto;gap:var(--s-5) var(--s-4);margin-top:var(--s-7)} .ab-team .card{grid-row:span 2;display:grid;grid-template-rows:subgrid;align-content:start;background:transparent;border:0;padding:0;box-shadow:none;min-width:0} .ab-avatar{width:100%;aspect-ratio:4/5;align-self:end;overflow:hidden;margin:0;border-radius:var(--cx-r-shot);background:var(--gf5)} .ab-avatar img{width:100%;height:100%;object-fit:cover;display:block} .ab-meta{padding-top:var(--s-3)} .ab-team h3{font-size:var(--cx-card-t);line-height:1.5;margin:0} .ab-lines{display:grid;gap:var(--s-1);margin-top:var(--s-2)} .ab-lines span{display:block;font-size:var(--t-small);line-height:1.6;color:var(--g57)} .ab-team .role{margin-top:var(--s-1);color:var(--brand);font-size:var(--t-eyebrow);line-height:1.6} .ab-gallery{display:flex;gap:var(--s-4);overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:var(--s-3);scrollbar-width:thin} .ab-shot{flex:0 0 clamp(230px,26vw,320px);scroll-snap-align:start;overflow:hidden;border:1px solid var(--gea);border-radius:var(--cx-r-shot)} .ab-shot button{display:block;width:100%;padding:0;border:0;background:transparent;cursor:zoom-in} .ab-shot img{width:100%;aspect-ratio:4/3;object-fit:cover} .ab-gallery-controls{display:flex;gap:var(--s-3);justify-content:flex-end;margin-bottom:var(--s-4)} .ab-gallery-controls .cx-btn{min-width:var(--s-7);justify-content:center;gap:0;padding:var(--s-3)} .ab-gallery-controls svg{width:var(--s-5);height:var(--s-5)} @media(max-width:1180px){.ab-team{grid-template-columns:repeat(3,minmax(0,1fr))}} @media(max-width:820px){.ab-team{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:1023px){.ab-group-kpis .n{font-size:var(--cx-num-m)}} @media(max-width:639px){.ab-group-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.ab-group-kpis .stat:nth-child(2n){border-right:0}.ab-group-kpis .stat:nth-child(-n+2){border-bottom:1px solid var(--gea)}} @media(max-width:560px){.ab-team{grid-template-columns:minmax(0,1fr)}} .ct-form .err{font-size:var(--t-eyebrow);line-height:1.5;color:var(--error)} .ct-form .err:empty{display:none} .ct-form .is-error input,.ct-form .is-error select,.ct-form .is-error textarea{border-color:var(--error)} .ct-ok{padding-top:var(--s-4);border-top:1px solid var(--gea);font-size:var(--t-small);line-height:1.7;color:var(--ink)} .ct-ok[hidden]{display:none!important} .ct-ok.is-error{color:var(--error);border-color:var(--error)} .ct-form button[disabled]{opacity:.62;cursor:wait} .ct-contacts{overflow-wrap:anywhere} @media(max-width:420px){.ct-contacts{display:grid;gap:var(--s-5);justify-items:start}} .nojs-nav{padding:16px;display:flex;flex-wrap:wrap;gap:16px;border-bottom:1px solid #eaeaea}.nojs-nav a{color:#1f4fb8} [id]{scroll-margin-top:100px}