/* TOIVO 官网原型 · 全站共用的组件样式
   token 不在这里：build.py 把 参考/tokens/tokens.css 原样复制到输出目录，页面用 <link> 引入，tokens.css 不手改。
   各页自己的样式在 css/page-<页>.css，构建时接在本文件后面合成一份 site.css；本文件只放两页以上共用的东西。
   尺寸与字样式取自 Figma「TOIVO 官网」Wireframe 页的 1440 画板，2026-09-23 对齐；2026-09-30 起三语，语言层写在「语言」一节。 */

/* ══════════ 明暗两套的局部值 ══════════ */
/* 晕染带 alpha 的值 Figma 变量表达不了，在这里按主题各给一套。
   规则与 tokens.css 相同：裸 :root 是浅色，系统深色走 prefers-color-scheme 且被显式 light 覆盖，显式 dark 再赢一次。 */
:root{
  /* 浅色晕染取 Figma wash 的色相：olive/900 低透明度（Figma 为 6.5% 到 3% 到 0，b3、b5 为 6% 到 2.5%），2026-09-23 由偏黄的 olive 300、400 改来。
     2026-09-25 峰值收到 6.5%：text/subtle 落在色团中心时，8% 为 4.45:1，7% 为 4.53:1（余量太薄），6.5% 为 4.56:1 */
  --wash-1: rgba(63,83,19,.065); --wash-1b: rgba(63,83,19,.03);
  --wash-2: rgba(63,83,19,.065); --wash-2b: rgba(63,83,19,.03);
  --wash-3: rgba(63,83,19,.06);  --wash-3b: rgba(63,83,19,.025);
  --wash-stamp: rgba(63,83,19,.06); --wash-stamp-b: rgba(63,83,19,.025);   /* 指针晕开，09-23 随晕染色相改为 olive/900，2026-09-26 恢复 */
  --brand-orange: #EF6905;   /* 字标 i 点与收尾标题的橙点。Figma 里是未绑变量的原色 */
}
@media screen and (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  color-scheme:dark;   /* 滚动条与表单控件跟着变深 */
  --wash-1: rgba(159,171,74,.20);  --wash-1b: rgba(159,171,74,.09);   /* .22 时 text/muted 落在色团中心只有 4.47:1 */
  --wash-2: rgba(127,139,46,.20);  --wash-2b: rgba(127,139,46,.08);
  --wash-3: rgba(95,108,31,.26);   --wash-3b: rgba(95,108,31,.10);
  --wash-stamp: rgba(178,189,76,.18); --wash-stamp-b: rgba(178,189,76,.07);
} }
:root[data-theme="dark"]{
  color-scheme:dark;
  --wash-1: rgba(159,171,74,.20);  --wash-1b: rgba(159,171,74,.09);   /* .22 时 text/muted 落在色团中心只有 4.47:1 */
  --wash-2: rgba(127,139,46,.20);  --wash-2b: rgba(127,139,46,.08);
  --wash-3: rgba(95,108,31,.26);   --wash-3b: rgba(95,108,31,.10);
  --wash-stamp: rgba(178,189,76,.18); --wash-stamp-b: rgba(178,189,76,.07);
}

/* ══════════ 页面基座 ══════════ */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; text-size-adjust:100%}   /* iOS 横屏时不自动放大正文 */
html{scrollbar-gutter:stable}   /* 常驻滚动条的系统上，打开菜单隐藏滚动条时版心不横移。scroll-behavior 保持默认 auto，页内跳转一帧到位（2026-09-25） */
html,body{overflow-x:clip}
body{margin:0; background:var(--bg-surface); color:var(--text-body);
     font:400 var(--font-body)/var(--lh-body) var(--font-stack);
     -webkit-font-smoothing:antialiased}
img{max-width:100%; display:block}
a{color:inherit}
h1,h2,h3,h4,h5,h6,p,ul,ol,dl,dd,figure{margin:0}
ul,ol{list-style:none; padding:0}
.wrap{max-width:calc(var(--container-max) + var(--margin-x) * 2); margin:0 auto;
      padding-inline:var(--margin-x)}
:focus-visible{outline:2px solid var(--focus-ring); outline-offset:2px; border-radius:4px}
[tabindex="-1"]:focus{outline:none}   /* 路由把焦点移到标题、区块或正文时不画框，它们本身不可点 */
.skip{position:absolute; left:var(--space-16); top:-100px; z-index:300; padding:var(--space-8) var(--space-16);
      min-height:44px; display:inline-flex; align-items:center;   /* 英文行高 26 加上下内距只有 42，补到 44（第 3 轮复核） */
      background:var(--bg-canvas); color:var(--text-primary); border-radius:var(--radius-card)}
.skip:focus{top:var(--space-16)}
[id]{scroll-margin-top:calc(var(--nav-h) + env(safe-area-inset-top, 0px))}   /* 页脚的 naming 等锚点是 div，也要让开吸顶页眉 */
/* 可聚焦的链接与按钮：Shift+Tab 倒序时浏览器把目标卷到视口顶边，会被吸顶页眉整个盖住（WCAG 2.4.11）。
   :where 优先级为 0，带 id 的锚点照旧走上一条，页内跳转落点不变（第 3 轮复核） */
:where(a[href], button, summary, [tabindex]:not([tabindex="-1"])){scroll-margin-top:calc(var(--nav-h) + env(safe-area-inset-top, 0px) + var(--space-16))}
p, dd, li{text-wrap:pretty}   /* 段落与列表条目末行不落单个词（8.22），标题另有 balance。li 2026-09-30 补上：新页面大量用列表 */
/* 中文条目：pretty 只管末行一个字的情形，仍会留下「風｜險」「節奏」这类一两个字的末行，还把词拆开。
   列表条目与表格值多为一到三行，改用 balance 各行等长。text-wrap 会继承，只给里面没有段落或整块的条目加，
   免得条目里的多行说明也被拉成等长；balance 超过六行浏览器不处理，长条目照常折行（第 1 轮复核） */
html:lang(zh) main :is(li, dd):not(:has(p, div, dl, ul, ol, h2, h3, h4)){text-wrap:balance}
/* balance 把行压短，又不认中文词界，会在「哪｜裏」「教｜別人」这类词中间断开。同一批条目与表格值（连同三栏表格内的值 .g3-cell > p）
   只在「、，；」等标点与空格处折行，一段长过整行、找不到标点时才硬断（第 2 轮复核） */
html:lang(zh) main :is(li, dd, .g3-cell > p):not(:has(p, div, dl, ul, ol, h2, h3, h4)){word-break:keep-all; overflow-wrap:anywhere}
main :is(h2, h3, h4){text-wrap:balance}   /* 小标题（.t-label、.g3-title 等）末行不落单词（8.22、09-24）；.t-display 等大标题各自带 balance（第 2 轮复核补） */

/* 文字样式，与 Figma Text styles 同名 */
.t-eyebrow, .t-mono{font:500 var(--font-caption)/var(--lh-caption) var(--font-stack-mono); color:var(--text-subtle)}
.t-mono-s{font:500 var(--font-small)/var(--lh-small) var(--font-stack-mono); color:var(--text-subtle)}
.t-display{font:700 var(--font-display)/var(--lh-display) var(--font-stack-display); letter-spacing:-.02em; color:var(--brand-solid); text-wrap:balance}   /* balance：末行不落单词（8.22，第 1 轮复核补） */
.t-h1{font:700 var(--font-h1)/var(--lh-h1) var(--font-stack-display); letter-spacing:-.02em; color:var(--text-primary); max-width:900px; text-wrap:balance}
.t-h2{font:600 var(--font-h2)/var(--lh-h2) var(--font-stack-display); letter-spacing:-.02em; color:var(--text-primary); max-width:900px; text-wrap:balance}
.t-h2-bold{font:700 var(--font-h2)/var(--lh-h2) var(--font-stack-display); letter-spacing:-.02em; color:var(--text-primary); text-wrap:balance}
.t-h3{font:600 var(--font-h3)/var(--lh-h3) var(--font-stack); letter-spacing:-.02em; color:var(--text-primary)}
.t-h4{font:600 var(--font-h4)/var(--lh-h4) var(--font-stack); letter-spacing:-.02em; color:var(--text-primary)}
.t-lead{font:400 var(--font-body-l)/var(--lh-body-l) var(--font-stack); color:var(--text-muted); max-width:34em}
.t-lead-body{font:400 var(--font-body-l)/var(--lh-body-l) var(--font-stack); color:var(--text-body); max-width:34em}
.t-label{font:600 var(--font-body-l)/var(--lh-body-l) var(--font-stack); letter-spacing:-.01em; color:var(--text-primary)}
.t-body{font:400 var(--font-body)/var(--lh-body) var(--font-stack); color:var(--text-body); max-width:34em}
.t-body-muted{font:400 var(--font-body)/var(--lh-body) var(--font-stack); color:var(--text-muted); max-width:34em}
.t-small{font:400 var(--font-small)/var(--lh-small) var(--font-stack); color:var(--text-body)}
.t-caption{font:400 var(--font-caption)/var(--lh-caption) var(--font-stack); color:var(--text-muted)}
.zh{font-family:var(--font-stack-hant)}
.placeholder{color:var(--text-subtle)}
.visually-hidden{position:absolute !important; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden;
                 clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0}
.nowrap{white-space:nowrap}   /* 文案里不可拆开的简称，如「中五／六」：不让斜线落到行首（第 3 轮复核，写法见 content/README.md） */

/* ══════════ 语言（2026-09-30 三语） ══════════ */
/* 只用 :lang() 与变量，不改 tokens.css：<html lang> 定了，全页自动套用；页内夹一段别的语言（英文页脚的公司名、
   简中页里按登记写的繁体公司名、语言切换的各项）按那一段自己的 lang 取字体。依据：三语技术方案 4.3、4.4，开工准备七之二。
   字体栈西文在前、中文在后，繁简两套分开写。昭源黑體正式版自托管，族名 Chiron Hei HK；本机装的是可变字体，族名 Chiron Hei HK VF，
   本地原型（build.py 默认 --fonts local）靠它，所以两个族名都写上。简中页不加载中文网页字体，用系统简体黑体。 */
:root{
  --font-family-hant-local: "Chiron Hei HK VF";
  --font-family-hant-fallback: "PingFang HK", "PingFang TC", "Heiti TC", "Microsoft JhengHei", "\5FAE\8EDF\6B63\9ED1\9AD4", "Noto Sans HK", "Noto Sans CJK TC";
  --font-family-hans: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "\5FAE\8F6F\96C5\9ED1", "Noto Sans SC", "Noto Sans CJK SC", "Source Han Sans SC";
  --font-stack-hant: var(--font-family-latin), var(--font-family-hant), var(--font-family-hant-local), var(--font-family-hant-fallback), ui-sans-serif, system-ui, sans-serif;
  --font-stack-hans: "TOIVO Hans Punct", var(--font-family-latin), var(--font-family-hans), ui-sans-serif, system-ui, sans-serif;
  --cjk-display-scale: .75;     /* 中文 display 取英文的 0.75 倍：桌面 54、笔记本 42、平板 36、手机 30（技术方案 4.3） */
  --lh-cjk-heading: 1.3;        /* 西文标题的 1.04 到 1.19 是给拉丁字母定的，汉字满格，照用上下几乎相碰 */
  --lh-cjk-body: 1.75;          /* 中文正文行高 1.6 到 1.8（开工准备七之二） */
  --lh-cjk-small: 1.7;
}
/* 简中的弯引号、省略号、间隔号在 Onest 里是西文窄字形，这个别名只管这几个字，改由系统简体字体出全角 */
@font-face{font-family:"TOIVO Hans Punct";
  src:local("PingFang SC Regular"), local("PingFangSC-Regular"), local("Microsoft YaHei"), local("Noto Sans CJK SC Regular"), local("NotoSansCJKsc-Regular");
  unicode-range:U+2018-2019, U+201C-201D, U+2026, U+00B7}
html:lang(zh-Hant){
  --font-stack: var(--font-stack-hant);
  --font-stack-display: var(--font-family-display), var(--font-family-latin), var(--font-family-hant), var(--font-family-hant-local), var(--font-family-hant-fallback), ui-sans-serif, system-ui, sans-serif;
  --font-stack-mono: var(--font-family-mono), var(--font-family-hant), var(--font-family-hant-local), var(--font-family-hant-fallback), ui-monospace, monospace;
}
html:lang(zh-Hans){
  --font-stack: var(--font-stack-hans);
  --font-stack-display: "TOIVO Hans Punct", var(--font-family-display), var(--font-family-latin), var(--font-family-hans), ui-sans-serif, system-ui, sans-serif;
  --font-stack-mono: var(--font-family-mono), var(--font-family-hans), ui-monospace, monospace;
}
/* 页内夹的另一种中文按自己的 lang 取字体。只认 body 里显式写了 lang 的元素，<html lang> 本身不算，不会盖掉各样式自己的字族 */
body [lang^="zh-Hant"]{font-family:var(--font-stack-hant)}
body [lang^="zh-Hans"]{font-family:var(--font-stack-hans)}
html:lang(zh){
  text-autospace:normal;        /* 中西文之间自动留约 1/8 字宽；Chrome 默认如此，Firefox 默认不留，显式写上两边一致 */
  text-spacing-trim:normal;     /* 相邻全角标点挤压（如 」， 连用） */
}
/* 标题：字距归零、行高 1.3，只在标点、空格与 <wbr> 处折行，不把「能力」拆在两行；长句由文案在词组之间写 <wbr> */
html:lang(zh) :is(.t-display, .t-h1, .t-h2, .t-h2-bold, .t-h3, .t-h4){
  letter-spacing:0; line-height:var(--lh-cjk-heading); word-break:keep-all; overflow-wrap:break-word; text-wrap:balance}
/* 大字句（.statement 收句与使命句、首页收尾末行 .closing-end）视觉上相当于小标题，同样只在标点处折行，各行求平衡；
   一段长过整行时才硬断（第 2 轮复核） */
html:lang(zh) main :is(.statement, .closing-end){word-break:keep-all; overflow-wrap:anywhere; text-wrap:balance}
html:lang(zh) .t-display{font-size:calc(var(--font-display) * var(--cjk-display-scale))}
/* 平板以上中文 display 不小于同档 h1：0.75 倍按旧的 600 宽两栏首屏定，现在首屏是单栏，笔记本 42、平板 36 会比内页页首 h1 还小。
   改后桌面 54、笔记本 48、平板 40；手机保持 30，再大会折成四行（第 3 轮复核） */
@media (min-width:768px){ html:lang(zh) .t-display{font-size:max(calc(var(--font-display) * var(--cjk-display-scale)), var(--font-h1))} }
html:lang(zh) :is(.t-label, .menu-links a){letter-spacing:0}
/* 正文与导语 */
html:lang(zh) :is(body, .t-body, .t-body-muted, .t-lead, .t-lead-body, .legal p, .facts dd, .channel dd, .statement, .points > li, .questions > li){line-height:var(--lh-cjk-body)}
html:lang(zh) :is(.t-small, .t-caption, .fcol a, .fcol .on, .chain .s){line-height:var(--lh-cjk-small)}
html:lang(zh) :is(.t-lead, .t-lead-body, .t-body, .t-body-muted){max-width:32em}   /* 一行约 32 个汉字；西文的 34em 按字母定 */
/* 眉标、页脚组名与各表的标签：英文用大写等宽，中文落进 IBM Plex Mono 会被拉开字距，改回正文字族 14（Figma Small/Regular · zh） */
html:lang(zh) :is(.t-eyebrow, .fcol h3, .foot-lang h3, .chain .k, .facts dt, .channel dt, .part-facts dt, .facts-note){
  font-family:var(--font-stack); font-size:var(--font-small); line-height:var(--lh-small); font-weight:400; letter-spacing:.08em}   /* 中文网页字体只有 400、700 两档 */
html:lang(zh) :is(.menu-btn, .menu-close){font-family:var(--font-stack); font-size:var(--font-small)}   /* 選單、關閉：等宽字没有中文 */
.legal [lang|="zh"]{white-space:nowrap}   /* 公司中文名整名换行 */

/* 状态章：浅彩底是在研发中，中性是构想与样例 */
.chip{display:inline-flex; align-items:center; padding:var(--space-4) var(--space-8);
      border-radius:var(--radius-chip); border:1px solid var(--border-strong); background:var(--bg-muted);
      font:500 var(--font-caption)/var(--lh-caption) var(--font-stack-mono); color:var(--text-subtle);
      white-space:nowrap}
.chip-soft{background:var(--bg-soft); color:var(--text-on-soft); border-color:var(--border-soft)}

/* 按钮 */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:var(--space-8);
     text-decoration:none; border-radius:var(--radius-card); border:1px solid transparent; cursor:pointer;
     font:500 var(--font-body)/var(--lh-body) var(--font-stack);
     padding:calc(var(--space-16) - 1px) calc(var(--space-24) - 1px); white-space:nowrap}   /* 边框 1px 算进内距，尺寸与 Figma 一致。
     悬停时颜色即时切换。全站不设 transition；animation 只用于首页的指针晕开，晕染位移与页眉字标收起由 site.js 逐帧写（2026-09-26） */
.btn-primary{background:var(--brand-solid); color:var(--text-on-brand-solid)}
.btn-primary:hover{background:var(--brand-hover)}
.btn-secondary{background:var(--bg-canvas); color:var(--text-body); border-color:var(--border-strong);
               padding:calc(var(--space-12) - 1px) calc(var(--space-24) - 1px)}
.btn-secondary:hover{color:var(--text-primary); border-color:var(--text-subtle)}
.btn-ghost{background:none; color:var(--text-body)}
.btn-ghost:hover{color:var(--text-primary); text-decoration:underline; text-underline-offset:4px}
.btn-sm{font:500 var(--font-small)/var(--lh-small) var(--font-stack); padding:calc(var(--space-8) - 1px) calc(var(--space-16) - 1px)}

/* 字标：字母随主题取 brand/solid，i 点固定品牌橙 */
.wordmark{display:inline-flex; color:var(--brand-solid); text-decoration:none; line-height:0}
.wordmark svg{width:108px; height:auto; display:block}
.wordmark .dot{fill:var(--brand-orange)}
/* 页眉字标收起：页面离开顶部即收成圖形標誌，回到顶部展开（触发照 anthropic.com）。动作照品牌预览模板 preview-template.html
   （2026-09-21）「從標誌到名字」一段，由 site.js 逐帧驱动：横笔从左端伸缩，橙点在 t 旁与 i 上方之间走弧线，o、i、v、o 错开淡入淡出。
   橙点走弧线时最高处拱出字标上沿约 9.5 个单位（弧高 13.21 是相对直线路径，终点 i 点本身在上沿下 0.49），页眉与菜单顶行的字标 SVG 放开溢出（页眉上方留白足够）；打印一律印完整字标 */
.nav-in .wordmark svg, .menu-top .wordmark svg{overflow:visible}

/* ══════════ 吸顶页眉 ══════════ */
/* 字标在左，链接、语言切换、按钮一组靠右，按钮右缘对齐版心 */
.nav{position:sticky; top:env(safe-area-inset-top, 0px); z-index:100;   /* 刘海屏上贴在状态栏下面，其余情况为 0 */
     height:var(--nav-h);
     background:var(--bg-surface); border-bottom:1px solid var(--border-subtle)}
