/* ==========================================================================
   Zeus Insights · 主站 v3 · pages.css
   二级页（方案、AI、案例、关于我们）的桌面版版面。变量、排版、按钮在 base.css；页脚、问答、收尾在 desktop.css。
   与首页同一套语言：暖纸、白、暖黑三种底；两段式细体标题；等宽小标签带红点；发丝线；整圆标记，当前一项圆心为红点。
   尺寸用 rem（随根字号随视口变化）；媒体查询用像素。
   ========================================================================== */

/* ---------- 二级页首屏 ----------
   左：小标签、两行标题、一句引文、两枚按钮。右：一幅随页面而定的图形。背景一层焦点环（擦开文字所在的矩形）。 */
.sec.phero { overflow: clip; padding-block: clamp(3.5rem, 9vh, 6.5rem) clamp(3.5rem, 9vh, 6rem); border-bottom: 1px solid var(--line); }
.phero__in { position: relative; display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(0, .82fr); column-gap: var(--s-16); align-items: center; min-height: min(58vh, 34rem); }
.phero__h { margin-top: var(--s-6); max-width: 15em; }
.phero__h .ln { white-space: nowrap; }
.phero__lead { margin-top: var(--s-8); max-width: 31em; }
.phero__cta { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: var(--s-10); }
.phero__fig { position: relative; justify-self: end; width: min(100%, 30rem); aspect-ratio: 1; }
.phero__canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.phero__facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: var(--s-16); border-top: 1px solid var(--line-strong); }
.phero__facts > div { padding: var(--s-5) var(--s-6) 0 0; }
.phero__facts dt { font-size: var(--t-micro); color: var(--ink-subtle); }
.phero__facts dd { margin: .25rem 0 0; font-size: var(--t-h3); line-height: 1.3; letter-spacing: -0.015em; }

/* 区块标题：小标签加两段式标题，可带一句引文 */
.shead { max-width: 62rem; }
.shead .h-2 { margin-top: var(--s-5); }
.shead__lead { margin-top: var(--s-6); max-width: 36em; }

/* ---------- 方案 · 四类系统 ----------
   两行两列的卡片：上半是真实界面（装在浏览器窗口里）或一幅焦点环图，下半是类别、标题、三条要点、AI 的位置与参考产品。 */
.kinds__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-4); margin-top: var(--s-16); }
.kind { display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: var(--r-3); overflow: hidden; scroll-margin-top: calc(var(--hdr-h) + 1rem);
  transition: border-color var(--d-2) var(--e-out), transform var(--d-3) var(--e-out), box-shadow var(--d-3) var(--e-out); }
.kind:hover { border-color: var(--line-strong); transform: translateY(-.1875rem); box-shadow: 0 1.375rem 2.5rem -1.75rem rgba(25, 24, 23, .4); }
.kind__fig { position: relative; height: 19rem; overflow: hidden; background: var(--c-paper); border-bottom: 1px solid var(--line); }
.kind__shot { position: absolute; inset: 1.75rem 1.75rem 0; display: flex; justify-content: center; align-items: flex-start; }
.kind__win { width: 100%; border-radius: .625rem .625rem 0 0; overflow: hidden; border: 1px solid rgba(25, 24, 23, .14); border-bottom: 0; background: var(--c-white); box-shadow: 0 1.5rem 3rem -1.75rem rgba(25, 24, 23, .45);
  transition: transform var(--d-4) var(--e-out); }
.kind__win img { width: 100%; height: auto; }
.kind:hover .kind__win { transform: translateY(-.5rem); }
.kind__shot--tall img { width: 15rem; height: auto; align-self: flex-start; border-radius: .625rem .625rem 0 0; border: 1px solid rgba(25, 24, 23, .14); box-shadow: 0 1.5rem 3rem -1.75rem rgba(25, 24, 23, .45); transition: transform var(--d-4) var(--e-out); }
.kind:hover .kind__shot--tall img { transform: translateY(-.5rem); }
.kind__scene { position: absolute; inset: 0; }
.kind__scene canvas { width: 100%; height: 100%; }
.pdev__bar { display: flex; align-items: center; gap: .375rem; height: 1.875rem; padding: 0 .75rem; background: #FAF8F5; border-bottom: 1px solid #E9E5DE; }
.pdev__bar i { width: .5rem; height: .5rem; border-radius: 50%; border: 1px solid #BDB7AC; }
.kind__txt { display: flex; flex-direction: column; flex: 1; padding: var(--s-6) var(--s-8) var(--s-8); }
.kind__cat { display: flex; align-items: baseline; gap: .75rem; font-size: var(--t-label); color: var(--ink-muted); font-family: var(--f-mono); }
.kind__n { color: var(--ink-subtle); }
.kind__h { margin-top: var(--s-3); font-size: 1.75rem; line-height: 1.2; font-weight: 400; letter-spacing: -0.025em; text-wrap: balance; }
.kind__pts { margin-top: var(--s-5); display: grid; row-gap: .5rem; }
.kind__pts li { position: relative; padding-left: 1.5rem; font-size: var(--t-body); line-height: 1.45; color: var(--ink); }
.kind__pts li::before { content: ""; position: absolute; left: 0; top: .5em; width: .5625rem; height: .5625rem; border-radius: 50%; border: 1px solid var(--ink-subtle); }
.kind__ai { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: .875rem; align-items: baseline; margin-top: var(--s-6); padding-top: var(--s-5); border-top: 1px solid var(--line); font-size: var(--t-small); line-height: 1.5; color: var(--ink-muted); }
.kind__lab { font-size: var(--t-micro); color: var(--ink-subtle); white-space: nowrap; }
.kind__ai .kind__lab::before { content: ""; display: inline-block; width: .4375rem; height: .4375rem; margin-right: .5rem; border-radius: 50%; background: var(--accent); vertical-align: .08em; }
.kind__refs { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin-top: auto; padding-top: var(--s-5); }
.kind__refs .kind__lab { margin-right: .25rem; }
.kind__note { font-size: var(--t-small); color: var(--ink-muted); }
.ref { display: inline-flex; align-items: center; gap: .5rem; padding: .3125rem .75rem .3125rem .3125rem; border: 1px solid var(--line); border-radius: var(--r-pill); font-size: var(--t-label); font-weight: 500; color: var(--ink); text-decoration: none; transition: border-color var(--d-2) var(--e-out), background var(--d-2) var(--e-out); }
.ref:hover { border-color: var(--ink); background: var(--surface-2); }
.ref img { width: 1.5rem; height: 1.5rem; }
.kinds__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s-4) var(--s-8); margin-top: var(--s-10); padding-top: var(--s-6); border-top: 1px solid var(--line-strong); font-size: var(--t-lead); color: var(--ink-muted); }
.kinds__foot .link { font-size: var(--t-body); color: var(--ink); }

