/* =========================================================
 * SIPENG CNC — 前台全站样式
 * 视觉方向：对标 carbon.5bot.au，黑/白/红工业风，大号加粗标题
 * ======================================================= */
:root {
    --ink: #0b0b0c;
    --ink-2: #16171a;
    --paper: #ffffff;
    --bg: #f4f5f7;
    --gray: #6b6e76;
    --gray-l: #9a9daa;
    --line: #e4e5e8;
    --red: #D71920;
    --red-dark: #b01419;
    --red-l: #ff5147; /* 亮红：深色背景上的红字专用（黑底纯红刺眼、对比度不足，2026-09-20 客户反馈） */
    --green: #1f9d55;
    --font: "Inter", "Segoe UI", "Helvetica Neue", Arial, "PingFang SC", "Microsoft YaHei", sans-serif;
    --shadow: 0 10px 30px rgba(11, 11, 12, .08);
    --shadow-lg: 0 24px 60px rgba(11, 11, 12, .16);
    --ease: cubic-bezier(.22, .61, .36, 1);
}

* { margin: 0; padding: 0; box-sizing: border-box; }
/* hidden 属性守卫（2026-09-23）：带 display 规则的网格容器（.ws-grid/.who-grid 展开区）会覆盖 UA 的
   [hidden]{display:none}，致「Explore More/Search More」折叠区初始即可见——统一以作者级规则压回 */
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
    font-family: var(--font);
    font-size: 16px;
    line-height: 1.65;
    color: var(--ink);
    background: var(--paper);
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }
button { font-family: inherit; cursor: pointer; }