.nav-in{height:100%; max-width:calc(var(--container-max) + var(--margin-x) * 2); margin:0 auto;
        padding-inline:var(--margin-x); display:flex; align-items:center; gap:var(--space-48)}
.nav .wordmark{margin-right:auto}
.nav-links{display:flex; gap:var(--space-32); align-items:center}
.nav-links a{position:relative; font:400 var(--font-body)/var(--lh-body) var(--font-stack);
             color:var(--text-muted); text-decoration:none; padding-block:9px}   /* 上下各 9，点击区 44（2026-09-30），字的位置不变 */
/* 下划线绝对定位在文字下方 8px，不占布局，切换当前页时文字不位移。链接盒上下各多 9，下划线由 100% + 8 改为 100% - 1，离字仍是 8 */
.nav-links a::after{content:""; position:absolute; left:0; right:0; top:calc(100% - 1px);
                    height:2px; background:transparent}
.nav-links a:hover{color:var(--text-primary)}
.nav-links a:hover::after{height:1px; background:var(--border-strong)}
.nav-links a[aria-current="page"]{color:var(--text-primary)}
.nav-links a[aria-current="page"]::after{height:2px; background:var(--brand-solid)}
.actions{display:flex; align-items:center; gap:var(--space-16)}
.lang{display:flex; align-items:center; font:400 var(--font-small)/var(--lh-small) var(--font-stack); color:var(--text-subtle)}
.lang > span{display:inline-flex; align-items:center; min-height:44px}
/* 三语切换（2026-09-30）：繁中／简中／EN，每项用自己的文字与字体（值里带 span lang）。当前语言不做链接、加粗、标 aria-current；
   另两项链到同一页的另一语言版。每项点击区 44×44，字在框内居中 */
.lang .opt{display:inline-flex; align-items:center; justify-content:center; min-height:44px; min-width:44px; padding-inline:var(--space-8)}
.lang a.opt{color:var(--text-muted); text-decoration:none}
.lang a.opt:hover{color:var(--text-primary); text-decoration:underline; text-underline-offset:3px}
.lang .on{font-weight:700; color:var(--text-primary)}
.lang .sep{color:var(--text-subtle)}
.lang .zh{font-family:var(--font-stack-hant)}
.nav .wordmark{min-height:44px; align-items:center}   /* 点击区 44 高，与 Figma 的 Logo / Home 框一致 */
/* MENU 与 CLOSE 是同一个描边按钮，同一个位置：1023 以下出现，打开菜单时手指不用挪。
   看得见的框手机 40 高，::after 把点击区撑到 44；平板与页眉按钮同为 50 高 */
.menu-btn, .menu-close{position:relative; display:none; align-items:center; justify-content:center; gap:var(--space-8);
          min-width:88px; height:40px; padding:0 var(--space-12); cursor:pointer;
          background:var(--bg-canvas); border:1px solid var(--border-strong); border-radius:var(--radius-card);
          font:500 var(--font-caption)/1 var(--font-stack-mono); color:var(--text-primary)}
.menu-btn::after, .menu-close::after{content:""; position:absolute; inset:-3px -1px}
.menu-btn:hover, .menu-close:hover{border-color:var(--text-subtle)}
.menu-btn .ic{width:14px; height:7px}
.menu-close .ic{width:10px; height:10px}

/* 满屏菜单，取 Figma Menu · 768 与 Menu · 390。顶行高度与页眉相同，打开时字标不跳位。
   菜单是原生 popover（2026-09-25）：没有脚本也能开关。宽高、外边距、边框与字色抹掉浏览器给 popover 的默认框 */
.menu{position:fixed; inset:0; z-index:200; overflow-y:auto; background:var(--bg-surface); color:var(--text-body);
      width:auto; height:auto; max-width:none; max-height:none; margin:0; border:0;
      display:none; flex-direction:column; gap:var(--space-40);
      padding:env(safe-area-inset-top, 0px) max(var(--margin-x), calc((100% - var(--container-max)) / 2))
              calc(var(--space-48) + env(safe-area-inset-bottom, 0px))}   /* 与页眉同一版心，打开时字标不横跳；上下让开刘海与底部横条 */
/* 只在打开时显示。两条分开写：旧浏览器不认 :popover-open，第一条整条失效，菜单保持隐藏，脚本改用 is-open 类 */
.menu:popover-open{display:flex}
.menu.is-open{display:flex}
.menu-top{flex:0 0 auto; height:calc(var(--nav-h) - 1px);   /* 页眉底线占 1px */
           display:flex; align-items:center; justify-content:space-between}
.menu-top .wordmark{min-height:44px; align-items:center}
.menu-close{display:inline-flex}
.menu-links{display:flex; flex-direction:column}
.menu-links a{display:flex; align-items:center; min-height:44px; padding-block:var(--space-8); text-decoration:none;
              font:600 var(--font-h3)/var(--lh-h3) var(--font-stack); letter-spacing:-.02em; color:var(--text-primary)}
.menu-links a[aria-current="page"]{text-decoration:underline; text-decoration-thickness:2px;
              text-underline-offset:8px; text-decoration-color:var(--brand-solid)}
.menu .lang{align-self:flex-start; margin-left:calc(-1 * var(--space-8))}   /* EN 与链接左缘对齐 */
.menu-cta{width:100%}
html.menu-open{overflow:hidden}

/* ══════════ 晕染 ══════════ */
.site{position:relative; overflow-x:clip}   /* 晕染左右各伸出 40px，在这里裁掉，页面不出横向滚动 */
/* 晕染是定位元素、z-index:0，内容区块要自己抬到上层，否则会被盖住 */
.site > main, .site > section, .site > footer{position:relative; z-index:1}

/* 首页逐屏停靠（2026-10-05 Cindy 确认）：宽屏且窗口足够高时，每个区块至少撑满页眉下的一屏。
   保留文档滚动与内容自然高度，超出一屏的区块仍可读到末尾。窄屏、矮窗口与减少动态效果时沿用自然滚动。
   根滚动容器统一给页眉留位，区块不再重复计入原有锚点外距。菜单打开时暂停停靠。 */
@media screen and (min-width:1280px) and (min-height:650px) and (prefers-reduced-motion:no-preference){
  html:has(body.pg-home):not(.menu-open){
    scroll-snap-type:y mandatory;
    scroll-padding-top:calc(var(--nav-h) + env(safe-area-inset-top, 0px));
  }
  .pg-home .site > main > section{
    min-height:calc(100svh - var(--nav-h) - env(safe-area-inset-top, 0px));
    padding-block:var(--space-48);
    display:flex;
    align-items:center;
    scroll-snap-align:start;
    scroll-snap-stop:always;
  }
  .pg-home .site > main > section[id], .pg-home .site > footer{
    scroll-margin-top:0;
    scroll-snap-align:start;
  }
  .pg-home .site > main > section > .l-wrap{width:100%}
  .pg-home .site :where(a[href], button, summary, [tabindex]:not([tabindex="-1"])){
    scroll-margin-top:var(--space-16);
  }
}
.wash{position:absolute; left:-40px; right:-40px; top:0; height:var(--wash-h,2400px);
      z-index:0; pointer-events:none; overflow:hidden;
      -webkit-mask-image:linear-gradient(to bottom,#000 0,#000 calc(100% - 260px),transparent 100%);
      mask-image:linear-gradient(to bottom,#000 0,#000 calc(100% - 260px),transparent 100%)}
.blob{position:absolute; width:900px; height:900px; border-radius:50%; will-change:transform;
      background:radial-gradient(circle, var(--wash-1) 0%, var(--wash-1b) 38%, transparent 68%)}
/* 晕染层从页眉下沿量到 Evidence 色带顶。色团纵向按这段高度的百分比定，b4 贴着底部定，任何宽度都铺到 What we do 段末，
   再由底部 260px 遮罩淡出。原先写死 -320、520、1500px，是 09-06 对照页的数值；09-17 The Loop 平铺后首页长了一屏半，
   三团在 The Loop 末尾就全部离场。晕染层高到 4600 以上（约 1090 宽以下），b3 与 b4 之间会空出一大段，
   site.js 给晕染层加 wash-tall，多一团 b5 放在两者正中。
   相邻两团的中心区互不相叠：浅色 text/subtle 落在单团中心只剩 4.56:1，中心区相叠就会跌破 4.5:1。外缘少量相叠处两团各约 2%，无碍 */
.b1{left:62%; top:-320px; transform:translate(calc(var(--p,0) * -160px), calc(var(--p,0) * 520px))}
.b2{left:-380px; top:14%; width:760px; height:760px;
    background:radial-gradient(circle, var(--wash-2) 0%, var(--wash-2b) 40%, transparent 68%);
    transform:translate(calc(var(--p,0) * 220px), calc(var(--p,0) * 420px))}
.b3{left:38%; top:40%; width:1100px; height:1100px;
    background:radial-gradient(circle, var(--wash-3) 0%, var(--wash-3b) 42%, transparent 70%);
    transform:translate(calc(var(--p,0) * -120px), calc(var(--p,0) * -260px))}
.b4{left:-240px; top:calc(100% - 1150px); width:1000px; height:1000px;
    background:radial-gradient(circle, var(--wash-2) 0%, var(--wash-2b) 40%, transparent 68%);
    transform:translate(calc(var(--p,0) * 160px), calc(var(--p,0) * -100px))}
.b5{display:none; left:calc(100% - 640px); top:calc(70% - 520px); width:1000px; height:1000px;
    background:radial-gradient(circle, var(--wash-3) 0%, var(--wash-3b) 42%, transparent 70%);
    transform:translate(calc(var(--p,0) * -120px), calc(var(--p,0) * -160px))}
.wash-tall .b5{display:block}
/* 指针晕开：鼠标经过处每 80ms 放一团，3.2 秒内放大并散去。09-06 采纳，09-25 撤，2026-09-26 Cindy 改回原版。
   晕团叠在文字上会暂时压低对比度：慢速划过时晕团越叠越浓，落在色团中心的深色正文约 1.9:1、浅色小灰字约 1.8:1（按动画逐帧推算，见 MOTION.md），
   读者挪开鼠标后几秒内恢复；Legal 无障碍声明写明这一点 */
.stamp{position:absolute; width:300px; height:300px; margin:-150px 0 0 -150px; border-radius:50%;
       pointer-events:none;
       background:radial-gradient(circle, var(--wash-stamp) 0%, var(--wash-stamp-b) 40%, transparent 70%);
       animation:bleed 3.2s ease-out forwards}
@keyframes bleed{0%{opacity:0; transform:scale(.35)} 20%{opacity:1} 100%{opacity:0; transform:scale(1.4)}}

/* ══════════ 区块通用 ══════════ */
.sec{padding-block:var(--pt, var(--section-y)) var(--pb, var(--section-y))}
.sec > .wrap{display:flex; flex-direction:column; gap:var(--gap, var(--space-24))}
.head-block{display:flex; flex-direction:column; gap:var(--space-16)}
/* 行式表：上边线分隔，首行无线 */
.rows > *{border-top:1px solid var(--border-hairline)}
.rows > :first-child{border-top:0}
.rows.all-lines > :first-child{border-top:1px solid var(--border-hairline)}
/* 深色档 hairline 与页面底色同为 warm-grey-800，线会消失，行式表改用 subtle */
@media screen and (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .rows > *{border-top-color:var(--border-subtle)} }
:root[data-theme="dark"] .rows > *{border-top-color:var(--border-subtle)}

/* ══════════ 首屏 ══════════ */
.hero{padding-block:var(--space-96) var(--space-80)}
.hero-in{display:grid; grid-template-columns:minmax(0,600px) 520px; gap:var(--space-80);
         justify-content:space-between; align-items:start}
.hero-copy{display:flex; flex-direction:column; gap:var(--space-24); min-width:0}
.cta-row{display:flex; flex-wrap:wrap; gap:var(--space-12); padding-top:var(--space-8)}

.card{background:var(--bg-canvas); border:1px solid var(--border-subtle); border-radius:var(--radius-card); overflow:hidden}
/* 2026-09-30 第 1 轮复核：旧首页的样例卡（卡头、卡身、卡底、brief-fields）、The Loop 五步与四个产品（.products、.prod、.naming、.lrow）
   随三语改版撤下（拍板 3），规则一并删掉。旧 .products 是纵向 flex，套到新首页同名区块上，把版心缩成内容宽并居中，左缘与上下各段对不齐。
   旧规则要追溯，看 _archive-2026-09-30/README.md 所记的提交 */

/* ══════════ Evidence ══════════ */
/* 锚点落点：按批注撑满一屏，内容纵向居中 */
.evidence{background:var(--bg-soft); --gap:var(--space-40);
          min-height:calc(100vh - var(--nav-h)); display:flex; align-items:center}
.evidence > .wrap{width:100%}
.chain > div{display:grid; grid-template-columns:130px 340px minmax(0,1fr); gap:var(--space-32);
             align-items:center; padding-block:var(--space-16); border-top:1px solid var(--border-soft)}
.chain > div:first-child{border-top:0}
.chain .k{font:500 var(--font-caption)/var(--lh-caption) var(--font-stack-mono); color:var(--text-subtle)}
.chain .v{font:500 var(--font-body)/var(--lh-body) var(--font-stack); color:var(--text-primary)}
.chain a.v{text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px}
.chain a.v:hover{text-decoration-thickness:2px}
.chain a.v{justify-self:start}   /* 44 点击区见共用组件「值链接点击区」 */
.chain .s{font:400 var(--font-small)/var(--lh-small) var(--font-stack); color:var(--text-muted)}

/* ══════════ 收尾 ══════════ */
.closing{background:var(--brand-solid); padding-block:var(--space-64)}
.closing .wrap{display:flex; flex-direction:column; align-items:flex-start; gap:var(--space-24)}
.closing .t-h2-bold{color:var(--text-on-brand-solid)}
/* 收尾块底色与 focus-ring 同为 olive/900，焦点框改用标题的白色。写成 --focus-ring 覆盖会输给 tokens.css 的 [data-theme="light"] */
.closing :focus-visible{outline-color:var(--text-on-brand-solid)}
/* i 点换成品牌橙：用无点 ı 加伪元素画方点，读屏走 aria-label 里的原文 */
.idot{position:relative}
/* 点的中心对准 Figma 1440 稿：基线上方 .631em，与 Gabarito 自带 i 点的中心（.61em）几乎重合。
   top 从字体行框顶算起，Gabarito 行框顶在基线上方 .9em，所以 top = .9 - (.631 + .097) = .172em。
   原先的 .02em 是给 Onest 调的，09-23 标题换成 Gabarito 后点飘到大写字母顶线上方 */
.idot::before{content:""; position:absolute; left:50%; top:.172em; width:.194em; height:.194em;
              transform:translateX(-50%); background:var(--brand-orange); border-radius:2px;
              -webkit-print-color-adjust:exact; print-color-adjust:exact}   /* 打印默认不印背景，不加这句 i 点会丢 */

/* 可打印的素档区块（Contact、Legal、About 公司资料与团队、页脚）所有文字不低于 7:1：标签与元信息的 text/subtle 在这里换成 text/muted。
   浅色 subtle 在底色上只有 5.03:1，muted 为 7.75:1；深色两者同为 warm-grey/300，不受影响（2026-09-25，兑现 Legal 无障碍声明的 7:1） */
.ct-channels, .lg, .ab-facts, .ab-team, .foot, .evidence{--text-subtle:var(--text-muted)}   /* 2026-09-30 加首页现况色带 .evidence（三语页面架构 4.1）；内页页首 .page-head 由素档页各自覆盖 */

/* ══════════ 页脚 ══════════ */
/* 照 Figma 正式组件 Footer / 1440 209:36、/ 768 209:71、/ 390 209:106（2026-09-30 第 2 轮复核改回主件栅格，原为一排四栏加一行语言）：
   上内距 80，字标、链接栅格、法定区之间 40；栅格三栏（1440 每栏 357、768 每栏 192，栏距 64），两排之间 40。
   三语版五组（合作对象、TOIVO、联络、法律信息、语言）排进主件的六格：第一排前三组，第二排法律信息与语言，第三格空着（三语页面架构 5.4） */
.foot{background:var(--bg-surface); padding-block:var(--space-80) var(--space-32)}
.foot .wrap{display:flex; flex-direction:column; gap:var(--space-40)}
/* 字标 108×35：1440 主件没有外框，点击区 44 由伪元素上下撑出，版面不动；768 起 Figma 用 44 高的 Logo 框，见 1023 以下一段 */
.foot .wordmark{align-self:flex-start; position:relative}
.foot .wordmark::after{content:""; position:absolute; left:0; right:0; top:50%; height:44px; transform:translateY(-50%)}
.foot-cols{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-40) var(--space-64)}
/* 组名 Mono/Caption/Medium text/muted（.foot 把 subtle 换成 muted），组名到第一条链接 20（Figma 间距 8、4 高的空帧、间距 8）；
   链接 Small/Regular text/body，Figma 行距 29（字高 21、间距 8）。点击框上下各借 4（内距 4 配负外距 4），框与框上下相接；
   桌面档框撑到 32、行距随之是 32（10-01 第 2 轮复核，见下一段），768 与手机档另有写法。
   语言组与其余四组同一写法：三种语言写全称，当前语言加粗不做链接（.on） */
.fcol{display:flex; flex-direction:column; gap:var(--space-8)}
.fcol h3{font:500 var(--font-caption)/var(--lh-caption) var(--font-stack-mono); color:var(--text-subtle); margin-bottom:var(--space-12)}
.fcol a, .fcol .on{display:flex; align-items:center; min-width:44px; padding-block:var(--space-4); margin-block:calc(-1 * var(--space-4));
        font:400 var(--font-small)/var(--lh-small) var(--font-stack); color:var(--text-body); text-decoration:none; align-self:flex-start}
/* 桌面档可点的高度不小于 32（兄弟页与页脚链接 ≥32×44）：框撑到 32，上下外距各收回 4（与内距相抵），行距随之是 32，
   相邻两个框正好相接、不重叠。英文 --lh-small 21 加内距 8 只有 29，框撑到 32，每行比 Figma 的 29 多 3；
   中文行高 14 × 1.7 = 23.8，加内距 31.8，框撑到 32，每行多 0.2。
   10-01 第 1 轮复核原写法是框 32 配外距（行高 − 32）÷ 2，行距仍是 29（中文 31.8），相邻两框叠 3（中文 0.2），重叠处归后一条链接，
   逐像素命中量得英文可点高度只有 29（10-01 第 2 轮复核改）。要保留 Figma 的 29 行距，须请 Cindy 把页脚这条规矩正式改成 29。
   768 档见下方「页脚」一段，手机档见【2026-09-27 新增 · 页脚】 */
@media (min-width:1024px){
  .fcol a, .fcol .on{min-height:var(--space-32); margin-block:calc(-1 * var(--space-4))}
}
.fcol a:hover{color:var(--text-primary); text-decoration:underline; text-underline-offset:3px}
.fcol .on{font-weight:700; color:var(--text-primary)}
.legal{padding-top:var(--space-32); border-top:1px solid var(--border-subtle);
       display:flex; flex-direction:column; gap:var(--space-8)}
.legal p{font:400 var(--font-body)/var(--lh-body) var(--font-stack); color:var(--text-body); max-width:34em}
.legal p:first-child{font-weight:600; color:var(--text-primary)}

/* ══════════ About ══════════ */
/* 各段上下内距在 css/page-about.css（三语版节奏）；这里只放资料表与团队卡 */
.facts > div{display:grid; grid-template-columns:280px minmax(0,1fr); gap:var(--space-32);
             align-items:center; padding-block:var(--space-16)}
.facts dt{font:500 var(--font-small)/var(--lh-small) var(--font-stack-mono); color:var(--text-subtle)}
.facts dd{font:400 var(--font-body)/var(--lh-body) var(--font-stack); color:var(--text-body); max-width:34em}
.facts-note{font:500 var(--font-caption)/var(--lh-caption) var(--font-stack-mono); color:var(--text-muted)}
.people{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-16)}
.person{display:flex; gap:var(--space-16); align-items:flex-start;
        background:var(--bg-canvas); border:1px solid var(--border-subtle);
        border-radius:var(--radius-card); padding:var(--space-24)}
.portrait{flex:0 0 140px; width:140px; height:175px; border-radius:var(--radius-card);
          overflow:hidden; background:var(--bg-muted); position:relative}
.portrait img{width:100%; height:100%; object-fit:cover; display:block}
/* 还没有照片的头像画一个不带字的剪影（头与肩两个椭圆，按头像框的百分比定，各档同比缩放）。
   原先用 CSS 写英文 PORTRAIT，中文页也会冒出来；2026-09-30 由 css/page-about.css 提上来 */
.portrait.empty::after{content:""; position:absolute; inset:0;
  background:radial-gradient(ellipse 16% 12.8% at 50% 40%, var(--border-strong) 98%, transparent 100%),
             radial-gradient(ellipse 38% 30% at 50% 100%, var(--border-strong) 98%, transparent 100%)}
.person .txt{display:flex; flex-direction:column; min-width:0; flex:1; padding-top:var(--space-16)}
.person .name{font:600 var(--font-body-l)/var(--lh-body-l) var(--font-stack); letter-spacing:-.01em; color:var(--text-primary)}
.person .role{font:400 var(--font-small)/var(--lh-small) var(--font-stack); color:var(--text-muted); margin-top:5px}
.person .city{font:400 var(--font-small)/var(--lh-small) var(--font-stack); color:var(--text-subtle); margin-top:3px}

/* ══════════ What we do ══════════ */
/* 三部分（.part）与四个能力范畴（.dom）沿用；旧页的 Who does what、六阶与各段留白随三语改版撤下（2026-09-30） */
.part{display:grid; grid-template-columns:380px 756px; justify-content:space-between; gap:var(--space-64);
      padding-block:var(--space-48); border-top:1px solid var(--border-subtle)}
.part:first-child{border-top:0}
.part .title{display:flex; flex-direction:column; align-items:flex-start; gap:var(--space-12)}
.part .detail{display:flex; flex-direction:column; gap:var(--space-24)}
.part-facts > div{display:grid; grid-template-columns:130px minmax(0,476px); gap:var(--space-24);
                  align-items:center; padding-block:var(--space-12)}
.part-facts dt{font:500 var(--font-caption)/var(--lh-caption) var(--font-stack-mono); color:var(--text-subtle)}
.part-facts dd{font:400 var(--font-small)/var(--lh-small) var(--font-stack); color:var(--text-body)}
.dom-cols{padding:0 0 var(--space-12) 780px}
.dom{display:grid; grid-template-columns:280px 420px minmax(0,1fr); gap:var(--space-40);
     padding-block:var(--space-24); border-top:1px solid var(--border-subtle)}
.dom .shows{font:400 var(--font-small)/var(--lh-small) var(--font-stack); color:var(--text-muted)}
/* ══════════ Contact ══════════ */
/* 三栏紧跟页首导语，没有自己的标题，与页首读作一组：离导语桌面与平板 64、手机 40（2026-09-30 由 css/page-contact.css 提上来，原为 96） */
.ct-channels{--pt:var(--space-64); --pb:0px}
.channels{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-48); align-items:start}
.channel, .channel dl{display:flex; flex-direction:column; gap:var(--space-16)}
.channel dl > div{display:flex; flex-direction:column; gap:var(--space-4)}
.channel dt{font:500 var(--font-caption)/var(--lh-caption) var(--font-stack-mono); color:var(--text-subtle)}
.channel dd{font:400 var(--font-body)/var(--lh-body) var(--font-stack); color:var(--text-body)}
.link{text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px}