/* ---------- 方案 · 五项职能 ----------
   一条发丝线串起五枚环，随滚动由左到右走完；走到的一枚填实，当前一枚圆心为红点。 */
.proc__track { position: relative; margin-top: var(--s-16); }
.proc__line { position: absolute; left: .59rem; right: 0; top: .59rem; height: 1px; background: var(--line-strong); }
.proc__line i { display: block; height: 2px; margin-top: -.5px; background: var(--ink); transform-origin: 0 50%; transform: scaleX(var(--p, 0)); }
.proc__list { position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); column-gap: var(--s-6); }
.proc__ring { position: relative; display: block; width: 1.1875rem; height: 1.1875rem; border-radius: 50%; border: 1px solid var(--line-strong); background: var(--surface); transition: border-color var(--d-2) var(--e-out), background var(--d-2) var(--e-out); }
.proc__ring::after { content: ""; position: absolute; inset: 0; margin: auto; width: .4375rem; height: .4375rem; border-radius: 50%; background: var(--c-red); transform: scale(0); transition: transform var(--d-3) var(--e-spring); }
.proc__i.is-done .proc__ring { background: var(--ink); border-color: var(--ink); }
.proc__i.is-cur .proc__ring { border: 2px solid var(--ink); background: var(--surface); }
.proc__i.is-cur .proc__ring::after { transform: scale(1); }
.proc__k { display: flex; align-items: baseline; gap: .625rem; margin-top: var(--s-6); font-size: 1.375rem; line-height: 1.2; font-weight: 500; letter-spacing: -0.02em; }
.proc__k .mono { font-size: var(--t-micro); font-weight: 400; color: var(--ink-subtle); }
.proc__p { margin-top: var(--s-4); font-size: var(--t-body); line-height: 1.55; color: var(--ink-muted); text-wrap: pretty; }
.proc__get { margin-top: var(--s-5); padding-top: var(--s-4); border-top: 1px solid var(--line); font-size: var(--t-small); line-height: 1.45; color: var(--ink); font-weight: 500; }
.proc__get .mono { display: block; margin-bottom: .25rem; font-size: var(--t-micro); font-weight: 400; color: var(--ink-subtle); }
.proc__i { opacity: .38; transition: opacity var(--d-3) var(--e-out); }
.proc__i.is-done, .proc__i.is-cur { opacity: 1; }
.proc__fine { display: grid; grid-template-columns: .875rem minmax(0, 1fr); column-gap: .625rem; max-width: 40rem; margin-top: var(--s-12); color: var(--ink-muted); }
.proc__fine::before { content: ""; width: .4375rem; height: .4375rem; margin-top: .4375rem; border-radius: 50%; border: 1px solid var(--ink-subtle); }
:is(html.rm, html:not(.js)) .proc__i { opacity: 1; }

/* ---------- 方案 · 上线评估与上线冲刺（深色） ---------- */
.review { overflow: clip; }
.review__cards { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: var(--s-4); margin-top: var(--s-16); background: none; align-items: start; }
.rcard { position: relative; padding: var(--s-8) var(--s-8) var(--s-10); border: 1px solid var(--line-strong); border-radius: var(--r-3); background: rgba(36, 34, 31, .82); backdrop-filter: blur(6px); }
.rcard__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .5rem 1.5rem; padding-bottom: var(--s-5); border-bottom: 1px solid var(--line); }
.rcard__k { font-family: var(--f-serif); font-weight: 300; font-size: 2.25rem; line-height: 1.1; letter-spacing: -0.02em; }
.rcard__terms { font-size: var(--t-label); color: var(--accent-text); }
.rcard__p { margin-top: var(--s-6); font-size: var(--t-lead); line-height: 1.5; color: var(--ink); text-wrap: pretty; }
.rcard__lh { margin-top: var(--s-8); font-size: var(--t-micro); color: var(--ink-subtle); }
.rcard__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .5rem; margin-top: var(--s-3); }
.rcard__list li { display: flex; align-items: center; gap: .5rem; min-height: 2.75rem; padding: .375rem .75rem; border: 1px solid var(--line); border-radius: var(--r-2); font-size: var(--t-label); line-height: 1.25; color: var(--ink); }
.rcard__list svg { flex: none; color: var(--ink-subtle); }
.rcard__list li.is-new { border-color: rgba(255, 86, 64, .55); }
.rcard__list li.is-new svg { color: var(--accent); }
.rcard__note { margin-top: var(--s-3); font-size: var(--t-small); line-height: 1.5; color: var(--ink-muted); }
.rcard__get { margin-top: var(--s-3); display: grid; row-gap: .125rem; }
.rcard__get li { position: relative; padding: .5rem 0 .5rem 1.5rem; border-bottom: 1px solid var(--line); font-size: var(--t-body); line-height: 1.45; color: var(--ink-muted); }
.rcard__get li::before { content: ""; position: absolute; left: 0; top: 1em; width: .5625rem; height: .5625rem; border-radius: 50%; border: 1px solid var(--ink-subtle); }

/* ---------- 方案 · 合作方式 ---------- */
.terms__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: var(--s-6); margin-top: var(--s-16); }
.term { position: relative; padding-top: var(--s-6); border-top: 1px solid var(--line-strong); }
.term__ring { position: absolute; top: -.59rem; left: 0; width: 1.1875rem; height: 1.1875rem; border-radius: 50%; border: 2px solid var(--ink); background: var(--surface); }
.term__ring i { position: absolute; inset: 0; margin: auto; width: .4375rem; height: .4375rem; border-radius: 50%; background: var(--c-red); transform: scale(0); transition: transform var(--d-3) var(--e-spring); }
.term:hover .term__ring i, .term.is-in .term__ring i { transform: scale(1); }
.term__n { font-size: var(--t-micro); color: var(--ink-subtle); margin-top: var(--s-2); }
.term__k { margin-top: var(--s-3); font-size: var(--t-h3); line-height: 1.25; font-weight: 500; letter-spacing: -0.02em; }
.term__p { margin-top: var(--s-3); font-size: var(--t-body); line-height: 1.55; color: var(--ink-muted); }
.terms__faq { display: grid; grid-template-columns: minmax(0, 18rem) minmax(0, 1fr); column-gap: var(--s-12); margin-top: var(--s-20); align-items: start; }
.terms__faqh { font-size: var(--t-h3); line-height: 1.25; font-weight: 500; letter-spacing: -0.02em; padding-top: 1.375rem; }