/* ---------- 通用按钮 ---------- */
/* 2026-09-22 客户 docx：全站主次按钮统一规格（padding/字号/圆角一致，直角 0），整体加大一档 */
.btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 17px 34px;
    font-size: 15.5px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    border: 2px solid transparent;
    border-radius: 0;
    transition: all .25s var(--ease);
    white-space: nowrap;
}
.btn i { font-style: normal; transition: transform .25s var(--ease); }
.btn:hover i { transform: translateX(4px); }
.btn-red { background: var(--red); color: #fff; }
.btn-red:hover { background: var(--red-dark); }
.btn-ghost { border-color: rgba(255, 255, 255, .5); color: #fff; }
.btn-ghost:hover { border-color: #fff; background: rgba(255, 255, 255, .08); }
/* 2026-09-22 客户 docx：黑色块按钮白底上过于沉重 → 统一为品牌红主按钮（类名保留，视觉与 .btn-red 一致） */
.btn-dark { background: var(--red); color: #fff; }
.btn-dark:hover { background: var(--red-dark); }
/* 深色底 + 红边描边按钮：Hero 次按钮（Explore Machines），视觉权重低于实心红主按钮 */
.btn-outline { background: #101114; border-color: var(--red); color: #fff; }
.btn-outline:hover { background: var(--red); }
.btn-line { border-color: rgba(255, 255, 255, .55); color: #fff; }
.btn-line:hover { border-color: #fff; }
.btn-sm { padding: 11px 20px; font-size: 13px; }

/* ---------- Topbar（最顶部联系条：黑底白字，参考客户截图样式） ---------- */
.topbar { background: var(--ink); border-bottom: 1px solid rgba(255, 255, 255, .08); }
.topbar-inner {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 38px;
}
.tb-contact { display: flex; align-items: center; gap: 26px; flex-wrap: wrap; }
.tb-item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #e8e9ee;
    font-size: 13px;
    letter-spacing: .02em;
    transition: color .2s;
}
.tb-item svg { color: var(--gray-l); transition: color .2s; flex-shrink: 0; }
.tb-item:hover, .tb-item:hover svg { color: #fff; }
.tb-cta {
    color: var(--red-l); /* 黑底红字提亮（2026-09-20）：保持品牌红相、提高明度与可读性 */
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: .04em;
    white-space: nowrap;
    transition: color .2s;
}
.tb-cta:hover { color: #ff4d55; }

/* ---------- Header ---------- */
.hdr {
    position: sticky;
    top: 0;
    z-index: 900;
    background: rgba(255, 255, 255, .96);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(11, 11, 12, .08);
    transition: box-shadow .3s var(--ease);
}
.hdr.scrolled { box-shadow: 0 8px 24px rgba(0, 0, 0, .12); }
.hdr-inner {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    height: 74px;
}
.brand { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.brand-mark { width: 42px; height: 42px; }
.brand-text { display: flex; flex-direction: column; line-height: 1.1; }
.brand-text b { color: var(--ink); font-size: 19px; letter-spacing: .15em; }
.brand-text b i { font-style: normal; color: var(--red); }
.brand-text small { color: var(--gray); font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; margin-top: 4px; }
/* ≤400 极窄视口（小屏 webview/分屏窗口）允许品牌行收缩：brand-text 内容宽 226px（24+42+12+226=304）
   曾把全站页面撑出 +24px 横向滚动（2026-09-21 客户《Production Optimization & Machine Retrofit.docx》
   「任何屏幕宽度不能出现横向滚动条」）——真收缩换行修复，不用 overflow-x:hidden 掩盖 */
@media (max-width: 400px) {
    .hdr .brand { flex-shrink: 1; min-width: 0; }
    .hdr .brand-text { min-width: 0; }
    .hdr .brand-text small { white-space: normal; }
}
/* 2026-09-30 主导航第 8 项 Resources 后桌面再收紧：1280/1366 实测 +52/+29 横向滚动，
   padding 8→5 / 字号 13→12.5 / gap 2→0 约省 80px（品牌行客户定稿样式不动） */
.nav { display: flex; align-items: center; gap: 0; }
.nav-link {
    display: block;
    padding: 10px 5px;
    color: var(--ink-2);
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: .02em;
    text-transform: uppercase;
    position: relative;
    transition: color .2s;
    white-space: nowrap;
}
.nav-link:hover, .nav-link.on, .nav-drop.on > .nav-link { color: var(--red); }
.nav-link.on::after, .nav-drop.on > .nav-link::after {
    content: "";
    position: absolute;
    left: 5px; right: 5px; bottom: 2px;
    height: 3px;
    background: var(--red);
    transition: opacity .2s var(--ease);
}
/* 面板展开时由面板红色 border-top 充当连接线，字下红线淡出，避免两条红条近距打架（须位于 .on 规则之后保证层叠生效） */
.nav-drop:hover > .nav-link::after { opacity: 0; }
.caret {
    display: inline-block;
    width: 7px; height: 7px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
    margin-left: 4px;
}
.nav-drop { position: relative; }
/* COMPANY / SUPPORT / RESOURCES 位于导航右端，面板改右对齐防右侧视口裁切（drawer 静态定位不受影响；
   2026-09-30 增第 6 个 nav-drop Resources，补 nth-of-type(6)——漏掉时该面板左对齐、面板本体戳出视口右缘产生真实横向滚动） */
#mainnav > .nav-drop:nth-of-type(4) .drop-panel,
#mainnav > .nav-drop:nth-of-type(5) .drop-panel,
#mainnav > .nav-drop:nth-of-type(6) .drop-panel { left: auto; right: 0; }
.drop-panel {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 260px;
    background: #fff;
    box-shadow: var(--shadow-lg);
    border-top: 3px solid var(--red);
    padding: 10px 0;
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: all .22s var(--ease);
}
.nav-drop:hover .drop-panel { opacity: 1; visibility: visible; transform: none; }
.drop-item { display: block; padding: 9px 22px; font-size: 14px; color: var(--ink-2); transition: all .15s; }
.drop-item:hover { color: var(--red); background: var(--bg); padding-left: 28px; }
.drop-all { font-weight: 700; color: var(--red); border-top: 1px solid var(--line); margin-top: 6px; white-space: nowrap; }
.nav-cta {
    /* 8 项导航后桌面宽度放不下：桌面隐藏，抽屉内（≤1180）恢复显示 */
    display: none;
    margin-left: 12px;
    background: var(--red);
    color: #fff;
    padding: 12px 22px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    transition: background .2s;
}
.nav-cta:hover { background: var(--red-dark); }

/* 语言切换（中文 = 旧中文站；EN = 本站） */
.lang-switch { display: flex; align-items: center; gap: 9px; margin-left: 8px; font-size: 12.5px; letter-spacing: .06em; }
.lang-switch .ls-sep { color: rgba(11, 11, 12, .22); }
.lang-switch .ls-item { color: var(--gray); padding: 4px 1px; transition: color .2s; }
.lang-switch .ls-item:hover { color: var(--red); }
.lang-switch .ls-item.on { color: var(--ink); font-weight: 700; border-bottom: 2px solid var(--red); }
/* 客户要求语言切换右移约 10mm；<1360px 时右缘空间不足会裁切，保持原位。
   relative 视觉位移替代负 margin（2026-09-21 响应式审查）：负 margin 会把 nav 内容
   撑出容器 38px（≥1361 视口 nav scrollWidth 恒大于 clientWidth，部分内核会计入
   可滚动溢出），relative 不参与布局计算，视觉效果相同且不产生布局溢出 */
@media (min-width: 1360px) {
    .lang-switch { position: relative; right: -38px; }
}
.burger { display: none; background: none; border: 0; width: 40px; height: 40px; position: relative; }
.burger span {
    position: absolute; left: 8px; right: 8px; height: 2px;
    background: var(--ink); transition: all .25s var(--ease);
}
.burger span:nth-child(1) { top: 12px; }
.burger span:nth-child(2) { top: 19px; }
.burger span:nth-child(3) { top: 26px; }
.burger.open span:nth-child(1) { top: 19px; transform: rotate(45deg); }
.burger.open span:nth-child(2) { opacity: 0; }
.burger.open span:nth-child(3) { top: 19px; transform: rotate(-45deg); }

/* ---------- HERO（首页，黑底） ---------- */
.hero { background: var(--ink); color: #fff; position: relative; overflow: hidden; }
.hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(700px 420px at 85% 12%, rgba(215, 25, 32, .16), transparent 65%),
        repeating-linear-gradient(90deg, rgba(255,255,255,.025) 0 1px, transparent 1px 90px);
    pointer-events: none;
}
.hero-grid {
    max-width: 1320px;
    margin: 0 auto;
    padding: 32px 24px 48px;
    display: grid;
    grid-template-columns: 1fr 1.1fr;
    gap: 24px;
    align-items: center;
    position: relative;
    z-index: 1;
}
.hero-kicker {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .32em;
    color: var(--red-l); /* 深色 hero 上的红 kicker 同步提亮 */
    text-transform: uppercase;
    margin-bottom: 26px;
}
.hero-kicker::before { content: "— "; color: var(--gray-l); }
.hero-h1 {
    font-size: clamp(30px, 4vw, 48px); /* 2026-10-10 客户反馈：hero 文案整体缩小一档（原 clamp(34px,4.6vw,56px)） */
    line-height: 1.1;
    font-weight: 800;
    letter-spacing: -0.015em;
    text-transform: uppercase;
    margin-bottom: 24px;
}
.hero-h1 .red { color: var(--red-l); } /* 黑底 banner 红字提亮（2026-09-20 客户反馈对比刺眼） */
/* Hero 快速入口标签按钮（2026-09-15）：小尺寸工业风，深底白字 1px 红边，hover 变品牌红；权重低于主 CTA */
.hero-tags { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 24px; }
.hero-tag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 132px;
    padding: 8px 16px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .03em;
    line-height: 1.5;
    color: #fff;
    text-align: center;
    background: #101114;
    border: 1px solid var(--red);
    transition: background .2s var(--ease), color .2s var(--ease);
}
.hero-tag:hover { background: var(--red); color: #fff; }
.hero-tag:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
/* 2026-09-21 客户反馈：笔记本宽度下 4 个标签折两行。根因：4 枚胶囊 13px 档共需 ~593px，
   而标签行容器在 ≥1366 视口也仅 594px（台式机压线放下），笔记本有效宽度 1093–1349
   （1366 屏 125% 缩放 / 浏览器滚动条占位）时容器缩到 486–588px 就放不下。
   笔记本档（921–1360）收窄一档：12px 字号 + 紧内边距 + 去 min-width + 间距 8px，
   总宽降到 ~462px，486px 容器也放得下；桌面 ≥1361 与手机 ≤920 样式不变。 */
@media (min-width: 921px) and (max-width: 1360px) {
    .hero-tags { gap: 8px; }
    .hero-tag { min-width: 0; padding: 6px 12px; font-size: 12px; }
}
.hero-body { color: #E0E0E0; font-size: 14px; max-width: 560px; margin-bottom: 14px; } /* 2026-09-22 客户 docx：暗底小字统一提亮 #E0E0E0；2026-10-10 客户反馈缩小 15→14 */
.hero-body.strong { color: #fff; font-weight: 700; font-size: 15px; margin: 20px 0 32px; } /* 2026-10-10 客户反馈缩小 16→15 */
.hero-actions { display: flex; gap: 14px; flex-wrap: wrap; }

.hero-visual { position: relative; min-height: 520px; align-self: start; margin-top: 96px; /* 人物下移：头顶低于左侧文字顶部（2026-09-21 客户反馈） */ }
.hero-portrait { position: relative; }
.hero-portrait img {
    width: 100%;
    max-width: 420px; /* boss.png 已裁掉透明留白，CSS 宽即人物可见宽（2026-09-21 客户要求调小 480→420） */
    margin-left: auto;
    margin-right: -12px; /* 借入容器 24px padding，人物再靠右（不产生横向滚动） */
    filter: drop-shadow(0 30px 50px rgba(0,0,0,.55));
}
.hero-quote {
    position: absolute;
    right: 24px;
    bottom: 112px;
    text-align: right;
    z-index: 2;
    max-width: 480px; /* 引言两行显示（2026-09-21 客户要求；340px 时代每段折两行共 4 行） */
}
.hero-quote p { font-size: 21px; font-weight: 700; line-height: 1.5; text-shadow: 0 2px 14px rgba(0,0,0,.7); }
.hero-quote p .q1, .hero-quote p .q2 { display: block; }
.hero-quote p .q1 { margin-right: 58px; }
.hero-quote cite { display: block; margin-top: 10px; font-style: normal; color: #E0E0E0; font-size: 13px; letter-spacing: .08em; } /* 2026-09-22 客户 docx：暗底小字提亮 */
.hero-factory { position: relative; height: 190px; overflow: hidden; margin-top: 24px; border-top: 1px solid rgba(255,255,255,.1); }
.hero-factory img { width: 100%; height: 100%; object-fit: cover; object-position: center 62%; opacity: .92; }
/* 首页底部形象区（工厂全景 + 数据，footer 上方） */
.home-base { background: var(--ink); color: #fff; }
.home-base .hero-factory { margin-top: 0; border-top: 0; }
.hf-cap {
    position: absolute; left: 16px; bottom: 12px;
    font-size: 11px; letter-spacing: .14em; text-transform: uppercase;
    color: #fff; background: rgba(11,11,12,.62); padding: 5px 10px;
}

.hero-stats {
    position: relative;
    z-index: 1;
    border-top: 1px solid rgba(255, 255, 255, .12);
    background: rgba(255, 255, 255, .03);
}
.hero-stats {
    max-width: 1320px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); /* 条数由后台 company_facts 决定，自动均分整行 */
    gap: 0;
    padding: 0 24px;
    border-top: 1px solid rgba(255,255,255,.12);
    background: transparent;
}
/* 2026-09-20 客户反馈「数据区 4 块视觉重量不统一」：统一为「大数字/大简称 + 固定两行小字标签」结构——
   数字行固定高居中、标签行固定两行高，条目长短不均时各块依然等高对齐（首页 hero-stats / About stats-grid / Support 信任条同组件） */
.hs-item { padding: 26px 12px; text-align: center; border-left: 1px solid rgba(255,255,255,.08); display: flex; flex-direction: column; justify-content: center; }
.hs-item:first-child { border-left: 0; }
.hs-item b { display: flex; align-items: center; justify-content: center; min-height: 40px; font-size: 27px; line-height: 1.15; font-weight: 800; color: #fff; letter-spacing: -0.01em; }
.hs-item b .unit { font-size: 16px; color: var(--red); }
.hs-item span { display: flex; align-items: flex-start; justify-content: center; min-height: 42px; line-height: 1.6; font-size: 13px; color: #E0E0E0; letter-spacing: .05em; text-transform: uppercase; } /* 2026-09-22 客户 docx：暗底小字提亮（.dark 浅底变体不受影响） */
.hs-item.dark b { color: var(--ink); }
/* 2026-09-22 客户《Company/About docx》：浅底数据卡说明小字 #444444 提对比（深底 .hs-item span 的 #E0E0E0 不受影响） */
.hs-item.dark span { color: #444444; }

/* ---------- 红条 ---------- */
.stripe { background: var(--red); color: #fff; overflow: hidden; }
.stripe p {
    max-width: 1320px; margin: 0 auto; padding: 18px 24px;
    font-size: 17px; letter-spacing: .02em;
}
.stripe b { font-weight: 800; }

/* ---------- Section 通用 ---------- */
.sec { max-width: 1320px; margin: 0 auto; padding: 84px 24px; }
.sec.alt { max-width: none; background: var(--bg); }
.sec.alt > * { max-width: 1320px; margin-left: auto; margin-right: auto; }
.sec-head { text-align: center; margin-bottom: 48px; }
.sec-head.left { text-align: left; }
.sec-kicker {
    display: inline-block;
    font-size: 13px; font-weight: 700; letter-spacing: .3em;
    color: var(--red); text-transform: uppercase; margin-bottom: 12px;
}
.sec-title {
    font-size: clamp(28px, 3.4vw, 40px);
    font-weight: 800; letter-spacing: -0.01em; text-transform: uppercase;
}
.sec-title.left { text-align: left; }
/* 2026-09-22 客户 docx：白底区块副标题/说明文字统一 #333 提对比（两行历史规则合并） */
.sec-sub { color: #333333; font-size: 18px; text-align: center; max-width: 640px; margin: 14px auto 0; } /* 2026-09-22 客户 docx（一.4）：居中大标题下副标题文字水平居中（多行不再左偏） */
/* 2026-09-22 客户 docx（二.2）：方案页双主按钮居中且间距 16-20px（原 text-align 仅靠空白字符 ≈4px）；
   单按钮板块 justify-content:center 视觉不变，cert-note/qcflow 的局部 flex 覆盖仍在后方生效 */
.sec-more { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 18px; margin-top: 44px; }

/* ---------- COMPANY PROFILE 栏目带（客户 2026-09-09 参考：全宽浅色带 + 特粗黑大写标题，红杠点缀） ---------- */
.cp-band { background: #edeff2; border-bottom: 1px solid var(--line); }
.cp-band-in {
    max-width: 1320px; margin: 0 auto; padding: 30px 24px;
    display: flex; align-items: center; gap: 18px;
}
.cp-band-in::before { content: ""; flex: none; width: 9px; height: 34px; background: var(--red); }
.cp-band-txt { min-width: 0; }
.cp-title { font-size: clamp(26px, 3vw, 38px); font-weight: 800; text-transform: uppercase; letter-spacing: .01em; }
.cp-sub { margin: 6px 0 0; font-size: 15px; color: var(--gray); letter-spacing: .02em; }
/* 2026-09-22 客户 docx（首页 UI）：五大板块上下留白适度缩减（84→56px），首页节奏统一 */
.cp-sec, .sec-hot, .sec-why, .sec-team, .sec-who { padding-top: 56px; padding-bottom: 56px; }

/* ---------- 首页产品轮播（左图右文） ---------- */
.sp-car { position: relative; }
.sp-car-view { position: relative; height: 540px; overflow: hidden; background: var(--bg); }
.sp-car-slide {
    position: absolute; inset: 0; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
    opacity: 0; visibility: hidden;
    transition: opacity .6s var(--ease), visibility .6s var(--ease);
}
.sp-car-slide.on { opacity: 1; visibility: visible; z-index: 2; }
.sp-car-media { position: relative; background: var(--ink); overflow: hidden; }
.sp-car-media img {
    width: 100%; height: 100%; object-fit: cover;
    transform: scale(1.045); transition: transform 6s linear;
}
.sp-car-slide.on .sp-car-media img { transform: scale(1); }
.sp-car-imglink { display: block; width: 100%; height: 100%; }
.sp-car-text {
    background: var(--paper); border: 1px solid var(--line); border-left: 0;
    padding: 52px 56px; display: flex; flex-direction: column; justify-content: flex-start; /* 2026-09-22 客户 docx：文字卡内容顶对齐，与左图上缘平齐，消除各 slide 参差（居中时内容长短不一显倾斜） */
    overflow-y: auto;
}
.sp-car-idx { font-size: 12px; font-weight: 700; letter-spacing: .25em; color: var(--gray); margin-bottom: 16px; }
.sp-car-text h3 {
    font-size: clamp(24px, 2.6vw, 36px); font-weight: 800; line-height: 1.15;
    text-transform: uppercase; letter-spacing: -0.01em; margin-bottom: 8px;
}
.sp-car-text h3::after { content: ""; display: block; width: 52px; height: 4px; background: var(--red); margin-top: 16px; }
.sp-car-text p { color: #333333; font-size: 15.5px; margin: 18px 0 26px; } /* 2026-09-22 客户 docx：白底段落文字 #333 */
.sp-car-btn {
    align-self: flex-start; display: inline-flex; align-items: center; gap: 10px;
    border: 2px solid var(--ink); padding: 17px 34px; font-size: 15.5px; font-weight: 700; /* 2026-09-22 客户 docx：与全站按钮统一尺寸字号 */
    letter-spacing: .05em; text-transform: uppercase; transition: all .2s;
}
.sp-car-btn:hover { background: var(--red); border-color: var(--red); color: #fff; }
.sp-car-ctrls { display: flex; align-items: center; justify-content: flex-end; gap: 16px; margin-top: 22px; }
.sp-car-btn-prev, .sp-car-btn-next {
    width: 44px; height: 44px; border: 1px solid var(--line); background: #fff;
    font-style: normal; font-size: 17px; color: var(--ink);
    display: inline-flex; align-items: center; justify-content: center; transition: all .2s;
}
.sp-car-btn-prev:hover, .sp-car-btn-next:hover { background: var(--ink); color: #fff; border-color: var(--ink); }
.sp-car-dots { display: flex; align-items: center; gap: 8px; margin-right: auto; }
.sp-car-dot { width: 10px; height: 10px; padding: 0; border-radius: 50%; border: 1px solid var(--gray-l); background: transparent; transition: all .25s var(--ease); }
.sp-car-dot:hover { border-color: var(--red); }
.sp-car-dot.on { width: 28px; border-radius: 6px; background: var(--red); border-color: var(--red); }
.sp-car-single .sp-car-ctrls { display: none; }

/* ---------- 产品卡 ---------- */
/* 2026-09-22 客户《Machines docx》：行间距 30-40 目标 → 行 32 列 20（分类页/列表页同源） */
.prod-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px 20px; }
.prod-grid.col3 { grid-template-columns: repeat(3, 1fr); }
.prod-grid.col4 { grid-template-columns: repeat(4, 1fr); }
.prod-card {
    background: #fff; border: 1px solid var(--line);
    display: flex; flex-direction: column;
    transition: all .25s var(--ease); position: relative;
}
.prod-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-lg); border-color: transparent; }
.prod-img { position: relative; aspect-ratio: 4/3; overflow: hidden; background: #fff; }
.prod-img img { width: 100%; height: 100%; object-fit: contain; padding: 14px; transition: transform .4s var(--ease); }
.prod-card:hover .prod-img img { transform: scale(1.05); }
.tag-hot {
    position: absolute; top: 0; left: 0;
    background: var(--red); color: #fff;
    font-size: 11px; font-weight: 800; letter-spacing: .12em;
    padding: 5px 12px;
}
.prod-body { padding: 18px 18px 20px; display: flex; flex-direction: column; flex: 1; }
.prod-cat {
    font-size: 11px; font-weight: 700; letter-spacing: .14em;
    text-transform: uppercase; color: var(--red); margin-bottom: 8px;
}
.prod-body b { font-size: 16px; line-height: 1.4; margin-bottom: 8px; }
.prod-body p { font-size: 13.5px; color: var(--gray); flex: 1; margin-bottom: 12px; }
.prod-foot { display: flex; justify-content: space-between; align-items: center; border-top: 1px solid var(--line); padding-top: 12px; }
.prod-moq { font-size: 12px; color: var(--gray); }
.prod-more { font-size: 13px; font-weight: 700; color: var(--red); letter-spacing: .04em; text-transform: uppercase; }

/* ---------- Why 区 ---------- */
.why-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
/* 公司展示 6 篇幅（2026-09-10，数据源 fa_store_slider，表空回退上方 why-grid） */
.show-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
.show-card {
    background: #fff;
    border: 1px solid var(--line);
    transition: transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s;
}
.show-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-color: var(--red); }
.show-img { aspect-ratio: 4 / 3; overflow: hidden; }
.show-img img {
    width: 100%; height: 100%; object-fit: cover; display: block;
    transition: transform .45s var(--ease);
}
.show-card:hover .show-img img { transform: scale(1.045); }
.show-body { padding: 18px 20px 22px; }
.show-body b {
    display: block; font-size: 15.5px;
    text-transform: uppercase; letter-spacing: .01em;
}
.show-body p { margin: 8px 0 0; font-size: 13.5px; line-height: 1.7; color: #333333; } /* 2026-09-22 客户 docx：白底卡片正文 #333 */
.why-card {
    border-top: 3px solid var(--ink);
    padding: 26px 22px 24px;
    background: #fff;
    transition: border-color .25s;
}
.why-card:hover { border-color: var(--red); }
.why-num {
    display: block; font-style: normal;
    font-size: 34px; font-weight: 800; color: var(--line);
    line-height: 1; margin-bottom: 14px;
}
.why-card b { display: block; font-size: 17px; margin-bottom: 10px; text-transform: uppercase; letter-spacing: .01em; }
.why-card p { font-size: 14px; color: var(--gray); }
.why-banner {
    margin-top: 48px; display: grid; grid-template-columns: 1.4fr 1fr;
    background: var(--ink); color: #fff;
}
.why-banner img { width: 100%; height: 100%; object-fit: cover; max-height: 320px; }
.wb-text { padding: 44px 40px; display: flex; flex-direction: column; justify-content: center; }
.wb-text b { font-size: 24px; font-weight: 800; text-transform: uppercase; margin-bottom: 14px; }
.wb-text p { color: #b9bcc6; font-size: 15px; margin-bottom: 22px; }
.wb-text a { color: var(--red); font-weight: 700; letter-spacing: .04em; text-transform: uppercase; font-size: 14px; }
.wb-text a:hover { color: #fff; }
/* why-banner 团队介绍：7 支团队名称胶囊标签（数据源 fa_store_team，空表时整行不渲染） */
.wb-tags { list-style: none; margin: 0 0 24px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.wb-tags li { font-size: 12.5px; line-height: 1; padding: 9px 14px; border: 1px solid rgba(255,255,255,.28); border-radius: 999px; color: #e8e9ee; letter-spacing: .02em; white-space: nowrap; }

/* ---------- News ---------- */
.news-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.news-card { background: #fff; border: 1px solid var(--line); transition: all .25s var(--ease); display: flex; flex-direction: column; }
.news-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-lg); border-color: transparent; }
.news-img { aspect-ratio: 16/9; overflow: hidden; }
.news-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.news-card:hover .news-img img { transform: scale(1.05); }
.news-body { padding: 20px; flex: 1; }
.news-body time { font-size: 12px; color: var(--gray-l); letter-spacing: .06em; text-transform: uppercase; }
.news-body b { display: block; font-size: 17px; line-height: 1.4; margin: 8px 0; }
.news-body p { font-size: 13.5px; color: var(--gray); }

/* ---------- 行业圆图卡（/industries.html 用；首页同款版式 2026-09-15 起改为下方 serve 卡片） ---------- */
/* 2026-09-22 客户 docx：WHO WE SERVE 栏目头与全站各板块统一水平居中 */
.who-head { margin-bottom: 44px; text-align: center; }
.who-title { font-size: clamp(24px, 2.6vw, 30px); font-weight: 800; text-transform: uppercase; letter-spacing: -.01em; }
.who-sub { color: #333333; font-size: 15px; margin: 10px auto 0; max-width: 860px; } /* 2026-09-22 客户 docx：白底说明文字 #333 + 盒体居中 */
.who-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 44px 20px; }
.who-item { text-align: center; display: flex; flex-direction: column; align-items: center; }
.who-item img { width: 220px; height: 220px; border-radius: 50%; box-shadow: 0 10px 26px rgba(11,11,12,.10); transition: transform .3s var(--ease), box-shadow .3s var(--ease); }
.who-item:hover img { transform: translateY(-6px) scale(1.04); box-shadow: 0 18px 36px rgba(11,11,12,.16); }
.who-item b { display: block; font-size: 15px; margin-top: 18px; }
.who-item p { font-size: 12.5px; line-height: 1.55; color: var(--gray); margin-top: 6px; max-width: 210px; }

/* ---------- WHO WE SERVE（客户 2026-09-15：首页客户类型卡 + /who-we-serve.html，数据源 fa_store_serve；
            2026-09-20 客户《Company修改.docx》：4×2 八卡 → 3×2 六卡对称网格，控制器只取前 6） ---------- */
.serve-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
.serve-grid .show-card { display: flex; flex-direction: column; }
.serve-grid .show-body { display: flex; flex-direction: column; flex: 1; padding: 18px 20px 22px; } /* 2026-09-22 客户 docx：卡片内边距与 .show-body 基准统一 */
.serve-grid .show-body b { font-size: 14.5px; }
.serve-grid .show-body p { flex: 1; font-size: 13px; line-height: 1.65; }
.serve-more { display: block; font-style: normal; margin-top: 14px; font-size: 12px; font-weight: 700; color: var(--red); text-transform: uppercase; letter-spacing: .08em; }
.serve-more em { font-style: normal; display: inline-block; margin-left: 4px; transition: transform .2s var(--ease); }
.serve-grid .show-card:hover .serve-more em { transform: translateX(4px); }

/* ---------- /who-we-serve.html（2026-09-23 客户《HYPERLINK.docx》简化：撤分组标签/快速导航/ABC 分组头，
   12 类扁平 3 列卡片栅格，前 6 直接展示 + 其余 Explore More 展开区；卡片等高、图片统一 4:3、按钮钉底） ---------- */
/* 2026-09-22 客户《Who We Serve docx》：行间距 30-40 目标 → 行 32 列 26 */
.ws-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px 26px; }

/* 卡片：整卡可点（2026-09-23 起直达四级详情页）；flex column + needs 区 flex:1 让 Learn More 恒钉底（同行卡片等高） */
.wsc { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); overflow: hidden; transition: transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s var(--ease); scroll-margin-top: 118px; }
.wsc:hover { transform: translateY(-4px); box-shadow: 0 16px 34px rgba(11, 11, 12, .12); border-color: rgba(215, 25, 32, .45); }
.wsc-media { position: relative; display: block; aspect-ratio: 4 / 3; overflow: hidden; background: #f2f3f5; }
.wsc-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s var(--ease); }
.wsc:hover .wsc-media img { transform: scale(1.04); }
/* 2026-09-21 客户《Company修改 - 副本.docx》：卡图上的序号徽章（.wsc-num）整体移除，卡面干净无标注（模板 span 已删，规则随之清理） */
.wsc-body { display: flex; flex-direction: column; flex: 1; padding: 18px 20px 20px; }
.wsc-title { display: block; font-size: 15.5px; line-height: 1.4; font-weight: 800; text-transform: uppercase; letter-spacing: .01em; }
.wsc-sum { display: block; margin-top: 8px; font-size: 14px; line-height: 1.65; color: var(--gray); }
.wsc-needs { display: block; margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--line); flex: 1; }
.wsc-needs > b { display: block; font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--ink); }
/* 2026-09-20 客户《Company修改.docx》：细分领域上限 3→8，4/5/6 条时 2 列对称网格（末条奇数通栏，同 pe-get 惯例） */
/* 2026-09-22 客户《Who We Serve docx》：打勾列表行距 12-16 目标（原行 2px 过密，列 14 达标保留） */
.wsc-needs ul { list-style: none; margin: 8px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px 14px; }
.wsc-needs ul li:last-child:nth-child(odd) { grid-column: 1 / -1; }
.wsc-needs li { position: relative; padding-left: 18px; font-size: 14px; line-height: 1.5; color: var(--gray); margin-top: 5px; }
.wsc-needs li::before { content: '✓'; position: absolute; left: 0; top: 0; color: var(--red); font-weight: 800; }
.wsc-btn { display: inline-flex; align-items: center; gap: 6px; margin-top: 16px; font-size: 12.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--red); }
.wsc-btn i { font-style: normal; transition: transform .2s var(--ease); }
.wsc:hover .wsc-btn i { transform: translateX(4px); }

/* ---------- 四级详情页 /who-we-serve/<slug>.html（2026-09-23 客户《HYPERLINK.docx》：
   8 张图 12 宫格（4 列×2 行），上图下文，纯静态不可点；≤1120 3 列 / ≤920 2 列） ---------- */
.wsi-lead { max-width: 900px; margin: 0 0 34px; font-size: 16px; line-height: 1.8; color: var(--gray); }
.wsi-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 26px 24px; }
.wsi { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); overflow: hidden; }
.wsi-media { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: #f2f3f5; }
.wsi-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.wsi-body { padding: 14px 16px 16px; }
.wsi-title { display: block; font-size: 14.5px; line-height: 1.4; font-weight: 800; }
.wsi-sum { display: block; margin-top: 6px; font-size: 13px; line-height: 1.6; color: var(--gray); }

/* 底部 CTA（下方接全站 footer 询盘表单区，页面仅此一个表单） */
.ws-cta-in { max-width: 860px; margin: 0 auto; text-align: center; }
.ws-cta-in h2 { font-size: clamp(22px, 2.6vw, 32px); font-weight: 800; text-transform: uppercase; letter-spacing: -.01em; }
.ws-cta-in p { margin-top: 14px; font-size: 16px; line-height: 1.75; color: var(--gray); }
.ws-cta-btns { margin-top: 26px; display: flex; justify-content: center; gap: 18px; flex-wrap: wrap; } /* 2026-09-22 docx：双按钮间距 16-20 目标 */

/* ---------- CTA band（footer 上方询盘表单区，样式见文件末尾 .cta-band 块） ---------- */

/* ---------- 内页头 ---------- */
.pagehead { background: var(--ink); color: #fff; position: relative; overflow: hidden; }
.pagehead::before {
    content: "";
    position: absolute; inset: 0;
    background:
        radial-gradient(560px 300px at 88% 20%, rgba(215, 25, 32, .16), transparent 62%),
        repeating-linear-gradient(90deg, rgba(255,255,255,.02) 0 1px, transparent 1px 90px);
}
.pagehead-inner { position: relative; z-index: 1; max-width: 1320px; margin: 0 auto; padding: 56px 24px 58px; }
.pagehead.small .pagehead-inner { padding: 34px 24px 36px; }
.pagehead h1 { font-size: clamp(30px, 4vw, 46px); font-weight: 800; text-transform: uppercase; letter-spacing: -0.01em; margin-top: 14px; }
/* 2026-09-19 Company 页 hero：核心标题（h1 下第二行主张）+ 双按钮（btn-red 主 / btn-line 次） */
.pagehead-core { font-size: clamp(18px, 2.2vw, 24px); font-weight: 700; color: #fff; margin-top: 14px; letter-spacing: .01em; }
.pagehead-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-top: 26px; }
.pagehead-actions .btn { padding: 13px 26px; font-size: 14px; }
.pagehead-sub { color: #E5E5E5; max-width: 700px; margin-top: 12px; font-size: 16px; line-height: 1.7; } /* 2026-09-22 客户 docx：横幅副标题提亮（现色 #b9bcc6 偏暗；行高 1.7 已高于客户 1.5-1.6 目标区间，保持更宽松不再调） */
/* 2026-09-20 客户《Support修改.docx》：FAT/Spare Parts 首屏主标题下副标题短行（白色加重，正文行仍走 pagehead-sub） */
.pagehead-lead { color: #fff; font-weight: 600; max-width: 700px; margin-top: 16px; font-size: 16.5px; line-height: 1.6; }
.pagehead-lead + .pagehead-sub { margin-top: 8px; }
.crumbs { font-size: 13px; color: #cccccc; } /* 2026-09-22 客户 docx（二.1）：面包屑整体提亮为浅灰 #ccc（末级 b 亮红为另一 docx 既定改动，保留） */
.crumbs a { color: #cccccc; }
.crumbs a:hover { color: #fff; }
.crumbs b { color: var(--red-l); font-weight: 600; } /* 2026-09-22 客户 docx（Production Optimization 详情页）：黑底面包屑末级 #D71920 对比不足 → 亮红 --red-l（.crumbs 全部位于深底 pagehead/abo-hero，全局安全） */
.crumbs .sep { margin: 0 6px; }
/* WHO WE SERVE 页头右侧点缀（客户 2026-09-15）：很淡的制造网络节点连线 SVG，不干扰左侧文字 */
.pagehead-net::after {
    content: "";
    position: absolute;
    right: -20px;
    top: 50%;
    width: 640px;
    height: 340px;
    transform: translateY(-50%);
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 340'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='.5'%3E%3Cpath d='M60 260 L180 170 L320 210 L440 90 L580 150'/%3E%3Cpath d='M180 170 L270 60 L440 90'/%3E%3Cpath d='M320 210 L440 90 L540 260 L320 210'/%3E%3Cpath d='M60 260 L320 210'/%3E%3Cpath d='M270 60 L580 150'/%3E%3C/g%3E%3Cg fill='%23ffffff'%3E%3Ccircle cx='60' cy='260' r='4'/%3E%3Ccircle cx='180' cy='170' r='6'/%3E%3Ccircle cx='270' cy='60' r='4'/%3E%3Ccircle cx='320' cy='210' r='5'/%3E%3Ccircle cx='440' cy='90' r='7'/%3E%3Ccircle cx='540' cy='260' r='4'/%3E%3Ccircle cx='580' cy='150' r='5'/%3E%3C/g%3E%3Ccircle cx='440' cy='90' r='13' fill='none' stroke='%23d71920' stroke-opacity='.65' stroke-width='1.5'/%3E%3C/svg%3E") center / contain no-repeat;
    opacity: .13;
    pointer-events: none;
}

/* ---------- 列表布局 ---------- */
.list-layout { display: grid; grid-template-columns: 260px 1fr; gap: 34px; align-items: start; }
.list-side { position: sticky; top: 96px; display: flex; flex-direction: column; gap: 18px; }
.side-box { border: 1px solid var(--line); background: #fff; padding: 22px; }
.side-box h4 { font-size: 13px; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 14px; border-bottom: 2px solid var(--red); display: inline-block; padding-bottom: 6px; }
/* 2026-09-22 客户《Machines docx》：分类列表行高 1.8 + 内边距加大；hover/选中态加浅红底高亮更醒目 */
.side-link { display: flex; justify-content: space-between; gap: 8px; padding: 9px 10px; font-size: 14.5px; line-height: 1.8; border-bottom: 1px dashed var(--line); border-radius: 6px; transition: background .15s, color .15s; }
.side-link i { font-style: normal; color: var(--gray-l); font-size: 12.5px; }
.side-link:hover { color: var(--red); background: #fbf2f2; }
.side-link.on { color: var(--red); font-weight: 700; background: #fbf2f2; }
.side-cta { background: var(--ink); color: #fff; border: 0; }
.side-cta b { display: block; font-size: 16.5px; margin-bottom: 8px; text-transform: uppercase; }
.side-cta p { font-size: 13.5px; color: #b9bcc6; margin-bottom: 16px; }
/* 2026-09-22 客户《Machines docx》：黑卡按钮水平居中 */
.side-cta .btn { display: flex; width: fit-content; margin: 0 auto; }
.side-news { display: block; padding: 10px 0; border-bottom: 1px dashed var(--line); }
.side-news b { display: block; font-size: 14px; line-height: 1.4; }
.side-news:hover b { color: var(--red); }
.side-news time { font-size: 12px; color: var(--gray-l); }
.empty { padding: 60px 20px; text-align: center; border: 1px dashed var(--line); background: #fff; }
.empty b { display: block; font-size: 20px; margin-bottom: 8px; }
.empty p { color: var(--gray); }
.empty a { color: var(--red); font-weight: 600; }
/* 空态内实体按钮（2026-09-30 技术分享空分类）：.empty a 的红字会盖掉 btn-red 白字，改回白字 */
.empty .btn { color: #fff; }

.pager { display: flex; gap: 8px; justify-content: center; margin-top: 44px; flex-wrap: wrap; }
/* 2026-09-22 客户《5 Case Studies docx》：分页统一样式——统一圆角 8px、文字 ink-2 提对比、hover 红描边红字与选中态同一语言 */
.pg { min-width: 42px; height: 42px; display: inline-flex; align-items: center; justify-content: center; padding: 0 12px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--ink-2); font-size: 14px; font-weight: 600; transition: all .2s; }
.pg:hover { border-color: var(--red); color: var(--red); }
.pg.on { background: var(--red); border-color: var(--red); color: #fff; }

/* ---------- 产品详情 ---------- */
#inquiry-form { scroll-margin-top: 90px; } /* Send Inquiry 锚点滚动预留 sticky 头部高度 */
#inquiry { scroll-margin-top: 90px; } /* 各页 CTA 按钮 #inquiry 平滑滚动至 layout 询盘表单区，预留 sticky 头部高度（2026-09-21） */
.detail-top { display: grid; grid-template-columns: 1.05fr 1fr; gap: 48px; margin-bottom: 56px; }
.gallery-main { aspect-ratio: 4/3; border: 1px solid var(--line); background: #fff; display: flex; align-items: center; justify-content: center; overflow: hidden; position: relative; cursor: zoom-in; }
.gallery-main img { max-height: 100%; width: 100%; object-fit: contain; padding: 18px; transition: transform .35s var(--ease); }
@media (hover:hover) { .gallery-main:hover img { transform: scale(1.03); } }
/* 大图右下角放大提示（悬停显现，点击进灯箱看高清原图） */
.gallery-zoom { position: absolute; right: 12px; bottom: 12px; width: 36px; height: 36px; border-radius: 50%; background: rgba(11,11,12,.55); color: #fff; display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity .25s var(--ease); pointer-events: none; }
.gallery-main:hover .gallery-zoom { opacity: 1; }
/* 产品图库灯箱：全屏看高清原图 */
.sp-lightbox { position: fixed; inset: 0; z-index: 9999; background: rgba(11,11,12,.93); display: flex; align-items: center; justify-content: center; padding: 34px; cursor: zoom-out; }
.sp-lightbox img { max-width: 94vw; max-height: 92vh; width: auto; height: auto; object-fit: contain; box-shadow: 0 16px 70px rgba(0,0,0,.55); }
.sp-lightbox-close { position: absolute; top: 14px; right: 16px; width: 44px; height: 44px; border: 0; border-radius: 50%; background: rgba(255,255,255,.14); color: #fff; font-size: 24px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.sp-lightbox-close:hover { background: var(--red); }
.gallery-thumbs { display: flex; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
.gallery-thumb { border: 1px solid var(--line); background: #fff; padding: 4px; width: 84px; height: 72px; opacity: .6; transition: all .2s; }
.gallery-thumb img { width: 100%; height: 100%; object-fit: contain; }
.gallery-thumb.active, .gallery-thumb:hover { opacity: 1; border-color: var(--red); }
.detail-info h1 { font-size: clamp(24px, 2.6vw, 34px); line-height: 1.25; font-weight: 800; margin: 10px 0 16px; }
.detail-summary { color: var(--gray); font-size: 16px; margin-bottom: 22px; }
.detail-points { margin-bottom: 28px; border-top: 1px solid var(--line); }
.detail-points li { padding: 11px 2px; border-bottom: 1px dashed var(--line); font-size: 14.5px; color: var(--gray); }
.detail-points b { color: var(--ink); margin-right: 8px; }
.detail-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.detail-specs, .detail-content { margin-bottom: 48px; }
.detail-specs h2, .detail-content h2 { font-size: 20px; text-transform: uppercase; letter-spacing: .04em; margin-bottom: 18px; border-left: 4px solid var(--red); padding-left: 14px; }
.spec-table { width: 100%; border-collapse: collapse; background: #fff; font-size: 14.5px; }
.spec-table th { width: 220px; text-align: left; font-weight: 600; background: var(--bg); }
.spec-table th, .spec-table td { padding: 12px 16px; border: 1px solid var(--line); }
.rich p { margin-bottom: 14px; color: #3a3d45; }

/* ---------- 2026-10-07 后台补装 Summernote 富文本编辑器：客户可在案例/新闻正文自插图、表格、列表，
   补齐裸标签前台样式（原有 .sol-body-text figure 系列管 docx 管线的图片，这里管编辑器产出的裸标签） ---------- */
.rich img { max-width: 100%; height: auto; }
.rich table { width: 100%; border-collapse: collapse; margin: 20px 0 24px; background: #fff; font-size: 15px; }
.rich th, .rich td { border: 1px solid var(--line); padding: 10px 14px; text-align: left; vertical-align: top; }
.rich th { background: var(--bg); font-weight: 700; }
.rich ul, .rich ol { margin: 0 0 16px; padding-left: 24px; color: #3a3d45; font-size: 16px; }
.rich li { margin-bottom: 8px; }
.rich h2, .rich h3, .rich h4 { margin: 28px 0 12px; color: var(--ink); letter-spacing: .02em; }
.rich h2 { font-size: 19px; }
.rich h3 { font-size: 17px; }
.rich h4 { font-size: 16px; }
.rich a { color: var(--red); }
.rich blockquote { margin: 20px 0; padding: 12px 18px; border-left: 3px solid var(--red); background: #f7f8fa; color: #3a3d45; }
.rich hr { margin: 26px 0; border: 0; border-top: 1px solid var(--line); }

/* ---------- 询盘框 ---------- */
.inquiry-box { display: grid; grid-template-columns: .8fr 1.2fr; gap: 36px; background: var(--ink); color: #fff; padding: 44px; align-items: start; }
.ib-text b { display: block; font-size: 22px; text-transform: uppercase; margin-bottom: 12px; }
.ib-text p { color: #b9bcc6; font-size: 15px; }
.inq-form .frow { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.inq-form input, .inq-form textarea, .inq-form select {
    width: 100%; margin-bottom: 12px; padding: 14px 16px;
    background: rgba(255,255,255,.06); color: #fff;
    border: 1px solid rgba(255,255,255,.18);
    font-family: inherit; font-size: 14.5px; outline: none; transition: border .2s;
}
.inq-form input::placeholder, .inq-form textarea::placeholder { color: #8d919c; }
.inq-form input:focus, .inq-form textarea:focus, .inq-form select:focus { border-color: var(--red); }
.inq-form select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, #8d919c 50%), linear-gradient(135deg, #8d919c 50%, transparent 50%); background-position: calc(100% - 20px) 20px, calc(100% - 15px) 20px; background-size: 5px 5px; background-repeat: no-repeat; }
.inq-form select option { color: var(--ink); }
.inq-form .btn { margin-top: 4px; }
.honey { position: absolute !important; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.form-msg { margin-top: 12px; font-size: 14px; min-height: 22px; }
.form-msg.ok { color: #4ade80; }
.form-msg.err { color: #fca5a5; }

/* ---------- 解决方案 ---------- */
/* 2026-09-20 客户要求：顶部 Solution 模块 3 个时 2 列下第二行右侧留白 → 桌面 3 列并排一行；
   卡片数恰为 3n+1（如未来 4/7 张）时末卡落中列居中，避免孤卡偏左。
   minmax(0,1fr) 压低轨道 min-content：后台录入的超长词/长串在旧内核（不支持
   overflow-wrap:anywhere）也不会把单元格/页面撑出横向滚动（2026-09-21 响应式审查） */
/* 2026-09-22 客户《5 Case Studies docx》：行间距 30-40 目标 → 行 32 列 24（solutions 列表页同源受益） */
.sol-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 24px; }
/* 3n+1 末卡居中只对桌面 3 列档有意义；两列/单列档强制中列会留空位（2026-09-21） */
@media (min-width: 1121px) {
    .sol-grid .sol-card:last-child:nth-child(3n+1) { grid-column: 2; }
}
.sol-card { border: 1px solid var(--line); background: #fff; overflow: hidden; transition: all .25s var(--ease); display: flex; flex-direction: column; }
.sol-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-lg); border-color: transparent; }
/* 2026-09-22 客户反馈 solutions.html 区块图片显示不全：容器 21:9 对 16:9 原图裁掉约 24% 高度 → 改 16:9
   （方案卡三图恰为 16:9 零裁切；案例卡 6 图 3:2 裁切由 36% 降至 15%；与全站大图 16:9 惯例一致） */
.sol-img { aspect-ratio: 16/9; overflow: hidden; }
.sol-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.sol-card:hover .sol-img img { transform: scale(1.05); }
.sol-body { padding: 26px; display: flex; flex-direction: column; flex: 1; } /* 2026-09-22 客户 docx：卡体 flex:1 吃满拉伸高度 + 卡内转 flex 列，p 的 flex:1 生效 → 正文不等长时 VIEW SOLUTION 链接贴底对齐（列表页/推荐卡同受益） */
.sol-body b { display: block; font-size: 20px; text-transform: uppercase; margin-bottom: 10px; }
.sol-body p { color: var(--gray); font-size: 14.5px; margin-bottom: 16px; flex: 1; }
/* 2026-09-22 客户反馈方案/案例详情页头图显示不全：原 max-height:480px 使容器比 2.65:1，16:9 方案图裁 49%、
   3:2 案例图裁 77% → 改 aspect-ratio 16:9；控制器按 isCase 给案例页加 .ar32 用 3:2——两类源图全部零裁切 */
.sol-hero { margin-bottom: 36px; border: 1px solid var(--line); overflow: hidden; }
.sol-hero img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.sol-hero.ar32 img { aspect-ratio: 3 / 2; }
.sol-body-text { max-width: 860px; }
.sol-body-text p { margin-bottom: 16px; color: #3a3d45; font-size: 16px; }
/* 2026-09-21 客户要求（5 Case Studies.docx）：详情正文改五段式（Project Background/The Challenge/
   Our Solution/Project Result/Application），独占一段的 <strong> 识别为小节标题做视觉强化 */
.sol-body-text p > strong:only-child {
    display: block;
    margin: 28px 0 12px;
    padding-left: 10px;
    border-left: 3px solid var(--red);
    font-size: 17px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--ink);
}
.sol-body-text p:first-child > strong:only-child { margin-top: 0; }
.sol-chips { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.sol-chip { border: 1px solid var(--line); padding: 16px 18px; font-weight: 700; font-size: 14.5px; background: #fff; transition: all .2s; }
.sol-chip:hover { border-color: var(--red); color: var(--red); }

/* ---------- 2026-09-20 客户 Solutions 审查报告 ---------- */
/* 详情页正文亮点卡片：图标+小标题+描述，替代三段纯文本（后台 highlights 每行「小标题|描述」，留空回退正文）；
   minmax(0,1fr) 同 .sol-grid（2026-09-21 响应式审查，旧内核 min-content 防撑破） */
.sp-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
/* 2026-09-22 客户《CNC Turning Machine Solutions.docx》：卡片转 flex 列（grid 默认 stretch 已拉平等高，
   flex 列让内部 流图标→标题→正文 纵向节奏恒定、p flex:1 吸收剩余高度，换行数不同留白差不再改变标题/图标位） */
.sp-card { background: #fff; border: 1px solid var(--line); padding: 26px 24px; transition: all .2s var(--ease); display: flex; flex-direction: column; }
@media (hover: hover) {
    .sp-card:hover { border-color: var(--red); transform: translateY(-4px); box-shadow: var(--shadow); }
}
.sp-ic { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 10px; background: rgba(215,25,32,.08); color: var(--red); align-self: flex-start; }
.sp-ic svg { width: 24px; height: 24px; display: block; }
.sp-card b { display: block; font-size: 16.5px; text-transform: uppercase; letter-spacing: .02em; margin: 16px 0 8px; }
.sp-card p { color: var(--gray); font-size: 14.5px; line-height: 1.7; margin: 0; flex: 1; }
/* OTHER SOLUTIONS：纯文字按钮改缩略图卡片（复用 sol-card 卡体，2 列铺满不留白）；
   客户点名「悬停变色」：悬停描边转品牌红（sol-card 默认 hover 只浮起+阴影+图片缩放） */
.sol-rel { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px; } /* 2026-09-22 客户 docx：推荐卡列间距 24→36px（客户要求 30-40px） */
.sol-rel .sol-body { padding: 20px 22px 22px; }
.sol-rel .sol-body b { font-size: 16.5px; }
.sol-rel .prod-more { font-size: 13.5px; }
.sol-rel .sol-card:hover { border-color: var(--red); }
/* 2026-09-21 客户《Production Optimization & Machine Retrofit.docx》：后台录入的长单词/长串
   超列宽时允许断词换行；anywhere 同时压低 grid/flex 的 min-content，防卡片把轨道撑破 */
.sp-card b, .sp-card p, .sol-body b, .sol-body p, .pagehead h1, .pagehead-sub, .sec-title { overflow-wrap: anywhere; }

/* ---------- 文章 ---------- */
.news-list { display: flex; flex-direction: column; gap: 22px; }
.news-item { display: grid; grid-template-columns: 260px 1fr; gap: 24px; border: 1px solid var(--line); background: #fff; overflow: hidden; transition: all .25s var(--ease); }
.news-item:hover { box-shadow: var(--shadow-lg); border-color: transparent; }
.ni-img { aspect-ratio: 4/3; overflow: hidden; }
.ni-img img { width: 100%; height: 100%; object-fit: cover; }
.ni-body { padding: 22px 24px 22px 0; display: flex; flex-direction: column; justify-content: center; }
.ni-body time { font-size: 12px; color: var(--gray-l); text-transform: uppercase; letter-spacing: .06em; }
.ni-body b { font-size: 19px; line-height: 1.35; margin: 8px 0; }
.ni-body p { color: var(--gray); font-size: 14px; margin-bottom: 10px; }
.article-layout { display: grid; grid-template-columns: 1fr 300px; gap: 40px; align-items: start; }
.article-title { font-size: clamp(26px, 3vw, 38px); line-height: 1.25; font-weight: 800; margin-bottom: 14px; }
.article-meta { display: flex; gap: 18px; font-size: 13px; color: var(--gray-l); text-transform: uppercase; letter-spacing: .05em; margin-bottom: 26px; }
.article-cover { margin-bottom: 30px; border: 1px solid var(--line); }
.article-cover img { width: 100%; max-height: 460px; object-fit: cover; }
.article-body { font-size: 16.5px; }
.article-body p { margin-bottom: 18px; color: #3a3d45; }
.article-cta { margin-top: 40px; border-left: 4px solid var(--red); background: var(--bg); padding: 26px; }
.article-cta b { display: block; font-size: 18px; margin-bottom: 6px; }
.article-cta p { color: var(--gray); margin-bottom: 16px; font-size: 14.5px; }

/* ---------- About ---------- */
.abo-hero { position: relative; min-height: 420px; display: flex; align-items: center; color: #fff; overflow: hidden; background: var(--ink); }
.abo-hero-bg { position: absolute; inset: 0; }
.abo-hero-bg img { width: 100%; height: 100%; object-fit: cover; opacity: .5; }
.abo-hero-veil { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(11,11,12,.88) 20%, rgba(11,11,12,.35)); }
.abo-hero-text { position: relative; z-index: 1; max-width: 1320px; margin: 0 auto; padding: 70px 24px; width: 100%; }
.abo-hero-text .crumbs { margin-bottom: 18px; }
.abo-hero-text h1 { font-size: clamp(32px, 4.4vw, 52px); font-weight: 800; text-transform: uppercase; margin: 16px 0 12px; }
.abo-hero-text p { color: #E5E5E5; font-size: 17px; max-width: 640px; } /* 2026-09-22 客户《About SIPENG docx》：hero 副标题提亮（同 pagehead-sub 令牌） */
.sec-abo-stats { padding: 56px 24px; }
.stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); max-width: 1320px; margin: 0 auto; background: var(--bg); }
.stats-grid .hs-item { border-left: 1px solid var(--line); }
.stats-grid .hs-item:first-child { border-left: 0; }
.abo-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
/* 2026-09-22 客户《Shafts & Pins 等七份应用详情页 docx》正文指令：颜色 #333333（与 136 轮白底正文
   色令牌统一）、段间距 20px；行高 1.75 已在客户 1.6-1.8 目标区间内保持不变 */
.abo-text p { color: #333333; margin-bottom: 20px; font-size: 16px; line-height: 1.75; }
/* 同批 docx：正文最大宽度 800/850 档 → 850px（原 860，居中不变），applications 详情等 14 模板 intro 同步受益 */
.abo-text.narrow { max-width: 850px; margin: 0 auto; }
.abo-img { display: grid; gap: 14px; }
.abo-img img { width: 100%; height: 260px; object-fit: cover; }
.abo-img img:first-child { height: 320px; }
.abo-img img.fit-top { object-position: center top; } /* boss.png 已裁边，cover 定高需从顶部起显示人头 */
/* 2026-09-22 客户《Company docx》：制造网络卡行间距 30-40 目标 → 行 32 列 18（about 页产能卡同源） */
.fac-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px 18px; }
.fac-card { background: #fff; border: 1px solid var(--line); overflow: hidden; }
.fac-card img { aspect-ratio: 4/3; width: 100%; object-fit: cover; }
.fac-body { padding: 18px; }
.fac-body b { display: block; font-size: 16px; text-transform: uppercase; margin-bottom: 8px; }
.fac-body p { font-size: 13.5px; color: var(--gray); }
.facility-strip { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin-top: 44px; }
.facility-strip img { width: 100%; height: 150px; object-fit: cover; }

/* ---------- FAQ ---------- */
.faq-wrap { max-width: 880px; margin: 0 auto; }
.faq-cat { margin-bottom: 40px; }
.faq-cat-title { font-size: 20px; text-transform: uppercase; letter-spacing: .03em; margin-bottom: 16px; border-left: 4px solid var(--red); padding-left: 14px; }
.faq-item { border: 1px solid var(--line); background: #fff; margin-bottom: 10px; }
.faq-item summary {
    list-style: none; cursor: pointer;
    display: flex; justify-content: space-between; align-items: center; gap: 16px;
    padding: 18px 22px; font-size: 16px; font-weight: 700;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary:hover { color: var(--red); }
.faq-mark { position: relative; width: 14px; height: 14px; flex-shrink: 0; }
.faq-mark::before, .faq-mark::after { content: ""; position: absolute; background: currentColor; transition: all .25s; }
.faq-mark::before { left: 0; right: 0; top: 6px; height: 2px; }
.faq-mark::after { top: 0; bottom: 0; left: 6px; width: 2px; }
.faq-item[open] .faq-mark::after { transform: rotate(90deg); opacity: 0; }
.faq-a { padding: 0 22px 20px; color: #3a3d45; font-size: 15px; border-top: 1px dashed var(--line); padding-top: 16px; }

/* ---------- Contact ---------- */
.contact-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 56px; align-items: start; }
.contact-info h2, .contact-form-wrap h2 { font-size: 26px; text-transform: uppercase; margin-bottom: 8px; }
.cf-sub { color: var(--gray); font-size: 14.5px; margin-bottom: 24px; }
.ci-item { display: flex; gap: 14px; padding: 16px 0; border-bottom: 1px dashed var(--line); }
.ci-item i { font-style: normal; font-size: 20px; width: 28px; text-align: center; color: var(--red); }
.ci-item b { display: block; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--gray-l); margin-bottom: 3px; }
.ci-item span, .ci-item a { font-size: 15.5px; }
.ci-item a:hover { color: var(--red); }
.ci-legacy { margin: 18px 0; font-size: 14px; color: var(--gray); }
.ci-legacy a { color: var(--red); font-weight: 600; }
.ci-map { margin-top: 10px; border: 1px solid var(--line); overflow: hidden; }
.ci-map img { width: 100%; height: 190px; object-fit: cover; }
.contact-form-wrap form { margin-top: 18px; }
.contact-form-wrap .inq-form input, .contact-form-wrap .inq-form textarea, .contact-form-wrap .inq-form select {
    background: #fff; color: var(--ink); border: 1px solid var(--line);
}
.contact-form-wrap .inq-form input::placeholder, .contact-form-wrap .inq-form textarea::placeholder { color: #a0a3ad; }
.contact-form-wrap .inq-form input:focus, .contact-form-wrap .inq-form textarea:focus, .contact-form-wrap .inq-form select:focus { border-color: var(--red); }
.contact-form-wrap .form-msg.ok { color: var(--green); }
.contact-form-wrap .form-msg.err { color: var(--red); }

/* ---------- Legal / 404 ---------- */
.sec-legal .legal-body { max-width: 860px; margin: 0 auto; }
.legal-body h2 { font-size: 19px; margin: 28px 0 10px; text-transform: uppercase; letter-spacing: .02em; }
.legal-body p { color: #3a3d45; margin-bottom: 12px; font-size: 15px; }
.sec-404 { text-align: center; padding: 130px 24px; }
.e404 h1 { font-size: clamp(90px, 16vw, 170px); font-weight: 800; letter-spacing: -0.02em; line-height: 1; }
.e404 h1 span { color: var(--red); }
.e404-msg { font-size: 20px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; margin: 10px 0 14px; }
.e404-sub { color: var(--gray); margin-bottom: 30px; }
.e404-actions { display: flex; gap: 14px; justify-content: center; }

/* ---------- Footer（2026-10-10 定版：Brand + Machines/Company/Support/Resources 四列精选，
   每列 ≤9 项 + 尾部 .ftr-more「查看全部」；四列 h4 标题/行距/顶部位置由同一网格与链接样式统一，
   列表全部写死不随后台增删变化（后台内容只更新列表页）） ---------- */
/* 2026-09-22 客户 docx：页脚深底小字整体提亮 #E0E0E0（原 #b9bcc6 / --gray-l 对比度不足） */
.ftr { background: var(--ink); color: #E0E0E0; }
.ftr-inner {
    max-width: 1400px; margin: 0 auto;
    padding: 64px 24px 44px;
    display: grid;
    grid-template-columns: 1.45fr 1fr 1fr 1.1fr .95fr;
    gap: 32px;
}
/* 页脚深底复用 .brand-text，恢复白字（头部白底为黑字） */
.ftr-brand .brand-text b { color: #fff; }
.ftr-brand .brand-text small { color: #E0E0E0; white-space: normal; }
/* 品牌行夺回 flex：下方 .ftr-col > a 的 display:block/padding 特异性(0,1,1)压过 .brand(0,1,0)，
   会把 logo 与文字拆成上下堆叠并误加 padding；logo 居左、顶部与粗体字平齐（客户 2026-09-15 指定） */
.ftr-brand .brand { display: flex; align-items: flex-start; padding: 0; }
.ftr-brand .brand:hover { padding-left: 0; color: inherit; }
.ftr-intro { font-size: 15px; margin-top: 18px; line-height: 1.75; }
.ftr-contact { margin-top: 16px; }
.ftr-contact .ftr-line { color: #E0E0E0; }
.ftr-col h4 { color: #fff; font-size: 14.5px; letter-spacing: .16em; text-transform: uppercase; margin-bottom: 18px; }
.ftr-col > a, .ftr-col-body > a { display: block; padding: 6px 0; font-size: 15.5px; line-height: 1.5; color: #E0E0E0; transition: all .2s; }
.ftr-col > a:hover, .ftr-col-body > a:hover { color: #fff; padding-left: 6px; }
/* 「查看全部」入口（2026-10-10 客户定版）：每列精选列表尾部的固定项，白字红色箭头 + 上分隔线，
   四列同款统一样式；特异性压过上方 .ftr-col-body > a 的灰字 hover 规则 */
.ftr-col-body > a.ftr-more { margin-top: 12px; padding-top: 12px; border-top: 1px solid rgba(255,255,255,.08); color: #fff; font-size: 13.5px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.ftr-col-body > a.ftr-more i { font-style: normal; color: var(--red); margin-left: 6px; display: inline-block; transition: transform .2s var(--ease); }
.ftr-col-body > a.ftr-more:hover { color: var(--red); padding-left: 0; }
.ftr-col-body > a.ftr-more:hover i { transform: translateX(3px); }
.ftr-line { font-size: 15.5px; margin-bottom: 9px; line-height: 1.55; }
.ftr-line span { color: #E0E0E0; }
.ftr-line a:hover { color: #fff; }
.ftr-bottom { border-top: 1px solid rgba(255,255,255,.08); }
.ftr-bottom-inner {
    max-width: 1400px; margin: 0 auto; padding: 20px 24px;
    display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap;
    font-size: 14px; color: #E0E0E0;
}
/* 2026-09-22 客户 docx：社媒图标移入底栏与版权/隐私条款同行，统一垂直居中 */
.ftr-bottom-inner .ftr-social { margin-top: 0; align-items: center; }
.ftr-legal a { color: #E0E0E0; }
.ftr-legal a:hover { color: #fff; }
.ftr-sep { margin: 0 10px; color: rgba(255,255,255,.22); }

/* ---------- 浮动工具 ---------- */
.floatbar { position: fixed; right: 20px; bottom: 90px; z-index: 850; display: flex; flex-direction: column; gap: 10px; transition: opacity .3s var(--ease), visibility .3s; } /* 2026-09-22 客户 docx（二.4）：右距定 20px（原 18px） */
/* 滚动到页脚区域时隐藏（judge 验收：避免遮挡移动端页脚折叠开关） */
.floatbar.ftr-over { opacity: 0; visibility: hidden; pointer-events: none; }
.fb-btn {
    width: 48px; height: 48px; display: flex; align-items: center; justify-content: center;
    border-radius: 50%; color: #fff; box-shadow: 0 8px 22px rgba(11,11,12,.28);
    transition: transform .2s var(--ease);
}
.fb-btn:hover { transform: translateY(-3px) scale(1.05); }
.fb-quote { background: var(--ink); }
.fb-quote:hover { background: var(--red); }
/* 2026-09-21 客户《Support修改 - 副本.docx》：取消亮绿/亮红组合，浮动栏统一品牌红黑灰调
   （WhatsApp 深墨底 hover 品牌红，电话品牌红 hover 深墨，与 quote/top 按钮同语言） */
.fb-wa { background: var(--ink); }
.fb-wa:hover { background: var(--red); }
.fb-tel { background: var(--red); }
.fb-tel:hover { background: var(--ink); }
.fb-top {
    border: none; cursor: pointer; background: var(--ink);
    opacity: 0; visibility: hidden; transform: translateY(12px);
    transition: opacity .3s var(--ease), transform .3s var(--ease), visibility .3s, background .2s var(--ease);
}
.fb-top.show { opacity: 1; visibility: visible; transform: none; }
.fb-top.show:hover { background: var(--red); transform: translateY(-3px) scale(1.05); }

/* ---------- 入场动效 ---------- */
.js .reveal { opacity: 0; transform: translateY(26px); transition: opacity .7s var(--ease), transform .7s var(--ease); }
.js .reveal.in { opacity: 1; transform: none; }
.js .reveal.d1 { transition-delay: .08s; }
.js .reveal.d2 { transition-delay: .16s; }
.js .reveal.d3 { transition-delay: .24s; }
.js .reveal.d4 { transition-delay: .32s; }
.js .reveal.r1 { transition-delay: .2s; }
@media (prefers-reduced-motion: reduce) {
    .js .reveal { opacity: 1; transform: none; transition: none; }
}

/* ---------- 响应式 ---------- */
/* ≤1360：引言右缘避开右侧浮动工具栏（fixed right 18px，约 66px 宽），人物取消右出血 */
@media (max-width: 1360px) {
    .hero-portrait img { margin-right: 0; }
    .hero-quote { right: 84px; max-width: 400px; } /* 窄档缩小字号保两行，防左尖溢入左列文字 */
    .hero-quote p { font-size: 18px; }
}
@media (max-width: 1120px) {
    .cat-grid, .prod-grid, .prod-grid.col3, .prod-grid.col4, .why-grid, .fac-grid, .sol-chips { grid-template-columns: repeat(2, 1fr); }
    .show-grid { grid-template-columns: repeat(2, 1fr); }
    .serve-grid { grid-template-columns: repeat(2, 1fr); }
    /* Who We Serve 卡片：平板每行 2 张（客户 2026-09-19 指定；≤600 落 1 列）；四级页图组 3 列 */
    .ws-grid { grid-template-columns: repeat(2, 1fr); }
    .wsi-grid { grid-template-columns: repeat(3, 1fr); }
    /* 2026-09-21 客户《Machine + Automation Solutions.docx》：亮点卡/案例卡平板档（921–1120）
       两列过渡——桌面 3 列在此区间每列仅 ~290px，即客户所见「卡片右侧被截断」的挤压观感；
       与 show/serve/ws 网格同断点。奇数末卡通栏避免 2 列下孤卡半行留白 */
    .sp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sp-grid .sp-card:last-child:nth-child(odd) { grid-column: 1 / -1; }
    .sol-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .news-grid { grid-template-columns: 1fr; }
    .who-grid { grid-template-columns: repeat(3, 1fr); }
    /* 2026-09-21《Automotive Components.docx》：4 链接列在 3 列轨下第 4 列孤行留空洞（客户所见
       「Footer 右侧内容不完整」）——改 2×2 均衡排布；≤920 仍单列折叠（下方断点覆盖） */
    .ftr-inner { grid-template-columns: repeat(2, 1fr); }
    .ftr-brand { grid-column: 1 / -1; }
}
@media (max-width: 920px) {
    .hero-grid { grid-template-columns: 1fr; padding-top: 28px; gap: 24px; }
    .hero-visual { min-height: auto; margin-top: 0; }
    .hero-portrait img { max-width: 460px; margin: 0 auto; }
    .hero-quote { position: static; text-align: left; margin-top: 18px; }
    .hero-factory { position: relative; height: 120px; margin-top: 30px; }
    .hero-stats { grid-template-columns: repeat(2, 1fr); }
    .hero-stats .hs-item:last-child:nth-child(odd) { grid-column: 1 / -1; }
    .hs-item { border-left: 0; border-top: 1px solid rgba(255,255,255,.08); }
    .detail-top { grid-template-columns: 1fr; gap: 30px; }
    .inquiry-box { grid-template-columns: 1fr; }
    .abo-layout, .contact-grid { grid-template-columns: 1fr; gap: 34px; }
    .article-layout { grid-template-columns: 1fr; }
    .list-layout { grid-template-columns: 1fr; }
    .list-side { position: static; }
    .why-banner { grid-template-columns: 1fr; }
    .sol-grid { grid-template-columns: 1fr; }
    /* 2026-09-20：详情亮点卡与 OTHER SOLUTIONS 卡移动端单列；
       2026-09-21 客户 docx：平板档（601–920）改两列过渡、手机（≤600）才单列 */
    .sp-grid, .sol-rel { grid-template-columns: repeat(2, 1fr); }
    /* 2026-09-23：快速导航（ws-qn*）随页面简化整体移除；四级页图组 2 列 */
    .wsi-grid { grid-template-columns: repeat(2, 1fr); }
    .pagehead-net::after { display: none; }

    /* 顶栏：移动端居中只留联系方式，右侧红色链接隐藏（CTA 已有导航按钮+悬浮工具栏） */
    .topbar-inner { justify-content: center; }
    .tb-contact { gap: 22px; justify-content: center; }
    .tb-cta { display: none; }
    /* 移动导航抽屉样式统一上移到 @media (max-width: 1180px) 块（8 项导航后桌面断点 920 → 1180） */
}
@media (max-width: 600px) {
    .sec { padding: 56px 18px; }
    /* 长文案按钮窄屏允许换行（Explore Engineering Departments 等 nowrap 按钮曾把 docW 撑到 414>390） */
    .btn { white-space: normal; }
    .cat-grid, .prod-grid, .prod-grid.col3, .prod-grid.col4, .why-grid, .fac-grid, .sol-chips { grid-template-columns: 1fr; }
    .show-grid { grid-template-columns: 1fr; }
    /* 2026-09-21：手机端亮点卡/OTHER SOLUTIONS 卡单列（601–920 已在上级断点改两列） */
    .sp-grid, .sol-rel { grid-template-columns: 1fr; }
    .serve-grid { grid-template-columns: 1fr; }
    .ws-grid { grid-template-columns: 1fr; }
    /* 快速导航窄屏继续横向滑动（客户 2026-09-19 指定） */
    .ws-cta-btns .btn { width: 100%; }
    .facility-strip { grid-template-columns: repeat(2, 1fr); }
    .stats-grid { grid-template-columns: repeat(2, 1fr); }
    .stats-grid .hs-item:last-child:nth-child(odd) { grid-column: 1 / -1; }
    .inq-form .frow { grid-template-columns: 1fr; }
    .news-item { grid-template-columns: 1fr; }
    .ni-body { padding: 0 20px 20px; }
    .who-grid { grid-template-columns: repeat(2, 1fr); gap: 34px 12px; }
    .who-item img { width: 160px; height: 160px; }
    .hero-actions .btn { width: 100%; justify-content: center; }
    .floatbar { bottom: 20px; right: 12px; }
    .topbar-inner { padding: 0 14px; }
    .tb-contact { gap: 14px; }
    .tb-item { font-size: 12px; gap: 6px; }
}

/* =========================================================
 * 2026-09-07 update: grouped dropdown / social / news tabs /
 * teams & founder / resources list / media page
 * ======================================================= */
.drop-panel-wide { display: grid; grid-template-columns: 1.4fr 1.2fr .9fr; min-width: 560px; padding: 10px 0 14px; }
.drop-col { padding: 4px 0; }
.drop-group { padding: 10px 22px 4px; font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--gray-l); }
.drop-col-cta { border-left: 1px solid var(--line); }
.drop-col-cta .drop-item { padding-top: 16px; }

/* footer social icons */
.ftr-social { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.ftr-social .soc { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; border: 1px solid rgba(255,255,255,.18); color: #cfd2da; transition: all .18s var(--ease); }
.ftr-social .soc:hover { background: var(--red); border-color: var(--red); color: #fff; transform: translateY(-2px); }
.ftr-social .soc-text { width: auto; padding: 0 12px; font-size: 12px; letter-spacing: .02em; }

/* contact page social + google map */
.ci-social { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; margin: 18px 0 6px; }
.ci-social b { font-size: 14px; margin-right: 4px; }
.ci-soc { font-size: 13px; font-weight: 600; color: var(--red); border: 1px solid var(--line); border-radius: 999px; padding: 4px 12px; transition: all .15s; }
.ci-soc:hover { background: var(--red); border-color: var(--red); color: #fff; }
.ci-soc-text { color: var(--gray); }
.ci-map iframe { display: block; width: 100%; height: 260px; border: 0; border-radius: 10px; filter: grayscale(.15); }

/* news tabs & tags */
.news-tabs { display: flex; gap: 8px; margin: 0 0 26px; flex-wrap: wrap; }
.news-tabs .nt { font-size: 13px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--gray); border: 1px solid var(--line); background: var(--paper); padding: 8px 18px; border-radius: 999px; transition: all .15s; }
.news-tabs .nt:hover { color: var(--ink); border-color: var(--ink); }
.news-tabs .nt.on { color: #fff; background: var(--ink); border-color: var(--ink); }
.nt-tag { display: inline-block; margin-left: 8px; padding: 1px 8px; border-radius: 4px; font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--red); background: rgba(215,25,32,.08); }
.nt-tag.nt-news { color: var(--green); background: rgba(31,157,85,.1); }

/* about: founder / teams / certificates */
/* founder 页版式（2026-09-15 重构；2026-09-29 客户反馈改版）：桌面左人物 40% + 右文字 60%，内容区 1240px；
   照片放大至整列宽（~448px 方图）+ scaleX(-1) 镜像朝右指向文字列，顶部与右栏文字平齐（无 padding-top）；
   姓名/职位白字压照片底部（渐变压暗保证可读）；founder-scene-941.jpg 方裁（941 见方，横裁保留 56% 为最小裁切） */
.founder-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 0 72px; align-items: start; max-width: 1240px; margin: 0 auto; padding: 0 24px; }
/* 2026-09-29 客户要求：照片顶部与右侧首段正文平齐——kicker+标题独占第一行（右列），
   照片与 bio 同处第二行，行顶天然对齐且不受标题换行影响；row-gap 0 由标题 margin 提供正文间距 */
.founder-head { grid-column: 2; grid-row: 1; min-width: 0; }
/* 2026-09-29 客户要求：照片顶部对齐首段、底部对齐引言末行——figure 拉伸至行高（=正文列高），
   founder-img absolute 铺满 + cover 微裁适配任意正文高度；margin 去 auto（子项全部离流后
   auto 边距令 justify-stretch 失效回退 fit-content 得 0 宽；桌面列恒 ≤ max-width 无需居中） */
.founder-figure { position: relative; margin: 0; max-width: 480px; grid-column: 1; grid-row: 2; align-self: stretch; }
.founder-img { position: absolute; inset: 0; }
.founder-img img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center top; transform: scaleX(-1); }
.founder-id { position: absolute; left: 0; right: 0; bottom: 0; padding: 64px 18px 16px; text-align: center; color: #fff; background: linear-gradient(180deg, rgba(11,11,12,0), rgba(11,11,12,.78)); }
.founder-id b { display: block; font-size: 17px; font-weight: 800; letter-spacing: .14em; color: #fff; } /* 2026-09-21 客户定名 Honglin HE（名首字母大写+姓全大写），去 uppercase 保真渲染 */
.founder-id span { display: block; margin-top: 6px; font-size: 13.5px; letter-spacing: .05em; color: rgba(255,255,255,.82); }
.founder-body { min-width: 0; grid-column: 2; grid-row: 2; }
.founder-title { font-size: clamp(23px, 2.4vw, 31px); line-height: 1.2; font-weight: 800; letter-spacing: -.01em; text-transform: uppercase; margin: 2px 0 26px; }
.founder-bio { max-width: 660px; }
.founder-bio p { font-size: 16.5px; line-height: 1.7; color: #3a3d45; margin: 0 0 18px; }
.founder-bio p:last-child { margin-bottom: 0; }
.founder-quote { margin: 36px 0 0; padding: 4px 0 4px 22px; border-left: 3px solid var(--red); max-width: 660px; }
.founder-quote p { font-size: 19px; font-weight: 700; line-height: 1.55; color: var(--ink); margin: 0; }
.founder-quote cite { display: block; margin-top: 10px; font-size: 13px; font-weight: 600; letter-spacing: .08em; color: var(--gray); font-style: normal; }
.sec-teams { padding: 64px 0; }
.team-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; max-width: 1120px; margin: 0 auto; padding: 0 24px; }
.team-card { background: var(--paper); border: 1px solid var(--line); border-top: 3px solid var(--ink); border-radius: 10px; padding: 22px 20px; transition: all .2s var(--ease); }
.team-card:hover { border-top-color: var(--red); transform: translateY(-4px); box-shadow: var(--shadow); }
.team-card b { display: block; font-size: 15px; margin-bottom: 8px; }
.team-card p { font-size: 13px; color: var(--gray); line-height: 1.6; }
.sec-certs { padding: 64px 0; }
.certs-row { display: grid; grid-template-columns: 1.1fr .9fr; gap: 56px; align-items: center; max-width: 1120px; margin: 0 auto; padding: 0 24px; }
.certs-copy p { color: var(--gray); margin-bottom: 18px; }
.certs-strip { display: flex; gap: 14px; margin: 20px 0; flex-wrap: wrap; }
.certs-strip img { height: 110px; border: 1px solid var(--line); border-radius: 8px; }
.certs-imgs { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.certs-imgs img { border-radius: 10px; height: 210px; width: 100%; object-fit: cover; }

/* resources page */
.sec-res { padding: 64px 0; }
.sec-res .res-head { max-width: 1120px; margin: 0 auto 34px; padding: 0 24px; }
.res-note { color: var(--gray); font-size: 15px; }
.res-note a { color: var(--red); font-weight: 600; }
.res-group { max-width: 1120px; margin: 0 auto 34px; padding: 0 24px; }
.res-group-head { display: flex; align-items: baseline; gap: 14px; border-bottom: 2px solid var(--ink); padding-bottom: 10px; margin-bottom: 6px; }
.res-group-head h3 { font-size: 19px; }
.res-group-head h3 a:hover { color: var(--red); }
/* 2026-09-22 客户《Product & Technical Resources.docx》：分类计数小字 #9a9daa 过淡 → #666666 */
.res-count { margin-left: auto; font-size: 12px; color: #666666; letter-spacing: .04em; text-transform: uppercase; font-weight: 700; }
/* 2026-09-19 客户审查报告：产品行 = 图+信息（点击进详情）+ 操作列（下载目录按钮 + 规格链接） */
.res-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; align-items: center; padding: 14px 10px; border-bottom: 1px solid var(--line); transition: background .15s; }
.res-row:hover { background: var(--bg); }
.res-main { display: grid; grid-template-columns: 128px 1fr; gap: 18px; align-items: center; min-width: 0; }
.res-main:hover .res-info b { color: var(--red); }
.res-row img { width: 120px; height: 80px; object-fit: cover; border-radius: 6px; }
.res-info b { display: block; font-size: 15px; margin-bottom: 2px; transition: color .15s; }
.res-info p { font-size: 13px; color: var(--gray); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.res-act { display: flex; flex-direction: column; align-items: stretch; gap: 8px; justify-self: end; min-width: 218px; }
.res-act .btn { justify-content: center; text-align: center; }
.res-spec { font-size: 13px; font-weight: 600; color: var(--ink-2); text-align: center; }
/* 2026-10-10 下载与产品解耦：下载行 = PDF 徽标 + 名称（无缩略图），按钮列复用 res-act */
.dl-main { display: flex; align-items: center; gap: 14px; min-width: 0; }
.dl-ico { flex: 0 0 auto; width: 48px; height: 34px; border: 2px solid var(--red); border-radius: 6px; color: var(--red); font-weight: 800; font-size: 11px; letter-spacing: .1em; display: flex; align-items: center; justify-content: center; }
.dl-main .dl-title { font-weight: 600; font-size: 15.5px; color: var(--ink); transition: color .15s; }
.dl-main:hover .dl-title { color: var(--red); }
.res-empty { padding: 18px 10px; color: var(--gray); font-size: 14.5px; }
.res-empty a { color: var(--red); font-weight: 600; }
.res-spec i { font-style: normal; color: var(--red); }
.res-spec:hover { color: var(--red); }
.btn-sm { font-size: 12.5px; padding: 9px 14px; }
/* 2026-09-19 客户审查报告：无产品分类升级为视觉卡（缩略图 + REQUEST CATEGORY CATALOG 按钮）
   2026-09-22 客户《Product & Technical Resources.docx》：正文 flex:1 吃满宽度，按钮移到卡片右缘垂直居中 */
.res-cat-card { display: flex; gap: 20px; align-items: center; padding: 14px 10px; border-bottom: 1px solid var(--line); }
.res-cat-card img { width: 220px; height: 132px; object-fit: cover; border-radius: 8px; flex: none; }
.res-cat-body { flex: 1; min-width: 0; }
.res-cat-card > .btn { flex: none; }
.res-cat-body b { display: block; font-size: 16px; margin-bottom: 4px; }
.res-cat-body p { font-size: 13.5px; color: var(--gray); line-height: 1.65; margin-bottom: 12px; max-width: 560px; }
.sec-res-downloads { padding: 64px 0; }
.rd-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; max-width: 1120px; margin: 0 auto; padding: 0 24px; }
/* 2026-09-21 客户全站响应式排查：4 列最小内容宽被 nowrap 按钮（~256px）托底、容器宽又
   被 .sec.alt > *（两类选择器）的 max-width:1320 盖过本块 1120，981–1349 视口 4 列放不下
   （实测 sw=1322 超视口 42px，笔记本重灾区）——该区间降两列，≥1350 恢复 4 列 */
@media (min-width: 981px) and (max-width: 1349px) {
    .rd-grid { grid-template-columns: 1fr 1fr; }
}
.rd-card { background: var(--paper); border: 1px solid var(--line); border-radius: 12px; padding: 26px 24px; display: flex; flex-direction: column; gap: 10px; }
.rd-card i { font-style: normal; font-size: 26px; }
/* 2026-09-19 客户审查报告：下载卡图标统一为红色 SVG 线性图标（原 emoji 剪贴画弃用） */
.rd-ic { display: inline-flex; color: var(--red); }
.rd-ic svg { width: 32px; height: 32px; }
.rd-card b { font-size: 16px; }
/* 2026-09-22 客户《Product & Technical Resources docx》：底部按钮钉底（内容长短不一时保持同线） */
.rd-card > .btn { margin-top: auto; }
.rd-card p { font-size: 13px; color: var(--gray); flex: 1; }
/* .btn-line 为深底设计（白字白边），浅色卡片上不可见——卡片内转深色描边 */
.rd-card .btn-line { color: var(--ink); border-color: rgba(11,11,12,.3); }
/* 2026-09-21 客户《Support修改 - 副本.docx》：悬停反馈加强——品牌红底白字 */
.rd-card .btn-line:hover { background: var(--red); border-color: var(--red); color: #fff; }
.rd-certs { display: flex; gap: 18px; flex-wrap: wrap; justify-content: center; max-width: 1120px; margin: 30px auto 0; padding: 0 24px; }
.rd-cert { text-align: center; max-width: 200px; }
.rd-cert img { height: 130px; border: 1px solid var(--line); border-radius: 8px; margin-bottom: 8px; }
.rd-cert b { display: block; font-size: 13px; }
.rd-certs-note { text-align: center; color: var(--gray); font-size: 14px; max-width: 640px; margin: 26px auto 0; padding: 0 24px; }

/* media page */
.sec-media { max-width: 1120px; margin: 0 auto; padding: 64px 24px; }
.md-channel { display: flex; align-items: center; gap: 20px; background: var(--ink); color: #fff; border-radius: 14px; padding: 24px 28px; margin-bottom: 30px; }
.md-ch-icon { display: flex; align-items: center; justify-content: center; width: 58px; height: 58px; border-radius: 14px; background: var(--red); flex: none; }
.md-ch-info { flex: 1; }
.md-ch-info b { display: block; font-size: 17px; }
.md-ch-info p { font-size: 13px; color: #b9bcc6; }
.md-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.md-card { border: 1px solid var(--line); border-radius: 12px; overflow: hidden; background: var(--paper); }
.md-thumb { position: relative; aspect-ratio: 16/9; }
.md-thumb img { width: 100%; height: 100%; object-fit: cover; }
.md-play { position: absolute; inset: 0; margin: auto; width: 58px; height: 40px; border: 0; border-radius: 10px; background: rgba(215,25,32,.92); transition: all .18s var(--ease); }
.md-play::after { content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-46%, -50%); border-left: 14px solid #fff; border-top: 9px solid transparent; border-bottom: 9px solid transparent; }
.md-card:hover .md-play { background: var(--red); transform: scale(1.08); }
.md-card iframe { width: 100%; aspect-ratio: 16/9; border: 0; display: block; }
.md-body { padding: 14px 16px 18px; }
.md-body b { display: block; font-size: 15px; margin-bottom: 4px; }
.md-body p { font-size: 13px; color: var(--gray); }
.md-empty { text-align: center; padding: 40px 0; color: var(--gray); }
.md-empty a { color: var(--red); font-weight: 600; }

@media (max-width: 980px) {
    .team-grid { grid-template-columns: repeat(2, 1fr); }
    .founder-grid, .certs-row { grid-template-columns: 1fr; gap: 30px; }
    /* 单列堆叠恢复源序（图→标题→正文），解除桌面显式行列定位 */
    .founder-head, .founder-figure, .founder-body { grid-column: auto; grid-row: auto; }
    .founder-figure { max-width: min(460px, 88%); margin: 0 auto; align-self: start; }
    .founder-img { position: static; }
    .founder-img img { height: auto; aspect-ratio: 1 / 1; }
    .founder-body { padding-top: 26px; }
    .founder-title { margin-bottom: 20px; }
    .rd-grid, .md-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 1180px) {
    .nav-drop.open .drop-panel.drop-panel-wide { display: block; min-width: 0; }
    .drop-group { color: #6d7079; padding-left: 0; }
    .drop-col-cta { border-left: 0; }
}
@media (max-width: 620px) {
    .team-grid, .rd-grid, .md-grid { grid-template-columns: 1fr; }
    /* 2026-09-19 审查报告：产品行移动端堆叠（图+信息一行，操作列换行），空分类卡纵向 */
    .res-row { display: block; }
    .res-main { grid-template-columns: 120px 1fr; gap: 14px; }
    .res-act { flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: flex-start; min-width: 0; margin-top: 12px; }
    .res-cat-card { flex-direction: column; align-items: flex-start; }
    .res-cat-card img { width: 100%; height: 172px; }
    /* 「MODELS AVAILABLE ON REQUEST」较长，移动端数量标签换到分类名下一行 */
    .res-group-head { flex-wrap: wrap; }
    .res-count { flex-basis: 100%; margin-left: 0; }
    .md-channel { flex-direction: column; text-align: center; }
    /* 手机端照片通栏微出血（+24px = 281px），方图宽于原 258 列，白字压图自适应 */
    .founder-figure { max-width: none; margin: 0 -12px; }
}

/* news page: main first, sidebar right */
.sec-news-list .list-layout { grid-template-columns: 1fr 260px; }
/* 2026-09-21 客户全站响应式排查：本规则两类选择器特异性压过 ≤920 块的单类 .list-layout
   单列折叠，手机端 260px 固定侧栏列把 News/Tech 页撑到 sw=487（实测 38 个元素超视口）。
   特异性对等 + 源顺序靠后才能覆盖，必须单列；侧栏随行流式落到底部 */
@media (max-width: 920px) {
    .sec-news-list .list-layout { grid-template-columns: 1fr; }
}

/* =========================================================
 * 2026-09-08 update: 首页 Product Range 轮播（左图右文）响应式
 * ======================================================= */
@media (max-width: 920px) {
    .cp-band-in { padding: 20px 18px; gap: 13px; }
    .cp-band-in::before { width: 7px; height: 25px; }
    .cp-sec { padding-top: 40px; }
    .sp-car-view { height: 660px; }
    .sp-car-slide { grid-template-columns: 1fr; grid-template-rows: 46% 54%; }
    .sp-car-text { border-left: 1px solid var(--line); border-top: 0; padding: 30px 26px; }
    .sp-car-text h3 { font-size: 24px; }
    .sp-car-text p { margin: 14px 0 20px; }
}
@media (max-width: 600px) {
    .sp-car-view { height: 620px; }
    .sp-car-slide { grid-template-rows: 42% 58%; }
    .sp-car-text { padding: 24px 20px; }
    .sp-car-btn { padding: 10px 16px; }
}

/* =========================================================
 * 2026-09-08 update: 导航信息架构 v2（7 项导航 + 产品父子 mega 菜单）
 * 新页：team / gallery(env-prod-insp) / certificates / culture /
 *       founder / project-management / tech
 * ======================================================= */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* ---------- Products mega 菜单（父子分类 4 列） ---------- */
.drop-panel-mega { grid-template-columns: 1.1fr 1.1fr 1.25fr .72fr; min-width: 780px; }
.drop-parent { font-weight: 700; color: var(--ink); margin-top: 8px; }
.drop-col .drop-parent:first-child { margin-top: 0; }
.drop-sub { padding-left: 34px; font-size: 13px; color: var(--gray); position: relative; }
.drop-sub::before { content: "·"; position: absolute; left: 24px; color: var(--red); font-weight: 800; }
@media (max-width: 1180px) {
    .drop-panel-mega { grid-template-columns: 1fr 1fr; min-width: 520px; }
    .drop-panel-mega .drop-col-cta { border-left: 1px solid var(--line); padding-left: 4px; }
}
/* 导航改 8 项后 Products 前移，mega 面板右探：≤1540 视口 4 列压 2×2 防右缘裁切 */
@media (max-width: 1540px) and (min-width: 1181px) {
    .drop-panel-mega { grid-template-columns: 1fr 1fr; min-width: 560px; }
}
@media (max-width: 1180px) {
    .nav .drop-panel-mega { display: none; }
    .nav-drop.open .drop-panel-mega { display: block; }
}

/* ---------- 导航抽屉（2026-09-13 导航扩为 8 项后桌面放不下，断点 920 → 1180；JS 同步 site.js NAV_MQ） ---------- */
@media (max-width: 1180px) {
    /* 抽屉闭态 translateX(100%) 移出屏外的 fixed 元素被 Chrome 计入视口可滚动溢出（docW=winW+24，
       移动端可平移露白）；clip 禁掉视口横向滚动且不产生滚动容器。hidden 写在前作旧引擎兜底
       （2026-09-21 客户《3 Solutions.docx》：不支持 clip 的旧 webview 至少不出现横向平移/滚动条） */
    html { overflow-x: hidden; overflow-x: clip; }
    /* hdr 的 backdrop-filter 会使 .nav 的 fixed 以 header 为包含块（菜单被压扁），抽屉模式禁用 */
    .hdr { backdrop-filter: none; background: rgba(255, 255, 255, .98); }
    .burger { display: block; z-index: 2; }
    .brand { position: relative; z-index: 2; }
    /* 抽屉从视口 0 覆盖（含顶栏），品牌与汉堡按钮 z-index:2 悬于其上保证可见可点 */
    .nav {
        position: fixed; top: 0; left: 0; right: 0; bottom: 0;
        background: #fff;
        flex-direction: column; align-items: stretch;
        padding: 86px 24px 24px; gap: 0;
        transform: translateX(100%);
        /* 闭态必须 visibility:hidden：translateX(100%) 移出屏外的 fixed 元素仍被 Chrome
           计入可滚动溢出（docW=winW+24，移动端可平移露白）；transition 让滑出动画走完再藏 */
        visibility: hidden;
        transition: transform .3s var(--ease), visibility 0s .3s;
        overflow-y: auto;
        z-index: 1;
    }
    .nav.open { transform: none; visibility: visible; transition: transform .3s var(--ease); }
    .nav-link { padding: 15px 4px; font-size: 17px; border-bottom: 1px solid rgba(11, 11, 12, .08); white-space: normal; }
    .nav-link.on::after, .nav-drop.on > .nav-link::after { display: none; }
    .nav-cta { display: block; margin: 18px 0 0; text-align: center; }
    .lang-switch { margin: 18px 0 0; justify-content: center; }
    .nav .drop-panel { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; background: transparent; border: 0; display: none; padding: 0 0 10px; }
    .nav-drop.open .drop-panel { display: block; }
    .nav-drop.open .drop-panel .drop-item { color: var(--gray); padding-left: 18px; }
    .nav-drop.open .drop-panel .drop-item:hover { color: var(--red); }
}

/* ---------- 产品列表：子分类 chips + 侧栏子级 ---------- */
.subcat-chips { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 22px; }
.subcat-chips .sc-label { font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--gray-l); margin-right: 4px; }
.sc-chip { font-size: 13px; font-weight: 600; color: var(--ink-2); border: 1px solid var(--line); background: #fff; border-radius: 999px; padding: 6px 14px; transition: all .15s; }
.sc-chip i { font-style: normal; color: var(--gray-l); font-size: 12px; }
.sc-chip:hover { border-color: var(--red); color: var(--red); }
.side-link.side-sub { position: relative; padding-left: 16px; font-size: 13.5px; border-bottom: 0; padding-top: 4px; padding-bottom: 4px; }
.side-link.side-sub::before { content: "·"; position: absolute; left: 6px; color: var(--red); font-weight: 800; }

/* ---------- 团队页 ---------- */
.team-nav { position: sticky; top: 64px; z-index: 30; background: rgba(11,11,12,.97); border-bottom: 1px solid rgba(255,255,255,.08); }
.team-nav-in { max-width: 1320px; margin: 0 auto; padding: 10px 24px; display: flex; flex-wrap: wrap; gap: 4px 6px; }
.team-nav a { color: #b9bcc6; font-size: 12.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; padding: 7px 12px; border-radius: 999px; border: 1px solid rgba(255,255,255,.14); transition: all .15s; }
.team-nav a:hover { color: #fff; border-color: var(--red); background: rgba(215,25,32,.22); }
.sec-teamlist { padding-top: 46px; }
.team-sec { display: grid; grid-template-columns: 1.05fr .95fr; gap: 54px; align-items: center; max-width: 1120px; margin: 0 auto 64px; padding: 0 24px; scroll-margin-top: 130px; }
.team-sec:nth-child(even) .ts-media { order: -1; }
.ts-num { display: inline-block; font-size: 13px; font-weight: 800; letter-spacing: .3em; color: var(--red); margin-bottom: 12px; }
.team-sec h2 { font-size: clamp(22px, 2.4vw, 30px); font-weight: 800; text-transform: uppercase; letter-spacing: -.01em; }
.ts-sum { color: var(--ink-2); font-weight: 600; margin: 14px 0 4px; }
.ts-meta { list-style: none; margin: 16px 0 2px; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px 20px; }
.ts-meta li { font-size: 13.5px; line-height: 1.6; color: var(--gray); padding-left: 12px; border-left: 2px solid var(--red); }
.ts-meta li b { display: block; font-size: 10.5px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--ink); margin-bottom: 2px; }
.ts-para { color: var(--gray); font-size: 15px; line-height: 1.75; margin-top: 12px; }
.ts-media img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 12px; box-shadow: var(--shadow); }
.team-more { margin-top: 10px; }

/* ---------- 公司图库页 ---------- */
.gal-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 30px; }
.gal-tabs .gt { font-size: 13px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--gray); border: 1px solid var(--line); background: var(--paper); padding: 8px 18px; border-radius: 999px; transition: all .15s; }
.gal-tabs .gt:hover { color: var(--red); border-color: var(--red); }
.gal-tabs .gt.on { background: var(--red); border-color: var(--red); color: #fff; }
/* flex 居中网格：桌面 3 张/行、平板 2 张、手机 1 张；不满一行时自动居中，不留单张贴左 */
/* 2026-09-22 客户《Manufacturing Network docx》：环境/设备/检测网格行间距 30-40 目标 → 行 32 列 18 */
.gal-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 32px 18px; }
.gal-item { flex: 0 0 calc((100% - 36px) / 3); display: flex; flex-direction: column; margin: 0; background: #fff; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; transition: all .25s var(--ease); }
.gal-item:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
/* 2026-09-22 客户《Manufacturing Network docx》：①设备图占位底色（lazy 未载显浅灰）；②caption flex:1 吃满余量 →
   底部规格标签（gal-specs）统一钉在卡底对齐 */
.gal-item img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; background: #f2f3f5; }
.gal-item figcaption { flex: 1; padding: 12px 16px; min-height: 65px; display: flex; align-items: center; font-size: 13.5px; color: var(--ink-2); font-weight: 600; }
.gal-more { display: flex; flex-wrap: wrap; gap: 18px; justify-content: center; } /* 2026-09-22 docx：双按钮间距 16-20 目标（原 12px） */

/* ---------- 荣誉证书页 ---------- */
.cert-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; max-width: 1120px; margin: 0 auto; }
.cert-card { margin: 0; background: #fff; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; transition: all .25s var(--ease); }
.cert-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-top: 3px solid var(--red); }
.cert-img { background: #fff; }
/* 2026-09-30 客户要求：证书照片放大一倍看清专利内容——取消 230px 定高 contain 缩略，
   整幅证书按卡片全宽自然比例呈现（361px 宽卡下证书显示宽 161→361px，线性约 2.2 倍） */
.cert-img img { display: block; width: 100%; height: auto; }
.cert-card figcaption { padding: 14px 16px 16px; }
.cert-card figcaption b { display: block; font-size: 14.5px; }
.cert-card figcaption p { font-size: 12.5px; color: var(--gray); margin-top: 6px; line-height: 1.55; }
.cert-note { max-width: 680px; margin: 40px auto 0; text-align: center; color: var(--gray); }
.cert-note .sec-more { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
/* 2026-09-21 全站响应式终扫（81 URL×26 档）唯一残留：≤340 极窄视口两列数据卡 min-content
   放不下（company 页实测 sw=310>300）——单列保完整；≤920 块的末项通栏规则在单列下无副作用 */
@media (max-width: 340px) {
    .hero-stats, .stats-grid { grid-template-columns: 1fr; }
}

/* ---------- 企业文化 / 创始人页 ---------- */
.cul-links { display: flex; gap: 18px; margin-top: 22px; flex-wrap: wrap; } /* 2026-09-22 客户《Corporate Culture docx》：双按钮间距 16-20 目标（原 10px） */
.val-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; max-width: 1120px; margin: 0 auto; padding: 0 24px; }
.val-card { background: #fff; border: 1px solid var(--line); border-top: 3px solid var(--ink); border-radius: 10px; padding: 22px 20px; transition: all .2s var(--ease); }
.val-card:hover { border-top-color: var(--red); transform: translateY(-4px); box-shadow: var(--shadow); }
.val-card i { font-style: normal; font-size: 13px; font-weight: 800; letter-spacing: .18em; color: var(--red); }
.val-card b { display: block; font-size: 15.5px; margin: 10px 0 8px; }
.val-card p { font-size: 13px; color: var(--gray); line-height: 1.65; }
.sec-culture-quote { text-align: center; }
.big-quote { max-width: 820px; margin: 0 auto; padding: 0 24px; }
.big-quote p { font-size: clamp(20px, 2.6vw, 30px); font-weight: 800; line-height: 1.4; text-transform: uppercase; letter-spacing: -.01em; }
.big-quote p::before { content: ""; display: block; width: 52px; height: 4px; background: var(--red); margin: 0 auto 22px; }
.big-quote cite { display: block; margin-top: 16px; font-size: 13.5px; font-weight: 700; letter-spacing: .14em; color: var(--gray); font-style: normal; } /* 2026-09-21 去 uppercase：署名统一 Honglin HE 格式须保真渲染 */
.link-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; max-width: 1120px; margin: 0 auto; padding: 0 24px; }
.link-card { display: block; background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 22px 22px 18px; transition: all .2s var(--ease); }
.link-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-color: #D71920; }
.link-card b { display: block; font-size: 16px; }
.link-card p { font-size: 13px; color: var(--gray); line-height: 1.6; margin: 8px 0 12px; }
.link-card span { font-size: 13px; font-weight: 700; color: var(--red); }

/* ---------- 项目管理页 ---------- */
.pm-intro { margin-bottom: 40px; }
.pm-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; max-width: 1120px; margin: 0 auto; padding: 0 24px; }
.pm-step { background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 20px 18px; position: relative; transition: all .2s var(--ease); }
/* 触屏点按后 :hover 会粘滞（客户见"第03张卡红边框"），hover 效果仅限真实悬停设备 */
@media (hover: hover) {
    .pm-step:hover { border-color: #D71920; transform: translateY(-4px); box-shadow: var(--shadow); }
}
.pm-step i { font-style: normal; font-size: 26px; font-weight: 800; color: rgba(215,25,32,.18); letter-spacing: -.02em; }
.pm-step b { display: block; font-size: 15px; margin: 8px 0 8px; }
.pm-step p { font-size: 12.5px; color: var(--gray); line-height: 1.6; }
.pm-scope-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; max-width: 1120px; margin: 0 auto; padding: 0 24px; }
.pm-scope { background: #fff; border: 1px solid var(--line); border-left: 4px solid var(--red); border-radius: 10px; padding: 24px 22px; }
.pm-scope b { display: block; font-size: 16.5px; margin-bottom: 10px; }
.pm-scope p { font-size: 13.5px; color: var(--gray); line-height: 1.7; }
.pm-scope ul { margin: 14px 0 0; padding-left: 18px; }
.pm-scope li { font-size: 13px; color: var(--ink-2); margin-top: 6px; }
.pm-checklist { margin-top: 18px; padding-left: 4px; }
.pm-checklist li { font-size: 14.5px; color: var(--ink-2); margin-top: 10px; list-style: none; position: relative; padding-left: 26px; }
.pm-checklist li::before { content: "¹3"; position: absolute; left: 0; top: 0; color: var(--red); font-weight: 800; }
.pm-deliver { margin-top: 22px; }
.pm-deliver li { list-style: none; position: relative; padding-left: 42px; margin-top: 18px; }
.pm-deliver li i { position: absolute; left: 0; top: 1px; font-style: normal; font-weight: 800; color: var(--red); font-size: 14px; }
.pm-deliver li b { display: block; font-size: 15px; color: var(--ink); line-height: 1.45; }
.pm-deliver li p { font-size: 13.5px; color: var(--gray); line-height: 1.65; margin-top: 5px; }

/* ---------- 响应式（新组件） ---------- */
@media (max-width: 1120px) {
    .team-sec { grid-template-columns: 1fr; gap: 24px; }
    .team-sec:nth-child(even) .ts-media { order: 0; }
    .ts-media img { max-height: 380px; }
    .cert-grid { grid-template-columns: repeat(2, 1fr); }
    .gal-item { flex-basis: calc((100% - 18px) / 2); }
    .pm-steps { grid-template-columns: repeat(2, 1fr); }
    .val-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
    .team-nav { top: 62px; }
    .team-nav-in { padding: 8px 14px; }
    .team-sec { padding: 0 18px; margin-bottom: 48px; }
    .cert-grid, .link-cards { grid-template-columns: 1fr; }
    .gal-item { flex-basis: 100%; }
    .pm-steps, .pm-scope-grid { grid-template-columns: 1fr; }
    .val-grid { grid-template-columns: 1fr; }
}
@media (max-width: 920px) {
    .nav .drop-panel .drop-item.drop-sub { padding-left: 36px; font-size: 14.5px; }
}

/* ---------- Pre-footer inquiry CTA（footer 上方询盘区：深底左文 + 白卡表单，参考客户 2026-09-09 截图） ---------- */
.cta-band { background: var(--ink); color: #fff; position: relative; overflow: hidden; }
.cta-band::before {
    content: "";
    position: absolute; inset: 0; pointer-events: none;
    background: radial-gradient(640px 420px at 10% 90%, rgba(215, 25, 32, .15), transparent 65%);
}
.cta-grid {
    max-width: 1320px; margin: 0 auto; padding: 84px 24px;
    display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 64px;
    align-items: center; position: relative; z-index: 1;
}
.cta-h2 {
    font-size: clamp(30px, 3.6vw, 46px); line-height: 1.12; font-weight: 800;
    letter-spacing: -0.01em; text-transform: uppercase; margin-bottom: 20px;
}
.cta-h2 .red { color: var(--red-l); } /* 黑底 CTA 区红字提亮（2026-09-20 客户反馈对比刺眼） */
.cta-sub { color: #E0E0E0; font-size: 15px; line-height: 1.75; max-width: 520px; margin-bottom: 26px; } /* 2026-09-22 客户 docx：暗底小字提亮（表单卡内文字不动） */
.cta-checks { list-style: none; display: flex; flex-wrap: wrap; gap: 12px 14px; }
.cta-svc {
    display: inline-flex; align-items: center; gap: 9px;
    padding: 8px 18px 8px 9px; border: 1px solid rgba(255, 255, 255, .22); border-radius: 999px;
    font-size: 14px; font-weight: 600; color: #e8e9ee; white-space: nowrap;
    transition: all .2s var(--ease);
}
.cta-svc:hover { border-color: var(--red); background: rgba(215, 25, 32, .14); color: #fff; }
.cta-svc i {
    width: 26px; height: 26px; border-radius: 50%; background: var(--red); color: #fff;
    font-style: normal; font-size: 13px; font-weight: 800; flex: 0 0 auto;
    display: inline-flex; align-items: center; justify-content: center;
}
.cta-card {
    background: #fff; color: var(--ink); border-radius: 14px; padding: 38px 36px 30px;
    box-shadow: 0 30px 60px rgba(0, 0, 0, .45);
}
.cta-card h3 { text-align: center; font-size: 22px; font-weight: 800; margin-bottom: 8px; }
.cta-card-sub { text-align: center; color: #8d919c; font-size: 14px; margin-bottom: 22px; }
.cta-form { display: flex; flex-direction: column; gap: 14px; }
.cta-form input, .cta-form textarea {
    width: 100%; border: 1px solid var(--line); background: #fff; border-radius: 8px;
    padding: 13px 16px; font-family: inherit; font-size: 15px; color: var(--ink); outline: none;
    transition: border-color .15s var(--ease);
}
.cta-form input::placeholder, .cta-form textarea::placeholder { color: #a0a3ad; }
.cta-form input:focus, .cta-form textarea:focus { border-color: var(--red); }
.cta-form textarea { resize: vertical; min-height: 110px; }
.cta-form .btn { width: 100%; border-radius: 8px; padding: 14px 18px; font-size: 15px; font-weight: 700; text-transform: none; letter-spacing: 0; }
/* 2026-09-19 询盘表单扩字段：短字段两列栅格 + 图纸上传行 + 格式提示 */
.cta-form .frow { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
/* 2026-09-21 客户《Support修改 - 副本.docx》：原生「No file chosen」控件整替为自定义拖拽上传框
   （Drag & Drop Zone，cta-band 表单与 contact 页表单同组件）：虚线框 + 上传图标 + 拖放/点击提示，
   hover/dragover 品牌红描边浅红底；选中文件后 .file-name 回显「✓ 文件名 · 大小」 */
.file-field { display: block; cursor: pointer; min-width: 0; }
.file-field input[type=file] {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.file-field .fd-zone {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px;
    text-align: center; padding: 22px 18px;
    border: 1.5px dashed rgba(11,11,12,.24); border-radius: 10px; background: #fafafb;
    transition: border-color .15s var(--ease), background .15s var(--ease);
}
/* 子元素不截断 dragleave/drop 事件（拖拽状态由 label 统一接管）；label 包裹点击浏览不受影响 */
.file-field .fd-zone > * { pointer-events: none; }
.file-field:hover .fd-zone, .file-field.dragover .fd-zone,
.file-field input:focus-visible ~ .fd-zone { border-color: var(--red); background: #fdf2f2; }
.file-field .fd-ic { display: inline-flex; color: var(--red); }
.file-field .fd-t b { display: block; font-size: 14px; font-weight: 700; color: var(--ink); }
.file-field .fd-t small { display: block; margin-top: 2px; font-size: 12.5px; color: #8d919c; }
.file-field .file-name {
    display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    font-size: 12.5px; font-weight: 600; color: var(--red);
}
.file-field .file-name:empty { display: none; }
.cta-form .file-hint { font-size: 12.5px; color: #8d919c; text-align: center; margin-top: -4px; }
@media (max-width: 620px) {
    .cta-form .frow { grid-template-columns: 1fr; }
}
.cta-form .form-msg { margin-top: 2px; text-align: center; min-height: 20px; }
.cta-form .form-msg.ok { color: var(--green); }
.cta-form .form-msg.err { color: var(--red); }
/* 2026-09-21 客户《Machine + Automation Solutions.docx》：左文右表单平板档（921–1120）
   即上下排列（原 920 档下移断点），手机继续堆叠 */
@media (max-width: 1120px) {
    .cta-grid { grid-template-columns: 1fr; gap: 36px; padding: 56px 18px; }
    .cta-card { padding: 28px 20px 24px; }
}

/* =========================================================
 * 2026-09-12 update: 首页能力卡（OUR CAPABILITIES 独立模块）
 * + Footer 六列重排 / 移动端折叠栏目
 * ======================================================= */

/* ---------- 首页能力卡（数据源 fa_store_capability，复用 .show-card 卡体） ---------- */
/* 2026-09-22 客户《Engineering Capabilities docx》：能力卡行间距 30-40 目标 → 行 32 列 22（首页能力模块同源受益） */
.cap-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px 22px; }
.cap-grid .show-card { display: flex; flex-direction: column; }
.cap-grid .show-body { flex: 1; display: flex; flex-direction: column; }
.cap-grid .show-body b { font-size: 15px; letter-spacing: .02em; }
.cap-grid .show-body p { flex: 1; }
.cap-more { margin-top: 14px; font-size: 13px; font-weight: 700; color: var(--red); letter-spacing: .04em; text-transform: uppercase; }
.cap-card:hover .cap-more { color: var(--red-dark); }
@media (max-width: 1120px) {
    .cap-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
    .cap-grid { grid-template-columns: 1fr; }
}

/* ---------- 工程能力页 6 卡（/capabilities.html，数据源 pages_cap_eng_cards 配置）：
     3 列 × 2 行（页面作用域覆盖 .cap-grid 首页 4 列默认）；hover 边框按客户指定 SIPENG 红 #D71920；
     标题统一占两行高 + 简介弹性撑满 → 上下两排卡片高度对齐 ---------- */
.sec-caps .cap-grid { grid-template-columns: repeat(3, 1fr); }
.sec-caps .show-card:hover { border-color: #D71920; }
.sec-caps .show-body b { min-height: 2.72em; }
@media (max-width: 1120px) {
    .sec-caps .cap-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
    .sec-caps .cap-grid { grid-template-columns: 1fr; }
}

/* ---------- Footer 移动端折叠栏目（≤920：单列 + 点击栏目标题展开/收起，由 site.js 驱动 .open） ---------- */
@media (max-width: 920px) {
    .ftr-inner { grid-template-columns: 1fr; gap: 0; padding: 44px 18px 28px; }
    .ftr-brand { padding-bottom: 24px; }
    .ftr-fold { border-bottom: 1px solid rgba(255, 255, 255, .08); }
    .ftr-fold h4 {
        position: relative; cursor: pointer; user-select: none;
        margin-bottom: 0; padding: 16px 28px 16px 0;
    }
    .ftr-fold h4::after {
        content: "+";
        position: absolute; right: 2px; top: 50%;
        transform: translateY(-50%);
        font-size: 19px; font-weight: 400; color: var(--gray-l);
        transition: transform .25s var(--ease);
    }
    .ftr-fold.open h4::after { transform: translateY(-50%) rotate(45deg); }
    .ftr-col-body { display: none; padding: 0 0 18px; }
    .ftr-fold.open .ftr-col-body { display: block; }
}

/* ---------- 2026-09-13 导航最终版：applications 页锚点分区跳转的吸顶偏移 ---------- */
.app-anchor { scroll-margin-top: 130px; } /* 锚点跳转预留 sticky 头部（74px）+ 呼吸空间 */

/* ---------- WHY CHOOSE SIPENG CNC 6 卡等高排版（2026-09-14：标题下加副标题，
   桌面 3 列两行，图片 4:3、卡片与文字区域等高；作用域限定 .sec-why 不影响能力卡/公司展示卡） ---------- */
.sec-why .show-card { display: flex; flex-direction: column; }
.sec-why .show-body { flex: 1; display: flex; flex-direction: column; }
/* 2026-09-20 客户反馈「红色副标题全大写字号偏大」：标题/副标题改 Title Case 常规大小写，
   副标题转深红 --red-dark 降压迫感（数据侧标题已同步 Title Case，此处断开基础规则的 uppercase） */
.sec-why .show-body b { min-height: 2.72em; text-transform: none; letter-spacing: .01em; }
.sec-why .show-sub {
    display: block; margin: 5px 0 0;
    font-size: 12px; font-weight: 600; font-style: normal;
    color: var(--red-dark); letter-spacing: .04em; text-transform: none;
    min-height: 1.5em;
}
.sec-why .show-body p { flex: 1; }

/* 2026-09-14 客户要求：WHY CHOOSE 6 卡现阶段静态——无链接的卡片不出现可点击悬停态；
   后台 home_why{n}_link 配置链接后卡片渲染为 <a>，悬停态自动恢复（服务详情页完成后启用） */
.sec-why .show-card:hover { transform: none; box-shadow: none; border-color: var(--line); }
.sec-why .show-card:hover .show-img img { transform: none; }
.sec-why a.show-card { cursor: pointer; }
.sec-why a.show-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-color: var(--red); }
.sec-why a.show-card:hover .show-img img { transform: scale(1.045); }

/* ---------- 2026-09-14 Engineering Capabilities 页：部门卡与流程卡 3/2/1 响应式 + 流程编号。
   覆盖规则与被覆盖断点写进相同媒体查询（52 轮特异性坑：双类选择器会压过媒体查询内单类规则） ---------- */
.sec-caps .cap-grid { grid-template-columns: repeat(3, 1fr); }
.sec-caps-explore .link-cards { gap: 26px; }
.lc-num {
    display: block; margin: 0 0 8px;
    font-size: 13px; font-weight: 700; color: var(--red);
    letter-spacing: .08em;
}
@media (max-width: 1120px) {
    .sec-caps .cap-grid { grid-template-columns: repeat(2, 1fr); }
    .sec-caps-explore .link-cards { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
    .sec-caps .cap-grid { grid-template-columns: 1fr; }
    .sec-caps-explore .link-cards { grid-template-columns: 1fr; }
}

/* ---------- 2026-09-16 Support 落地页改版：交付流程图（桌面 5 列横排 → 箭头、≤1120 纵排 ↓ 箭头）
   + 信任数据条（复用 About 页 stats-grid / hs-item dark 组件，零新增） ---------- */
.sup-flow { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px 40px; max-width: 1320px; margin: 0 auto; padding: 0 24px; }
/* 卡片统一（2026-09-19 客户"所有卡片统一图片高度/卡片高度/标题位置/Learn More 固定卡底"）：
   sf-step 纵向 flex + sf-body 弹性撑满 → 同行卡片等高、sf-more 齐底 */
.sf-step { position: relative; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); border-radius: 10px; transition: all .2s var(--ease); }
@media (hover: hover) {
    .sf-step:hover { border-color: var(--red); transform: translateY(-4px); box-shadow: var(--shadow); }
}
/* 2026-09-17 客户反馈「照片只剩半截」：固定 150px 高在宽列下裁掉大半原图，改 4:3 宽高比露全图 */
.sf-img { aspect-ratio: 4 / 3; border-radius: 9px 9px 0 0; overflow: hidden; background: #f2f3f5; } /* 2026-09-22：lazy 图未载时显浅灰底不再是刺眼白块（客户 QC/流程卡「空白」反馈） */
.sf-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sf-body { flex: 1; display: flex; flex-direction: column; padding: 0 16px 16px; }
.sf-num { display: inline-block; min-width: 36px; height: 30px; line-height: 30px; padding: 0 9px; text-align: center; background: var(--red); color: #fff; font-size: 13px; font-weight: 800; border-radius: 8px; margin-top: -15px; position: relative; box-shadow: 0 4px 10px rgba(215,25,32,.28); align-self: flex-start; }
.sf-body b { display: block; font-size: 16px; margin: 10px 0 6px; line-height: 1.35; min-height: 2.72em; }
/* 2026-09-22 客户《Company docx》（QC 卡文字 #333333）：sup-flow 卡描述文字与 136 轮 .show-body p 的 #333 白底卡政策统一 */
.sf-body p { font-size: 14.5px; color: #333333; line-height: 1.65; }
/* 步骤间箭头：2026-09-22 客户「这个区块的箭头还是没有去掉，所有类似的箭头都需要去掉」——
   桌面 →、窄屏 ↓、折线连接线全站一律不渲染（sf-grid/app-grid 的抑制规则随之成为冗余兜底），
   步骤次序由红色编号 01-08 表达；源头规则直接 content:none，媒体查询内的 ↓ 恢复规则一并移除 */
.sf-step:not(:last-child)::after { content: none; }
/* flow-3/flow-4 列更宽、图更高（4:3），箭头仍对图片中线 */
.sup-flow.flow-4 .sf-step:not(:last-child)::after { top: 108px; }
.sup-flow.flow-3 .sf-step:not(:last-child)::after { top: 149px; }
/* 2026-09-19 全站编号文字卡统一上图下文（link-cards/pm-steps → sup-flow）连带：
   卡片链接行、<a> 卡片、多行网格的行末箭头抑制（仅桌面，≤1120 单列箭头不受影响）与行距 */
.sf-more { display: inline-block; margin-top: auto; padding-top: 9px; color: var(--red); font-size: 13.5px; font-weight: 700; }
a.sf-step { display: block; color: inherit; text-decoration: none; }
.sf-img img.fit-top { object-position: center top; }
@media (min-width: 1121px) {
    .sup-flow.flow-3, .sup-flow.flow-4 { row-gap: 40px; }
    /* 行末箭头抑制：有折线连接行的流程按结构定位（连接行前那个步骤），
       无连接行的按列数定位——连接行插入后 nth-child 序号偏移，不隔离会误伤 07 的箭头 */
    .sup-flow.flow-3:not(:has(.flow-turn)) .sf-step:nth-child(3n)::after,
    .sup-flow.flow-4:not(:has(.flow-turn)) .sf-step:nth-child(4n)::after { content: none; }
    /* 2026-09-20 客户要求：流程 04→05 换行衔接折线箭头（从 04 底下行、横穿、箭头落入 05 顶）。
       连接行占满整行并接管行距（row-gap 归零） */
    .sup-flow .sf-step:has(+ .flow-turn)::after { content: none; }
    .sup-flow.flow-4:has(.flow-turn) { row-gap: 0; }
    .flow-turn { grid-column: 1 / -1; position: relative; height: 68px; }
    .flow-turn::before { content: ""; position: absolute; top: 0; bottom: 11px; left: 12.5%; right: 12.5%; border-left: 2px solid var(--red); border-right: 2px solid var(--red); border-bottom: 2px solid var(--red); }
    .flow-turn::after { content: "\25BC"; position: absolute; left: 12.5%; bottom: 0; transform: translateX(-50%); color: var(--red); font-size: 10px; line-height: 1; }
}
@media (max-width: 1120px) {
    .sup-flow { grid-template-columns: 1fr; gap: 44px; max-width: 560px; }
    .sf-img { aspect-ratio: 3 / 2; }
    /* 2026-09-22 客户要求：单列 ↓ 连接箭头一并去除（原 ↓ 规则删除），折线连接行仍隐藏 */
    .flow-turn { display: none; }
}

/* ============ Process Evaluation 页：What You Will Receive 交付物清单（2026-09-16）
   2026-09-19 客户审查报告：六个项目框等高（grid-auto-rows:1fr）、红勾与文字垂直居中统一对齐 ============ */
/* 2026-09-22 客户《Process Evaluation/QC/FAT docx》：打勾清单行间距 16-20 目标（原行 12px） */
.pe-get { list-style: none; margin: 22px auto 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); grid-auto-rows: 1fr; gap: 16px 24px; max-width: 900px; }
.pe-get li { position: relative; display: flex; align-items: center; padding: 13px 16px 13px 44px; border: 1px solid var(--line); border-radius: 8px; background: #fff; font-weight: 600; font-size: 15px; color: var(--ink-2); }
.pe-get li::before { content: "\2714"; position: absolute; left: 16px; top: 50%; transform: translateY(-50%); color: var(--red); font-weight: 700; font-size: 14px; }
.pe-get li:last-child:nth-child(odd) { grid-column: 1 / -1; }
@media (max-width: 920px) {
    .pe-get { grid-template-columns: 1fr; gap: 10px; }
}

/* ============ 2026-09-19 客户审查报告：信息页通用新增 ============ */
/* Why Work With Us 页：红色模块小标题相对整组卡片水平居中 */
.pm-intro.mod-center { text-align: center; }
/* 五个 Support 子页介绍模块末段下的主 CTA（左对齐跟随正文栏） */
.intro-cta { margin-top: 28px; }
/* Support 落地页：第 7 项起服务卡展开区（默认收起，max-height 动画） */
.sup-more-wrap { max-height: 0; overflow: hidden; opacity: 0; transition: max-height .5s var(--ease), opacity .4s var(--ease); }
.sup-more-wrap.open { max-height: 1400px; opacity: 1; }
/* 2026-09-22《Support(1).docx》：View More Services 按钮并入 .sec-more.gal-more 行（原独立 .sup-more-btn 容器删除，规则随之移除） */
/* Support 落地页：交付流程五卡下方居中说明小字 */
/* 2026-09-22 客户《Support/QC/Process Evaluation docx》：板块说明小字 #666666 + 与上方卡片间距 24px（原 26px） */
.sup-flow-note { margin: 24px auto 0; max-width: 760px; text-align: center; font-size: 13.5px; color: #666666; line-height: 1.7; }
/* 2026-09-21 客户《Support.docx》：信任数据条删业绩数字改「标题|说明」文字卡——
   b 槽位放栏目标题（小号特粗，非大数字），span 槽位放说明句（不转大写），仅 Support 页 sup-stats 作用域 */
.sup-stats .hs-item { padding: 30px 16px; }
.sup-stats .hs-item b { min-height: 0; font-size: 15.5px; letter-spacing: .05em; line-height: 1.5; }
.sup-stats .hs-item span { min-height: 0; text-transform: none; letter-spacing: .02em; line-height: 1.65; }
/* Spare Parts 页：随机床备件包全宽深色 hero 横幅（背景图 + 深色遮罩） */
.spp-pkg { margin-top: 48px; border-radius: 16px; overflow: hidden; background-color: #0b0b0c; background-size: cover; background-position: center; }
.spp-pkg-in { max-width: 940px; margin: 0 auto; padding: 48px 64px; }
.spp-pkg-title { display: block; margin: 4px 0 14px; font-size: clamp(24px, 2.8vw, 34px); font-weight: 800; letter-spacing: -.01em; text-transform: uppercase; color: #fff; }
.spp-pkg-in p { font-size: 16px; line-height: 1.75; color: #e0e0e0; margin-bottom: 26px; }
.spp-pkg-in .sec-kicker { color: var(--red-l, var(--red)); }
@media (max-width: 920px) {
    .spp-pkg-in { padding: 34px 26px; }
}

/* ============ 编号图文流程 flow-4 变体（2026-09-16 复用 sup-flow 组件，全站 solutions、service 系列、project 等共用）
   2026-09-21 客户《3 Solutions.docx》：电脑 4 列 → 屏幕变窄（1120-601）自动 2 列 → 手机（≤600）1 列；
   2 列档不再渲染 ↓ 箭头（箭头语义是纵向衔接，两列时下一卡在右侧；顺序由红色编号 01-08 表达，
   同 app-grid 平板 2 列先例；≤600 原 ↓ 恢复规则已按 2026-09-22 客户要求删除 */
.sup-flow.flow-4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1120px) {
    .sup-flow.flow-4 { grid-template-columns: repeat(2, 1fr); max-width: 780px; gap: 44px 24px; }
    .sup-flow.flow-4 .sf-step:not(:last-child)::after { content: none; }
}
@media (max-width: 600px) {
    .sup-flow.flow-4 { grid-template-columns: 1fr; max-width: 560px; gap: 44px; }
    /* 2026-09-22 客户要求：手机单列 ↓ 恢复规则删除（全站流程卡零箭头） */
}

/* ============ FAT & Inspection 页：FAT Documentation 三图 + 文档清单（2026-09-16，复用 sup-flow / pe-get） ============ */
/* 2026-09-21 客户《Support.docx》：flow-3 补平板两列档（六张服务卡平板 2 列、手机 1 列；
   交付流程卡空间不足自动换行）——全局 flow-3 栅格统一 3-2-1 阶梯，同 flow-4 先例（74 轮）；
   两列档箭头语义与 flow-4 相同（下一卡在右侧，次序由编号表达）content:none；≤600 原 ↓ 恢复规则已按 2026-09-22 客户要求删除 */
.sup-flow.flow-3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 1120px) {
    .sup-flow.flow-3 { grid-template-columns: repeat(2, 1fr); max-width: 780px; gap: 44px 24px; }
    .sup-flow.flow-3 .sf-step:not(:last-child)::after { content: none; }
}
@media (max-width: 600px) {
    .sup-flow.flow-3 { grid-template-columns: 1fr; max-width: 560px; gap: 44px; }
    /* 2026-09-22 客户要求：手机单列 ↓ 恢复规则删除（全站流程卡零箭头） */
}

/* ============ Quality Control 页（2026-09-19 重构）：清单备注小字（What We Verify / Quality Records 说明行） ============ */
/* 2026-09-22 客户《Quality Control docx》：清单下方说明 #666666 + margin-top 20px（原 18px；pe 边界小字同源） */
.qc-note { margin: 20px 0 0; font-size: 13.5px; color: #666666; line-height: 1.7; }
/* 流程区按钮行与 sup-flow 卡网格对齐 24px 内边距：修复移动端长文案红按钮左右外扩出卡格（实测 18→357 vs 卡 42→333） */
.sec-qcflow .sec-more { padding: 0 24px; }

/* ============ Founder's Story 五章故事线（2026-09-19，仅 /founder.html 使用） ============ */
/* 间距：intro（.sec-founder-page）与故事区（.sec-fstory）间距缩约 30%（原 .sec 默认 84+84=168 → 52+64=116）；五章间距统一 92px */
.sec-founder-page { padding-bottom: 52px; }
.sec-fstory { padding-top: 64px; }
.fstory-ch { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: center; }
.fstory-ch + .fstory-ch { margin-top: 92px; }
.fstory-media { display: grid; gap: 14px; margin: 0; align-content: start; }
.fstory-media figure { margin: 0; }
.fstory-media img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 10px; border: 1px solid var(--line); background: #f2f3f5; display: block; }
.fstory-media.duo { grid-template-columns: 1fr 1fr; }
.fstory-ch.flip .fstory-media { order: 2; }
.fstory-txt h3 { font-size: clamp(20px, 2.2vw, 27px); font-weight: 800; letter-spacing: -.01em; text-transform: uppercase; line-height: 1.25; margin: 2px 0 16px; }
/* 2026-09-22 客户《Founder's Story(1).docx》：章节正文 #333333（与全站正文令牌统一）+ 段间距 16px（docx 字面值；行高 1.75 在 1.6-1.8 区间保持） */
.fstory-txt p { font-size: 15.5px; line-height: 1.75; color: #333333; margin: 0 0 16px; max-width: 560px; }
.fstory-txt p:last-child { margin-bottom: 0; }
@media (max-width: 980px) {
    .fstory-ch { grid-template-columns: 1fr; gap: 24px; }
    .fstory-ch + .fstory-ch { margin-top: 64px; }
    .fstory-ch.flip .fstory-media { order: 0; } /* 移动端一律图上文下 */
    .fstory-txt p { max-width: none; }
}
@media (max-width: 620px) {
    .fstory-media.duo { grid-template-columns: 1fr; }
    .fstory-txt p { font-size: 14.5px; }
}
/* 2026-09-22 客户《Founder's Story(1).docx》：EXPLORE MORE 卡恢复等高 + Explore 链接钉底（撤销 09-21 按客户当时
   要求加的 .sec-founder-more .sup-flow{align-items:start} 缩高与 .sf-more{margin-top:10px} 定距——最新 docx 明确
   「设置卡片等高 + 链接底端对齐」，以最新指令为准；两条规则删除后回归基础 .sf-step 拉伸 + .sf-more margin-top:auto 钉底机制） */

/* ---------- Corporate Culture 页 Mission / Vision / Promise 三栏（2026-09-19） ---------- */
.mvv-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; max-width: 1120px; margin: 0 auto; padding: 0 24px; }
.mvv-card { background: #fff; border: 1px solid var(--line); border-top: 3px solid var(--red); border-radius: 10px; padding: 30px 28px 28px; transition: all .2s var(--ease); }
.mvv-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.mvv-tag { display: inline-block; font-size: 13px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--red); margin-bottom: 14px; }
.mvv-card p { font-size: 15px; line-height: 1.75; color: #3a3d45; margin: 0; }
@media (max-width: 920px) {
    .mvv-grid { grid-template-columns: 1fr; gap: 16px; }
}

/* ===== 2026-09-19 About TRUST 区改左文右图 + 4 价值要点（Why Customers Work With Us）
   2026-09-19 客户要求配图 1:1 方图（1400×1400 five-axis-2-sq.jpg）：容器锁 1:1，左文右图垂直居中 ===== */
.trust-layout { align-items: center; }
.trust-visual { border-radius: 14px; overflow: hidden; border: 1px solid rgba(11, 11, 12, .08); }
.trust-visual img { display: block; width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; }
/* 2026-09-22 客户《About SIPENG docx》：信任要点 2×2 统一最小高度（grid-auto-rows 拉平每行） */
.trust-points { list-style: none; margin: 26px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows: 1fr; gap: 12px 14px; }
.trust-points li { display: flex; align-items: flex-start; gap: 10px; background: #fff; border: 1px solid rgba(11, 11, 12, .09); border-radius: 10px; padding: 13px 15px; }
.trust-points li i { flex: none; width: 21px; height: 21px; margin-top: 2px; border-radius: 50%; background: var(--red) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='4.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/12px no-repeat; }
.trust-points b { display: block; font-size: 14.5px; color: var(--ink); line-height: 1.35; }
.trust-points span { display: block; font-size: 12.5px; color: var(--gray); line-height: 1.55; margin-top: 4px; }
@media (max-width: 1120px) {
    .trust-points { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 920px) {
    .trust-points { grid-template-columns: 1fr; }
    .trust-points li { padding: 12px 13px; }
}

/* ===== 2026-09-19 capabilities 页新增 Engineering Expertise 模块（7 专业方向 + 真实团队数据条） ===== */
.exp-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px; margin-top: 34px; }
/* 2026-09-20 客户《Company修改.docx》：Coordinated Expertise 固定 3×2 六卡（第 7+ 张经 data-loadmore 折叠），
   4 列 → 3 列对称网格 */
.exp-card { flex: 0 1 calc((100% - 32px) / 3); background: #fff; border: 1px solid rgba(11, 11, 12, .09); border-radius: 12px; padding: 20px 18px 18px; display: flex; flex-direction: column; transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.exp-card:hover { border-color: rgba(215, 25, 32, .45); box-shadow: 0 10px 26px rgba(11, 11, 12, .07); transform: translateY(-2px); }
.exp-num { display: inline-block; min-width: 34px; height: 27px; line-height: 27px; padding: 0 8px; text-align: center; background: var(--red); color: #fff; font-size: 12px; font-weight: 800; border-radius: 7px; align-self: flex-start; letter-spacing: .04em; }
.exp-card b { font-size: 15.5px; color: var(--ink); line-height: 1.4; margin-top: 13px; }
.exp-card p { font-size: 13.5px; color: var(--gray); line-height: 1.6; margin: 7px 0 0; }
.exp-stats { margin-top: 34px; background: var(--ink); border-radius: 14px; padding: 30px 26px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.exp-stat { text-align: center; }
.exp-stat b { display: block; font-size: 30px; font-weight: 800; color: #fff; letter-spacing: .01em; }
.exp-stat span { display: block; font-size: 12px; color: rgba(255, 255, 255, .62); margin-top: 6px; letter-spacing: .06em; text-transform: uppercase; }
@media (max-width: 1120px) {
    .exp-card { flex: 0 1 calc(50% - 8px); }
}
@media (max-width: 920px) {
    .exp-grid { margin-top: 26px; }
    /* 手机端数据条 4 列 → 2×2：4 列时 1fr 不低于 min-content，长标签会把网格撑出视口（实测 docW 433>390） */
    .exp-stats { margin-top: 26px; padding: 24px 18px; gap: 14px; grid-template-columns: 1fr 1fr; }
    .exp-stat { min-width: 0; }
    .exp-stat b { font-size: 25px; }
}
@media (max-width: 560px) {
    /* 手机端 7 卡保持 2 列（与数据条 2×2 节奏一致），padding 略收 */
    .exp-card { flex: 0 1 calc(50% - 8px); padding: 15px 13px 14px; }
    .exp-card b { font-size: 14px; margin-top: 10px; }
    .exp-card p { font-size: 12.5px; }
}

/* ============ Manufacturing Network 页 /facilities.html（2026-09-19）：
   自有/合作设施徽章 + 双卡说明 + 责任团队模块；gal-item 卡高统一（figcaption 固定两行高） ============ */
.fac-badge { display: inline-flex; align-items: center; gap: 8px; margin: 14px 0 0; padding: 7px 15px; border: 1px solid var(--line); border-radius: 999px; background: #fff; font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-2); }
.fac-badge i { flex: 0 0 8px; width: 8px; height: 8px; border-radius: 50%; background: var(--red); }
.fac-badge.partner i { background: #8a8f99; }
.fac-intro-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; max-width: 1120px; margin: 0 auto; padding: 0 24px; }
.fac-intro-card { background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 26px 26px 24px; }
.fac-intro-card h3 { font-size: 19px; letter-spacing: -.01em; margin: 16px 0 10px; }
.fac-intro-card p { font-size: 14.5px; color: var(--gray); line-height: 1.7; margin: 0; }
.fac-intro-note { max-width: 860px; margin: 26px auto 0; padding: 0 24px; text-align: center; font-size: 15.5px; font-weight: 600; color: var(--ink-2); line-height: 1.7; }
.fac-team-steps { margin-top: 4px; }
@media (max-width: 920px) {
    .fac-intro-grid { grid-template-columns: 1fr; }
    .fac-intro-card h3 { font-size: 17px; }
    .fac-intro-note { font-size: 14.5px; }
}

/* 2026-09-19 客户要求：合作产能区块（.fac-partner）6 卡图注下加 Ningbo Partner Facility 小字，
   仅作用于合作区块，自有/检测区块与其他图库页不受影响；caption 固定容纳两行标题+一行小字保证六卡等高
   （92px 实测覆盖移动端 2 行标题折行场景，86px 会出现 2px 高度差） */
.fac-partner .gal-item figcaption { flex-direction: column; align-items: flex-start; justify-content: center; min-height: 92px; }
.fac-partner .gal-item figcaption .gal-sub { font-size: 12px; font-weight: 400; color: var(--gray); margin: 3px 0 0; line-height: 1.35; }

/* 2026-09-19 客户要求：Culture 页 How We Create Value 右侧双图改单张大图（.abo-img.single 仅作用本页，
   about 页双图不受影响）：4:3 比例显示（源图 1392×1044 居中裁切）、顶齐左栏 OUR CULTURE 起线（stretch+start），
   底部在 4:3 硬约束下尽量接近按钮行；圆角 10px + var(--line) 描边与站内大图规范一致（同 .fstory-media img）；
   规则置于文件末尾以同特异性覆盖 .abo-img img:first-child 的 320px 定高 */
.abo-img.single { align-self: stretch; align-content: start; }
.abo-img.single img { height: auto; aspect-ratio: 4 / 3; border-radius: 10px; border: 1px solid var(--line); }
/* 2026-09-23 客户要求：About SIPENG 页 Who We Are 右侧双图改单张 1:1 正方形（square 修饰符仅作用 company 页该图位） */
.abo-img.single.square img { aspect-ratio: 1 / 1; }

/* 2026-09-19 客户要求：Quality Control 页首屏与 QA 模块留白收敛 + 标题两行均衡
   （qc-pagehead/qc-intro 仅 qualitycontrol.html 专用模板使用，不影响其他页的 pagehead/sec 间距；
   标题区 860→1020px 让 40px 大标题两行断点更从容，text-wrap:balance 均衡两行长度，
   正文 p 仍限 860px 左对齐不拉过宽；旧 webview 不支持 balance 时退化为原断点，不劣化） */
.qc-pagehead .pagehead-inner { padding-bottom: 40px; }
.qc-intro { padding-top: 44px; padding-bottom: 64px; }
.qc-intro .pm-intro { max-width: 1020px; }
.qc-intro .pm-intro > p { max-width: 860px; }
.qc-intro .sec-title { text-wrap: balance; }

/* 2026-09-19 客户要求：QC 页 What We Verify 八项框高度统一（仅本模块作用域）——
   两处长文案（Positioning accuracy/Cycle time 项）在桌面列宽折两行后行高 78 与单行 53 混排，
   min-height 对齐到两行框高，同行格内文字/红勾 flex 居中对齐不变；其他页 pe-get 清单不受影响 */
.sec-qcverify .pe-get li { min-height: 78px; }

/* 2026-09-19 客户要求：QC 页 Quality Records 模块——清单上方提示行 + 六框等高（仅 sec-qcdocs 作用域，
   verify 模块与其他页 pe-get 不受影响）；提示行小字灰色与 qc-note 同调性 */
.sec-qcdocs .qc-lead { margin: 0 0 16px; font-size: 13.5px; color: #666666; } /* 2026-09-22 客户《FAT/QC docx》：清单上方说明 #666666 + margin-bottom 16px（原 10px） */
.sec-qcdocs .pe-get li { min-height: 78px; }

/* 2026-09-21 客户《FAT & Inspection.docx》：FAT Documentation 文件清单上方范围说明句
   （pages_fat_docs_note，版式与 QC 页 qc-lead 同款，仅 sec-fatdocs 作用域） */
.sec-fatdocs .qc-lead { margin: 0 0 16px; font-size: 13.5px; color: #666666; }

/* ============ Applications 板块（2026-09-20 客户《Applications 修改.docx》） ============ */
/* 概览 8 卡 / 详情 WHAT WE PRODUCE 是独立分类卡而非流程：卡片间 → 箭头全部去除
   （特异性/源序同 .sup-flow.flow-4 的箭头规则且在其后，含 ≤1120 单列的 ↓ 一并去） */
.sup-flow.app-grid .sf-step:not(:last-child)::after { content: none; }
/* 客户「View Application 八卡对齐统一」根修：a.sf-step 原 display:block 覆盖掉 flex，
   sf-body 无法撑满、sf-more 悬空（短文案卡链接浮在文字下方不齐底）——恢复纵向 flex，
   配合既有 .sf-body{flex:1} / .sf-more{margin-top:auto} 让链接统一钉在卡底（company/founder/
   capabilities/support-landing 等锚点卡同步受益，均为既有注释声称的目标行为） */
a.sf-step { display: flex; flex-direction: column; }
/* 详情要点 >6 条时折叠多余卡，Show More 分批展开（无 JS 时全量展示不塌） */
.lm-hidden { display: none; }
[data-loadmore-btn].lm-off { display: none; }
/* 平板 2 列：概览 8 卡 / 详情 6 卡（3×2）在 ≤1120 不跌成单列长滚（覆盖 .flow-3/.flow-4 的单列规则） */
@media (max-width: 1120px) {
    /* 2026-09-22 客户《4 Applications(1).docx》：行间距目标 30-40px——桌面 4 列既有 40px 已达标，
       ≤1120 两列/≤600 单列沿用基础 16px 偏窄，补 32px */
    .sup-flow.app-grid { grid-template-columns: repeat(2, 1fr); max-width: none; row-gap: 32px; }
}
@media (max-width: 600px) {
    .sup-flow.app-grid { grid-template-columns: 1fr; max-width: 560px; }
}
/* 2026-09-22 客户反馈 Applications 卡图显示不全：卡源图全为 3:2 系横图（含换图后），容器 4:3 → 3:2 零裁切
   （作用域限 app-grid，不动全站 sup-flow 的 4:3 标准） */
.sup-flow.app-grid .sf-img { aspect-ratio: 3 / 2; }
/* 概览卡轻量 Tag（公差/材质等，后台「应用领域」tags 每行一个；空值不渲染） */
.app-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.app-tags span { font-size: 12px; font-weight: 600; color: var(--gray); background: #f2f3f5; border: 1px solid var(--line); border-radius: 999px; padding: 3px 10px; white-space: nowrap; }
/* Other Applications：纯文字 chip 升级微型缩略图卡（hover 变色沿用 .sol-chip 红边红字） */
.app-chip { padding: 0; overflow: hidden; }
.app-chip-img { display: block; aspect-ratio: 16 / 10; overflow: hidden; }
.app-chip-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s var(--ease); }
.app-chip:hover .app-chip-img img { transform: scale(1.04); }
.app-chip-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 13px 15px; font-size: 14px; line-height: 1.4; }
.app-chip-row b { min-width: 0; }
.app-chip-row i { flex: none; color: var(--red); font-style: normal; font-weight: 800; transition: transform .2s var(--ease); }
.app-chip:hover .app-chip-row i { transform: translateX(3px); }

/* ============ 2026-09-20 客户《Company修改.docx》：Company/About/Founder/Culture/WWU 等页箭头与网格整备 ============ */
/* 非流程类编号卡（并列展示）统一去卡间箭头：桌面 → 与 ≤1120 单列 ↓ 一并去（特异性高于基础规则）。
   company.html EXPLORE 卡 / founder.html 两模块 / culture.html 价值观卡 / landing.html Overview 卡 /
   infopage.html cards 模块；真流程（QC 流程、From Your Drawing、Getting Started）不加此类保留箭头 */
.sup-flow.sf-grid .sf-step:not(:last-child)::after { content: none; }
/* flow-3 两行流程（6 步）03→04 换行折线连接（flow-4 版 2026-09-20 已上线，此处补 3 列变体的行距与几何：
   列中心 16.67%/83.33%，折线竖段对齐上下两卡中线，箭头落在下行首卡顶） */
.sup-flow.flow-3:has(.flow-turn) { row-gap: 0; }
.sup-flow.flow-3 .flow-turn::before { left: 16.5%; right: 16.5%; }
.sup-flow.flow-3 .flow-turn::after { left: 16.5%; }
/* Manufacturing Network 页设备卡轻量规格标签（加工/检测两区块；后台 pages_fac_specs 维护，空值整块不渲染） */
.gal-specs { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 16px 14px; }
.gal-specs i { font-style: normal; font-size: 11.5px; font-weight: 700; letter-spacing: .04em; color: var(--ink-2); background: #f2f3f5; border: 1px solid var(--line); border-radius: 999px; padding: 3px 10px; line-height: 1.4; white-space: nowrap; }

/* ============ 2026-09-20 客户《Support修改.docx》：Support 7 页整备 ============ */
/* 并列卡去箭头后列距收窄（原 40px 为让位卡间箭头；sf-grid 桌面/平板列距统一 24px，行距/移动端不变） */
.sup-flow.sf-grid { column-gap: 24px; }
/* Download Center：分类区间距加大；产品名称/简介字号增大提高可读性（正文行高不变） */
.res-group { margin-bottom: 44px; }
.res-info b { font-size: 16.5px; }
.res-info p { font-size: 14px; }
/* TECHNICAL DOCUMENTS & SUPPORT 四卡：卡文 14-15px 档（标题 16px 保持），等高由 flex+p{flex:1} 既有机制保证 */
.rd-card p { font-size: 14px; line-height: 1.65; }

/* ============ 2026-09-21 客户《4 Applications.docx》：响应式截断统一加固（全站 sup-flow 卡格 + Footer 列） ============
   客户要求「标题/说明/标签/按钮不得超出卡片、任何宽度无横向滚动条、不用 overflow-x:hidden 掩盖」。
   页面级右缘截断主因（顶栏 lang-switch 负 margin 于 1360-1395 视口撑出滚动区）已在本日响应式审查改为
   position:relative 位移；此处补足内容级加固——后台录入的超长词/长标签在网格轨道内可收缩断行，
   不会撑破 1fr 轨道（grid 项默认 min-width:auto 是「最右列被顶出容器」这类截断的根源） */
.sf-step { min-width: 0; }
.sf-body b, .sf-body p { min-width: 0; overflow-wrap: break-word; }
/* 标签胶囊：极端长标签限宽换行（常态单行视觉不变），杜绝 nowrap 溢出卡右缘 */
.app-tags span { max-width: 100%; white-space: normal; overflow-wrap: break-word; }
/* Footer 五列同源加固：列内容长词可断行，防止任何一列被 min-content 顶宽挤出容器 */
.ftr-inner > * { min-width: 0; }
.ftr-col > a, .ftr-col-body > a, .ftr-intro, .ftr-contact { overflow-wrap: break-word; }
/* 2026-09-22 客户 docx：≤600 底栏版权/社媒/隐私条款堆叠时居中对齐 */
@media (max-width: 600px) {
    .ftr-bottom-inner { flex-direction: column; justify-content: center; text-align: center; }
    .ftr-bottom-inner .ftr-social { justify-content: center; margin: 2px 0; }
}

/* ============ 2026-09-21 客户《Automotive Components.docx》：floatbar 遮挡内容统一真修复 ============
   客户要求「任何设备上文字/表单/Footer 栏目必须完整显示，不用 overflow-x:hidden 掩盖」。
   根因：.floatbar（fixed 悬浮钮列，桌面 right:18px / 移动 right:12px，钮宽 48px）在视口 <1404px 时
   与页面容器内容右缘（vw-24）几何相交约 42px——笔记本/平板档压住询盘表单卡与各类卡片右缘，
   手机档直接压住 Project Requirements 输入框与上传区（客户所见「底部询盘表单/Footer 右侧被截断」）。
   真修复（内容收缩让位，非隐藏溢出）：受影响宽度给主内容容器预留右侧悬浮钮通道，悬浮钮不再压任何
   内容；≥1401px 几何上不相交，桌面不动；页脚不处理（floatbar 滚至页脚经 .ftr-over 自动隐藏）；
   顶栏/头部悬浮钮够不到，不动。通道宽 = 钮占位（66/60px）+ 安全间隙。 */
@media (min-width: 921px) and (max-width: 1400px) {
    .hero-grid, .sec, .stripe p, .cp-band-in, .pagehead-inner,
    .abo-hero-text, .sec-abo-stats, .cta-grid, .sup-flow, .hero-factory, .hero-stats { padding-right: 78px; }
}
@media (max-width: 920px) {
    .hero-grid, .sec, .stripe p, .cp-band-in, .pagehead-inner,
    .abo-hero-text, .sec-abo-stats, .cta-grid, .sup-flow, .hero-factory, .hero-stats { padding-right: 66px; }
}

/* 2026-09-21《Who We Serve.docx》极窄屏（≤380）：客户类型卡 Typical Needs 2 列网格被最长词撑出卡体（320 档实测
   "Machine and process planning" 右缘越卡 23px 被裁），降单列真换行修复，不用 overflow-x:hidden 掩盖、不缩字号 */
@media (max-width: 380px) {
    .wsc-needs ul { grid-template-columns: 1fr; }
}
/* ===== 2026-09-21 客户《Download Center.docx》：Request Catalog 机型提示行（site.js 运行时注入 #ctaForm，
   未选择机型时不存在该节点；位于白色表单卡内提交键上方） ===== */
.catalog-note { margin: 2px 0 10px; font-size: 12.5px; color: var(--gray); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.catalog-note b { color: var(--ink); font-weight: 600; }
.catalog-x { border: 0; background: none; cursor: pointer; font-size: 15px; line-height: 1; color: var(--gray); padding: 2px 5px; font-family: inherit; }
.catalog-x:hover { color: var(--red); }

/* =========================================================
 * Technical Insights 技术分享（2026-09-30 客户需求）
 * 首页精选 3 卡 / 列表页 4 分类+搜索+分页 / 详情居中单列 860px
 * ======================================================= */

/* ---------- 卡片网格（首页精选/列表页/详情相关共用：桌面 3 列、≤920 单列，封面 16:9） ---------- */
.ins-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
.ins-card { display: flex; flex-direction: column; background: var(--paper); border: 1px solid var(--line); transition: border-color .2s var(--ease), box-shadow .2s var(--ease), transform .2s var(--ease); }
.ins-card:hover { border-color: var(--ink); box-shadow: var(--shadow); transform: translateY(-3px); }
.ins-img { display: block; aspect-ratio: 16 / 9; overflow: hidden; background: var(--bg); }
.ins-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.ins-card:hover .ins-img img { transform: scale(1.04); }
.ins-body { display: flex; flex-direction: column; flex: 1; padding: 20px 22px 22px; }
.ins-meta { font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--red); margin-bottom: 10px; }
.ins-body b { font-size: 17px; line-height: 1.45; margin-bottom: 8px; overflow-wrap: anywhere; }
.ins-body p { color: var(--gray); font-size: 14.5px; line-height: 1.65; margin-bottom: 14px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ins-body .prod-more { margin-top: auto; }

/* ---------- 首页精选板块（白底，红条 stripe 与深色表单区之间） ---------- */
.sec-ins .ins-grid { max-width: 1320px; margin: 0 auto; }

/* ---------- 列表页筛选条（分类 chips + 搜索框） ---------- */
.tech-filter { display: flex; justify-content: space-between; align-items: center; gap: 18px; flex-wrap: wrap; margin-bottom: 34px; }
.tech-filter .news-tabs { margin-bottom: 0; }
.tech-search { display: flex; gap: 8px; }
.tech-search input { border: 1px solid var(--line); background: var(--paper); padding: 9px 14px; font-size: 14px; width: 230px; font-family: inherit; }
.tech-search input:focus { outline: none; border-color: var(--ink); }

/* ---------- 详情页：居中单列（版心 860px，正文左对齐） ---------- */
.sec-tech { padding-top: 64px; }
.tech-article { max-width: 860px; margin: 0 auto; }
.ta-title { font-size: clamp(26px, 3.4vw, 40px); font-weight: 800; line-height: 1.25; margin: 10px 0 14px; overflow-wrap: anywhere; }
.ta-lead { font-size: 17.5px; color: #333; line-height: 1.8; }
.ta-meta { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); color: var(--gray); font-size: 13.5px; }
.ta-cover { margin: 30px 0 6px; border: 1px solid var(--line); }
.ta-cover img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.ta-video { position: relative; aspect-ratio: 16 / 9; margin: 26px 0 6px; background: var(--ink); }
.ta-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.ta-body { font-size: 16.5px; margin-top: 26px; }
.ta-body h2 { font-size: 25px; font-weight: 800; line-height: 1.3; margin: 36px 0 14px; }
.ta-body h3 { font-size: 20px; font-weight: 800; margin: 28px 0 12px; }
.ta-body figure { margin: 22px 0; }
.ta-body figure img { border: 1px solid var(--line); }
.ta-body figcaption { font-size: 13px; color: var(--gray); text-align: center; margin-top: 8px; }
.ta-body img { margin: 8px 0; }
.ta-body ul, .ta-body ol { margin: 0 0 18px 22px; }
.ta-body ul li { list-style: disc; margin-bottom: 8px; }
.ta-body ol li { list-style: decimal; margin-bottom: 8px; }
/* 表格：窄屏横向滚动（编辑器表格无包裹层，块化滚动为通用方案） */
.ta-body table { width: 100%; border-collapse: collapse; margin: 22px 0; font-size: 14.5px; display: block; overflow-x: auto; }
.ta-body th, .ta-body td { border: 1px solid var(--line); padding: 10px 14px; text-align: left; vertical-align: top; }
.ta-body th { background: var(--bg); font-weight: 700; }
.ta-body p { margin-bottom: 18px; color: #3a3d45; }
.ta-cta { margin-top: 46px; text-align: center; border: 1px solid var(--line); border-top: 4px solid var(--red); padding: 34px 26px; background: var(--bg); }
.ta-cta b { display: block; font-size: 21px; margin-bottom: 8px; }
.ta-cta p { color: var(--gray); font-size: 14.5px; max-width: 560px; margin: 0 auto 18px; }
.ta-rel { margin-top: 84px; }
.ta-rel .sec-title { text-align: center; margin-bottom: 30px; }

@media (max-width: 920px) {
    .ins-grid { grid-template-columns: 1fr; }
    .tech-filter { flex-direction: column; align-items: stretch; }
    .tech-search { width: 100%; }
    .tech-search input { flex: 1; width: auto; min-width: 0; }
    .sec-tech { padding-top: 48px; }
    .ta-rel { margin-top: 56px; }
}

/* ---------- 2026-09-30 案例详情正文内嵌实拍/图纸（真实案例 docx）：figure 满宽 + 细边框 + 图注；.cs-narrow 竖版图居中限宽 ---------- */
.sol-body-text figure { margin: 24px 0 28px; }
.sol-body-text figure img { width: 100%; border: 1px solid var(--line); background: #fff; }
.sol-body-text figcaption { margin-top: 10px; font-size: 13.5px; line-height: 1.6; color: var(--gray); }
.sol-body-text figure.cs-narrow { max-width: 520px; margin-left: auto; margin-right: auto; }
@media (max-width: 620px) {
    .sol-body-text figure.cs-narrow { max-width: none; }
}