/* ══════════ 法务 ══════════ */
.lg{--pt:var(--space-96); --pb:var(--space-96); --gap:0}
.lg .head-block{padding-bottom:var(--space-40)}
/* 兄弟页链接，也作 Responsible AI 与合作伙伴页首的页内跳转行。点击框各档不小于 44 宽：左右各借 8（内距 8 配负外距 8，文字位置不动），
   两个字的「大學」28 宽补到 44；高度桌面 32、平板 44、手机 32（见各档）。桌面用负的上下外距把 32 高的框收回一行字高，行仍按 21 排，
   框伸进上下留白，碰不到别的可点元素（2026-09-30 由法务、Responsible AI、合作伙伴三页的同一写法合并） */
.siblings{display:flex; flex-wrap:wrap; gap:var(--space-24); padding-bottom:var(--space-40)}
.siblings a{display:inline-flex; align-items:center; justify-content:center; padding-inline:var(--space-8); margin-inline:calc(-1 * var(--space-8));
            font:400 var(--font-small)/var(--lh-small) var(--font-stack); color:var(--text-muted); text-decoration:none}
@media (min-width:1024px){
  .siblings a{min-height:var(--space-32); margin-block:calc((var(--lh-small) - var(--space-32)) / 2)}
}
.siblings a:hover{color:var(--text-primary)}
.siblings a[aria-current="page"]{color:var(--text-primary); font-weight:600}
.prose{display:flex; flex-direction:column; gap:var(--space-8)}
.prose + .prose{margin-top:var(--space-32)}
/* 法务正文里的行内链接（邮箱与两处 Contact）：上下内距 2 把点击高从 21 撑到 25（≥ 24），行内元素的上下内距不占行高，版面不动。
   左右各借 2，横向净宽为 0，断行不变；焦点框外扩 0，四边离自身字形约 2，不压上下行的字。两条必须一起带上，只带一条焦点框就会贴字。
   句中链接做不到 44，按 2.5.8 的行内豁免处理。原先只在手机档，2026-09-30 起各档都这样 */
.prose a{text-underline-offset:3px; padding-block:var(--space-2); padding-inline:var(--space-2); margin-inline:calc(-1 * var(--space-2))}
.prose a:focus-visible{outline-offset:0}
.lg + .lg{border-top:1px solid var(--border-subtle)}

/* ══════════ 三语改版新增的共用组件（2026-09-30） ══════════ */
/* 依据三语页面架构第四节。两页以上会用到的放这里，只有一页用的放该页的 css/page-<页>.css。
   胆量档：半自由档圆角 8，素档零圆角；素档区块的标签与元信息 7:1 靠上面那组 --text-subtle 覆盖。
   手机档照 8.29：区块上内距 section-y、下内距 0；组件内部降一档；列表首项上内距、末项下内距归零；点击目标 44。 */

/* 页首：内页第一个区块。标题离页眉桌面 96、手机 40，下内距交给下一段 */
.page-head{--pt:var(--space-96); --pb:0px}

/* 末段到页脚（2026-09-30 第 1 轮复核统一；原先各页各写一套：0、section-y 减 80、section-y，页尾到页脚 84 到 225 不等）。
   768 以上末段下内距取 section-y，加上页脚自带的上内距 80，末段到页脚字标桌面约 200、平板约 176，与旧英文站和法务页一致。
   页脚上方没有分隔线，距离小了页脚会读成正文的一部分。手机页脚上内距已是 section-y，末段下内距照 8.29 取 0。
   首页末块是收尾色带 .closing，没有 .sec 类，不受影响。各页样式别再另写末段下内距 */
main > .sec:last-child{--pb:var(--section-y)}
@media (max-width:767px){
  main > .sec:last-child{--pb:0px}
}

/* 要点列表：短句一条一行，方块点用品牌色；.points-2 条目短时排两列。Responsible AI 等素档页用时去掉方块的色即可 */
.points{display:grid; grid-template-columns:minmax(0,1fr); column-gap:var(--space-48)}
.points-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.points > li{position:relative; padding:var(--space-16) 0 var(--space-16) var(--space-24); border-top:1px solid var(--border-subtle);
             font:400 var(--font-body-l)/var(--lh-body-l) var(--font-stack); color:var(--text-body)}
.points > li::before{content:""; position:absolute; left:0; top:calc(var(--space-16) + .5lh - 4px); width:8px; height:8px;
                     border-radius:1px; background:var(--brand-solid)}

/* 大字导语：一段收句或结论，正文之上、标题之下的一档 */
.statement{font:500 var(--font-h4)/1.45 var(--font-stack); color:var(--text-primary); max-width:36em; text-wrap:pretty}

/* 流程链：节点横排，<ol> 语义，节点之间画箭头（用边框画，读屏不念）。放不下就折行。
   箭头画在每个节点的左边（第二个起），整条链裁掉左缘以外：折到下一行行首的那个箭头落在框外被裁掉，行尾也不会挂箭头。
   .flow 小号（正文字号）用在表格与段落旁；.flow-lg 大号作方法图解（h3 字号、bg/soft 底），手机改竖排。
   节点间距用 --flow-gap 调（默认 32）。.flow-next 写在链后的去向（如「之後：機會」），不算一步 */
.flow{--flow-gap:var(--space-32); display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-8) var(--flow-gap); overflow:hidden}
.flow > li{position:relative; display:inline-flex; align-items:center; min-height:36px; padding:calc(var(--space-4) - 1px) calc(var(--space-12) - 1px);
           border:1px solid var(--border-soft); border-radius:var(--radius-card); background:var(--bg-soft); color:var(--text-on-soft);   /* 描边与 .chip-soft 同：深色档 bg/soft 与卡片同色，靠描边分出节点 */
           font:500 var(--font-body)/var(--lh-body) var(--font-stack)}
.flow > li + li::before{content:""; position:absolute; top:50%; left:calc(-1 * var(--flow-gap) / 2 - 4px);
           width:6px; height:6px; border-top:1.5px solid var(--text-subtle); border-right:1.5px solid var(--text-subtle);
           transform:translateY(-50%) rotate(45deg)}
.flow-lg{--flow-gap:var(--space-40); row-gap:var(--space-12)}
.flow-lg > li{min-height:0; padding:calc(var(--space-8) - 1px) calc(var(--space-16) - 1px); font:600 var(--font-h3)/var(--lh-h3) var(--font-stack); letter-spacing:-.02em}
.flow-lg > li + li::before{width:8px; height:8px; border-width:2px; left:calc(-1 * var(--flow-gap) / 2 - 5px)}
html:lang(zh) .flow-lg > li{letter-spacing:0}
.flow-next{display:inline-flex; align-items:center; gap:var(--space-8); font:400 var(--font-body)/var(--lh-body) var(--font-stack); color:var(--text-muted)}

/* 受众入口列表：每条一行，对象在左、一句在右，整行是链接，行尾箭头。收尾色带里用 .entries-inverse（反白、两栏） */
.entries{border-top:1px solid var(--border-subtle)}
.entries > li{border-bottom:1px solid var(--border-subtle)}
.entries a{position:relative; display:flex; align-items:baseline; gap:var(--space-8) var(--space-32); min-height:44px;
           padding:var(--space-24) var(--space-48) var(--space-24) 0; color:var(--text-body); text-decoration:none}
.entries a::after{content:""; position:absolute; right:var(--space-8); top:50%; width:9px; height:9px;
           border-top:1.5px solid currentColor; border-right:1.5px solid currentColor; transform:translateY(-50%) rotate(45deg)}
.entry-label{flex:0 0 min(280px, 40%); font:600 var(--font-body-l)/var(--lh-body-l) var(--font-stack); letter-spacing:-.01em; color:var(--text-primary)}
.entry-label:only-child{flex:1 1 auto}
.entry-text{flex:1 1 0; font:400 var(--font-body-l)/var(--lh-body-l) var(--font-stack); color:var(--text-muted)}
.entries a:hover .entry-label{text-decoration:underline; text-underline-offset:4px; text-decoration-thickness:1px}
.entries-inverse{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:var(--space-48); border-top-color:var(--olive-700)}
.entries-inverse > li{border-bottom-color:var(--olive-700)}
.entries-inverse a{padding-block:var(--space-16); color:var(--text-on-brand-solid)}
.entries-inverse .entry-label{color:var(--text-on-brand-solid); font-weight:500}
.entries-inverse a:focus-visible{outline-color:var(--text-on-brand-solid)}
html:lang(zh) :is(.entry-label, .entry-text){letter-spacing:0; line-height:var(--lh-cjk-body)}

/* 问题列表：导语字号，一列，行与行之间细线 */
.questions > li{padding-block:var(--space-16); border-top:1px solid var(--border-subtle); max-width:40em;
                font:400 var(--font-body-l)/var(--lh-body-l) var(--font-stack); color:var(--text-body)}
.questions > li:first-child{border-top:0}

/* 两栏对照表：左栏名、右栏说明，行式。<dl class="pairs"><div><dt>…</dt><dd>…</dd></div></dl> */
.pairs > div{display:grid; grid-template-columns:minmax(0,280px) minmax(0,1fr); gap:var(--space-8) var(--space-32);
             padding-block:var(--space-16); border-top:1px solid var(--border-subtle)}
.pairs > div:first-child{border-top:0}
.pairs dt{font:600 var(--font-body)/var(--lh-body) var(--font-stack); color:var(--text-primary)}
.pairs dd{font:400 var(--font-body)/var(--lh-body) var(--font-stack); color:var(--text-body); max-width:40em}
html:lang(zh) .pairs :is(dt, dd){line-height:var(--lh-cjk-body)}

/* 表格列头：一行小字，下接 strong 线，aria-hidden（读屏跳过，靠每格自带的小标签与 dt）。.grid3-head 与 .cols-head 同一个样子；
   .pairs-head 是两栏对照表 .pairs 的列头，两栏与 .pairs 同宽。手机档列头不出。
   2026-09-30 由我們做甚麼（科学原则表）与合作伙伴（回报表、流程）两页的同一写法合并 */
.grid3-head, .cols-head{display:grid; padding-bottom:var(--space-12); border-bottom:1px solid var(--border-strong);
            font:500 var(--font-caption)/var(--lh-caption) var(--font-stack-mono); color:var(--text-subtle)}
.cols-head{gap:var(--space-8) var(--space-32)}
.pairs-head{grid-template-columns:minmax(0,280px) minmax(0,1fr)}
html:lang(zh) :is(.grid3-head, .cols-head){font-family:var(--font-stack); font-size:var(--font-small); line-height:var(--lh-small); font-weight:400; letter-spacing:.08em}

/* 三栏对照表：列头一行（aria-hidden，读屏跳过），每行第一格是标题，另两格各带一个写在 HTML 里的小标签。
   桌面小标签只给读屏（.g3-label 视觉隐藏），手机列头不出、小标签贴着内容显示。
   <div class="grid3"><div class="grid3-head" aria-hidden="true"><span>…</span>×3</div>
     <div class="grid3-row"><h3 class="g3-title">…</h3><div class="g3-cell"><span class="g3-label">…</span><p>…</p></div>×2</div></div> */
.grid3-head, .grid3-row{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.4fr) minmax(0,1.4fr); gap:var(--space-8) var(--space-32)}
.grid3-row{padding-block:var(--space-16); border-bottom:1px solid var(--border-subtle)}
.g3-title{font:600 var(--font-body)/var(--lh-body) var(--font-stack); color:var(--text-primary)}
.g3-cell p{font:400 var(--font-body)/var(--lh-body) var(--font-stack); color:var(--text-body)}
.g3-label{position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap}
html:lang(zh) :is(.g3-title, .g3-cell p){line-height:var(--lh-cjk-body)}

/* 文字链接加箭头：卡片末尾「看全文」一类。单行时上下各 9，点击区 44 高。
   行内块写法：链接文字折成两行时（窄栏里的英文），箭头跟在最后一个词后面；原先是 flex，箭头会被推到栏的最右边。
   两行求平衡，末行留得出箭头的位置（2026-09-30 由我們做甚麼页提上来） */
.more{display:inline-block; align-self:flex-start; padding-block:calc((44px - var(--lh-body)) / 2); text-wrap:balance;
      font:500 var(--font-body)/var(--lh-body) var(--font-stack); color:var(--text-primary);
      text-decoration:underline; text-underline-offset:4px; text-decoration-thickness:1px}
.more::after{content:""; display:inline-block; width:7px; height:7px; margin-left:var(--space-12); vertical-align:middle;
             border-top:1.5px solid currentColor; border-right:1.5px solid currentColor; transform:translateY(-1px) rotate(45deg)}
.more:hover{text-decoration-thickness:2px}

/* 值链接点击区：邮箱、现况值一类只占一行字的链接，链接盒只有一行字高，44 高的点击区由伪元素上下撑出，版面不动。
   用在首页现况（.chain a.v）、联络页邮箱与 404 返回首页（.tap-area） */
.tap-area, .chain a.v{position:relative}
.tap-area::after, .chain a.v::after{content:""; position:absolute; left:0; right:0; top:50%; height:44px; transform:translateY(-50%)}

@media (max-width:1023px){
  .points-2{column-gap:var(--space-32)}
  .grid3-head, .grid3-row{gap:var(--space-8) var(--space-24)}
}
@media (max-width:767px){
  .page-head{--pt:var(--space-40); --pb:0px}
  .points, .points-2{grid-template-columns:minmax(0,1fr)}
  .points > li{padding-block:var(--space-12)}
  .points > li::before{top:calc(var(--space-12) + .5lh - 4px)}
  .statement{font-size:var(--font-body-l); line-height:1.5}
  /* 大号流程链竖排：一步一行，箭头朝下 */
  .flow-lg{flex-direction:column; align-items:flex-start; gap:var(--space-24)}
  .flow-lg > li{font-size:var(--font-h4); line-height:var(--lh-h4); padding:var(--space-8) var(--space-12)}
  .flow-lg > li + li::before{top:-17px; left:var(--space-24); transform:rotate(135deg)}
  .entries a{flex-direction:column; gap:var(--space-4); padding-block:var(--space-16); padding-right:var(--space-32)}
  .entries a::after{right:var(--space-4)}
  .entry-label{flex:none}
  .entries-inverse{grid-template-columns:minmax(0,1fr)}
  .entries-inverse a{padding-block:var(--space-12)}
  .questions > li{padding-block:var(--space-12)}
  .questions > li:first-child{padding-top:0}
  .questions > li:last-child{padding-bottom:0}
  .pairs > div{grid-template-columns:minmax(0,1fr); gap:var(--space-4); padding-block:var(--space-12)}
  .pairs > div:first-child{padding-top:0}
  .grid3-head, .cols-head{display:none}
  .grid3-row{grid-template-columns:minmax(0,1fr); gap:var(--space-12); padding-block:var(--space-16)}
  .g3-label{position:static; width:auto; height:auto; overflow:visible; clip-path:none; display:block; margin-bottom:var(--space-2);
            font:500 var(--font-caption)/var(--lh-caption) var(--font-stack-mono); color:var(--text-subtle)}
  html:lang(zh) .g3-label{font-family:var(--font-stack); font-size:var(--font-small); line-height:var(--lh-small); letter-spacing:.08em}
}
@media print{
  .entries a::after, .more::after{display:none}
  .points > li, .entries > li, .pairs > div, .questions > li{break-inside:avoid}
  /* 三栏表：整行设 break-inside:avoid 时 Chromium 会把整张表连同上面的标题推到下一页（Responsible AI 英文页多出两页半空白）。
     改成每格不拆，表只在行与行之间分页；列头不单独留在页底（2026-09-30 由 Responsible AI 页提上来） */
  .grid3-row > *{break-inside:avoid}
  .grid3-head, .cols-head{break-after:avoid}
  /* 打印默认不印背景：要点的方块点是背景，不加这句纸上就没了 */
  .points > li::before{-webkit-print-color-adjust:exact; print-color-adjust:exact}
}