/* ---------- AI · 变化，与两行反向走的任务字样 ---------- */
.shift { overflow: clip; }
.shift__in { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); column-gap: var(--s-16); align-items: start; }
.shift__p { display: grid; row-gap: var(--s-5); padding-top: 2.75rem; }
.mq { margin-top: var(--s-20); display: grid; row-gap: var(--s-3); -webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); }
.mq__row { overflow: hidden; }
.mq__track { display: flex; align-items: center; gap: 1.5rem; width: max-content; animation: mq 60s linear infinite; }
.mq__row--rev .mq__track { animation-direction: reverse; animation-duration: 72s; }
.mq__track span { font-family: var(--f-serif); font-weight: 300; font-size: clamp(2rem, 3.6vw, 3.25rem); line-height: 1.2; letter-spacing: -0.02em; white-space: nowrap; color: var(--ink); }
.mq__row--rev .mq__track span { font-family: var(--f-sans); font-weight: 350; letter-spacing: -0.04em; color: var(--ink-muted); }
.mq__track i { width: .625rem; height: .625rem; border-radius: 50%; border: 1px solid var(--ink-subtle); flex: none; }
.mq__track span:nth-of-type(3n+2) + i { background: var(--c-red); border-color: var(--c-red); }
@keyframes mq { to { transform: translateX(-50%); } }
.mq.is-paused .mq__track { animation-play-state: paused; }
:is(html.rm) .mq__track { animation: none; }

/* ---------- AI · 四个朴素的问题 ---------- */
.qs__in { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); column-gap: var(--s-16); align-items: start; }
.qs__list { grid-row: span 2; border-top: 1px solid var(--line-strong); }
.qs__i { display: grid; grid-template-columns: 2.5rem minmax(0, 1fr); align-items: center; padding: 1.5rem 0; border-bottom: 1px solid var(--line); font-family: var(--f-serif); font-weight: 300; font-size: clamp(1.75rem, 2.6vw, 2.4rem); line-height: 1.2; letter-spacing: -0.02em; color: var(--ink-subtle); transition: color var(--d-3) var(--e-out); cursor: default; }
.qs__ring { position: relative; width: 1.1875rem; height: 1.1875rem; border-radius: 50%; border: 1px solid var(--line-strong); transition: border-color var(--d-2) var(--e-out); }
.qs__ring::after { content: ""; position: absolute; inset: 0; margin: auto; width: .4375rem; height: .4375rem; border-radius: 50%; background: var(--c-red); transform: scale(0); transition: transform var(--d-3) var(--e-spring); }
.qs__i.is-on { color: var(--ink); }
.qs__i.is-on .qs__ring { border: 2px solid var(--ink); }
.qs__i.is-on .qs__ring::after { transform: scale(1); }
.qs__foot { align-self: end; margin-top: var(--s-10); max-width: 24em; font-size: var(--t-lead); line-height: 1.5; color: var(--ink-muted); }
:is(html.rm, html:not(.js)) .qs__i { color: var(--ink); }

/* ---------- AI · 四种做法（可切换） ----------
   上：一条分段切换（与首屏窗口顶栏同一写法）。下：左边深色面板里是流程图（story.js 的第三段画面），右边是四行说明。 */
.ways__ui { margin-top: var(--s-12); }
.ways__opts { display: inline-flex; gap: .25rem; padding: .25rem; border-radius: var(--r-pill); background: var(--surface-2); border: 1px solid var(--line); }
.ways__opt { display: inline-flex; align-items: center; gap: .5rem; height: 2.75rem; padding: 0 1.25rem 0 1rem; border-radius: var(--r-pill); font-size: var(--t-ui); font-weight: 500; color: var(--ink-muted); transition: background var(--d-2) var(--e-out), color var(--d-2) var(--e-out), box-shadow var(--d-2) var(--e-out); }
.ways__opt i { width: .875rem; height: .875rem; border-radius: 50%; border: 1px solid var(--line-strong); position: relative; }
.ways__opt i::after { content: ""; position: absolute; inset: 0; margin: auto; width: .375rem; height: .375rem; border-radius: 50%; background: var(--c-red); transform: scale(0); transition: transform var(--d-3) var(--e-spring); }
.ways__opt:hover { color: var(--ink); }
.ways__opt[aria-checked="true"] { background: var(--c-white); color: var(--ink); box-shadow: 0 1px 2px rgba(25, 24, 23, .08), 0 .375rem .875rem -.5rem rgba(25, 24, 23, .3); }
.ways__opt[aria-checked="true"] i { border: 2px solid var(--ink); }
.ways__opt[aria-checked="true"] i::after { transform: scale(1); }
.ways__body { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); column-gap: var(--s-12); margin-top: var(--s-6); align-items: stretch; }
.ways__panel { position: relative; border-radius: var(--r-3); overflow: hidden; aspect-ratio: 680 / 560; }
.ways__bg { position: absolute; inset: 0; width: 100%; height: 100%; }
.ways__art { position: absolute; inset: 0; }
.ways__cards { position: relative; align-self: center; }
.ways__card { display: grid; row-gap: 0; border-top: 1px solid var(--line-strong); }
.ways__card[hidden] { display: none; }
.ways__card > div { display: grid; grid-template-columns: 9.5rem minmax(0, 1fr); column-gap: var(--s-5); padding: 1.125rem 0; border-bottom: 1px solid var(--line); }
.ways__card dt { font-size: var(--t-micro); color: var(--ink-subtle); padding-top: .25rem; }
.ways__card dd { margin: 0; font-size: var(--t-lead); line-height: 1.45; color: var(--ink); text-wrap: pretty; }
.ways__card > div:last-child dd { font-size: var(--t-body); color: var(--ink-muted); }
.ways__card.is-on > div { animation: ways-in var(--d-4) var(--e-out) both; }
.ways__card.is-on > div:nth-child(2) { animation-delay: 50ms; }
.ways__card.is-on > div:nth-child(3) { animation-delay: 100ms; }
.ways__card.is-on > div:nth-child(4) { animation-delay: 150ms; }
@keyframes ways-in { from { opacity: 0; transform: translateY(.75rem); } to { opacity: 1; transform: none; } }
.ways__foot { margin-top: var(--s-10); max-width: 40em; font-size: var(--t-lead); color: var(--ink-muted); }
/* 面板里的画板缩放：story.css 的 .art 以 --k 缩放，这里只隐去画板里与右侧说明重复的四行选项与卡片 */
.ways__art .st-opts { display: none; }

