*{box-sizing:border-box;margin:0;padding:0}
/* 全站整体缩放至 88%（文字、间距、图片同比例） */
#root{zoom:0.88}
body{font-family:'Noto Serif SC',serif;font-weight:300;background:#fff;color:#151A22;-webkit-font-smoothing:antialiased;text-spacing-trim:trim-start}
a{color:#0072BC}
a:hover{color:#163A6B}
::selection{background:#C9DFF0;color:#0F2748}
img{-webkit-user-drag:none}
/* 全站单一字族：思源宋体 Noto Serif SC 轻字重。
 * 设计系统组件内联的是 var(--font-*)，因此只需在本页重定义这几个变量，
 * 即可让 Eyebrow / Badge / Button / Input 等一并统一 —— 无需通配选择器。 */
:root{
  --font-display:'Noto Serif SC',serif;
  --font-heading:'Noto Serif SC',serif;
  --font-body:'Noto Serif SC',serif;
  --font-ui:'Noto Serif SC',serif;
  --font-mono:'Noto Serif SC',serif;
}
/* 设计系统的 Eyebrow 与表单 label 把 11px 写在行内样式里，变量覆写不到，
 * 这里按元素类型定点放大（窄选择器，不是通配，无性能代价）。 */
#root label{font-size:14px!important;letter-spacing:0.06em!important}
#root div[style*="letter-spacing: 0.12em"]{font-size:14px!important;letter-spacing:0.07em!important;white-space:nowrap}

/* 流程图：一行不换，溢出时右缘渐隐提示可横向滚动，滚动条保留但收细 */
.amp-flow{overflow-x:auto;overscroll-behavior-x:contain}
.amp-flow::-webkit-scrollbar{height:4px}
.amp-flow::-webkit-scrollbar-thumb{background:#C3C8CF;border-radius:2px}
.amp-flow::-webkit-scrollbar-track{background:transparent}

/* 桌面端布局 */
.amp-hero{display:grid;grid-template-columns:1.1fr 0.9fr;gap:88px;align-items:center}
.amp-paths{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:stretch}
.amp-arch{display:grid;grid-template-columns:1.15fr 0.85fr;gap:56px;align-items:start}
.amp-value{display:grid;grid-template-columns:repeat(2,1fr);gap:30px 48px}
.amp-cap{display:grid;grid-template-columns:repeat(2,1fr);gap:34px 48px}
/* 等大正方形照片对：两列等宽、整体居中。
 * 两张原图方向相反，统一为 1:1 画框后各自从长边等量裁切，尺寸与风格才一致。 */
.amp-pairsq{display:grid;grid-template-columns:repeat(2,268px);gap:24px;justify-content:center;margin-left:auto;margin-right:auto}
/* 同向竖构图照片对（可选配置整机图）：等宽居中，保留 3/4 不裁切整机 */
.amp-pairtall{display:grid;grid-template-columns:repeat(2,300px);gap:28px;justify-content:center;margin-left:auto;margin-right:auto}
@media (max-width:760px){
  .amp-pairsq{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  .amp-pairtall{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
}
.amp-split2{display:grid;grid-template-columns:0.85fr 1.15fr;gap:60px;align-items:start}
.amp-pair2{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.amp-spec-row{display:grid;grid-template-columns:1.1fr 1.2fr 1.5fr;gap:20px;align-items:baseline}
.amp-q{display:grid;grid-template-columns:repeat(2,1fr);gap:14px 32px}
/* 第9–11章新增栅格 */
.amp-nodes{display:grid;grid-template-columns:repeat(3,1fr);gap:24px 32px}
.amp-gates{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:stretch}
.amp-two{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.amp-fact-row{display:grid;grid-template-columns:0.9fr 1fr 1.4fr;gap:24px;align-items:baseline}
.amp-cmp-row{display:grid;grid-template-columns:0.8fr 1.1fr 1.1fr;gap:26px;align-items:start}
.amp-spec3{display:grid;grid-template-columns:0.5fr 1.1fr 1.3fr;gap:22px;align-items:baseline}
.amp-pair3{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
/* V3.0 栅格 */
.amp-tags{display:grid;grid-template-columns:repeat(4,1fr)}
/* 痛点图：中心「袋数增加」占左侧两行，六个痛点环绕 */
.amp-pain{display:grid;grid-template-columns:1.15fr 1fr 1fr;grid-template-rows:auto auto auto;gap:16px}
.amp-pain-core{grid-row:span 3}
.amp-chain{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.amp-less{display:grid;grid-template-columns:repeat(3,1fr);gap:36px 40px}
.amp-less-light{display:grid;grid-template-columns:repeat(2,1fr);gap:30px 44px}
.amp-labor{display:grid;grid-template-columns:repeat(5,1fr);gap:24px}
.amp-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.amp-bill{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.amp-four{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;align-items:stretch}
.amp-mag-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;align-content:start}
.amp-numbering{display:flex;align-items:stretch;gap:14px}
.amp-ev-item{display:grid;grid-template-columns:minmax(0,1fr) 252px;gap:56px;align-items:start}
.amp-ev-img{width:252px}
.amp-cmp-row.amp-ev2{grid-template-columns:0.7fr 2fr}
.amp-shift{display:grid;grid-template-columns:220px 64px 1fr;gap:12px;align-items:stretch}
.amp-shift-to{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.amp-metric3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
/* 单行句：宽屏不换行且随视口缩字，窄屏恢复正常换行 */
@media (min-width:1001px){.amp-oneline{white-space:nowrap;font-size:clamp(14px,1.45vw,18px)}}
.amp-app-row.amp-app3{grid-template-columns:0.85fr 1.2fr 1.2fr}
.amp-app-row{display:grid;grid-template-columns:0.85fr 1.1fr 1.1fr 0.95fr;gap:24px;align-items:start}
.amp-ev{display:grid;grid-template-columns:1.4fr 0.6fr;gap:32px;align-items:start}
.amp-case{display:block}
.amp-cta{display:flex;align-items:center;justify-content:space-between;gap:48px}
.amp-foot{display:grid;grid-template-columns:1.2fr 1fr;gap:48px}
.amp-foot-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.amp-foot-cols a:hover{color:#0072BC!important}
@media (max-width:560px){.amp-foot-cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 24px}}

/* 首屏 —— 诚实分栏：左栏平色文案，右栏照片通高裁切，交界一条直边。
 * 不再用 CSS 渐变伪造照片背景的延长（那是上一版断层的来源）。 */
.amp-hsplit{display:grid;grid-template-columns:1.25fr 0.75fr;align-items:stretch;min-height:min(78vh,760px);background:#F4F6F8}
.amp-hsplit > *{min-width:0}
/* 图一容器：指令要求设备完整出现，不裁脚轮、顶部与侧面，故用 contain。
 * 底色取左栏同一灰（#F4F6F8），两栏连成一片。 */
.amp-hphoto{position:relative;overflow:hidden;min-width:0;background:#F4F6F8}
.amp-hphoto img{position:absolute;inset:28px 0;width:100%;height:calc(100% - 56px);object-fit:contain;object-position:center;display:block;user-select:none;pointer-events:none}
.amp-hcopy{position:relative;z-index:1;background:#F4F6F8;display:flex;align-items:center;justify-content:flex-end;padding:80px 52px 80px 40px}
.amp-hcopy-in{width:100%;max-width:38.4rem}
.amp-hmedia{position:relative;overflow:hidden;background:#e6eaee}
.amp-hmedia img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:52% 50%;display:block;user-select:none;pointer-events:none}

/* 首屏：文案与图片共用页面栅栏，左右灰色页边距一致 */
.amp-hsplit{padding:0 max(40px, calc((100% - 1280px) / 2 + 40px))}
.amp-hsplit .amp-hcopy{justify-content:flex-start!important;padding-left:0!important}
@media (max-width:1240px){
  .amp-nav{height:112px!important}
  .amp-hsplit{grid-template-columns:1.3fr 0.7fr}
  .amp-hcopy{padding:68px 40px 68px 40px}
}
@media (max-width:980px){
  .amp-hsplit{grid-template-columns:1fr}
  .amp-hphoto{height:min(78vh,640px)}
  .amp-hcopy{justify-content:flex-start;padding:60px 40px 52px}
  .amp-hcopy-in{max-width:none}
  .amp-hmedia{position:relative;aspect-ratio:4/3;background:#e6eaee}

  .amp-hmedia img{object-position:50% 46%}
}

/* 响应式标志 */
.amp-logo{height:100px}
.amp-logo-foot{height:104px}
@media (max-width:1280px){
  .amp-nav-links a{padding:10px 10px!important;font-size:15px!important}
}
@media (max-width:1120px){
  .amp-nav-links a{padding:9px 7px!important;font-size:14px!important}
  .amp-nav-links a span{left:7px!important;right:7px!important}
}
@media (max-width:1100px){
  .amp-metric3{grid-template-columns:1fr}
  .amp-logo{height:80px}
  .amp-logo-foot{height:86px}
}
@media (max-width:860px){
  .amp-logo{height:66px}
  .amp-logo-foot{height:74px}
}
@media (max-width:560px){
  .amp-logo{height:56px}
  .amp-logo-foot{height:64px}
}

/* 平板 */
@media (max-width:1280px){
  .amp-nav-links a{padding:10px 10px!important;font-size:15px!important}
}
@media (max-width:1120px){
  .amp-nav-links a{padding:9px 7px!important;font-size:14px!important}
  .amp-nav-links a span{left:7px!important;right:7px!important}
}
@media (max-width:1100px){
  .amp-metric3{grid-template-columns:1fr}
  .amp-hero,.amp-arch,.amp-split2,.amp-ev{grid-template-columns:1fr;gap:40px}
  .amp-hero-img{max-width:440px}
  .amp-paths{grid-template-columns:1fr;gap:14px}
  .amp-q{grid-template-columns:1fr}
  .amp-spec-row{grid-template-columns:1fr 1fr;gap:6px 24px}
  .amp-spec-row>div:last-child{grid-column:1/-1;margin-top:4px}
  .amp-cta{flex-direction:column;align-items:flex-start;gap:28px}
}

/* 移动端 */
@media (max-width:1240px){
  .amp-chain{grid-template-columns:repeat(3,1fr)}
  .amp-labor{grid-template-columns:repeat(3,1fr)}
  .amp-app-row{grid-template-columns:1fr 1fr;gap:18px 24px}
}
@media (max-width:1100px){
  .amp-metric3{grid-template-columns:1fr}
  .amp-nodes{grid-template-columns:repeat(2,1fr)}
  .amp-two{gap:40px}
  .amp-pain{grid-template-columns:1fr 1fr}
  .amp-pain-core{grid-row:auto;grid-column:span 2}
  .amp-less{grid-template-columns:repeat(2,1fr)}
  .amp-stats{grid-template-columns:repeat(2,1fr)}
  .amp-four{grid-template-columns:repeat(2,1fr)}
  .amp-tags{grid-template-columns:repeat(2,1fr)}
  .amp-tags > *{border-left:none!important;border-top:1px solid #EDEFF2}
}
@media (max-width:900px){
  .amp-chain{grid-template-columns:repeat(2,1fr)}
  .amp-numbering{flex-direction:column}
  .amp-num-arrow{transform:rotate(90deg);align-self:center}
}
@media (max-width:860px){
  /* 16.4 表格在移动端拆成卡片，不允许缩到无法阅读 */
  .amp-cmp-row,.amp-cmp-row.amp-ev2,.amp-spec3,.amp-fact-row,.amp-app-row,.amp-app-row.amp-app3{grid-template-columns:1fr;gap:8px;padding:20px 22px!important}
  .amp-cmp-row > *,.amp-spec3 > *,.amp-fact-row > *{min-width:0}
  /* 表头行隐藏，改由每格 data-label 自带标签 */
  .amp-thead{display:none!important}
  [data-label]::before{content:attr(data-label);display:block;font-size:13px;font-weight:500;
    letter-spacing:0.06em;color:#9BA1AB;margin-bottom:4px}
}
@media (max-width:760px){
  .amp-ev-item{grid-template-columns:1fr;gap:22px}
  .amp-shift,.amp-metric3{grid-template-columns:1fr}
  .amp-shift-arrow{transform:rotate(90deg)}
  .amp-shift-to{grid-template-columns:repeat(2,1fr)}
  .amp-value,.amp-cap,.amp-pair2,.amp-foot{grid-template-columns:1fr;gap:22px}
  .amp-nodes,.amp-gates,.amp-two,.amp-pair3,.amp-q{grid-template-columns:1fr;gap:22px}
  .amp-pain,.amp-chain,.amp-less,.amp-less-light,.amp-labor,.amp-stats,.amp-bill,.amp-four,.amp-mag-stats{grid-template-columns:1fr;gap:18px}
  .amp-pain-core{grid-column:auto}
  .amp-tags{grid-template-columns:1fr}
  .amp-app-row,.amp-app-row.amp-app3{grid-template-columns:1fr;gap:8px;padding:22px 24px!important}
  .amp-spec-row{grid-template-columns:1fr}
}

/* 窄屏：导航改为紧凑换行式，不隐藏入口。
 * 断点定在 1000px —— 八项导航加 165px CTA 在 860–1000px 区间会超出页边距，
 * 必须在栅栏被吃掉之前换行，而不是等到 860px。 */
@media (max-width:1000px){
  .amp-nav{flex-wrap:wrap;height:auto!important;padding-top:18px;padding-bottom:16px;gap:10px}
  .amp-nav-links{flex-wrap:wrap;width:100%}
  .amp-nav-links a{padding:9px 10px!important;font-size:15px!important}
  .amp-nav-links a span{left:10px!important;right:10px!important}
  .amp-nav-links{flex-wrap:wrap;gap:2px 0;width:100%}
  .amp-nav-links a{padding:8px 12px;font-size:14px}
  .amp-nav-links a:first-child{padding-left:0}
  .amp-nav-links>button{margin-left:12px!important}
}
@media (max-width:560px){
  .amp-nav-links>button{margin-left:0!important;margin-top:8px;width:100%}
}


/* WordPress integration + mobile refinements */
html{scroll-behavior:smooth} body.admin-bar nav{top:32px!important}
@media(max-width:782px){body.admin-bar nav{top:46px!important}}
@media(max-width:760px){#root{zoom:1}.amp-nav{padding-left:20px!important;padding-right:20px!important}.amp-hsplit{padding-left:20px!important;padding-right:20px!important}.amp-hcopy{padding:46px 0 38px!important}.amp-hphoto{height:420px!important}}