/* ══════════ 断点 ══════════ */
/* 笔记本（1024 到 1439）：栅格按 fr 自动收缩，只收窄固定列 */
@media (max-width:1439px){
  .hero-in{grid-template-columns:minmax(0,1fr) 520px}
  .part{grid-template-columns:320px minmax(0,1fr)}
  .dom-cols{padding-left:calc(260px + 380px + var(--space-40) * 2)}
  .dom{grid-template-columns:260px 380px minmax(0,1fr)}
}
/* 1024 到 1279：五个链接加三语切换再加按钮放不下（英文实测 1037 宽），隐藏页眉按钮，导航里已有联络我们（拍板 15） */
@media (min-width:1024px) and (max-width:1279px){
  .nav .actions .btn{display:none}
}
@media (max-width:1023px){
  /* Figma 768 与 390 画板各区块都是撑满、左右留 margin-x，没有版心上限；tokens 里的 704 与 350 只是画板宽度算出来的值。
     照搬成上限会让 430 宽的手机两侧各空 40，所以这两档版心随屏宽 */
  :root{--container-max:100%}
  /* 页眉：字标在左，右侧 按钮、MENU；手机档按钮收进菜单。MENU 在最右，与菜单里的 CLOSE 同位 */
  .nav-links, .actions .lang{display:none}
  .nav-in{gap:var(--space-16)}
  .actions{order:2}
  .menu-btn{display:inline-flex; order:3}
  /* 页脚照 Figma Footer / 768 209:71：栅格同基础档三栏（768 时每栏 192、栏距 64），组名到第一条链接 16，链接每条 44 高、间距 0（见下方点击区一段） */
  .fcol h3{margin-bottom:var(--space-16)}
  .hero-in{grid-template-columns:1fr; gap:var(--space-48)}
  .chain > div{grid-template-columns:130px minmax(0,1fr)}
  .chain .s{grid-column:2}
  .facts > div{grid-template-columns:200px minmax(0,1fr)}
  .people{grid-template-columns:repeat(2,minmax(0,1fr))}
  .portrait{flex:0 0 120px; width:120px; height:150px}
  .part{grid-template-columns:1fr; gap:var(--space-24)}
  .dom-cols{display:none}
  .dom{grid-template-columns:1fr; gap:var(--space-12)}
}
@media (min-width:768px) and (max-width:1023px){
  /* 联络三栏在平板一栏一行，栏名在左 200、字段在右（同 .part 的左右分段），行与行之间 40，大于栏内字段间距 16。
     原为两列，第三栏独占一行、右半空着（2026-09-30 由 css/page-contact.css 提上来） */
  .channels{grid-template-columns:minmax(0,1fr); gap:var(--space-40) 0}
  .channel{display:grid; grid-template-columns:200px minmax(0,1fr); gap:var(--space-16) var(--space-32); align-items:start}
  .channel dl{max-width:34em}
}
@media (min-width:768px) and (max-width:1023px){
  /* 平板旁边已有描边的 Request a briefing，MENU 去掉框只留图标与字，按钮才站得出来；点击区仍是 50 高 */
  .menu-btn, .menu-close{min-width:0; height:50px; padding:0 var(--space-8); margin-right:calc(-1 * var(--space-8));
          gap:var(--space-12); background:none; border-color:transparent; font-size:var(--font-small)}
  .menu-btn:hover, .menu-close:hover{border-color:transparent; background:var(--bg-soft)}
  .menu-btn::after, .menu-close::after{inset:-1px}
  .menu-btn .ic{width:16px; height:8px}
  .menu-close .ic{width:12px; height:12px}
}
@media (max-width:767px){
  .nav .actions{display:none}        /* 手机页眉只留字标与 MENU，Request a briefing 在菜单里 */
  .nav .wordmark svg{width:80px}     /* 页眉与菜单顶行 80，96 显得太重 */
  .foot .wordmark svg{width:96px}    /* 页脚照 Figma 390 */
  .foot-cols, .people, .channels{grid-template-columns:1fr; gap:var(--space-32)}
  .facts > div{grid-template-columns:1fr; gap:var(--space-4)}
}
/* 手机档细调（2026-09-24 按真机宽度 360 到 430 逐页核查）：区块留白收紧，两栏表改上下叠，按钮撑满，页脚两栏 */
@media (max-width:1023px){
  .chain > div{row-gap:var(--space-4)}   /* 说明换到第二行时贴着值，别隔 32 */
  /* 平板与手机横屏也是触屏：页脚与法务兄弟页链接点击区 44；折成两行的链接上下各留 11.5，不会挤在一起 */
  .fcol{gap:0}
  .fcol a, .fcol .on{display:flex; align-items:center; min-height:44px; padding-block:calc((44px - var(--lh-small)) / 2); margin-block:0; text-wrap:balance}
  .siblings{row-gap:0}
  .siblings a{min-height:44px}
  .foot .wordmark{justify-self:start; min-height:44px; align-items:center}
}
@media (min-width:768px) and (max-width:1023px){
  .menu-cta{max-width:704px}   /* 菜单主按钮最宽到 Figma 768 画板的版心，1023 宽时不拉成 959 */
}
@media (max-width:767px){
  /* 节奏（2026-09-27 收紧）：每个区块上内距取 --section-y（64），下内距 0，区块交界只留一次；页脚上内距同样取 --section-y。
     交界有色带或描边时，留白分到两侧：色带（Evidence、收尾块）内外各 48，法务各节 32 + 线 + 32。
     组件内部间距降一档（48→32、40→32、32→24、24→16、16→12、12→8），组内一律近于组间；列表首项上内距、末项下内距归零。
     页脚与法务兄弟页链接点击框 32（WCAG 2.2 AA 的 2.5.8 要求 24×24，另留 8），其余点击目标仍是 44。
     原写「首屏标题离页眉 40，区块之间约 96，原先内页沿用桌面 96 与 80，两节之间空出近 200」，区块上下内距各取 48 到 64，
     上一块的下内距叠上下一块的上内距，2026-09-27 撤（首屏标题离页眉 40 仍保留） */
  .hero{padding-block:var(--space-40) 0}   /* 底部交给下一段的 section-y（原写下内距 48，2026-09-27 撤） */
  .hero-in{gap:var(--space-24)}
  .part{padding-block:var(--space-24); gap:var(--space-12)}
  .part:last-child, .dom:last-child{padding-bottom:0}   /* 末项的内距别叠在区块留白上 */
  .part:first-child{padding-top:0}                      /* 首项同理 */
  .ct-channels{--pt:var(--space-40)}                    /* 三栏紧跟页首导语，没有自己的标题，离导语 40 */
  .lg{--pt:var(--space-32); --pb:var(--space-32)}       /* 节与节之间有描边：32 + 线 + 32，合计仍是 64；末节下内距 0 见「末段到页脚」 */
  .lg:first-child{--pt:var(--space-40)}
  /* 首屏两个按钮上下叠、撑满，第二个的字不再缩进 */
  .cta-row{flex-direction:column; align-items:stretch; gap:var(--space-4)}
  .closing .btn{align-self:stretch}   /* 收尾按钮与首屏按钮一样撑满 */
  /* Evidence 四条链接只占文字宽，链接盒只剩一行字高（26），44 点击区由本段末尾的伪元素撑出；z-index 让点击区盖过下一行说明。
     左右各借 2（内距 2 配负外距 2，文字位置不动），焦点框左右离字 2。
     原写上下内距 9 配负外距 9 把链接盒撑到 44，焦点框横穿上方标签的字脚与下方说明的字头，2026-09-27 撤 */
  .chain a.v{justify-self:start; z-index:1; padding:0 var(--space-2); margin:0 calc(-1 * var(--space-2))}
  /* 标签与值的两栏表在手机上改为标签在上、值在下，与 About 资料表一致；两栏时值列只剩 160 到 196 宽 */
  .part-facts > div, .chain > div{grid-template-columns:1fr; gap:var(--space-2); align-items:start}
  .chain .s{grid-column:auto}
  /* 团队卡收紧，一屏能看到两张多 */
  .people{gap:var(--space-12)}
  .person{padding:var(--space-12)}
  .portrait{flex:0 0 88px; width:88px; height:110px}
  .person .txt{padding-top:var(--space-8)}
  /* Contact 各组之间加分隔线，组与组分得开 */
  .channels{gap:0}
  .channel{padding-block:var(--space-24); border-top:1px solid var(--border-subtle)}
  .channel:first-child{border-top:0; padding-top:0}
  /* 法务：兄弟页链接点击框 32 高、两行之间 0（行距 32），元信息行用 12 的 mono。原写点击区 44，2026-09-27 撤。
     左右各借 8 见基础档，最窄的「大學」补到 44；文字在 32 框内居中，框边到文字行框上下各 5.5 */
  .siblings{gap:0 var(--space-16); padding-bottom:var(--space-24)}
  .siblings a{min-height:var(--space-32)}
  .lg .head-block .t-mono-s{font:500 var(--font-caption)/var(--lh-caption) var(--font-stack-mono)}
  /* 页脚两栏按行对齐（单栏时页脚有近两屏高）：字标单独一行（点击区 44），下面两个 .foot-cols 拆开，六组两两成行，
     同一行两组的组标题顶端对齐；阅读与 Tab 顺序跟着 DOM 走，正好逐行从左到右。法定区单独占最后一行，上方 24 + 分隔线 + 24。
     链接点击框 32，见本段末尾（原写 44，2026-09-27 撤） */
  .foot{padding-block:var(--section-y) var(--space-32)}
  .foot .wrap{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-24) var(--space-16); align-items:start}
  .foot .wordmark, .foot .legal, .foot-lang{grid-column:1 / -1}
  .foot-cols{display:contents}
  .fcol h3{margin-bottom:var(--space-8)}   /* 组标题到第一条链接框 8，到链接文字看得见 13.5 */

  /* 【2026-09-27 新增 · 区块节奏】 */
  .hero-copy{gap:var(--space-16)}                                  /* 眉标、大标题、导语 24→16 */
  .sec > .wrap{gap:var(--gap, var(--space-16))}                    /* 没有单独设 --gap 的区块，眉标、标题、导语 24→16（与 .head-block 同值） */
  .evidence{--pt:var(--space-48); --pb:var(--space-48); --gap:var(--space-32); min-height:0}   /* 色带内 48；手机不撑满一屏（内容本身已高过一屏） */
  .closing{padding-block:var(--space-48)}                          /* 色带内 64→48，与 Evidence 同 */

  /* 【2026-09-27 新增 · 列表首末项不叠留白】 */
  .rows:not(.all-lines) > :first-child{padding-top:0}
  .rows > :last-child{padding-bottom:0}
  .chain > div:first-child{padding-top:0}
  .chain > div:last-child{padding-bottom:0}
  .channel:last-child{padding-bottom:0}

  /* 【2026-09-27 新增 · 组件内部降一档】 */
  .cta-row .btn-ghost{padding-block:calc((44px - var(--lh-body)) / 2 - 1px)}   /* 第二个按钮没有描边，58 高只是点击区，降到 44 */
  .chain > div{padding-block:var(--space-12)}
  .facts > div{padding-block:var(--space-12)}
  .part .title{gap:var(--space-8)}
  .part .detail{gap:var(--space-16)}
  .part-facts > div{padding-block:var(--space-8)}
  .dom{padding-block:var(--space-16); gap:var(--space-8)}
  .channel, .channel dl{gap:var(--space-12)}                       /* 组内 16→12；组间 24 + 线 + 24 不动，组才分得开 */
  .prose + .prose{margin-top:var(--space-24)}                      /* 条款之间 32→24，条款内 8 */
  .lg .head-block{padding-bottom:var(--space-24)}                  /* 页头到兄弟页导航 40→24 */

  /* 【2026-09-27 新增 · 点击区与焦点框】 */
  /* 现况链接：44 点击区见共用组件「值链接点击区」。焦点框外扩 0，上下贴着链接盒，离上方标签「Company」的 p、y 字脚 2.6（外扩 2 时只剩 0.6）。
     法务正文行内链接的点击高与焦点框 2026-09-30 起各档一致，写在法务一节 */
  .chain a.v:focus-visible{outline-offset:0}

  /* 【2026-09-27 新增 · 页脚】 */
  /* 链接点击框 32 高，链接之间 0（行距 32），上下内距 4：单行时靠 min-height 32 与上方 ≤1023 段的 flex 居中，文字在框正中；
     折成两行的链接（Company information pack）框高随内容（42 + 8 = 50），上下各 4。
     链接撑满栏宽（360 宽时约 152）。左右各借 4（内距 4 配负外距 4，文字位置不动）：焦点框左右都伸出栏边 8，与栏对称，
     左缘离字由 2 放到 6；两栏的框各伸进栏间 8，正好在 16 的栏间中线相接 */
  .fcol a, .fcol .on{min-height:var(--space-32); padding-block:var(--space-4); align-self:stretch;
          padding-inline:var(--space-4); margin-inline:calc(-1 * var(--space-4))}
  .foot .legal{padding-top:var(--space-24)}
  /* 语言组在手机上单独占一行（上方 .foot-lang 跨两栏），三种语言横排；平板以上与其余四组一样竖排 */
  .fcol.foot-lang{flex-direction:row; flex-wrap:wrap; align-items:center; column-gap:var(--space-16)}
  .foot-lang h3{flex:1 0 100%; margin:0 0 var(--space-8)}   /* 组名单独一行，与其余四组的组名同一写法 */
  .foot-lang a, .foot-lang .on{align-self:center}
  /* 法定身份四段用基础档的 16/26（C3：≥ 1rem）。原写手机档 14/21，2026-09-27 撤 */
  .legal .zh{white-space:nowrap}                                   /* 中文公司名整名换行，别断在中间 */
}
/* 手机横屏（只限 1023 以下，矮的桌面窗口不受影响）：页眉降到 56，按钮收成 40 高，首屏标题离页眉 40；
   首屏按钮与卡底栏恢复横排；菜单链接排两列，整张菜单不用滚 */
@media (max-height:500px) and (orientation:landscape) and (max-width:1023px){
  :root{--nav-h:56px}
  .nav .actions .btn{height:40px; padding-block:0; padding-inline:calc(var(--space-16) - 1px); font-size:var(--font-small)}
  .menu-btn, .menu-close{height:40px}
  .menu-btn::after, .menu-close::after{inset:-3px -1px}
  .hero{padding-top:var(--space-40)}
  .page-head, .lg:first-child{--pt:var(--space-40)}
  .cta-row{flex-direction:row; align-items:center}
  .menu{gap:var(--space-16)}
  .menu-links{display:grid; grid-template-columns:repeat(2, max-content); column-gap:var(--space-48)}
  .menu-cta{width:auto; align-self:flex-start}
}
/* 占位值统一浅灰。放在最后并加一级选择器，压过各表格的值样式 */
.site .placeholder{color:var(--text-subtle)}