/* ---------- AI · AI 就绪（深色） ---------- */
.aiready { overflow: clip; }
.aiready__head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 26rem); column-gap: var(--s-16); align-items: center; }
.aiready__head .ready__fig { width: 100%; max-width: 26rem; }
.aiready__list { margin-top: var(--s-12); border-top: 1px solid var(--line-strong); }
.rrow { display: grid; grid-template-columns: 3rem minmax(0, 1.1fr) minmax(0, .9fr); column-gap: var(--s-8); align-items: baseline; padding: 1.5rem 0 1.625rem; border-bottom: 1px solid var(--line); cursor: default; }
.rrow__n { font-size: var(--t-micro); color: var(--ink-subtle); transition: color var(--d-2) var(--e-out); }
.rrow__t h3 { font-size: 1.4375rem; line-height: 1.3; font-weight: 400; letter-spacing: -0.02em; color: var(--ink-muted); transition: color var(--d-2) var(--e-out); }
.rrow__t p { margin-top: .375rem; font-size: var(--t-body); line-height: 1.5; color: var(--ink-subtle); }
.rrow__v { font-size: var(--t-small); line-height: 1.5; color: var(--ink-muted); }
.rrow__v .mono { display: block; margin-bottom: .25rem; font-size: var(--t-micro); color: var(--ink-subtle); }
.rrow.is-on .rrow__t h3 { color: var(--ink); }
.rrow.is-on .rrow__n { color: var(--accent-text); }
:is(html.rm, html:not(.js)) .rrow__t h3 { color: var(--ink); }

/* ---------- AI · 自有产品里的四个做法 ----------
   每张卡上一块小界面（网页元素手写，示意），下面一句标题与一句说明。 */
.practice__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-4); margin-top: var(--s-16); }
.prac { display: flex; flex-direction: column; }
.prac__fig { position: relative; height: 15.5rem; border-radius: var(--r-3); border: 1px solid var(--line); overflow: hidden; display: grid; place-items: center; padding: 1.25rem; }
.prac__k { margin-top: var(--s-6); font-size: var(--t-h3); line-height: 1.25; font-weight: 500; letter-spacing: -0.02em; }
.prac__p { margin-top: var(--s-3); font-size: var(--t-body); line-height: 1.55; color: var(--ink-muted); text-wrap: pretty; }
.practice__note { display: grid; grid-template-columns: .875rem minmax(0, 1fr); column-gap: .625rem; max-width: 46rem; margin-top: var(--s-12); color: var(--ink-muted); }
.practice__note::before { content: ""; width: .4375rem; height: .4375rem; margin-top: .4375rem; border-radius: 50%; border: 1px solid var(--ink-subtle); }