@media (prefers-reduced-motion:reduce){
  .blob{transform:none !important}   /* 晕染静止一帧 */
  .stamp{display:none}               /* 不放指针晕开 */
}
@media print{
  /* 纸面落在哪一档取决于页边距从哪里来（2026-09-27 实测）：打印对话框设页边距时，Chromium 按扣掉页边距后的宽算（A4 加 16mm 为 673，落在手机档）；
     只靠下方 @page 的 16mm 时按整张 A4 宽 794 算，落在平板档。打印时去掉版心上限与左右边距，由页边距当留白。
     原写「纸面宽度落在手机档，版心会缩成 350 宽的一窄条」，2026-09-27 撤 */
  @page{margin:16mm}
  .wrap, .nav-in{max-width:none; padding-inline:0}
  .nav{position:static; height:auto; border:0}
  .nav-links, .actions, .menu-btn, .menu, .wash, .skip{display:none}
  .wordmark .wm-part{transform:none !important; opacity:1 !important}   /* 纸面上一律印完整字标 */
  .closing{background:none; border-top:1px solid var(--border-subtle); break-inside:avoid}   /* 标题与按钮不拆页 */
  .closing .t-h2-bold{color:var(--text-primary)}
  .menu:popover-open, .menu.is-open{display:none}   /* 菜单开着时打印也不印出来 */
  html.menu-open{overflow:visible}
  .btn-primary{background:none; color:var(--text-primary); border-color:currentColor}
  body{background:#fff}
  .evidence{background:#fff; min-height:0; display:block}
  /* 首屏在纸面上是单栏网格，Chrome 会把整块推到第二页，第一页只剩字标；改成块级才能在两行之间分页 */
  .hero-in{display:block}
  .hero-in > * + *{margin-top:var(--space-48)}
  /* 纸面上区块上下留白封顶 48，屏幕上的 96 会把整块卡片挤到下一页。
     --pt、--pb 写 0 时一律带单位（0px）：不带单位的 0 放进 min() 与长度相比，整条声明失效，纸面上区块上下内距都变成 0（build.py 会拦） */
  .sec{padding-block:min(var(--pt, var(--section-y)), var(--space-48)) min(var(--pb, var(--section-y)), var(--space-48))}
  /* 标题不落在页底，卡片与表格行不拆页 */
  h1, h2, h3, h4, .head-block, .part .title{break-after:avoid}
  .head-block, .part .title, .legal, .dom, .chain > div, dl > div{break-inside:avoid}
  .siblings{display:none}   /* 法务页的兄弟页链接与内页的页内跳转行在纸上没有用 */
  .person{break-inside:avoid}
  /* 页脚整块放得进一页（手机纸宽 673 量得 884 高；平板纸宽 794 四组排 2×2，更矮；A4 内容高约 1002），整块不拆；
     万一放不下，退一步保证组、字标与法务块不被分页线拆开（Chromium 对网格行之间的 break-before:avoid 不生效，只作兜底）。
     原先只写在手机档，纸宽落在平板档时页脚被拆开，语言行与法定区单独落到最后一页（2026-09-30 第 1 轮复核移到这里，各纸宽都生效） */
  .foot .wrap{break-inside:avoid}
  .foot .wordmark{break-after:avoid}
  .fcol{break-inside:avoid}
  .foot .legal{break-before:avoid}
  /* 纸上没有手指：链接一律 32 高、上下内距 4（手机档的写法），上内距与区块同样封顶 48。平板纸宽原按触屏的 44 高排，
     页脚连上内距约 1040 高，超过 A4 内容高，整块推到新的一页后仍被拆开；收紧后约 850（2026-09-30 第 1 轮复核实测） */
  .foot{padding-top:var(--space-48)}
  .fcol a, .fcol .on{min-height:var(--space-32); padding-block:var(--space-4); margin-block:0}
}

/* ══════════ 组件样式 · css/components.css ══════════ */
/* TOIVO 官网原型 · 组件与版式样式（2026-09-30 起）
   对应 templates/components/ 里的片段，调用方式与 Figma 节点见 templates/components/README.md。构建时接在 site.css 后面、各页样式前面。
   正本是 Figma「TOIVO 官网」（9lNE2L7rN8jGlWZCxCyQlM）的 1440、768、390 画板；样式底子取自 09-29 旧英文六页单文件
   （参考/官网原型 · 六页单文件.html 第 343 至 964 行，与 Figma 逐区块对齐过），类名改成 c-（组件）与 l-（版式）开头，
   与 site.css 里现行页面的类名分开，互不影响。
   规矩（build.py 的 check_components_css 会查）：
   1. 选择器都带 .c- 或 .l- 开头的类名，组件样式不管页面；
   2. 颜色、间距、字号、行高、圆角一律用 tokens.css 的变量，不写裸值；
   3. Figma 里没有变量的固定尺寸（列宽、头像、刻度高、正文最宽的 em、撑满一屏的 vh）写成下面「组件常量」里的 --c-*、--l-*，注明节点；
      px、em、rem、vh、vw 等带单位的裸值出现在常量定义以外的地方，构建报错；
   4. 描边 1px、图标描边 1.5px、焦点框与当前页细条 2px、点击区 44px 这几个常量可以直接写；字距只许写 tokens.css 文字样式类的
      -.02em（标题）与 -.01em（Body L/SemiBold）。
   断点与 tokens.css 相同：桌面 1440 以上、笔记本 1024 至 1439、平板 768 至 1023、手机 767 以下。 */

/* ══════════ 组件常量 ══════════ */
:root{
  /* 首屏两栏（Home 3:13）：文案列最宽 600，样例卡 520 */
  --l-hero-copy: 600px;
  --l-hero-card: 520px;
  /* 五步（Home 47:2）：步名列 430，作品卡 638 */
  --l-step-name: 430px;
  --l-step-card: 638px;
  /* 部件详述（What we do 54:17）：标题栏 380，详情 756 */
  --l-part-title: 380px;
  --l-part-detail: 756px;
  /* 卡内字段行标签列：样例卡 92（4:16），作品卡 88（333:1239）；作品卡情境句最宽 544 */
  --c-brief-key: 92px;
  --c-artifact-key: 88px;
  --c-artifact-lead: 544px;
  /* 五段进度刻度每段高 3（333:1244） */
  --c-tick-h: 3px;
  /* 产品行五栏（382:1131）：编号 15、名称 240、状态 200、说明填满、证据 200 */
  --c-layer-num: 15px;
  --c-layer-name: 240px;
  --c-layer-status: 200px;
  --c-layer-ev: 200px;
  /* 2026-10-02 已批准 UI 评审：产品身份 280、当前证据 200；宣言标题栏 420。既有 token 保持原值。 */
  --c-product-identity: 280px;
  --c-product-evidence: 200px;
  --l-split-intro: 420px;
  /* 命名阶梯行四栏（57:69）：编号 34、名称 268、说明 440、条件填满 */
  --c-num-num: 34px;
  --c-num-name: 268px;
  --c-num-desc: 440px;
  --c-num-note: 1fr;
  /* 证据链行（51:12）：键 130、值 340 */
  --c-chain-k: 130px;
  --c-chain-v: 340px;
  /* 标签值行：公司资料 280（52:27）、分工 380（214:263）、部件事实 130（54:30）；值最宽 544、476 */
  --c-facts-k: 280px;
  --c-who-k: 380px;
  --c-part-k: 130px;
  --c-kv-v: 544px;
  --c-part-v: 476px;
  /* 能力领域行（59:8）：名称 280、说明 420、表现填满（1440 为 420） */
  --c-dom-name: 280px;
  --c-dom-desc: 420px;
  /* 研究条目（54:95）：meta 170，标题最宽 748 */
  --c-entry-meta: 170px;
  --c-entry-title: 748px;
  /* 团队卡（55:8）：头像 140×175；名字到职位 5、职位到城市 3（Figma 用空帧撑出，没有变量） */
  --c-portrait-w: 140px;
  --c-portrait-h: 175px;
  --c-person-gap-role: 5px;
  /* 下划线离字：链接 3，去框按钮悬停 4（旧代码，Figma 没画悬停） */
  --c-underline: 3px;
  --c-underline-btn: 4px;
  /* 页首与区块标题最宽 900（Figma 880 至 900） */
  --c-title-max: 900px;
  /* 并排的样例卡在 1279 以下改一栏时的卡宽：照 Figma 768 样例卡 181:38（704，与首屏卡在 768 同宽；排版方案 G18） */
  --c-brief-w: 704px;
  /* 区块内分组（x-group，排版方案 G17）：组与组、组与前后内容之间 64，手机 40；组名到内容 24 写在 .l-group */
  --l-group-y: var(--space-64);
  /* 锚点落点（G19）：跳到带 id 的区块时，区块第一行离页眉 64，手机 40 */
  --l-anchor-y: var(--space-64);
  /* 正文最宽 34em：Body L 18 时 612（区块导语 57:3、首屏导语 3:13），Body 16 时 544（条款正文 53:71、引言 57:60、部件导语 54:17）；
     中文字宽，同一行放 32 个字 */
  --c-measure: 34em;
  --c-measure-zh: 32em;
  /* 撑满一屏的色带（P06，Home 51:2）：视口高减页眉。Figma 1440 的 802 是 900 高视口减 98，768 的 926 是 1024 减 98 */
  --l-fill-h: calc(100vh - var(--nav-h));
  /* 行式表分隔线：浅色用 hairline；深色 hairline 与页面底同为 warm-grey-800，线会消失，改用 subtle（旧 .rows 的做法） */
  --c-hairline: var(--border-hairline);
  /* 中文标签：英文页的标签是大写等宽字（Mono/Caption/Medium），中文字落进等宽字会被拉开，中文页改用 Figma 的
     Small/Regular · zh（昭源黑體 14/21，字距 0）。现行 site.css 给中文标签加了 .08em 字距，与 Figma 不同，
     待 Cindy 定（代码组件对照与改法 四之 4）；要改只改这一个变量 */
  --c-label-zh-track: 0em;
}
@media screen and (prefers-color-scheme: dark){ :root:not([data-theme="light"]){ --c-hairline: var(--border-subtle); } }
:root[data-theme="dark"]{ --c-hairline: var(--border-subtle); }
@media (max-width:1439px){ :root{
  --l-hero-copy: 1fr;
  --c-layer-name: 200px; --c-layer-status: 190px; --c-layer-ev: 180px;
  --c-num-name: 240px; --c-num-desc: 1fr; --c-num-note: 300px;
  --l-part-title: 320px; --l-part-detail: 1fr;
  --c-who-k: 320px;
  --c-dom-name: 260px; --c-dom-desc: 380px;
} }
@media (max-width:1023px){ :root{
  --c-facts-k: 200px;
  --c-who-k: 200px;
  --c-portrait-w: 120px; --c-portrait-h: 150px;
} }
@media (max-width:767px){ :root{
  --c-num-num: 20px;
  --c-portrait-w: 88px; --c-portrait-h: 110px;
  --l-group-y: var(--space-40);
  --l-anchor-y: var(--space-40);
} }

/* ══════════ 文字样式（与 Figma Text styles 同名，组件内部用） ══════════ */
.c-t-display{font:700 var(--font-display)/var(--lh-display) var(--font-stack-display); letter-spacing:-.02em; text-wrap:balance}
.c-t-h1{font:700 var(--font-h1)/var(--lh-h1) var(--font-stack-display); letter-spacing:-.02em; text-wrap:balance}
.c-t-h2{font:600 var(--font-h2)/var(--lh-h2) var(--font-stack-display); letter-spacing:-.02em; text-wrap:balance}
.c-t-h2-bold{font:700 var(--font-h2)/var(--lh-h2) var(--font-stack-display); letter-spacing:-.02em; text-wrap:balance}
.c-t-h3{font:600 var(--font-h3)/var(--lh-h3) var(--font-stack); letter-spacing:-.02em; text-wrap:balance}
.c-t-h4{font:600 var(--font-h4)/var(--lh-h4) var(--font-stack); letter-spacing:-.02em; text-wrap:balance}
.c-t-body-l{font:400 var(--font-body-l)/var(--lh-body-l) var(--font-stack)}
.c-t-body-l-sb{font:600 var(--font-body-l)/var(--lh-body-l) var(--font-stack); letter-spacing:-.01em}
.c-t-body{font:400 var(--font-body)/var(--lh-body) var(--font-stack)}
.c-t-body-m{font:500 var(--font-body)/var(--lh-body) var(--font-stack)}
.c-t-small{font:400 var(--font-small)/var(--lh-small) var(--font-stack)}
.c-t-small-sb{font:600 var(--font-small)/var(--lh-small) var(--font-stack)}
.c-t-caption{font:400 var(--font-caption)/var(--lh-caption) var(--font-stack)}
.c-t-mono{font:500 var(--font-caption)/var(--lh-caption) var(--font-stack-mono)}
.c-t-mono-s{font:500 var(--font-small)/var(--lh-small) var(--font-stack-mono)}
.c-t-zh-small{font:400 var(--font-small)/var(--lh-small) var(--font-stack-hant)}
.c-t-zh-caption{font:400 var(--font-caption)/var(--lh-caption) var(--font-stack-hant)}
/* 中文：标题字距归零、行高 1.3、优先在标点与 <wbr> 处折行，容器不足时允许断行；正文行高 1.75，小字 1.7；display 取英文的 0.75 倍，平板以上不小于 h1
   （与 site.css「语言」一节同一套变量） */
html:lang(zh) :is(.c-t-display, .c-t-h1, .c-t-h2, .c-t-h2-bold, .c-t-h3, .c-t-h4){
  letter-spacing:0; line-height:var(--lh-cjk-heading); word-break:keep-all; overflow-wrap:anywhere}
html:lang(zh) .c-t-display{font-size:calc(var(--font-display) * var(--cjk-display-scale))}
@media (min-width:768px){ html:lang(zh) .c-t-display{font-size:max(calc(var(--font-display) * var(--cjk-display-scale)), var(--font-h1))} }
html:lang(zh) .c-t-body-l-sb{letter-spacing:0}
html:lang(zh) :is(.c-t-body-l, .c-t-body, .c-t-body-m){line-height:var(--lh-cjk-body)}
html:lang(zh) :is(.c-t-small, .c-t-small-sb, .c-t-caption){line-height:var(--lh-cjk-small)}
/* 标签（眉标、表格标签、作品卡的 ARTIFACT、状态栏名）：中文页换成正文字族 14/21，见组件常量 --c-label-zh-track */
html:lang(zh) .c-label{font-family:var(--font-stack); font-weight:400; font-size:var(--font-small); line-height:var(--lh-small); letter-spacing:var(--c-label-zh-track)}
/* 中文导语与短段落末行不落单（8.22，10-01 第 2 轮复核）：Chrome 的 text-wrap:pretty 对中文不起作用，末行常只剩两个字加句号
   （首页「…由人／主導。」、關於我們「…屬實／的事。」）。这几类段落改用 balance 拉匀各行，六行以内生效，与 site.css 给 li、dd 的写法一致；
   三栏行的说明与表现（手机档简中「…比較」「…效率」）、五步的步名说明、证据链的说明、注记与单独一条的文字链接（1024 与 360 各有几处）
   同样处理。不加 keep-all，正文仍可在字间折行，不至于只在标点处断 */
html:lang(zh) :is(.c-head__lead, .l-hero__lead, .l-part__lead, .c-para, .c-layer__desc, .c-dom__desc, .c-dom__shows,
  .l-step__desc, .c-chain-row__s, .c-note, .c-more__a){text-wrap:balance}
/* 读屏专用（桌面栏头已写、窄屏才显示的行内标签） */
.c-sr{position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0}

/* ══════════ 按钮 · Button / primary 3:19、secondary 212:625、small outline 4:24、首屏第二按钮 3:21 ══════════ */
/* 描边不计入 Figma 布局：边框 1px 算进内距，尺寸与 Figma 一致（primary 58 高、secondary 50、small 37）。
   悬停只换色、不设过渡（Figma 没画悬停，沿用旧代码）；焦点框用 site.css 的全站写法（2px focus/ring，外扩 2） */
.c-btn{display:inline-flex; align-items:center; justify-content:center; gap:var(--space-8); box-sizing:border-box; margin:0;
  padding:calc(var(--space-16) - 1px) calc(var(--space-24) - 1px); border:1px solid transparent; border-radius:var(--radius-card);
  background:none; color:var(--text-body); font:500 var(--font-body)/var(--lh-body) var(--font-stack);
  text-decoration:none; white-space:nowrap; cursor:pointer}
.c-btn--primary{background:var(--brand-solid); color:var(--text-on-brand-solid)}
.c-btn--primary:hover{background:var(--brand-hover)}
.c-btn--secondary, .c-btn--small{background:var(--bg-canvas); border-color:var(--border-strong)}
.c-btn--secondary{padding:calc(var(--space-12) - 1px) calc(var(--space-24) - 1px)}
.c-btn--small{padding:calc(var(--space-8) - 1px) calc(var(--space-16) - 1px); font:500 var(--font-small)/var(--lh-small) var(--font-stack)}
.c-btn--secondary:hover, .c-btn--small:hover{color:var(--text-primary); border-color:var(--text-subtle)}
.c-btn--ghost:hover{color:var(--text-primary); text-decoration:underline; text-underline-offset:var(--c-underline-btn)}
/* 小号按钮桌面 37 高（排版方案 G4）：44 高的点击区由伪元素上下撑出，版面不动（与证据链的值同一写法）。手机满宽时 45 高，伪元素落在按钮里 */
.c-btn--small{position:relative}
.c-btn--small::after{content:""; position:absolute; left:0; right:0; top:50%; height:44px; transform:translateY(-50%)}
/* 区块与部件里直接放的按钮不拉满整行（排版方案 G1）：区块外框与部件详情是纵向弹性盒，按钮默认会被拉宽。
   依据收尾色带按钮靠左（386:3037）；手机档写了 wide 的照旧撑满（下面 .c-btn--wide 的 width:100%） */
.l-section > .l-wrap > .c-btn, .l-part__detail > .c-btn{align-self:flex-start}
@media (max-width:767px){
  /* 撑满：首屏两个按钮、收尾按钮、卡底按钮照 Figma 390 满宽 */
  .c-btn--wide{display:flex; width:100%}
  /* 去框按钮没有描边，58 高只是点击区，手机降到 44（Figma 183:36 内距 8/24） */
  .c-btn--ghost{padding-block:calc((44px - var(--lh-body)) / 2 - 1px)}
  /* 卡底小按钮满宽时上下 12（Figma 183:60，45 高） */
  .c-btn--small.c-btn--wide{padding-block:calc(var(--space-12) - 1px)}
}

/* ══════════ 状态章 · status 382:1136（浅彩，研发中）、382:1175（中性，构想）；chip / sample 4:5 ══════════ */
/* 描边计入布局：28 高。浅彩只用于研发中，中性用于构想与样例 */
.c-chip{display:inline-flex; align-items:center; box-sizing:border-box; padding:var(--space-4) var(--space-8);
  border:1px solid var(--border-strong); border-radius:var(--radius-chip); background:var(--bg-muted);
  font:500 var(--font-caption)/var(--lh-caption) var(--font-stack-mono); color:var(--text-subtle); white-space:nowrap}
.c-chip--soft{background:var(--bg-soft); border-color:var(--border-soft); color:var(--text-on-soft)}
/* 中文章用 Figma Caption/Regular · zh（12/18），与眉标同一字族，章高仍是 28 */
html:lang(zh) .c-chip{font-family:var(--font-stack); font-weight:400; letter-spacing:var(--c-label-zh-track)}

/* ══════════ 编号、眉标、注记 ══════════ */
.c-num{font:500 var(--font-caption)/var(--lh-caption) var(--font-stack-mono); color:var(--text-subtle)}
.c-eyebrow{color:var(--text-subtle)}
.c-eyebrow--muted{color:var(--text-muted)}
/* 英文眉标一律大写（排版方案 G13）：旧设计全站等宽眉标都是大写（HOW IT IS VERIFIED）。组名、产品名作眉标时文案照句首大写写
   （How we design for learning、TOIVO Pathways），由样式转成大写，与卡头标签 .c-card__label、栏头 .c-layer-cols 同一做法；中文页不受影响 */
html:lang(en) .c-eyebrow{text-transform:uppercase}
.c-note{color:var(--text-muted)}
.c-para{color:var(--text-muted); max-width:var(--c-measure)}
/* 段落里的句中链接（Responsible AI 两段链到法务页）：照条款段 .c-prose__body a，上下内距 2 把点击高撑到 25（≥ 24，按 2.5.8 的行内豁免），
   左右各借 2，版面不动；焦点框外扩 0，不压上下行的字 */
.c-para a{text-underline-offset:var(--c-underline); padding:var(--space-2); margin-inline:calc(-1 * var(--space-2))}
.c-para a:focus-visible{outline-offset:0}
/* 下划线链接：句中与表格值里可点的字（证据链的值、邮箱），不画箭头 */
.c-link{text-decoration:underline; text-underline-offset:var(--c-underline); text-decoration-thickness:1px}
.c-link:hover{text-decoration-thickness:2px}
.c-para--body{color:var(--text-body)}
html:lang(zh) .c-para{max-width:var(--c-measure-zh)}
/* 表格值与联系渠道里的链接（排版方案 G3）：链接盒只有一行字高，44 高的点击区由伪元素上下撑出，版面不动（与证据链的值同一写法） */
:is(.c-field__v, .c-channel) .c-link{position:relative}
:is(.c-field__v, .c-channel) .c-link::after{content:""; position:absolute; left:0; right:0; top:50%; height:44px; transform:translateY(-50%)}
/* 单独一条的文字链接 x-more（排版方案 G2）：照证据链的值（51:12）Body/Medium、text/primary、下划线。
   上下内距把链接盒撑到 44 高，负外距收回，版面只占一行字高（中文行高 28 时盒高 46） */
.c-more__a{display:inline-block; color:var(--text-primary);
  padding-block:calc((44px - var(--lh-body)) / 2); margin-block:calc((var(--lh-body) - 44px) / 2)}

/* ══════════ 区块标题组 · head 57:3（眉标、H2/SemiBold、Body L 导语 612） ══════════ */
.c-head{display:flex; flex-direction:column; align-items:flex-start; gap:var(--space-16); min-width:0}
.c-head--loose{gap:var(--space-24)}
/* 2026-10-05 手机实机反馈：长标题须按父栏宽度折行，避免内容宽度撑开后被页面裁切。 */
.c-head__title{color:var(--text-primary); width:100%; max-width:var(--c-title-max)}
.c-head__lead{color:var(--text-muted); max-width:var(--c-measure)}
html:lang(zh) .c-head__lead{max-width:var(--c-measure-zh)}
@media (max-width:767px){ .c-head--loose{gap:var(--space-16)} }

/* ══════════ 卡片 · Card / Challenge Brief 4:2 ══════════ */
/* 卡：bg/canvas、1px border/subtle（计入布局）、圆角 8。卡头与卡底是 bg/surface 色条，各用一条 hairline 与卡身分开 */
.c-card{background:var(--bg-canvas); border:1px solid var(--border-subtle); border-radius:var(--radius-card); overflow:hidden}
.c-card__head{display:flex; align-items:center; justify-content:space-between; gap:var(--space-8);
  padding:var(--space-16) var(--space-24); background:var(--bg-surface); border-bottom:1px solid var(--border-hairline)}
/* 卡头标签与章一行放不下时，章整枚换到下一行（行距 8），标签不在字间折开（10-01 第 2 轮复核：合作伙伴页示例任务卡头改放阶段章后，
   英文「03 · SECONDARY 4 TO 6」配「PLANNED · 2027 Q3 TO Q4」在 1440、390 把标签挤成两三行）。放得下时照 Figma 4:2 同一行、章靠右 */
.c-card__head{flex-wrap:wrap}
.c-card__label{color:var(--text-subtle)}
/* 英文卡头标签转大写（排版方案 G12）：文案写句首大写（Example tasks · 03），照旧卡头 STEP 01 · BRIEF 显示为大写，与产品行栏头同一做法 */
html:lang(en) .c-card__label{text-transform:uppercase}
.c-card__body{display:flex; flex-direction:column; gap:var(--space-16); padding:var(--space-24)}
/* 卡身导语最宽 34em（Body L 18 时 612），与首屏导语、区块导语同一写法：768 卡身 654 宽时收到 612（Figma 181:44 maxWidth 612），
   1440（卡身 470）与 390（316）不受影响；中文 32em */
.c-card__lead{color:var(--text-body); max-width:var(--c-measure)}
html:lang(zh) .c-card__lead{max-width:var(--c-measure-zh)}
.c-card__foot{display:flex; align-items:center; justify-content:space-between; gap:var(--space-12);
  padding:var(--space-16) var(--space-24); background:var(--bg-surface); border-top:1px solid var(--border-hairline)}
.c-card__note{color:var(--text-muted)}
@media (max-width:767px){
  /* Figma 183:38：卡头 12/16，卡身四边 16、间距 12，卡底纵排、按钮满宽 */
  .c-card__head{padding:var(--space-12) var(--space-16)}
  .c-card__body{padding:var(--space-16); gap:var(--space-12)}
  .c-card__foot{flex-direction:column; align-items:stretch; padding:var(--space-16)}
}

/* ══════════ 标签值行 · 卡内字段行 4:16、部件事实行 54:30、公司资料行 52:27、分工行 214:263 ══════════ */
/* <dl class="c-kv c-kv--种类"> 里放 x-field 出的 <div class="c-field"><dt>标签</dt><dd>值</dd></div>。
   标签是等宽小字（中文页换正文字族），值是正文；行与行之间细线，首行无线（分工行与样例卡每行都画） */
.c-kv{display:flex; flex-direction:column}
/* 2026-10-08：横排字段按首行文字基线配对，长值不把标签推到段落中部。手机堆叠仍在下方单独处理。 */
.c-field{display:grid; align-items:baseline}
.c-field__k{color:var(--text-subtle)}
.c-field__v{font:400 var(--font-small)/var(--lh-small) var(--font-stack); color:var(--text-body)}
/* 资料、分工、任务字段、产品事实与联系渠道的值用 Body；标签维持原字号（2026-10-07 字号评审）。 */
:is(.c-kv--facts, .c-kv--who) .c-field__k{font-size:var(--font-small); line-height:var(--lh-small)}
:is(.c-kv--facts, .c-kv--who, .c-kv--brief, .c-kv--part, .c-channel__fields) .c-field__v{font-size:var(--font-body); line-height:var(--lh-body)}
html:lang(zh) .c-field__v{line-height:var(--lh-cjk-small)}
html:lang(zh) :is(.c-kv--facts, .c-kv--who, .c-kv--brief, .c-kv--part, .c-channel__fields) .c-field__v{line-height:var(--lh-cjk-body)}
/* 样例卡字段：92 + 值，间距 16，上下 12；每行上边一条 hairline（卡里第一行也画，与导语分开） */
.c-kv--brief > .c-field{grid-template-columns:var(--c-brief-key) minmax(0,1fr); gap:var(--space-16);
  padding-block:var(--space-12); border-top:1px solid var(--c-hairline)}
/* 作品卡字段：88 + 值，间距 16，行与行 8，不画线 */
.c-kv--artifact{gap:var(--space-8)}
.c-kv--artifact > .c-field{grid-template-columns:var(--c-artifact-key) minmax(0,1fr); gap:var(--space-16)}
/* 部件事实：130 + 值 476，间距 24，上下 12 */
.c-kv--part > .c-field{grid-template-columns:var(--c-part-k) minmax(0,var(--c-part-v)); gap:var(--space-24); padding-block:var(--space-12)}
/* 公司资料：280 + 值 544，间距 32，上下 16；标签 Mono/Small/Medium text/muted（Figma 52:27） */
.c-kv--facts > .c-field{grid-template-columns:var(--c-facts-k) minmax(0,var(--c-kv-v)); gap:var(--space-32); padding-block:var(--space-16)}
.c-kv--facts .c-field__k{color:var(--text-muted)}
/* 分工：380 + 值 544，间距 64，上下 24，首行基线对齐；每行都画线（原 Figma 214:263 为盒顶对齐，10-08 更新） */
.c-kv--who > .c-field{grid-template-columns:var(--c-who-k) minmax(0,var(--c-kv-v)); gap:var(--space-64); padding-block:var(--space-24);
  align-items:baseline; border-top:1px solid var(--c-hairline)}
:is(.c-kv--part, .c-kv--facts) > .c-field + .c-field{border-top:1px solid var(--c-hairline)}
/* 入口行 · kind="links"（排版方案 G5）：没有标签的入口清单，单栏，每行上边线 hairline（行线照分工行 214:263），
   链接照证据链的值（51:12）Body/Medium、text/primary、下划线；链接盒至少 44 高，整行就是点击区的高度，三档相同。
   整张表最宽收在正文最宽（10-01 复核：行线原先拉满版心，1440 长 1200、768 长 704，链接只占左边一小段，像页面自造的清单），
   与区块导语用同一组变量 --c-measure、--c-measure-zh；表是 Body 16，em 按 16 算，英文 544、中文 512（导语 Body L 18 为 612、576），
   版心窄于这个宽度时（390）照旧撑满 */
.c-kv--links{margin:0; padding:0; list-style:none; max-width:var(--c-measure)}
html:lang(zh) .c-kv--links{max-width:var(--c-measure-zh)}
.c-link-row{display:flex; align-items:center; border-top:1px solid var(--c-hairline)}
.c-link-row__a{display:inline-flex; align-items:center; min-height:44px; color:var(--text-primary)}
@media (max-width:1023px){
  .c-kv--who > .c-field{gap:var(--space-32)}
}
@media (max-width:767px){
  /* 标签在上、值在下：样例卡与部件事实间距 2，资料与分工 4；上下内距降一档，首行不留上内距、末行不留下内距 */
  .c-kv > .c-field{grid-template-columns:minmax(0,1fr); align-items:start}
  .c-kv--brief > .c-field{gap:var(--space-2); padding-block:var(--space-8)}
  .c-kv--artifact > .c-field, .c-kv--part > .c-field{gap:var(--space-2)}
  .c-kv--part > .c-field{padding-block:var(--space-8)}
  .c-kv--facts > .c-field, .c-kv--who > .c-field{gap:var(--space-4); padding-block:var(--space-12)}
  :is(.c-kv--part, .c-kv--facts) > .c-field:first-child{padding-top:0}
  :is(.c-kv--part, .c-kv--facts, .c-kv--who) > .c-field:last-child{padding-bottom:0}
}

/* ══════════ 卡片 · Card / Artifact 333:1239，五段进度刻度 ticks 333:1244 ══════════ */
.c-artifact__head{display:flex; flex-direction:column; gap:var(--space-12); padding:var(--space-16) var(--space-24)}
.c-artifact__meta{display:flex; align-items:center; gap:var(--space-16)}
.c-artifact__meta > .c-t-mono{color:var(--text-subtle)}
.c-artifact__lead{color:var(--text-muted); max-width:var(--c-artifact-lead)}
.c-artifact__title{color:var(--text-primary)}
.c-artifact .c-kv--artifact{padding:var(--space-24) var(--space-24) var(--space-16); border-top:1px solid var(--border-hairline)}
/* 刻度：五段等分，每段高 3、间距 4、圆角 radius/chip；走到第几步就亮几段（brand/solid），其余 bg/track */
.c-ticks{display:flex; flex:1; gap:var(--space-4)}
.c-ticks > i{flex:1; height:var(--c-tick-h); border-radius:var(--radius-chip); background:var(--bg-track)}
.c-ticks[data-step="1"] > i:nth-child(-n+1), .c-ticks[data-step="2"] > i:nth-child(-n+2), .c-ticks[data-step="3"] > i:nth-child(-n+3),
.c-ticks[data-step="4"] > i:nth-child(-n+4), .c-ticks[data-step="5"] > i{background:var(--brand-solid)}
@media (max-width:767px){
  .c-artifact__head{padding:var(--space-16); gap:var(--space-8)}
  .c-artifact .c-kv--artifact{padding:var(--space-16)}
}

/* ══════════ 产品行 · Layer / * 382:1131（1440）、181:105（768）、183:105（390） ══════════ */
/* 每行一张白卡，五栏：编号、名称、状态章、说明、证据；上方栏头只在证据栏写一次（读屏跳过，每行另带只给读屏的栏名） */
.c-layer-cols, .c-layer{display:grid; grid-template-columns:var(--c-layer-num) var(--c-layer-name) var(--c-layer-status) minmax(0,1fr) var(--c-layer-ev); gap:var(--space-24)}
.c-layer-cols{padding-inline:var(--space-24)}
.c-layer-cols > span{grid-column:5; color:var(--text-subtle)}
/* 栏头与每行的栏名可以用同一个文案 key（句首大写）：英文页栏头照 Figma 382:1130 转大写（EVIDENCE） */
html:lang(en) .c-layer-cols > span{text-transform:uppercase}
.c-layer{align-items:baseline; background:var(--bg-canvas); border:1px solid var(--border-subtle); border-radius:var(--radius-card);
  padding:var(--space-24) var(--space-24) var(--space-16)}
.c-layer__nm{display:flex; flex-direction:column; gap:var(--space-2); min-width:0}
.c-layer__name{color:var(--text-primary)}
/* 名称下的副题（sub，排版方案 G7）：中文页首次出现的平台中文名「托禾成長路徑」，Small text/muted */
.c-layer__sub{color:var(--text-muted)}
.c-layer__status{display:flex; align-items:flex-start}
.c-layer__desc{color:var(--text-muted)}
.c-layer__ev{color:var(--text-body)}
.c-layer__ev.is-empty{color:var(--text-subtle)}
.c-layer__ev-label{color:var(--text-subtle)}
/* 行尾链接（x-more，排版方案 G2）：1440 排在说明那一栏、说明下面，行距 8；平板与手机跟在证据后面（下面两档的 grid-column 已覆盖） */
.c-layer{row-gap:var(--space-8)}
.c-layer > .c-more{grid-column:4}
@media (max-width:1023px){
  /* 平板：编号一栏，其余叠在第二栏；证据前加栏名「Evidence · 」 */
  .c-layer-cols{display:none}
  .c-layer{grid-template-columns:var(--c-layer-num) minmax(0,1fr); gap:var(--space-8) var(--space-16)}
  .c-layer > :not(.c-layer__num){grid-column:2}
  .c-layer__ev-label{position:static; width:auto; height:auto; margin:0; overflow:visible; clip-path:none; white-space:normal}
  .c-layer__ev-label::after{content:" · "}
}
@media (min-width:768px) and (max-width:1023px){
  /* 平板照 Figma 181:105：栏名与证据是同一个文字节点，Caption/Regular，栏名 text/subtle、证据 text/body。
     栏名改用证据的字（跟着 .c-t-caption，中文页同样跟着证据，不换成标签的 14/21）；文案写句首大写 Evidence，这一档照原样显示 */
  .c-layer__ev-label, html:lang(zh) .c-layer__ev-label{font:inherit; letter-spacing:inherit; color:var(--text-subtle)}
}
@media (max-width:767px){
  /* 手机照 Figma 183:105：去掉卡框平铺，证据另起一块（上边线、栏名单独一行）。
     栏名回到标签的写法：英文 Mono/Caption/Medium 大写（EVIDENCE，由 text-transform 转，文案仍写 Evidence），中文页照 .c-label 换正文字族 */
  .c-layer{grid-template-columns:minmax(0,1fr); gap:var(--space-8); background:none; border:0; border-radius:0; padding:0}
  .c-layer > :not(.c-layer__num){grid-column:1}
  .c-layer__ev{margin-top:var(--space-8); padding-top:var(--space-12); border-top:1px solid var(--border-subtle)}
  .c-layer__ev-label{display:block; margin-bottom:var(--space-4)}
  .c-layer__ev-label::after{content:none}
  html:lang(en) .c-layer__ev-label{text-transform:uppercase}
}


/* 2026-10-02 产品分组变体：保持原白卡、边框、字体，三组按关联排列。默认产品行仍照 Figma 五栏。 */
.c-layer--grouped{grid-template-columns:var(--c-product-identity) minmax(0,1fr) var(--c-product-evidence); gap:var(--space-32)}
/* 2026-10-05 首页产品概览只保留身份与说明，原状态及证据变体供其他页面使用。 */
.c-layer--grouped.c-layer--overview{grid-template-columns:var(--c-product-identity) minmax(0,1fr)}
.c-layer__identity{display:grid; grid-template-columns:var(--c-layer-num) minmax(0,1fr); gap:var(--space-16); align-items:baseline}
.c-layer__identity-body, .c-layer__detail{display:flex; flex-direction:column; gap:var(--space-8); min-width:0}
.c-layer--grouped .c-layer__ev-label{display:block; position:static; width:auto; height:auto; margin:0 0 var(--space-4);
  overflow:visible; clip-path:none; white-space:normal}
.c-layer--grouped .c-layer__ev-label::after{content:none}
@media (max-width:1023px){
  .c-layer--grouped, .c-layer--grouped.c-layer--overview{grid-template-columns:minmax(0,1fr); gap:var(--space-16); align-items:start}
  .c-layer--grouped > :not(.c-layer__num){grid-column:1}
}
@media (max-width:767px){
  .c-layer--grouped{gap:var(--space-12)}
  .c-layer__identity{grid-template-columns:minmax(0,1fr); gap:var(--space-8); align-items:start}
}

/* ══════════ 编号行 · Naming ladder 行 57:69（1440）、181:166（768）、183:166（390） ══════════ */
.c-num-row{display:grid; grid-template-columns:var(--c-num-num) var(--c-num-name) var(--c-num-desc) var(--c-num-note); gap:var(--space-32);
  align-items:baseline; padding-block:var(--space-16)}
.c-num-row + .c-num-row{border-top:1px solid var(--c-hairline)}
.c-num-row__name{color:var(--text-primary)}
.c-num-row__desc{color:var(--text-body)}
.c-num-row__note{color:var(--text-subtle)}
/* 只有名称一栏（没有说明与条件）时，名称占满编号以外的整行。四栏固定列宽（1440 为 34/268/440/1fr，1024 至 1279 为 34/240/1fr/300）
   放进部件详述的右栏（1440 宽 690、1024 宽 512）会比栏宽，名称格伸出版心、被 .site 裁掉；短行改用两栏栅格，三档都一样 */
.c-num-row--short{grid-template-columns:var(--c-num-num) minmax(0,1fr)}
.c-num-row--short .c-num-row__name{grid-column:2 / -1}
/* 不写说明、只写短注（排版方案 G9）：名称跨第 2 至 3 栏一栏读完，短注在第 4 栏，照旧命名阶梯右栏的浅色短注（57:69 的 m 栏） */
.c-num-row--wide .c-num-row__name{grid-column:2 / 4}
/* 编号行表的栏头（cols-label，G9）：只在第 4 栏上方写一次（读屏跳过，每行另带只给读屏的栏名 note-label），与编号行同一套四栏；
   表有眉标时眉标跨前三栏，与栏头同一行。英文页栏头转大写，与产品行、三栏行的栏头同一做法 */
.c-num-cols{display:grid; grid-template-columns:var(--c-num-num) var(--c-num-name) var(--c-num-desc) var(--c-num-note); column-gap:var(--space-32); align-items:baseline}
.c-num-cols > .c-table-title{grid-column:1 / 4}
.c-num-cols__label{grid-column:4; color:var(--text-subtle)}
html:lang(en) .c-num-cols__label{text-transform:uppercase}
@media (min-width:1024px){
  /* 带栏头的表里，只写名称的一行（企業 Challenge 流程第 07 步）名称也只占第 2 至 3 栏，第 4 栏空着，与上面几行对齐 */
  .l-num-table--cols .c-num-row--short{grid-template-columns:var(--c-num-num) var(--c-num-name) var(--c-num-desc) var(--c-num-note)}
  .l-num-table--cols .c-num-row--short .c-num-row__name{grid-column:2 / 4}
}
@media (max-width:1023px){
  .c-num-row{grid-template-columns:var(--c-num-num) minmax(0,1fr); gap:var(--space-8) var(--space-24)}
  .c-num-row > :not(.c-num){grid-column:2}
  /* 栏头隐藏，栏名写在短注前（「對應步驟 · 任務」），跟着短注的字，与三栏行 .c-dom__shows-label 同一写法 */
  .c-num-cols{display:block}
  .c-num-cols__label{display:none}
  .c-num-row__note-label, html:lang(zh) .c-num-row__note-label{position:static; width:auto; height:auto; margin:0; overflow:visible; clip-path:none;
    white-space:normal; font:inherit; letter-spacing:inherit; text-transform:none}
  .c-num-row__note-label::after{content:" · "}
}
@media (min-width:768px) and (max-width:1023px){
  /* 平板仍横排的编号与名称也按首行基线对齐，正文余栏在名称下面独立成行。 */
  .c-num-row{align-items:baseline}
}
@media (max-width:767px){
  /* 手机照 Figma 183:166 编号框 26 高、字居中，编号对齐名称第一行（10-01 第 2 轮复核）：行顶端对齐，编号框高等于名称一行的行高
     （英文 --lh-body 26，中文正文行高 16 × 1.75 = 28），字在框里居中。原先整行居中，名称折两行时编号比名称顶低 17、三行低 30，
     英文页一整列编号上下飘。旧设计 390 命名阶梯也是编号与名称第一行同一行起头 */
  .c-num-row{align-items:start}
  .c-num-row > .c-num{display:flex; align-items:center; min-height:var(--lh-body)}
  html:lang(zh) .c-num-row > .c-num{min-height:calc(var(--font-body) * var(--lh-cjk-body))}
  .c-num-row{column-gap:var(--space-12); row-gap:var(--space-4); padding-block:var(--space-12)}
  .c-num-row:first-child{padding-top:0}
  .c-num-row:last-child{padding-bottom:0}
}

/* ══════════ 证据链行 · Evidence chain 行 51:12（1440）、181:196（768）、183:196（390）（色带 bg/soft 上，线用 border/soft） ══════════ */
.c-chain{display:flex; flex-direction:column}
.c-chain-row{display:grid; grid-template-columns:var(--c-chain-k) var(--c-chain-v) minmax(0,1fr); gap:var(--space-32);
  align-items:baseline; padding-block:var(--space-16)}
.c-chain-row + .c-chain-row{border-top:1px solid var(--border-soft)}
.c-chain-row__k{color:var(--text-subtle)}
.c-chain-row__v{color:var(--text-primary); justify-self:start}
a.c-chain-row__v{position:relative; text-decoration:underline; text-underline-offset:var(--c-underline); text-decoration-thickness:1px}
a.c-chain-row__v:hover{text-decoration-thickness:2px}
/* 链接盒只有一行字高，44 高的点击区由伪元素上下撑出，版面不动 */
a.c-chain-row__v::after{content:""; position:absolute; left:0; right:0; top:50%; height:44px; transform:translateY(-50%)}
.c-chain-row__s{color:var(--text-muted)}
/* 编号键（num，10-01 第 2 轮复核）：键栏出编号行同一个 .c-num（三语等宽 12 号），栏宽与栏距照编号行（编号 34，间距 32；平板 24），
   值的起点与同页编号行的名称对齐（Responsible AI 1440 为 186，原先键栏 130 时在 282）；手机照旧叠排，编号在值上面一行 */
.c-chain-row:has(> .c-num){grid-template-columns:var(--c-num-num) var(--c-chain-v) minmax(0,1fr)}
@media (max-width:1023px){
  .c-chain-row{grid-template-columns:var(--c-chain-k) minmax(0,1fr); row-gap:var(--space-4)}
  .c-chain-row__s{grid-column:2}
  .c-chain-row:has(> .c-num){grid-template-columns:var(--c-num-num) minmax(0,1fr); column-gap:var(--space-24)}
}
@media (min-width:768px) and (max-width:1023px){
  /* 平板键与值按首行基线对齐，说明在值下面；手机叠排另行处理。 */
  .c-chain-row{align-items:baseline}
}
@media (max-width:767px){
  .c-chain-row, .c-chain-row:has(> .c-num){grid-template-columns:minmax(0,1fr); gap:var(--space-2); align-items:start; padding-block:var(--space-12)}
  .c-chain-row__s{grid-column:auto}
  .c-chain-row:first-child{padding-top:0}
  .c-chain-row:last-child{padding-bottom:0}
  a.c-chain-row__v{z-index:1; padding:0 var(--space-2); margin:0 calc(-1 * var(--space-2))}
  a.c-chain-row__v:focus-visible{outline-offset:0}
}

/* ══════════ 能力领域行 · 59:8（1440）、184:631（390） ══════════ */
/* 栏头与行同一套三栏：第三栏栏头（cols-label）照旧；第二栏栏头（desc-label，排版方案 G8）写在第二栏上方，
   资料与权限表的「可見內容」、题目表的「適合對象」，可见与不可见靠文字栏名区分（架构 4.2） */
.c-dom-cols{padding:0 0 var(--space-12) calc(var(--c-dom-name) + var(--c-dom-desc) + var(--space-40) * 2); color:var(--text-subtle)}
/* 有第二栏栏头时从第二栏起排：第二栏栏头占第二栏宽加栏距（行内块，与第三栏栏头同一基线），第三栏栏头紧接在后，落在第三栏起点。
   栏头仍是一行文字（行高随正文 26），整块高度与只有第三栏栏头时相同（Figma 59:2） */
.c-dom-cols:has(> .c-dom-cols__desc){padding-left:calc(var(--c-dom-name) + var(--space-40))}
.c-dom-cols__desc{display:inline-block; width:calc(var(--c-dom-desc) + var(--space-40))}
/* 栏头与每行的栏名用同一个文案 key（句首大写 Shows up as）：英文页栏头照 Figma 59:2 转大写（SHOWS UP AS），
   平板与手机句前的栏名照 184:455、184:631 原样显示（Shows up as · …）。与产品行 .c-layer-cols 同一做法 */
html:lang(en) .c-dom-cols > span{text-transform:uppercase}
.c-dom{display:grid; grid-template-columns:var(--c-dom-name) var(--c-dom-desc) minmax(0,1fr); gap:var(--space-40);
  align-items:baseline; padding-block:var(--space-24); border-top:1px solid var(--border-subtle)}
.c-dom__nm{display:flex; flex-direction:column; gap:var(--space-4)}
.c-dom__name{color:var(--text-primary)}
.c-dom__zh{color:var(--text-subtle)}
.c-dom__desc{color:var(--text-body)}
.c-dom__shows{color:var(--text-muted)}
.c-dom__shows-label{color:var(--text-subtle)}
@media (max-width:1023px){
  .c-dom-cols{display:none}
  .c-dom{grid-template-columns:minmax(0,1fr); gap:var(--space-12); align-items:start}
  /* 说明一栏最宽 544（Figma 768 的 184:454 里说明文字 FILL、maxWidth 544）；手机 350 宽不受影响 */
  .c-dom__desc{max-width:var(--c-kv-v)}
  /* 窄屏栏名写在句前，维持 Small；成果与权限正文升为 Body 后，标签字号不随之放大。 */
  .c-dom__shows-label{position:static; width:auto; height:auto; margin:0; overflow:visible; clip-path:none; white-space:normal;
    font:400 var(--font-small)/var(--lh-small) var(--font-stack)}
  .c-dom__shows-label::after{content:" · "}
  /* 第二栏栏名（G8）同一写法，跟着说明这一句的字（Body）；中文页不换成标签的 14/21 */
  .c-dom__desc-label, html:lang(zh) .c-dom__desc-label{position:static; width:auto; height:auto; margin:0; overflow:visible; clip-path:none;
    white-space:normal; font:inherit; letter-spacing:inherit; color:var(--text-subtle)}
  .c-dom__desc-label::after{content:" · "}
}
@media (max-width:767px){
  .c-dom{padding-block:var(--space-16); gap:var(--space-8)}
  .c-dom:last-child{padding-bottom:0}
}

/* ══════════ 阶段卡 · Stage / * 59:47（1440）、184:669（390） ══════════ */
/* 卡头（编号、阶段名、英文页的中文名、状态章）、说明撑高、产出在卡底（上边线）；同一排卡底分隔线对齐。
   卡头包成一块（.c-stage__head），手机档 subgrid 只对齐卡头、说明、产出三行，不因为某张卡少一行中文名或状态章而错开 */
.c-stage{display:flex; flex-direction:column; min-width:0; background:var(--bg-canvas); border:1px solid var(--border-subtle);
  border-radius:var(--radius-card); padding:var(--space-16)}
.c-stage__head{display:flex; flex-direction:column; align-items:flex-start; min-width:0}
.c-stage__name{margin-top:var(--space-8); color:var(--text-primary); width:100%; overflow-wrap:anywhere}
/* 中文阶段名优先在标点、空格与 <wbr> 处折行（排版方案 G17），窄卡片不足时允许断行。 */
html:lang(zh) .c-stage__name{word-break:keep-all; overflow-wrap:anywhere}
.c-stage__zh{color:var(--text-subtle)}
/* 状态章（排版方案 G6）：阶段名下一行，沿用 x-chip。章永远一行（10-01 第 2 轮复核）：原先卡窄时章里的字折成两行，
   成了两行字的厚底色块，同一排有的卡章一行、有的两行，卡头高低不齐。卡放不下一整枚章时，由「卡片网格」一节把带章的阶段卡网格改少几列 */
.c-stage__chip{display:flex; margin-top:var(--space-8)}
.c-stage .c-chip{white-space:nowrap}
.c-stage__desc{flex:1; margin-top:var(--space-12); color:var(--text-muted)}
/* 说明前的卡内小标签（label，如「主要對象」）：单独一行，中文为 Small，英文为等宽 Caption。 */
.c-stage__label{display:block; margin-bottom:var(--space-4); color:var(--text-subtle)}
.c-stage__out{margin-top:var(--space-12); padding-top:var(--space-12); border-top:1px solid var(--border-subtle); color:var(--text-muted)}
@media (max-width:767px){
  /* 两列：用 subgrid 让同一行两张卡的分隔线对齐；说明与产出沿用 Body（2026-10-07 字号评审）。
     subgrid 只给带说明或产出的卡（排版方案 G14），按实际有几行跨几行：卡头、说明、产出三行，少一样少一行。
     只写编号与名称的卡按内容高，上下内距相同，不再跨空行（空行连同网格行距在卡底留下 30 至 43 的空白） */
  .l-grid > .c-stage:has(> .c-stage__desc, > .c-stage__out){display:grid; grid-row:span 2; grid-template-rows:subgrid; row-gap:0; align-content:start}
  .l-grid > .c-stage:has(> .c-stage__desc):has(> .c-stage__out){grid-row:span 3}
  .c-stage{padding:var(--space-12)}
  .c-stage__desc{margin-top:var(--space-8)}
  .c-stage__out{margin-top:var(--space-8); padding-top:var(--space-8)}
}

/* ══════════ 团队卡 · Person / * 55:8（1440）、184:160（390） ══════════ */
.c-person{display:flex; align-items:flex-start; gap:var(--space-16); background:var(--bg-canvas);
  border:1px solid var(--border-subtle); border-radius:var(--radius-card); padding:var(--space-24)}
.c-person__portrait{position:relative; flex:0 0 var(--c-portrait-w); width:var(--c-portrait-w); height:var(--c-portrait-h);
  border-radius:var(--radius-card); overflow:hidden; background:var(--bg-muted)}
.c-person__portrait img{width:100%; height:100%; object-fit:cover; display:block}
.c-person__txt{display:flex; flex-direction:column; flex:1; min-width:0; padding-top:var(--space-16)}
.c-person__name{color:var(--text-primary)}
/* 中文页姓名是「英文名 中文名」：中文名不在字间折开，只在空格处折行（旧页面同一写法） */
html:lang(zh) .c-person__name{word-break:keep-all; overflow-wrap:break-word}
.c-person__role{margin-top:var(--c-person-gap-role); color:var(--text-muted)}
@media (max-width:767px){
  .c-person{padding:var(--space-12)}
  .c-person__txt{padding-top:var(--space-8)}
}

/* ══════════ 研究条目 · Insights 条目 54:95（1440）、184:800（390） ══════════ */
.c-entry{display:grid; grid-template-columns:var(--c-entry-meta) minmax(0,1fr); gap:var(--space-40); padding-block:var(--space-32)}
.c-entry + .c-entry{border-top:1px solid var(--border-subtle)}
.c-entry__meta, .c-entry__body{display:flex; flex-direction:column; gap:var(--space-8)}
.c-entry__meta > span{color:var(--text-subtle)}
.c-entry__title{color:var(--text-primary); max-width:var(--c-entry-title)}
.c-entry__sum{color:var(--text-muted); max-width:var(--c-measure)}
@media (max-width:767px){
  .c-entry{grid-template-columns:minmax(0,1fr); gap:var(--space-8); padding-block:var(--space-24)}
  .c-entry__meta{flex-direction:row; gap:var(--space-12)}
  .c-entry:first-child{padding-top:0}
  .c-entry:last-child{padding-bottom:0}
}

/* ══════════ 联系渠道块 · 433:1118（1440）、184:271（390） ══════════ */
.c-channel, .c-channel__fields{display:flex; flex-direction:column; gap:var(--space-16)}
.c-channel__title{color:var(--text-primary)}
.c-channel__fields > .c-field{display:flex; flex-direction:column; align-items:flex-start; gap:var(--space-4)}
.c-channel .c-field__k{color:var(--text-muted)}
/* 锚点落点（10-01 第 2 轮复核，联络页报告缺组件第 3 条）：页脚与各页链到 contact.html#procurement 等渠道时，渠道名落在页眉下 64（手机 40），
   与区块的锚点落点（G19，.l-section[id]）一致，原先贴着页眉 */
.c-channel[id]{scroll-margin-top:calc(var(--nav-h) + env(safe-area-inset-top, 0px) + var(--l-anchor-y))}
@media (max-width:767px){
  /* 手机档渠道块有上内距 24（第一块没有），落点扣掉这一段，渠道名同样离页眉 40 */
  .c-channel[id]:not(:first-child){scroll-margin-top:calc(var(--nav-h) + env(safe-area-inset-top, 0px) + var(--l-anchor-y) - var(--space-24))}
}
@media (max-width:767px){
  /* 各块之间上边线，块内 12，块间 24 + 线 + 24 */
  .c-channel, .c-channel__fields{gap:var(--space-12)}
  .c-channel{padding-block:var(--space-24)}
  .c-channel + .c-channel{border-top:1px solid var(--border-subtle)}
  .c-channel:first-child{padding-top:0}
  .c-channel:last-child{padding-bottom:0}
}

/* ══════════ 法律条款段 · 53:71，同级页切换 · sibling pages 53:63 ══════════ */
.c-prose{display:flex; flex-direction:column; gap:var(--space-8)}
.c-prose + .c-prose{margin-top:var(--space-32)}
.c-prose__title{color:var(--text-primary)}
.c-prose__body{color:var(--text-body); max-width:var(--c-measure)}
/* 正文里的行内链接：上下内距 2 把点击高撑到 25（≥ 24），左右各借 2，版面不动 */
.c-prose__body a{text-underline-offset:var(--c-underline); padding:var(--space-2); margin-inline:calc(-1 * var(--space-2))}
.c-prose__body a:focus-visible{outline-offset:0}
.c-siblings{display:flex; flex-wrap:wrap; gap:var(--space-24)}
/* 每项点击框不小于 44 宽：左右各借 8（内距 8 配负外距 8，文字位置不动）；桌面 32 高，用负的上下外距收回一行字高 */
.c-siblings a{display:inline-flex; align-items:center; justify-content:center; padding-inline:var(--space-8); margin-inline:calc(-1 * var(--space-8));
  color:var(--text-muted); text-decoration:none}
.c-siblings a:hover{color:var(--text-primary)}
.c-siblings a[aria-current="page"]{color:var(--text-primary); font-weight:600}
@media (min-width:1024px){
  .c-siblings a{min-height:var(--space-32); margin-block:calc((var(--lh-small) - var(--space-32)) / 2)}
}
@media (max-width:1023px){
  .c-siblings{row-gap:0}
  .c-siblings a{min-height:44px}
}
@media (max-width:767px){
  .c-prose + .c-prose{margin-top:var(--space-24)}
  .c-siblings{gap:0 var(--space-16)}
  .c-siblings a{min-height:var(--space-32)}
}

/* 10-02 页内目录：复用同级导航结构，文字 16、持续下划线、点击区 44；法律同级导航照旧。 */
.c-siblings--sections{gap:0 var(--space-24)}
.c-siblings--sections a{font-size:var(--font-body); line-height:var(--lh-body); min-height:44px; margin-block:0;
  color:var(--text-body); text-decoration:underline; text-underline-offset:var(--c-underline); text-decoration-thickness:1px}
html:lang(zh) .c-siblings--sections a{line-height:var(--lh-cjk-body)}
@media (max-width:767px){ .c-siblings--sections{column-gap:var(--space-16)} }

/* ══════════ 版式 · 区块外框（P00：左右 margin-x、版心 container-max，上下内距各区块自带） ══════════ */
.l-wrap{max-width:calc(var(--container-max) + var(--margin-x) * 2); margin:0 auto; padding-inline:var(--margin-x)}
.l-section{--pt:var(--section-y); --pb:var(--section-y); --gap:var(--space-24); padding-block:var(--pt) var(--pb)}
.l-section > .l-wrap{display:flex; flex-direction:column; gap:var(--gap)}
.l-pt-section-y{--pt:var(--section-y)} .l-pt-96{--pt:var(--space-96)} .l-pt-80{--pt:var(--space-80)} .l-pt-64{--pt:var(--space-64)} .l-pt-0{--pt:0px}
.l-pb-section-y{--pb:var(--section-y)} .l-pb-96{--pb:var(--space-96)} .l-pb-80{--pb:var(--space-80)} .l-pb-64{--pb:var(--space-64)} .l-pb-40{--pb:var(--space-40)} .l-pb-0{--pb:0px}
.l-gap-16{--gap:var(--space-16)} .l-gap-24{--gap:var(--space-24)} .l-gap-32{--gap:var(--space-32)} .l-gap-40{--gap:var(--space-40)} .l-gap-48{--gap:var(--space-48)}
/* 色带（P06，Home 51:2）：bg/soft 底；fill 时撑满一屏（--l-fill-h）、内容纵向居中 */
.l-section--soft{background:var(--bg-soft)}
.l-section--fill{min-height:var(--l-fill-h); display:flex; align-items:center}
.l-section--fill > .l-wrap{width:100%}
/* 末段到页脚：与 site.css「末段到页脚」同一规则 */
main > .l-section:last-child{--pb:var(--section-y)}
/* 锚点落点（排版方案 G19，10-01 第 1 轮复核补）：跳到带 id 的区块时，区块的第一行（眉标或标题）落在页眉下 64（手机 40），
   不把整段上内距留在页眉下（原先 1440 眉标离视口顶 218）。原写在 css/page-partners.css，分页样式闸门不许写，收进组件，各页一样 */
.l-section[id]{scroll-margin-top:calc(var(--nav-h) + env(safe-area-inset-top, 0px) - var(--pt) + var(--l-anchor-y))}

/* 页首块（P02，About 52:13、What we do 54:13）：标题离页眉 96，眉标、H1、导语间距 24（联络与法务 16） */
.l-page-head .c-head__title{max-width:var(--c-title-max)}

/* 区块内分组（x-group，排版方案 G17）：组名（眉标，可带状态章）到内容 24；组与组、组与前后内容之间 64（手机 40）。
   区块外框的 gap 一律等距，分不开「组名到自己的表」与「组到组」，这里在 gap 之外补足差额（--l-group-y 减区块的 --gap） */
.l-group{display:flex; flex-direction:column; gap:var(--space-24); min-width:0}
.l-group__head{display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-8) var(--space-12)}
/* 表题沿用 Body L/SemiBold，独立于辅助眉标和字段标签；间距继续用既有刻度。 */
.c-table-title{color:var(--text-primary)}
.l-wrap > .l-group:not(:first-child), .l-wrap > .l-group + *{margin-top:calc(var(--l-group-y) - var(--gap))}
/* 编号行表自带组名（眉标与第 4 栏栏头同一行，企業 Challenge 流程）时，组名到行同样 24；手机档编号行表内部间距降到 16，这里不降 */
.l-group > .l-num-table--cols{gap:var(--space-24)}

/* 10-02 宣言分栏：标题导语与七条编号行使用原组件；正文末的收句保留在原阅读顺序。 */
.l-split{display:grid; grid-template-columns:var(--l-split-intro) minmax(0,1fr); gap:var(--space-64); align-items:start}
.l-split__intro, .l-split__body{display:flex; flex-direction:column; gap:var(--space-32); min-width:0}
@media (max-width:1279px){ .l-split{grid-template-columns:minmax(0,1fr); gap:var(--space-40)} }
@media (max-width:767px){ .l-split{gap:var(--space-24)} .l-split__body{gap:var(--space-24)} }
@media print{ .l-split{display:block} .l-split__body{margin-top:var(--space-24)} }

/* ══════════ 版式 · 首屏两栏配样例卡（P01，Home 3:13） ══════════ */
.l-hero{padding-block:var(--space-96) var(--space-80)}
.l-hero__in{display:grid; grid-template-columns:minmax(0,var(--l-hero-copy)) var(--l-hero-card); gap:var(--space-80);
  justify-content:space-between; align-items:start}
.l-hero--single .l-hero__in{grid-template-columns:minmax(0,1fr)}
.l-hero__copy{display:flex; flex-direction:column; gap:var(--space-24); min-width:0}
.l-hero__title{color:var(--brand-solid)}
/* en-title="h1"（排版方案 G11）：英文首屏标题太长（首页 93 个字符），1440 用 Display 72 折六行、实心按钮落到第一屏外，三档都改用 H1 字号。
   Figma 首屏是 Display，README「与 Figma 仍有差异之处」登记；中文页不受影响 */
html:lang(en) .l-hero--en-h1 .l-hero__title{font-size:var(--font-h1); line-height:var(--lh-h1)}
.l-hero__lead{color:var(--text-muted); max-width:var(--c-measure)}
html:lang(zh) .l-hero__lead{max-width:var(--c-measure-zh)}
.l-hero__cta{display:flex; flex-wrap:wrap; gap:var(--space-12); padding-top:var(--space-8)}
@media (max-width:1439px){ .l-hero__in{grid-template-columns:minmax(0,1fr) var(--l-hero-card)} }
/* 2026-10-02 UI 评审：固定卡宽挤压 1024 至 1279 的标题，提前改成单栏；1280 起沿用两栏。 */
@media (max-width:1279px){
  .l-hero__in{grid-template-columns:minmax(0,1fr); gap:var(--space-48)}
  .l-hero__copy{max-width:var(--c-brief-w)}
  .l-hero__in > .c-card{width:100%; max-width:var(--c-brief-w)}
}
@media (max-width:767px){
  .l-hero{padding-block:var(--space-40) 0}
  .l-hero__in{gap:var(--space-24)}
  .l-hero__copy{gap:var(--space-16)}
  .l-hero__cta{flex-direction:column; align-items:stretch; gap:var(--space-4)}
}

/* ══════════ 版式 · 五步：步名配作品卡（P03，Home 47:2） ══════════ */
.l-steps{display:flex; flex-direction:column; gap:var(--space-48)}
.l-step{display:grid; grid-template-columns:minmax(0,var(--l-step-name)) minmax(0,var(--l-step-card)); justify-content:space-between;
  gap:var(--space-32); align-items:start}
.l-step__text{display:flex; flex-direction:column; gap:var(--space-12)}
.l-step__name{color:var(--text-primary)}
.l-step__desc{color:var(--text-muted)}
@media (max-width:1023px){ .l-step{grid-template-columns:minmax(0,1fr); gap:var(--space-24)} }
@media (max-width:767px){
  /* 步与步 32，步名离自己的卡 12，读得出步名是这张卡的标题 */
  .l-steps{gap:var(--space-32)}
  .l-step{gap:var(--space-12)}
  .l-step__text{gap:var(--space-8)}
}

/* ══════════ 版式 · 产品行（P04，Home 382:1130） ══════════ */
.l-products{display:flex; flex-direction:column; gap:var(--space-16)}
@media (max-width:767px){ .l-products{gap:var(--space-40)} }

/* ══════════ 版式 · 四栏行式表（P05，命名阶梯 57:60） ══════════ */
.l-num-table{display:flex; flex-direction:column; gap:var(--space-24); padding-top:var(--space-24); border-top:1px solid var(--border-subtle)}
.l-num-table--bare{padding-top:0; border-top:0}
.l-num-table__intro{color:var(--text-muted); max-width:var(--c-measure)}
@media (max-width:767px){ .l-num-table{gap:var(--space-16)} }

/* ══════════ 版式 · 收尾色带配按钮（P07，Home 386:3037） ══════════ */
.l-closing{background:var(--brand-solid); padding-block:var(--space-64)}
.l-closing > .l-wrap{display:flex; flex-direction:column; align-items:flex-start; gap:var(--space-24)}
.l-closing__title{color:var(--text-on-brand-solid)}
/* 色带底色与 focus-ring 同为 olive/900，焦点框改用标题的白色 */
.l-closing :focus-visible{outline-color:var(--text-on-brand-solid)}
@media (max-width:767px){ .l-closing{padding-block:var(--space-48)} }

/* ══════════ 版式 · 卡片网格（P09 团队 55:2 三列、P14 阶段 59:41 六列） ══════════ */
.l-grid{display:grid; grid-template-columns:repeat(var(--l-cols), minmax(0,1fr)); gap:var(--space-16); align-items:stretch}
.l-grid--2{--l-cols:2} .l-grid--3{--l-cols:3} .l-grid--4{--l-cols:4}
.l-grid--6{--l-cols:6; gap:var(--space-12)}
.l-grid--3 > .c-person{align-self:start}
@media (max-width:1023px){ .l-grid--3, .l-grid--4{--l-cols:2} .l-grid--6{--l-cols:3} }
@media (max-width:767px){ .l-grid{gap:var(--space-12)} .l-grid--2, .l-grid--3{--l-cols:1} .l-grid--4, .l-grid--6{--l-cols:2} }
/* 团队卡三列在 1024 至 1279 太挤（文字栏只剩约 80 至 170 宽，英文职衔一词一行），这一档排两列，与平板档同一排法 */
@media (min-width:1024px) and (max-width:1279px){ .l-grid--3:has(> .c-person){--l-cols:2} }
/* 四阶段架构卡保留原有阅读宽度：2026-10-08 撤去状态章后，响应式排列按阶段卡本身判断。
   1024 至 1279 两列，767 以下一列，1280 以上四列、768 至 1023 两列。 */
@media (min-width:1024px) and (max-width:1279px){ .l-grid--4:has(> .c-stage){--l-cols:2} }
@media (max-width:767px){ .l-grid--4:has(> .c-stage){--l-cols:1} }
/* 并排的样例卡（示例任务三张，排版方案 G18）：1280 起三栏；1279 以下一栏，卡宽照 Figma 768 样例卡 181:38（--c-brief-w，704），
   不再在 768 排成两栏、第三张独占一行，也不在 1024 挤成三张约 305 宽的窄卡 */
@media (max-width:1279px){
  .l-grid:has(> .c-brief){--l-cols:1}
  .l-grid > .c-brief{max-width:var(--c-brief-w)}
}
/* 三张并排时（1280 起）卡头、卡身、卡底用 subgrid 对齐，同一排卡头一样高（10-01 第 2 轮复核）：卡头放章后，英文有的卡章换到第二行、
   有的不换，卡头高低不齐。较矮的卡头照网格行高拉齐，标签行贴卡头上内距，三张卡的标签在同一条线上 */
@media (min-width:1280px){
  .l-grid > .c-brief{display:grid; grid-row:span 2; grid-template-rows:subgrid; row-gap:0}
  .l-grid > .c-brief > .c-card__head{align-content:flex-start}
  .l-grid > .c-brief:has(> .c-card__foot){grid-row:span 3}
}

/* ══════════ 版式 · 部件详述：标题栏配事实表（P12，What we do 54:17） ══════════ */
.l-parts{display:flex; flex-direction:column}
.l-part{display:grid; grid-template-columns:var(--l-part-title) var(--l-part-detail); justify-content:space-between; gap:var(--space-64);
  padding-block:var(--space-48)}
.l-part + .l-part{border-top:1px solid var(--border-subtle)}
.l-part__title{display:flex; flex-direction:column; align-items:flex-start; gap:var(--space-12)}
/* 名称与副题（sub，排版方案 G7）包成一块，副题紧跟名称（4），不占标题栏的 12 间距 */
.l-part__nm{display:flex; flex-direction:column; gap:var(--space-4)}
.l-part__name{color:var(--text-primary)}
.l-part__sub{color:var(--text-muted)}
.l-part__detail{display:flex; flex-direction:column; gap:var(--space-24); min-width:0}
.l-part__lead{color:var(--text-body); max-width:var(--c-measure)}
html:lang(zh) .l-part__lead{max-width:var(--c-measure-zh)}
@media (max-width:1023px){ .l-part{grid-template-columns:minmax(0,1fr); gap:var(--space-24)} }
@media (max-width:767px){
  .l-part{padding-block:var(--space-24); gap:var(--space-12)}
  .l-part:first-child{padding-top:0}
  .l-part:last-child{padding-bottom:0}
  .l-part__title{gap:var(--space-8)}
  .l-part__detail{gap:var(--space-16)}
}

/* ══════════ 版式 · 联系渠道三栏（P16，Contact 53:17） ══════════ */
.l-channels{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-48); align-items:start}
@media (max-width:1023px){ .l-channels{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:767px){ .l-channels{grid-template-columns:minmax(0,1fr); gap:0} }

/* ══════════ 版式 · 法律页（P17，Legal 53:48 等六块） ══════════ */
.l-legal{--pt:var(--space-96); --pb:var(--space-96); --gap:0px}
.l-legal .c-head{padding-bottom:var(--space-40)}
.l-legal .c-head__meta{color:var(--text-muted)}
.l-legal .c-siblings{padding-bottom:var(--space-40)}
.l-legal + .l-legal{border-top:1px solid var(--border-subtle)}
/* 可打印的素档区块（联络、法务、公司资料、团队）文字不低于 7:1：text/subtle 换成 text/muted（site.css 同一规则） */
.l-print-safe, .l-legal{--text-subtle:var(--text-muted)}

/* ══════════ 手机档区块节奏（放在最后，压过上面各档的 l-pt-*、l-pb-*、l-gap-*） ══════════ */
@media (max-width:767px){
  /* 每个区块上内距 section-y（64）、下内距 0，交界只留一次；紧跟页首、没有自己标题的区块（follow）离上一块 40 */
  .l-section{--pt:var(--section-y); --pb:0px; --gap:var(--space-16)}
  /* 组件内部间距降一档：48、40→32，24→16；32 不变（团队、阶段卡的标题到卡片，Figma 184:154、184:663 仍是 32） */
  .l-gap-48, .l-gap-40, .l-gap-32{--gap:var(--space-32)}
  .l-gap-24{--gap:var(--space-16)}
  /* 只有眉标、没有标题的区块（公司资料、分工）：眉标到表、表到注记保持 24（Figma 184:127、214:734） */
  .l-gap-24:has(> .l-wrap > .c-head:first-child > .c-eyebrow:only-child){--gap:var(--space-24)}
  .l-section--follow{--pt:var(--space-40)}
  .l-page-head{--pt:var(--space-40)}
  /* 色带内外各 48，不撑满一屏：色带上面那一块下内距 48（Figma 183:104 的 64/20/48/20） */
  .l-section--soft{--pt:var(--space-48); --pb:var(--space-48); min-height:0}
  /* 收尾橄榄色带（P07）前面接普通区块时（首页入口块）同样留 48，不然末行文字贴着色带 */
  .l-section:has(+ .l-section--soft), .l-section:has(+ .l-closing){--pb:var(--space-48)}
  .l-legal{--pt:var(--space-32); --pb:var(--space-32); --gap:0px}
  .l-legal:first-child{--pt:var(--space-40)}
  .l-legal .c-head{padding-bottom:var(--space-24)}
  .l-legal .c-siblings{padding-bottom:var(--space-24)}
  .l-legal .c-head__meta{font-size:var(--font-caption); line-height:var(--lh-caption)}
  main > .l-section:last-child{--pb:0px}
}
@media (max-height:500px) and (orientation:landscape) and (max-width:1023px){
  .l-hero{padding-top:var(--space-40)}
  .l-page-head, .l-legal:first-child{--pt:var(--space-40)}
  .l-hero__cta, .c-card__foot{flex-direction:row; align-items:center}
}

/* ══════════ 打印 ══════════ */
@media print{
  .l-section{padding-block:min(var(--pt), var(--space-48)) min(var(--pb), var(--space-48))}
  .l-section--soft{background:none}
  .l-section--fill{min-height:0; display:block}
  .l-closing{background:none; border-top:1px solid var(--border-subtle); break-inside:avoid}
  .l-closing__title{color:var(--text-primary)}
  .c-btn--primary{background:none; color:var(--text-primary); border-color:currentColor}
  .l-hero__in{display:block}
  .l-hero__in > .c-card{margin-top:var(--space-48)}
  .c-head, .l-part__title, .c-artifact__head, .l-group__head, .c-num-cols{break-after:avoid}
  .c-head, .l-part__title, .c-layer, .c-dom, .c-entry, .c-num-row, .c-chain-row, .c-field, .c-person, .c-card__foot, .l-step, .c-stage{break-inside:avoid}
  /* 公司资料表连同核对日期整块不拆；引导段后面紧接卡片网格时不在两者之间分页（About A4 实测，10-01 补） */
  .c-kv--facts{break-inside:avoid}
  .c-kv--facts + .c-note, .c-para + .l-grid{break-before:avoid}
  .c-siblings{display:none}
  .c-ticks > i{-webkit-print-color-adjust:exact; print-color-adjust:exact}
}
/* 联系渠道三栏（P16）打印：纸面按整张 A4 宽（794）算落在平板档，平板档的两栏折行会把页首连同三栏推到第二页，第一页只剩页眉字标（10-01 实测）。
   纸面平板档起排三栏，页首与三栏在 A4 第一页放完；手机档纸面（对话框自设页边距，673 宽）照一栏打印。原写在 css/page-contact.css，10-01 收进组件 */
@media print and (min-width:768px){
  .l-channels{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* ══════════ 页面样式 · css/page-home.css ══════════ */
/* 首页（templates/home.html）自己的样式。2026-10-01 按组件重做后没有规则：排位、间距、字号、手机档全部由 css/components.css 的组件与版式管。
   原来写在这里的首屏单栏、产品摘要卡、收尾反白入口与英文首屏标题手机档字号，已分别由 x-hero、x-products、x-kv kind="links"、
   x-hero en-title="h1" 接替。以后真要加，只许写排位（栅格与弹性盒的列、行、对齐、顺序、显示与隐藏，间距只用 token），
   选择器带 .pg-home；build.py 的分页样式闸门（--strict-pages）逐条查。 */

/* ══════════ 页面样式 · css/page-what-we-do.css ══════════ */
/* 我們做甚麼（templates/what-we-do.html）自己的样式。2026-10-01 按组件重做后没有规则：排位、间距、字号、手机档全部由 css/components.css 的组件与版式管。
   原来写在这里的两产品对照表、五步卡、大号流程链、成果形式小标签与科学设计列头，已分别由整体架构的阶段卡与部件详述（x-grid、x-stage、x-parts）、
   方法三部件（x-part）、投入来源小卡（x-stage）、三栏行（x-domains）与两栏行（x-kv kind="who"）接替。以后真要加，只许写排位（栅格与弹性盒的列、行、
   对齐、顺序、显示与隐藏，间距只用 token），选择器带 .pg-what-we-do；build.py 的分页样式闸门（--strict-pages）逐条查。 */

/* ══════════ 页面样式 · css/page-responsible-ai.css ══════════ */
/* Responsible AI（templates/responsible-ai.html）自己的样式。2026-10-01 按组件重做后没有规则：排位、间距、字号、手机档全部由 css/components.css 的组件与版式管。
   原来写在这里的素档换色、七项承诺编号、示例引文、要点列表、两张表与段末链接，已分别由 x-section print-safe、x-parts 与 x-part、x-para、
   x-num-table、x-kv kind="who"、x-domains 接替。以后真要加，只许写排位（栅格与弹性盒的列、行、对齐、顺序、显示与隐藏，间距只用 token），
   选择器带 .pg-responsible-ai；build.py 的分页样式闸门（--strict-pages）逐条查。 */

/* ══════════ 页面样式 · css/page-partners.css ══════════ */
/* 合作伙伴（templates/partners.html）自己的样式。2026-10-01 按组件重做后没有规则：排位、间距、字号、手机档全部由 css/components.css 的组件与版式管。
   原来写在这里的页首跳转行、回报表与流程的列头、竖排流程、四栏题目表、段内分组间距与锚点落点，已分别由 x-sibling-nav、x-kv kind="who"、
   x-num-table、x-domains 与紧跟的 x-section（follow，pt="64"，gap="24"）接替；流程与题目表的栏头等 G8、G9 补进组件后再上页面。
   以后真要加，只许写排位（栅格与弹性盒的列、行、对齐、顺序、显示与隐藏，间距只用 token），选择器带 .pg-partners；
   build.py 的分页样式闸门（--strict-pages）逐条查。 */

/* ══════════ 页面样式 · css/page-about.css ══════════ */
/* 關於我們（templates/about.html）自己的样式。2026-10-01 按组件重做后没有规则：字号、颜色、间距、手机档留白全部由 css/components.css 的组件与版式管。
   原来写在这里的使命句大字、六节点流程链（带箭头）、五问与六条要点列表、各段留白与打印分页，已分别由 x-section-head 的内容槽、
   x-grid 加 x-stage、x-num-table 加 x-num-row、x-section 的 pt、pb、gap 与组件自带的打印规则接替。
   10-01 第 1 轮复核：原留的两条排位也收进组件，这里清空。1024 至 1279 团队卡排两列改由 components.css 的 .l-grid--3:has(> .c-person) 管；
   手机档只写编号与名称的阶段卡按内容高（排版方案 G14），不再在页面里写 grid-row:span 2。
   以后真要加，只许写排位（栅格与弹性盒的列、行、对齐、顺序、显示与隐藏，间距只用 token），选择器带 .pg-about；
   build.py 的分页样式闸门逐条查（10-01 起默认打开）。 */

/* ══════════ 页面样式 · css/page-contact.css ══════════ */
/* 聯絡我們（templates/contact.html）自己的样式。2026-10-01 按组件重做后没有规则：屏幕上的排位、间距、字号与手机档全部由 css/components.css 的
   x-page-head、x-section、x-channels、x-channel、x-link 管。
   原来写在这里的素档 7:1（页首眉标换 text/muted）、邮箱链接样式与 44 点击区，分别由 x-page-head tone="muted"、x-section print-safe、
   x-link（排版方案 G3）接替；桌面三栏顶线、链入那一栏的 2px 品牌色标记与锚点多让 24，旧设计与 Figma 都没有，随重做撤下。
   10-01 第 1 轮复核：打印时纸面平板档排三栏（页首与三栏在 A4 第一页放完）一条收进 components.css 的 P16 打印规则，这里清空。
   以后要加，只许写排位（栅格与弹性盒的列、行、对齐、顺序、显示与隐藏，间距只用 token），选择器带 .pg-contact；
   build.py 的分页样式闸门逐条查（10-01 起默认打开）。 */

/* ══════════ 页面样式 · css/page-legal.css ══════════ */
/* 法律資訊（templates/legal.html）自己的样式。2026-10-01 按组件重做后没有规则：六份文件的外框、节与节之间的描边、素档 7:1、
   同级页切换（桌面 32 高、平板 44 高、手机 32 高，宽不小于 44）、条款段与正文行内链接的点击区、手机档内距与打印，全部由
   css/components.css 的 x-legal、x-sibling-nav、x-prose、x-link 管（版式 P17）。09-30 第 1 轮复核已把原写在这里的点击框提进 site.css，
   这次随组件接替一并不再依赖。以后真要加，只许写排位（栅格与弹性盒的列、行、对齐、顺序、显示与隐藏，间距只用 token），
   选择器带 .pg-legal；build.py 的分页样式闸门（--strict-pages）逐条查。 */

/* ══════════ 页面样式 · css/page-404.css ══════════ */
/* 404（templates/404.html）自己的样式。2026-10-01 按组件重做后没有规则：页首、回首页的一条链接（x-more）、另两种语言的入口行
   （x-kv kind="links" 加 x-link-row，带 hreflang）与各自 44 高的点击区全部由 css/components.css 管。
   原来写在这里的另两种语言横排与 min-height:44px 已随组件接替撤下。以后真要加，只许写排位（栅格与弹性盒的列、行、对齐、顺序、
   显示与隐藏，间距只用 token），选择器带 .pg-404；build.py 的分页样式闸门逐条查（10-01 起默认打开）。 */