.mini { width: 100%; max-width: 17.5rem; background: var(--c-white); color: var(--c-ink); border: 1px solid rgba(25, 24, 23, .14); border-radius: .625rem; box-shadow: 0 1.25rem 2.5rem -1.5rem rgba(25, 24, 23, .45); font-size: .8125rem; line-height: 1.35; overflow: hidden; }
.mini .mono { font-size: .8125rem; }
.mini__bar { display: flex; align-items: center; justify-content: space-between; height: 2.25rem; padding: 0 .75rem; background: #FAF8F5; border-bottom: 1px solid #E9E5DE; }
.mini__chip { display: inline-flex; align-items: center; gap: .375rem; padding: 0 .5rem; line-height: 1.375rem; border-radius: 99rem; background: #EFECE6; font-weight: 500; }
.mini__chip i { width: .375rem; height: .375rem; border-radius: 50%; background: #2F8A57; }
.mini__tree { padding: .375rem; }
.mini__tree li { display: flex; align-items: center; gap: .5rem; height: 2.125rem; padding: 0 .5rem; border-radius: .375rem; color: #8A867F; }
.mini__tree li.is-cur { color: var(--c-ink); background: #FFF1EC; box-shadow: inset 0 0 0 1px rgba(230, 0, 0, .35); font-weight: 500; }
.mini__lock { margin-left: auto; opacity: .7; }
.mini__foot { padding: .5rem .75rem; border-top: 1px solid #F0EDE7; color: #56534E; }
.mini--confirm { padding: 1rem 1rem 1.125rem; }
.mini__k { display: flex; align-items: center; gap: .5rem; color: #8A5A00; }
.mini__k i { width: .5rem; height: .5rem; border-radius: 50%; background: #E8A317; }
.mini__t { margin-top: .5rem; font-size: 1rem; line-height: 1.35; font-weight: 500; }
.mini__btns { display: flex; gap: .5rem; margin-top: .875rem; }
.mini__btn { display: inline-flex; align-items: center; height: 2.125rem; padding: 0 .875rem; border-radius: 99rem; border: 1px solid rgba(25, 24, 23, .2); font-weight: 500; }
.mini__btn--go { background: var(--c-ink); border-color: var(--c-ink); color: #fff; }
.mini__timer { display: flex; align-items: center; gap: .5rem; margin-top: .875rem; color: #56534E; }
.mini__arc { stroke-dasharray: 1; stroke-dashoffset: var(--arc, 0); color: var(--c-red); }
.mini__count { font-weight: 600; color: var(--c-ink); }
.mini--claim { padding: 1rem; background: transparent; border: 0; box-shadow: none; overflow: visible; }
.mini__msg { position: relative; padding: .75rem .875rem; border-radius: .75rem .75rem .75rem .25rem; background: var(--c-white); border: 1px solid rgba(25, 24, 23, .14); box-shadow: 0 1rem 2rem -1.25rem rgba(25, 24, 23, .45); font-size: .9375rem; transition: opacity var(--d-3) var(--e-out); }
.mini__flag { display: flex; align-items: center; gap: .5rem; margin-top: .625rem; padding: .5rem .75rem; border-radius: .5rem; background: #FFF1EC; color: #A3271B; font-weight: 500; transition: opacity var(--d-3) var(--e-out), transform var(--d-3) var(--e-out); }
.mini__flag i { flex: none; width: .9375rem; height: .9375rem; border-radius: 50%; border: 2px solid currentColor; position: relative; }
.mini__flag i::after { content: ""; position: absolute; left: 50%; top: 50%; width: .625rem; height: 2px; margin: -1px 0 0 -.3125rem; background: currentColor; transform: rotate(-45deg); }
.mini--claim.is-stopped .mini__msg { opacity: .45; text-decoration: line-through; text-decoration-color: rgba(192, 54, 44, .7); }
.js .mini--claim .mini__flag { opacity: 0; transform: translateY(.375rem); }
.js .mini--claim.is-stopped .mini__flag { opacity: 1; transform: none; }
.mini--edit { position: relative; }
.mini--edit ol { padding: .375rem 0; }
.mini--edit li { position: relative; display: grid; grid-template-columns: 2.5rem minmax(0, 1fr); column-gap: .25rem; padding: .5rem .75rem; }
.mini--edit li .mono { color: #8A867F; }
.mini--edit li em { grid-column: 2; justify-self: start; margin-top: .25rem; font-style: normal; padding: 0 .4375rem; line-height: 1.25rem; border-radius: 99rem; background: #E6F2EB; color: #1F6B42; }
.mini--edit li.is-kept { background: #F7FBF8; }
.mini__sweep { position: absolute; left: 0; right: 0; top: 0; height: 2.25rem; display: flex; align-items: center; gap: .375rem; padding: 0 .75rem; color: #24406F; background: linear-gradient(180deg, rgba(221, 230, 243, 0), rgba(221, 230, 243, .95) 40%, rgba(221, 230, 243, .95) 60%, rgba(221, 230, 243, 0)); pointer-events: none; opacity: 0; }
.mini__sweep i { width: .375rem; height: .375rem; border-radius: 50%; background: currentColor; }
.mini--edit li.is-flash > span:nth-child(2) { animation: mini-flash 900ms var(--e-out); }
@keyframes mini-flash { 0% { color: #24406F; } 100% { color: inherit; } }

/* ---------- 通栏：一段话加一个链接（AI 页「评估其他系统」、案例页「样例评估」） ---------- */
.band__in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: var(--s-16); align-items: end; }
.band__txt { display: grid; justify-items: start; row-gap: var(--s-6); }
.band--sample { overflow: clip; }

/* ---------- 案例 · 首屏右侧的五枚产品图标与子导航 ---------- */
.orbit { position: absolute; inset: 0; }
.orbit__bg { position: absolute; inset: 0; width: 100%; height: 100%; }
.orbit__i { position: absolute; left: 50%; top: 50%; width: 4.75rem; height: 4.75rem; margin: -2.375rem 0 0 -2.375rem; display: grid; place-items: center; border-radius: 1.25rem; background: var(--c-white); border: 1px solid var(--line); box-shadow: 0 1rem 2rem -1.25rem rgba(25, 24, 23, .45);
  transform: rotate(calc(var(--i) * 72deg - 90deg + var(--rot, 0deg))) translate(var(--orb, 11.5rem)) rotate(calc(var(--i) * -72deg + 90deg - var(--rot, 0deg))); }
.orbit__i img { width: 3.25rem; height: 3.25rem; }
.wnav { position: sticky; top: var(--hdr-h); z-index: 40; background: var(--c-paper); border-bottom: 1px solid rgba(25, 24, 23, .13); }
.wnav__in { display: flex; align-items: center; gap: .25rem; height: 3.5rem; overflow-x: auto; scrollbar-width: none; }
.wnav__in::-webkit-scrollbar { display: none; }
.wnav a { display: inline-flex; align-items: center; gap: .5rem; height: 2.5rem; padding: 0 .875rem 0 .5rem; border-radius: var(--r-pill); font-size: var(--t-label); font-weight: 500; color: #56534E; text-decoration: none; white-space: nowrap; transition: background var(--d-2) var(--e-out), color var(--d-2) var(--e-out); }
.wnav a:hover { color: var(--c-ink); background: rgba(25, 24, 23, .05); }
.wnav a.is-cur { color: var(--c-ink); background: var(--c-white); box-shadow: 0 0 0 1px rgba(25, 24, 23, .12); }
.wnav a img { width: 1.375rem; height: 1.375rem; }
.wnav__decade { margin-left: auto; padding-left: .875rem !important; }

/* ---------- 案例 · 产品 ----------
   左文右图（逐款左右交替）。图在一块暖纸色舞台上：浏览器窗口在后，手机在前；背景一层焦点环。 */
.prod { scroll-margin-top: calc(var(--hdr-h) + 3.5rem); }
.prod__in { display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); column-gap: var(--s-16); align-items: center; }
.prod--flip .prod__in { grid-template-columns: minmax(0, 1.18fr) minmax(0, .82fr); }
.prod--flip .prod__txt { order: 2; }
.prod__name img { height: 2.25rem; width: auto; }
.prod__cat { margin-top: var(--s-5); display: inline-flex; align-items: center; gap: .5rem; font-size: var(--t-label); color: var(--ink-muted); }
.prod__cat::before { content: ""; width: .4375rem; height: .4375rem; border-radius: 50%; background: var(--accent); }
.prod__h { margin-top: var(--s-4); font-family: var(--f-serif); font-weight: 300; font-size: clamp(1.9rem, 2.8vw, 2.5rem); line-height: 1.15; letter-spacing: -0.02em; text-wrap: balance; }
.prod__p { margin-top: var(--s-5); max-width: 32em; }
.prod__shows { margin-top: var(--s-6); padding: var(--s-4) var(--s-5); border-left: 2px solid var(--ink); background: var(--surface-2); }
.prod__shows .mono { font-size: var(--t-micro); color: var(--ink-subtle); }
.prod__shows p + p { margin-top: .25rem; font-size: var(--t-body); line-height: 1.5; color: var(--ink); }
.prod__ai { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: .875rem; align-items: baseline; margin-top: var(--s-5); font-size: var(--t-small); line-height: 1.5; color: var(--ink-muted); }
.prod__ai .mono { font-size: var(--t-micro); color: var(--ink-subtle); padding: 0 .5rem; border: 1px solid var(--line-strong); border-radius: var(--r-pill); line-height: 1.25rem; }
.prod__facts { margin-top: var(--s-6); border-top: 1px solid var(--line); }
.prod__facts li { position: relative; padding: .625rem 0 .625rem 1.5rem; border-bottom: 1px solid var(--line); font-size: var(--t-small); line-height: 1.45; color: var(--ink); }
.prod__facts li::before { content: ""; position: absolute; left: 0; top: 1.05em; width: .5625rem; height: .5625rem; border-radius: 50%; border: 1px solid var(--ink-subtle); }
.prod__tm { margin-top: var(--s-4); max-width: 36em; }
.prod__tm a { color: inherit; }
.prod__stage { position: relative; aspect-ratio: 1.18; border-radius: var(--r-3); overflow: hidden; isolation: isolate; }
.prod__bg { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; }
.pdev { position: absolute; margin: 0; transition: transform var(--d-4) var(--e-out); will-change: transform; }
.pdev img { display: block; width: 100%; height: auto; }
.pdev--win, .pdev--tall { border-radius: .625rem; overflow: hidden; background: var(--c-white); border: 1px solid rgba(25, 24, 23, .16); box-shadow: 0 1.875rem 3.75rem -1.875rem rgba(25, 24, 23, .45); }
.pdev--bare { border: 0; border-radius: 0; background: none; overflow: visible; box-shadow: none; filter: drop-shadow(0 1.25rem 1.75rem rgba(25, 24, 23, .22)); }
.pdev--phone { padding: .375rem; border-radius: 1.75rem; background: var(--c-ink); box-shadow: 0 1px 0 rgba(255, 255, 255, .5) inset, 0 1.875rem 3.125rem -1.75rem rgba(25, 24, 23, .55); }
.pdev--phone .pdev__screen { aspect-ratio: 780 / 1688; border-radius: 1.375rem; overflow: hidden; background: var(--c-white); }
/* 舞台上的摆法：按截图组合各写一套。窗口的高度由截图决定，位置按舞台高度上下留匀（舞台宽高比 1.18） */
.prod__stage--win-phone .pdev--0 { left: 7%; top: 14%; width: 70%; }
.prod__stage--win-phone .pdev--1 { right: 7%; top: 21%; width: 22%; }
.prod__stage--win-phone-phone .pdev--0 { left: 5%; top: 18%; width: 64%; }
.prod__stage--win-phone-phone .pdev--1 { right: 28%; top: 24%; width: 20%; }
.prod__stage--win-phone-phone .pdev--2 { right: 4%; top: 13%; width: 20%; }
.prod__stage--tall-tall .pdev--0 { left: 10%; top: 6%; width: 38%; }
.prod__stage--tall-tall .pdev--1 { right: 10%; top: 12%; width: 38%; }
.prod__stage--phone-phone-phone .pdev--0 { left: 9%; top: 14%; width: 24%; }
.prod__stage--phone-phone-phone .pdev--1 { left: 38%; top: 7%; width: 24%; }
.prod__stage--phone-phone-phone .pdev--2 { right: 9%; top: 14%; width: 24%; }
.prod__stage--win-win .pdev--0 { left: 5%; top: 8%; width: 70%; }
.prod__stage--win-win .pdev--1 { right: 5%; top: 30%; width: 52%; }

/* ---------- 案例 · ZEUS OFFICE 对比 ---------- */
.cmp { border-top: 1px solid var(--line); }
.cmp__grid { display: grid; grid-template-columns: minmax(0, .62fr) minmax(0, 1.38fr); column-gap: var(--s-12); align-items: center; margin-top: var(--s-16); }
.cmp__txt .body { margin-top: var(--s-4); }
.slider { position: relative; margin: 0; border-radius: var(--r-3); overflow: hidden; border: 1px solid rgba(25, 24, 23, .16); background: var(--c-white); box-shadow: 0 1.875rem 3.75rem -2rem rgba(25, 24, 23, .45); aspect-ratio: 6 / 5; touch-action: pan-y; user-select: none; }
.slider__img { position: absolute; inset: 0; }
.slider__img img { width: 100%; height: 100%; object-fit: cover; object-position: 0 0; }
.slider__img--b { clip-path: inset(0 0 0 var(--x)); }
.slider__line { position: absolute; top: 0; bottom: 0; left: var(--x); width: 2px; margin-left: -1px; background: var(--c-ink); pointer-events: none; }
.slider__knob { position: absolute; top: 50%; left: 50%; width: 2.75rem; height: 2.75rem; margin: -1.375rem 0 0 -1.375rem; border-radius: 50%; background: var(--c-ink); display: flex; align-items: center; justify-content: center; gap: .3125rem; box-shadow: 0 .5rem 1rem -.375rem rgba(0, 0, 0, .5); }
.slider__knob i { width: 0; height: 0; border-top: .3125rem solid transparent; border-bottom: .3125rem solid transparent; }
.slider__knob i:first-child { border-right: .375rem solid #fff; }
.slider__knob i:last-child { border-left: .375rem solid #fff; }
.slider__knob::after { content: ""; position: absolute; inset: -.375rem; border-radius: 50%; border: 1.5px solid var(--c-red); opacity: 0; }
.slider:hover .slider__knob::after { animation: zi-ring 1.4s var(--e-out) infinite; }
.slider__range { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: ew-resize; }
.slider__range:focus-visible + .slider__caps { outline: 2px solid var(--c-red-text); }
.slider__caps { position: absolute; left: 0; right: 0; bottom: 0; display: flex; justify-content: space-between; gap: 1rem; padding: .75rem; pointer-events: none; }
.slider__caps span { padding: .25rem .625rem; border-radius: var(--r-pill); background: rgba(25, 24, 23, .82); color: #fff; font-size: var(--t-micro); }
.cmp__terms { display: grid; grid-template-columns: minmax(0, .62fr) minmax(0, 1.38fr); column-gap: var(--s-12); align-items: start; margin-top: var(--s-20); }
.cmp__tablewrap .micro { margin-top: var(--s-3); }
.cmp__table { width: 100%; border-collapse: collapse; font-size: var(--t-small); background: var(--c-white); border: 1px solid var(--line); border-radius: var(--r-3); overflow: hidden; }
.cmp__table th, .cmp__table td { text-align: left; padding: .75rem 1rem; border-bottom: 1px solid var(--line); font-weight: 400; vertical-align: top; }
.cmp__table thead th { font-family: var(--f-mono); font-size: var(--t-micro); color: var(--ink-subtle); background: var(--surface-2); }
.cmp__table tbody th { color: var(--ink-muted); }
.cmp__table td:last-child { font-weight: 600; color: var(--ink); }
.cmp__table td:nth-child(2) { color: var(--ink-subtle); }
.cmp__table .cmp__g th { padding-top: 1.125rem; font-weight: 500; color: var(--ink); background: var(--surface); }
.cmp__table .cmp__g .mono { margin-left: .5rem; font-size: var(--t-micro); color: var(--accent-text); }
.cmp__table [lang="zh-Hant-TW"] { font-family: "Microsoft JhengHei", "PingFang TC", "Noto Sans TC", "Noto Sans SC", sans-serif; }
.cmp__how { margin-top: var(--s-10); max-width: 60em; }

/* ---------- 案例 · 十年里的四个案例 ----------
   2026-10-05 用户判：钉住横推的做法在常见屏高下卡片压住标题、底部没有留白，不可用。改为纵向的案例列表：
   每个案例一行，左列年份，中列标题与正文，右列照片或数字；行与行之间发丝线，留足上下空间。 */
.decade { border-top: 1px solid var(--line); }
.cases { margin-top: var(--s-16); border-top: 1px solid var(--line-strong); }
.case { display: grid; grid-template-columns: 10rem minmax(0, 1fr) 20rem; column-gap: var(--s-12); align-items: start; padding: var(--s-12) 0; border-bottom: 1px solid var(--line); }
.case--text .case__txt { grid-column: 2 / span 2; max-width: 46rem; }
.case__y { display: flex; gap: .75rem; padding-top: .5rem; font-size: var(--t-micro); color: var(--ink-subtle); }
.case__y span { color: var(--accent-text); }
.case__h { font-family: var(--f-serif); font-weight: 300; font-size: clamp(1.75rem, 2.4vw, 2.25rem); line-height: 1.16; letter-spacing: -0.02em; text-wrap: balance; }
.case__sub { margin-top: var(--s-3); font-size: var(--t-small); color: var(--ink-muted); }
.case__p { margin-top: var(--s-5); max-width: 40rem; font-size: var(--t-body); line-height: 1.6; color: var(--ink); text-wrap: pretty; }
.case__pt { margin-top: var(--s-4); font-size: var(--t-small); font-weight: 500; color: var(--ink); }
.case__pt::before { content: ""; display: inline-block; width: .4375rem; height: .4375rem; margin-right: .625rem; border-radius: 50%; background: var(--accent); vertical-align: .1em; }
.case__ip { margin-top: var(--s-6); }
.case__ip .mono { font-size: var(--t-micro); color: var(--ink-subtle); }
.case__ip ul { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.75rem; margin-top: .75rem; }
.case__ip img { width: auto; filter: grayscale(1) contrast(1.1); opacity: .85; }
.case__media { padding-top: .375rem; }
.case__ph { margin: 0; }
.case__ph img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--r-2); }
.case__ph figcaption { margin-top: .625rem; }
.case__figs { display: grid; row-gap: var(--s-5); }
.case__figs > div { padding-top: var(--s-3); border-top: 1px solid var(--line-strong); }
.case__figs dt { font-size: 2.5rem; line-height: 1; letter-spacing: -0.03em; color: var(--ink); font-family: var(--f-sans); font-weight: 350; }
.case__figs dd { margin: .5rem 0 0; font-size: var(--t-label); color: var(--ink-muted); }

/* ---------- 案例 · 署名 ---------- */
.more__list { margin-top: var(--s-8); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-6); }
.more__list li { display: flex; flex-direction: column; align-items: center; text-align: center; }
.more__list li > img { width: 3.5rem; height: 3.5rem; border-radius: .875rem; box-shadow: 0 0 0 1px rgba(25, 24, 23, .1), 0 .5rem 1.25rem rgba(25, 24, 23, .06); }
.more__txt { display: grid; justify-items: center; row-gap: .5rem; margin-top: 1rem; min-width: 0; }
.more__txt img { width: auto; height: 1.25rem; max-width: 100%; }
.more__txt .small { color: var(--ink-muted); }
.credits { border-top: 1px solid var(--line); }
.credits__in { display: grid; grid-template-columns: minmax(0, 18rem) minmax(0, 1fr); column-gap: var(--s-12); }
.credits__h { font-size: var(--t-h3); font-weight: 500; letter-spacing: -0.02em; }
.credits__list { margin-top: var(--s-5); display: grid; row-gap: .75rem; }
.credits__list li { font-size: var(--t-small); line-height: 1.5; color: var(--ink-muted); }
.credits__list b { font-weight: 500; color: var(--ink); }
.credits__src { display: block; font-size: var(--t-label); }
.credits__list a { color: inherit; text-decoration: underline; text-decoration-color: var(--line-strong); text-underline-offset: 3px; overflow-wrap: anywhere; }

/* ---------- 关于我们 · 首屏的圆标 ---------- */
.cmark { position: absolute; inset: 0; display: grid; place-items: center; }
.cmark__bg { position: absolute; inset: -15%; width: 130%; height: 130%; }
.cmark__img { position: relative; width: 46%; height: auto; }

/* ---------- 关于我们 · 时间线 ----------
   2026-10-05 起不钉住：三段章节条在上，一条横贯全宽的线，八个节点等分；区块进入视口后线随滚动由左到右走完，
   走到的节点填实，当前一枚圆心为红点。 */
.tl { border-top: 1px solid var(--line); }
.tl__rail { margin-top: var(--s-16); }
.tl__chapters { display: grid; grid-template-columns: 3fr 3fr 2fr; column-gap: var(--s-6); margin-bottom: var(--s-10); }
.tl__c { display: grid; row-gap: .25rem; }
.tl__c .mono { font-size: var(--t-micro); color: var(--ink-subtle); }
.tl__c b { font-weight: 500; font-size: var(--t-body); }
.tl__c::before { content: ""; height: 3px; margin-bottom: .625rem; border-radius: 2px; background: var(--ink); }
.tl__c--b::before { background: #8F8A82; }
.tl__c--c::before { background: var(--c-red); }
.tl__track { position: relative; }
.tl__line { position: absolute; left: .59rem; right: 0; top: 0; height: 1px; background: var(--line-strong); }
.tl__line i { display: block; height: 2px; margin-top: -.5px; background: var(--ink); transform-origin: 0 50%; transform: scaleX(var(--p, 0)); }
.tl__nodes { position: relative; display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); column-gap: var(--s-6); }
.tl__dot { position: relative; display: block; width: 1.1875rem; height: 1.1875rem; margin-top: -.59rem; border-radius: 50%; border: 1px solid var(--line-strong); background: var(--surface); transition: border-color var(--d-2) var(--e-out), background var(--d-2) var(--e-out); }
.tl__dot::after { content: ""; position: absolute; inset: 0; margin: auto; width: .4375rem; height: .4375rem; border-radius: 50%; background: var(--c-red); transform: scale(0); transition: transform var(--d-3) var(--e-spring); }
.tl__n.is-done .tl__dot { background: var(--ink); border-color: var(--ink); }
.tl__n.is-cur .tl__dot { border: 2px solid var(--ink); background: var(--surface); }
.tl__n.is-cur .tl__dot::after { transform: scale(1); }
.tl__y { margin-top: var(--s-5); font-size: clamp(2rem, 2.6vw, 2.75rem); line-height: 1; letter-spacing: -0.03em; font-family: var(--f-sans); font-weight: 300; color: var(--ink-subtle); transition: color var(--d-3) var(--e-out); }
.tl__n.is-done .tl__y, .tl__n.is-cur .tl__y { color: var(--ink); }
.tl__t { margin-top: var(--s-3); font-size: var(--t-small); line-height: 1.5; color: var(--ink-muted); text-wrap: pretty; }
.tl__turn { margin-top: var(--s-16); max-width: 46rem; font-size: var(--t-lead); line-height: 1.5; color: var(--ink-muted); }
:is(html.rm, html:not(.js)) .tl__y { color: var(--ink); }
:is(html.rm, html:not(.js)) .tl__dot { background: var(--ink); border-color: var(--ink); }
:is(html.rm, html:not(.js)) .tl__line i { transform: none; }

/* ---------- 关于我们 · 价值观 ----------
   2026-10-05 改：标题写立场（以人为本），三项价值各配一句说明；不再写「三个词」与旧词对比。 */
.values__body { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); column-gap: var(--s-16); align-items: center; margin-top: var(--s-16); }
.values__mark { padding: var(--s-12) var(--s-10); border: 1px solid var(--line); border-radius: var(--r-3); background: var(--c-white); }
.values__img { width: 100%; height: auto; }
.values__list { border-top: 1px solid var(--line-strong); }
.values__list > div { display: grid; grid-template-columns: 10rem minmax(0, 1fr); column-gap: var(--s-6); align-items: baseline; padding: 1.375rem 0; border-bottom: 1px solid var(--line); }
.values__list dt { font-size: var(--t-h3); line-height: 1.25; font-weight: 500; letter-spacing: -0.02em; }
.values__list dd { margin: 0; font-size: var(--t-lead); line-height: 1.5; color: var(--ink-muted); text-wrap: pretty; }

/* ---------- 关于我们 · 公司架构 ---------- */
.team__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-4); margin-top: var(--s-16); }
.role { padding: var(--s-6) var(--s-6) var(--s-8); border: 1px solid var(--line); border-radius: var(--r-3); transition: border-color var(--d-2) var(--e-out); }
.role:hover { border-color: var(--line-strong); }
.role__ring { position: relative; display: block; width: 2.5rem; height: 2.5rem; border-radius: 50%; border: 1px solid var(--line-strong); }
.role__ring::before { content: ""; position: absolute; inset: .4375rem; border-radius: 50%; border: 1px solid var(--line-strong); }
.role__ring i { position: absolute; inset: 0; margin: auto; width: .5rem; height: .5rem; border-radius: 50%; background: var(--c-red); }
.role__k { margin-top: var(--s-6); font-size: 1.25rem; line-height: 1.3; font-weight: 500; letter-spacing: -0.015em; }
.role__p { margin-top: var(--s-3); font-size: var(--t-body); line-height: 1.55; color: var(--ink-muted); }

/* ---------- 关于我们 · 客户与联系方式 ---------- */
.clients--full .clients__logos--full { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); margin-top: var(--s-12); }
.clients--full .wrap { display: block; }
.clients__all { margin-top: var(--s-8); max-width: 60em; font-size: var(--t-body); line-height: 1.7; color: var(--ink-muted); }
.contactrows__in { display: grid; grid-template-columns: minmax(0, 18rem) minmax(0, 1fr); column-gap: var(--s-12); align-items: start; }
.contactrows dl { border-top: 1px solid var(--line-strong); }
.contactrows dl > div { display: grid; grid-template-columns: 10rem minmax(0, 1fr); padding: 1rem 0; border-bottom: 1px solid var(--line); }
.contactrows dt { font-size: var(--t-micro); color: var(--ink-subtle); padding-top: .25rem; }
.contactrows dd { margin: 0; font-size: var(--t-lead); }
.contactrows dd a { color: inherit; text-decoration: none; border-bottom: 1px solid var(--line-strong); }

/* ---------- 随宽度重排 ---------- */
@media (max-width: 1359px) {
  .phero__in { column-gap: var(--s-10); }
  .practice__list { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: var(--s-10); }
  .team__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rcard__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 1199px) {
  .phero__in { grid-template-columns: minmax(0, 1fr) minmax(0, 20rem); }
  .kinds__grid { grid-template-columns: minmax(0, 1fr); }
  .kind { flex-direction: row; }
  .kind__fig { flex: none; width: 46%; height: auto; min-height: 22rem; border-bottom: 0; border-right: 1px solid var(--line); }
  .proc__list { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: var(--s-12); }
  .proc__line { display: none; }
  .review__cards { grid-template-columns: minmax(0, 1fr); }
  .terms__list { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: var(--s-12); }
  .shift__in, .qs__in, .band__in, .values__body, .cmp__grid, .cmp__terms { grid-template-columns: minmax(0, 1fr); row-gap: var(--s-10); }
  .case { grid-template-columns: 8rem minmax(0, 1fr); row-gap: var(--s-6); }
  .case__media { grid-column: 2; max-width: 26rem; }
  .case--text .case__txt { grid-column: 2; }
  .tl__chapters, .tl__line { display: none; }
  .tl__nodes { grid-template-columns: repeat(4, minmax(0, 1fr)); row-gap: var(--s-10); }
  .tl__dot { margin-top: 0; }
  .ways__body { grid-template-columns: minmax(0, 1fr); row-gap: var(--s-8); }
  .aiready__head { grid-template-columns: minmax(0, 1fr); }
  .aiready__head .ready__fig { display: none; }
  .rrow { grid-template-columns: 3rem minmax(0, 1fr); row-gap: .75rem; }
  .rrow__v { grid-column: 2; }
  .prod__in, .prod--flip .prod__in { grid-template-columns: minmax(0, 1fr); row-gap: var(--s-12); }
  .prod--flip .prod__txt { order: 0; }
  .prod__stage { max-width: 46rem; }
}
@media (max-width: 899px) {
  .phero__in { grid-template-columns: minmax(0, 1fr); }
  .phero__fig { display: none; }
  .phero__h .ln { white-space: normal; }
  .kind { flex-direction: column; }
  .kind__fig { width: auto; height: 17rem; min-height: 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .proc__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .practice__list, .team__list { grid-template-columns: minmax(0, 1fr); }
  .credits__in, .contactrows__in { grid-template-columns: minmax(0, 1fr); row-gap: var(--s-6); }
  .clients--full .clients__logos--full { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}