/* ============================================================
   ChemiTech 高端化升级覆盖层（桌面端 min-width:641px）
   方向：精密化工 × 轻奢克制 —— 深海军蓝主导 + 品牌橙单点强调
   部署：/template/css/custom.css（css_js.asp 末尾引入，版本 v=2026.9）
   原则：只覆盖视觉，不改动任何原有文件；回滚=删除引用行
   ============================================================ */

/* ---------- 1. 设计令牌 ---------- */
:root{
  --navy-950:#071A2E;
  --navy-900:#0A2540;
  --navy-800:#0F2F50;
  --navy-700:#14486B;
  --brand-500:#E8491D;
  --brand-600:#C93A14;
  --ink-900:#16283C;
  --ink-700:#33455A;
  --muted:#5A6B7C;
  --line:#E3E9F0;
  --bg-soft:#F5F8FB;
  --white:#FFFFFF;
  --radius-sm:6px;
  --radius-md:10px;
  --shadow-1:0 2px 8px rgba(10,37,64,.08);
  --shadow-2:0 10px 30px rgba(10,37,64,.14);
  --shadow-3:0 24px 60px rgba(10,37,64,.20);
  --ease-out:cubic-bezier(0.16,1,0.3,1);
  --dur-fast:180ms;
  --dur-base:340ms;
  --font-num:"Bahnschrift","DIN Alternate","Arial Narrow","Microsoft YaHei",sans-serif;
}

/* ---------- 2. 全局基调：正文近黑蓝、链接深蓝 ---------- */
body{ color:var(--ink-700); }
a{ color:var(--navy-800); transition:color var(--dur-fast) var(--ease-out); }
a:hover{ color:var(--brand-500); }
h1,h2,h3,h4{ color:var(--ink-900); }

/* ---------- 3. 头部 Logo 区：紫红撞色 → 深蓝+品牌橙双行口号 ---------- */
.t_logo{ min-height:118px; }
.t_logo .left .txt{ background:none !important; border-left:3px solid var(--brand-500); padding-left:16px; }
.t_logo .left .txt .one{
  color:var(--navy-900);
  font-size:28px;
  font-weight:700;
  letter-spacing:4px;
  font-family:var(--font-num);
}
.t_logo .left .txt .two{
  color:var(--brand-500);
  font-size:14px;
  font-weight:600;
  letter-spacing:6px;
  margin-top:6px;
  text-transform:uppercase;
  font-family:var(--font-num);
}

/* 头部右侧电话：红色大字 → 深蓝 + 橙色点缀 */
.t_logo .right .sub_right{ background:none !important; border-left:1px solid var(--line); padding-left:28px; }
.t_logo .right .s1{ color:var(--muted); font-size:13px; letter-spacing:2px; padding-top:8px; }
.t_logo .right .s2{
  color:var(--navy-900);
  font-size:26px;
  font-weight:700;
  font-family:var(--font-num);
  font-variant-numeric:tabular-nums;
  letter-spacing:1px;
}

/* ---------- 4. 主导航：蓝红渐变 → 深海军蓝 + 顶部品牌橙记忆线 ---------- */
.t_nav{
  background:var(--navy-900) !important;
  border-top:3px solid var(--brand-500);
  box-shadow:var(--shadow-1);
  line-height:60px;
  min-height:60px;
  font-size:16px;
  position:relative;
}
.t_nav .center{ display:block; }
.t_nav ul.ul_1{ display:flex; }
.t_nav li{
  float:none;
  width:auto;
  flex:1 1 auto;
  text-align:center;
}
.t_nav li a{
  display:block;
  color:rgba(255,255,255,.88);
  font-size:16px;
  font-weight:500;
  letter-spacing:3px;
  padding:0 8px;
  position:relative;
  transition:color var(--dur-fast) var(--ease-out), background-color var(--dur-fast) var(--ease-out);
}
/* hover：底部品牌橙指示线扫入 */
.t_nav li a::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:0;
  width:0;
  height:3px;
  background:var(--brand-500);
  transform:translateX(-50%);
  transition:width var(--dur-base) var(--ease-out);
}
.t_nav li a:hover{ color:#fff; font-weight:600; background:rgba(255,255,255,.06); }
.t_nav li a:hover::after{ width:100%; }

/* 语言切换按钮（中英互跳）：胶囊描边，hover 填充品牌橙 */
.t_nav li.langItem{ flex:0 0 132px; }
.t_nav li.langItem .langSwitch{
  display:inline-block;
  line-height:32px;
  margin:14px auto;
  padding:0 22px;
  border:1px solid rgba(255,255,255,.45);
  border-radius:999px;
  color:#fff;
  font-size:14px;
  font-weight:600;
  letter-spacing:2px;
  font-family:var(--font-num);
  transition:all var(--dur-fast) var(--ease-out);
}
.t_nav li.langItem .langSwitch::after{ content:none; }
.t_nav li.langItem .langSwitch:hover{
  background:var(--brand-500);
  border-color:var(--brand-500);
  color:#fff;
  transform:translateY(-1px);
  box-shadow:0 6px 16px rgba(232,73,29,.35);
}
.t_nav li.langItem .langSwitch:focus-visible{
  outline:2px solid var(--brand-500);
  outline-offset:2px;
}

/* ---------- 5. 首页大 Banner：深蓝渐变遮罩提升质感 ---------- */
.bannerBox{ position:relative; }
.bannerBox::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg, rgba(7,26,46,.10) 0%, rgba(7,26,46,0) 35%, rgba(7,26,46,.28) 100%);
}

/* ---------- 6. 区块大标题：紫红 → 深蓝 + 品牌橙短线 ---------- */
.iBaoZhang .shareTitle .cn{
  color:var(--navy-900);
  background:none !important;
  font-weight:700;
  letter-spacing:8px;
  padding-bottom:22px;
  position:relative;
}
.iBaoZhang .shareTitle .cn::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:0;
  width:56px;
  height:4px;
  border-radius:2px;
  background:var(--brand-500);
  transform:translateX(-50%);
}
.iBaoZhang .content{ color:var(--ink-700); letter-spacing:3px; }

.title_center{ color:var(--navy-900); }

/* ---------- 7. 卡片体系：统一发丝边框 + 三级阴影 + 上浮动效 ---------- */
.shareProItem,
.shareNewBox,
.shareFaItem,
.iCase .item,
.iPro .item{
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  background:var(--white);
  box-shadow:var(--shadow-1);
  transition:transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out);
}
.shareProItem:hover,
.shareNewBox:hover,
.shareFaItem:hover,
.iCase .item:hover,
.iPro .item:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow-2);
  border-color:#CFDCE8;
}

/* 卡片内图片轻放大 */
.shareProItem img,
.shareNewBox img,
.shareFaItem img{
  transition:transform var(--dur-base) var(--ease-out);
}
.shareProItem:hover img,
.shareNewBox:hover img,
.shareFaItem:hover img{ transform:scale(1.04); }

/* ---------- 8. 按钮：红橙杂色 → 品牌橙统一，hover 上浮 ---------- */
a.more,
.more a,
[class*="more"] a[href],
a.tzBox,
a[href*="contact"].bt,
.lookMore a{
  background:var(--brand-500);
  color:#fff !important;
  border-radius:var(--radius-sm);
  box-shadow:var(--shadow-1);
  transition:all var(--dur-fast) var(--ease-out);
}
a.more:hover,
.more a:hover,
a.tzBox:hover,
.lookMore a:hover{
  background:var(--brand-600);
  transform:translateY(-2px);
  box-shadow:var(--shadow-2);
}

/* ---------- 9. 内页 Banner：统一深蓝基调遮罩 ---------- */
.in_banner{ position:relative; }
.in_banner::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(90deg, rgba(7,26,46,.35) 0%, rgba(7,26,46,.10) 55%, rgba(7,26,46,0) 100%);
}

/* ---------- 10. 面包屑 / 页码 / 侧栏导航 ---------- */
.pageDH{ color:var(--muted); }
.pageDH a{ color:var(--navy-800); }

.pageNumber a{
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  color:var(--ink-700);
  transition:all var(--dur-fast) var(--ease-out);
}
.pageNumber a:hover{
  border-color:var(--navy-900);
  color:var(--navy-900);
}

.typeNav a,
.newNav a,
.faNav a{
  transition:all var(--dur-fast) var(--ease-out);
}
.typeNav a:hover,
.newNav a:hover,
.faNav a:hover{
  color:var(--brand-500);
}

/* ---------- 11. 页脚：深海军蓝 + 统一链接色 ---------- */
.foot{
  background:var(--navy-950) !important;
  color:rgba(255,255,255,.72);
}
.foot a{ color:rgba(255,255,255,.72); }
.foot a:hover{ color:var(--brand-500); }
.friendLink a{ color:rgba(255,255,255,.6); }
.friendLink a:hover{ color:#fff; }
.bq{ color:rgba(255,255,255,.5); }

/* ---------- 12. 搜索框 ---------- */
.t_search2 input[type="text"],
.t_search input[type="text"]{
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  transition:border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}
.t_search2 input[type="text"]:focus,
.t_search input[type="text"]:focus{
  border-color:var(--navy-700);
  box-shadow:0 0 0 3px rgba(20,72,107,.12);
  outline:none;
}

/* ---------- 13. 全局细节：选中色与滚动条 ---------- */
::selection{ background:var(--brand-500); color:#fff; }
::-webkit-scrollbar{ width:10px; }
::-webkit-scrollbar-track{ background:var(--bg-soft); }
::-webkit-scrollbar-thumb{ background:#B8C6D4; border-radius:5px; }
::-webkit-scrollbar-thumb:hover{ background:var(--navy-700); }

/* ---------- 14. 动效降级 ---------- */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    transition:none !important;
    animation:none !important;
  }
}

/* ---------- 15. 首页产品板块（iPro）—— 整段重做 ---------- */
/* 方向：Editorial Industrial —— 大字号章节头 + 真实 chip 按钮 + 紧凑产品网格 + 最大化零遮挡 */
/* 关键修复：
   - 所有 grid 列用 minmax(0, 1fr) 防止子项溢出
   - 所有 flex 子项 min-width:0 防止内容撑大
   - transform 加 will-change 限定作用域，不影响相邻卡片
   - 移除 backdrop-filter（性能差，大屏引发模糊）
   - 更多按钮从文字链接升级为真实 chip 按钮
   - 图片 aspect-ratio 锁死，object-fit:cover 中心裁切 */

/* 15.0 板块容器 + isolation 独立堆叠上下文（修复遮挡的关键：左列 z-index 永远高于右列） */
.iPro{
  padding:72px 0 80px !important;
  position:relative;
  isolation:isolate;          /* 新建 stacking context，子级 z-index 在本上下文内竞争，不外溢 */
  background:linear-gradient(180deg, var(--bg-soft) 0%, #ffffff 100%);
  overflow:clip;
}
.iPro > .center{ position:relative; z-index:2; }    /* 内容层最高，永远盖章节头 */
.iPro::before{ z-index:1; }                          /* 章节头编号在中层 */
.iPro::after{
  content:"";
  position:absolute; left:50%; bottom:0; transform:translateX(-50%);
  width:96px; height:3px;
  background:linear-gradient(90deg, var(--brand-500) 0%, var(--brand-300) 100%);
  border-radius:2px;
  z-index:1;
}

/* 章节编号（修饰：左侧细线 + 大字间距） */
.iPro::before{
  content:"03   /   PRODUCT PORTFOLIO";
  display:block;
  font-family:var(--font-display);
  font-size:11px; font-weight:600;
  letter-spacing:.32em;
  color:var(--text-muted);
  opacity:.5;
  margin:0 auto 14px;
  width:100%;
  max-width:1320px;
  padding:0 32px;
  text-align:left;
  position:relative;
  box-sizing:border-box;
}

/* 15.1 章节头：左边大字标题，右边醒目 CTA 主按钮 */
.iPro .right .proTitle{
  display:flex !important;
  align-items:flex-end; justify-content:space-between; gap:24px;
  flex-wrap:wrap;   /* 小窗口自动换行，避免被挤变形 */
  margin:0 0 28px 0 !important;
  padding-bottom:18px;
  border-bottom:1px solid #E5E9F0;
  min-width:0;
}
.iPro .right .proTitle .sub_left{
  display:flex !important; flex-direction:column; gap:6px;
  font-family:var(--font-display);
  font-size:30px !important; font-weight:700;
  color:var(--navy-900);
  letter-spacing:-.015em;
  line-height:1.05;
  min-width:0;
  flex:1 1 auto;
}
.iPro .right .proTitle .sub_left::before{
  content:"精选矩阵 · Engineered Additives & Imported Equivalents";
  display:block;
  font-family:var(--font-display);
  font-size:12px; font-weight:500;
  letter-spacing:.18em;
  color:var(--brand-500);
  text-transform:uppercase;
  opacity:.85;
}
.iPro .right .proTitle .sub_left::after{ content:none !important; }

/* 15.2 "查看全部产品"按钮（升级：实心 navy → brand 主 CTA，与 LOGO 同色） */
.iPro .right .proTitle .sub_right{
  flex:0 0 auto;     /* 永远保持原尺寸，不被挤压 */
  margin-left:0;
}
.iPro .right .proTitle .sub_right .more{
  display:inline-flex !important; align-items:center; gap:10px;
  font-size:14px !important; font-weight:700;
  color:#ffffff;
  background:linear-gradient(135deg, #0A2540 0%, #14365C 100%);
  border:1px solid #0A2540;
  border-radius:999px;
  padding:11px 22px 11px 14px;
  text-decoration:none;
  white-space:nowrap;
  transition:all .28s var(--ease-out, cubic-bezier(.2,.6,.3,1));
  position:relative; overflow:hidden;
  letter-spacing:.02em;
  box-shadow:0 6px 16px rgba(10,37,64,.18);
}
.iPro .right .proTitle .sub_right .more::before{
  content:"";
  flex:0 0 auto;
  width:26px; height:26px; border-radius:50%;
  background:var(--brand-500);
  display:inline-flex; align-items:center; justify-content:center;
  color:#fff; font-size:14px; font-weight:700;
  transition:transform .3s var(--ease-out, cubic-bezier(.2,.6,.3,1));
}
.iPro .right .proTitle .sub_right .more::after{
  content:"→"; color:#fff; font-size:14px; font-weight:700;
  margin-left:2px;
  transition:transform .3s var(--ease-out, cubic-bezier(.2,.6,.3,1));
}
.iPro .right .proTitle .sub_right .more span{ display:none !important; }   /* 隐藏 >>> */
.iPro .right .proTitle .sub_right .more:hover{
  background:linear-gradient(135deg, #E8491D 0%, #F26B40 100%);
  border-color:#E8491D;
  transform:translateY(-1px);
  box-shadow:0 10px 22px rgba(232,73,29,.32);
}
.iPro .right .proTitle .sub_right .more:hover::before{
  background:#ffffff; color:var(--brand-500);
  transform:rotate(90deg);
}
.iPro .right .proTitle .sub_right .more:hover::after{
  transform:translate(4px, 0);
}
.iPro .right .proTitle .sub_right .more:active{
  transform:translateY(0);
  box-shadow:0 4px 12px rgba(232,73,29,.28);
}

/* 英文站 chip 文案：用 ::before 覆盖原"更多"/"More" 为 "View All" */
html[lang="en"] .iPro .right .proTitle .sub_right .more{ font-size:0 !important; }
html[lang="en"] .iPro .right .proTitle .sub_right .more::before{
  width:auto !important; height:auto !important;
  border-radius:0 !important; background:transparent !important;
  content:"View All";
  font-size:14px !important; font-weight:700;
  letter-spacing:.02em;
}
html[lang="en"] .iPro .right .proTitle .sub_right .more:hover::before{ transform:none; }
html[lang="en"] .iPro .right .proTitle .sub_right .more:active::before{ transform:none; }

/* 英文站副标题（产品板块顶部 Eyebrow） */
html[lang="en"] .iPro .right .proTitle .sub_left::before{
  content:"Engineered Additives · Imported Equivalents";
}

/* 15.3 双栏布局：固定左宽 + 弹性右宽，断点间不跳变
   关键：左列显式 z-index:5，右列 z-index:1，左列永远在上 */
.iPro .center{ max-width:1320px; padding:0 32px; position:relative; z-index:1; }
.iPro .pl_Box{
  display:flex !important;
  gap:32px;
  align-items:flex-start;
  min-width:0;
}
.iPro .pl_Box > li.left{
  flex:0 0 240px !important;
  width:240px !important;
  min-width:0;
  position:relative;
  z-index:5;       /* 左列永远在右列之上，杜绝遮挡 */
}
.iPro .pl_Box > li.right{
  flex:1 1 auto !important;
  width:auto !important;
  min-width:0;     /* 关键：允许 grid 收缩 */
  position:relative;
  z-index:1;
}

/* 15.4 左侧分类导航：白底圆角卡 + 主分类深色块 + 子分类网格
   V4 关键修复：HTML 模板里 ul>li>div 嵌套错乱，浏览器自动闭合 ul。
   这里用 .left_content 直接做 flex column，所有子级（bigNav/subBox）垂直堆叠，
   不再依赖 ul_8。 */
.iPro .typeNav{
  background:#ffffff;
  border:1px solid #E5E9F0;
  border-radius:14px;
  padding:14px 12px 16px;
  box-shadow:0 6px 18px rgba(10,37,64,.06);
  width:100%;
  box-sizing:border-box;
  overflow:hidden;
  position:relative;
  z-index:5;
}
.iPro .typeNav::before{
  content:"";
  position:absolute; left:0; top:18px; bottom:18px;
  width:3px;
  background:linear-gradient(180deg, var(--brand-500) 0%, var(--navy-900) 100%);
  border-radius:0 2px 2px 0;
}
.iPro .left_Title{ display:none !important; }

/* 关键：直接对 .left_content 强制 flex column，覆盖模板 HTML 嵌套错乱 */
.iPro .left_content{
  display:flex !important;
  flex-direction:column;
  gap:10px;
  min-width:0;
  padding:0 !important;
  margin:0 !important;
}
.iPro .left_content .ul_8{
  list-style:none; padding:0; margin:0;
  display:contents;   /* 关键：让 ul_8 "透明"，里面 bigNav 仍属 .left_content 的 flex 子项 */
  min-width:0;
}

/* 一级分类：紧凑深色 header（白字 + navy 渐变），与右侧 navy 品牌 CTA 呼应 */
.iPro .left_content .bigNav{
  list-style:none;
  margin:0 !important; padding:0;
  border-radius:8px;
  background:linear-gradient(135deg, #0A2540 0%, #14365C 100%);
  overflow:hidden;
  transition:all .25s var(--ease-out, cubic-bezier(.2,.6,.3,1));
  position:relative;
  z-index:5;
}
.iPro .left_content .bigNav > a{
  display:flex !important; align-items:center; justify-content:space-between;
  gap:8px;
  font-size:13.5px !important; font-weight:700;
  color:#ffffff !important;
  padding:11px 14px !important;
  background:transparent !important;
  border:none !important;
  text-decoration:none;
  letter-spacing:.04em;
  min-width:0;
  width:100%;
  box-sizing:border-box;
}
.iPro .left_content .bigNav > a::before{
  content:"";
  flex:0 0 auto;
  width:6px; height:6px;
  border-radius:50%;
  background:var(--brand-500);
  box-shadow:0 0 0 3px rgba(232,73,29,.18);
  margin-right:4px;
}
.iPro .left_content .bigNav > a::after{
  content:"›"; font-size:18px; font-weight:600;
  color:#ffffff; opacity:.65;
  transition:transform .25s ease, color .25s ease, opacity .25s ease;
  flex:0 0 auto;
  line-height:1;
}
.iPro .left_content .bigNav > a span{
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  min-width:0;
  flex:1 1 auto;
}
.iPro .left_content .bigNav:hover{
  background:linear-gradient(135deg, #E8491D 0%, #F26B40 100%);
  transform:translateY(-2px);
  box-shadow:0 10px 22px rgba(232,73,29,.28);
}
.iPro .left_content .bigNav:hover > a::after{
  color:#ffffff; opacity:1; transform:translateX(4px);
}

/* 二级分类：浅色块容器 + 2 列网格，子项紧凑 chip */
.iPro .left_content .subBox{
  display:grid !important;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:5px;
  padding:10px 12px 12px !important;
  background:linear-gradient(180deg, #F7F9FC 0%, #FAFBFD 100%);
  border:1px solid #E5E9F0;
  border-radius:8px;
  margin:0 !important;
  min-width:0;
  position:relative;
  z-index:5;
}
.iPro .left_content .smallType{
  list-style:none; padding:0; margin:0;
  float:none !important;
  min-width:0;
}
.iPro .left_content .smallType > a{
  display:block;
  font-size:11.5px; font-weight:500;
  color:#6B7785;
  padding:5px 6px;
  background:#FFFFFF;
  border:1px solid #E5E9F0;
  border-radius:5px;
  text-decoration:none;
  text-align:center;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  transition:all .2s ease;
  min-width:0;
}
.iPro .left_content .smallType > a:hover{
  color:#FFF; background:var(--brand-500); border-color:var(--brand-500);
  transform:translateY(-1px);
}

/* 15.6 产品网格：默认 3 列（1200-1439），4 列（1440+），5 列（2560+） */
.iPro .sContent{ min-width:0; position:relative; z-index:1; }
.iPro .sContent > .pl{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:20px;
  margin:0 !important;
  min-width:0;
}
.iPro .sContent > .pl::after{ content:none !important; }

/* 产品卡片：1px 细边 + 4:3 图片 + 文字 + hover 浮起（限定 z-index 不抢左列层级） */
.iPro .shareProItem{
  background:#ffffff;
  border:1px solid #EEF1F5;
  border-radius:12px;
  overflow:hidden;
  margin:0 !important;
  float:none !important;
  display:flex !important;
  flex-direction:column;
  position:relative;
  z-index:1;       /* 在右列内是基础层，hover 不抢左列 */
  transition:transform .28s var(--ease-out, cubic-bezier(.2,.6,.3,1)),
             box-shadow .28s var(--ease-out, cubic-bezier(.2,.6,.3,1)),
             border-color .28s ease;
  box-shadow:0 1px 3px rgba(10,37,64,.04);
  will-change:transform;
  min-width:0;
  contain:layout paint;
}
.iPro .shareProItem:hover{
  transform:translateY(-4px);
  border-color:transparent;
  box-shadow:0 16px 32px rgba(10,37,64,.14);
  z-index:2;       /* hover 时短暂提到右列内最高，但仍低于 li.left 的 z-index:5 */
}

/* 卡片图片：固定比例 + cover 裁切 */
.iPro .shareProItem .one{
  display:block;
  position:relative;
  overflow:hidden;
  aspect-ratio:4/3;
  background:#F7F9FC;
  width:100%;
  flex:0 0 auto;
}
.iPro .shareProItem .one img{
  position:absolute; inset:0;
  width:100% !important; height:100% !important;
  max-width:none !important;
  object-fit:cover;
  object-position:center;
  transition:transform .5s var(--ease-out, cubic-bezier(.2,.6,.3,1));
}
.iPro .shareProItem:hover .one img{
  transform:scale(1.06);
}

/* hover 角标：去掉 backdrop-filter（性能差，大屏引发模糊） */
.iPro .shareProItem .one::after{
  content:"查看详情 →";
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  background:rgba(10,37,64,.78);
  color:#ffffff;
  font-size:13px; font-weight:600;
  letter-spacing:.04em;
  opacity:0;
  transition:opacity .25s ease;
  pointer-events:none;
}
.iPro .shareProItem:hover .one::after{ opacity:1; }

/* 卡片文字区 */
.iPro .shareProItem .txt{
  padding:14px 16px 16px !important;
  text-align:left !important;
  flex:1 1 auto;
  display:flex; flex-direction:column; gap:8px;
  min-width:0;
}
.iPro .shareProItem .three{
  display:block !important;
  font-size:14px !important; font-weight:600;
  color:var(--navy-900);
  text-decoration:none;
  line-height:1.4;
  transition:color .2s ease;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  min-width:0;
}
.iPro .shareProItem:hover .three{ color:var(--brand-500); }

/* 卡片底部双按钮：紧凑水平行 */
.iPro .shareProItem .two{
  display:flex !important; align-items:center;
  gap:6px;
  margin:0 !important;
  flex:0 0 auto;
  min-width:0;
}
.iPro .shareProItem .two a{
  flex:1 1 0; min-width:0;
  display:inline-flex !important; align-items:center; justify-content:center;
  font-size:12px;
  padding:6px 8px;
  border-radius:4px;
  text-decoration:none;
  transition:all .18s ease;
  white-space:nowrap; overflow:hidden;
}
.iPro .shareProItem .two a:first-child{
  color:var(--navy-900);
  border:1px solid #D8DEE7;
  background:#ffffff;
}
.iPro .shareProItem .two a:first-child:hover{
  border-color:var(--navy-900);
  background:var(--navy-900);
  color:#ffffff;
}
.iPro .shareProItem .two a:last-child{
  color:var(--brand-500);
  border:1px solid var(--brand-500);
  background:rgba(232,73,29,.04);
}
.iPro .shareProItem .two a:last-child:hover{
  background:var(--brand-500);
  color:#ffffff;
}

/* 15.6 板块底部"更多产品"—— 已合并到右上角 chip 按钮，此处不再额外渲染 */
.iPro .right::after{ content:none !important; display:none; }

/* ---------- 16. 首页其它板块同步收紧（顺手优化相邻板块） ---------- */
/* iBaoZhang（优势）、iAbout、iCase、iNews 板块都压缩 padding */
.iBaoZhang,
.iAbout,
.iCase,
.iNews,
.iPro{
  padding-left:0 !important;
  padding-right:0 !important;
}
@media (min-width:1200px){
  .iBaoZhang, .iAbout, .iCase, .iNews{ padding-top:56px !important; padding-bottom:56px !important; }
}

/* ---------- 17. 章节标题统一规范（适用于全站所有大板块） ---------- */
/* 给 iBaoZhang/iAbout/iCase/iNews 顶部都加 Eyebrow 章节标签 */
.iBaoZhang::before,
.iAbout::before,
.iCase::before,
.iNews::before{
  content:attr(data-chapter);
  display:block;
  font-family:var(--font-display);
  font-size:11px; font-weight:600;
  letter-spacing:.25em;
  color:var(--text-muted);
  opacity:.55;
  text-align:center;
  margin-bottom:10px;
}
.iBaoZhang::before{ content:"02  CORE PILLARS"; }
.iAbout::before{ content:"04  ABOUT US"; }
.iCase::before{ content:"05  CLIENT STORIES"; }
.iNews::before{ content:"06  INDUSTRY INSIGHTS"; }

/* ---------- 18. 大屏适配（1440px+）—— 撑满宽屏、4 列卡片、字号放大 ---------- */
@media (min-width: 1440px){
  /* 主容器扩到 1440，两侧加边距 */
  .iPro .center,
  .iBaoZhang .center,
  .iAbout .center,
  .iCase .center,
  .iNews .center{ max-width:1440px !important; padding-left:48px !important; padding-right:48px !important; }
  .iPro::before{ max-width:1440px !important; padding-left:48px !important; padding-right:48px !important; }

  /* 产品板块：升级为 4 列网格，左列放宽 */
  .iPro .pl_Box{ gap:40px !important; }
  .iPro .pl_Box > li.left{ flex:0 0 260px !important; width:260px !important; }
  .iPro .sContent > .pl{ grid-template-columns:repeat(4, minmax(0,1fr)) !important; gap:24px !important; }

  /* 板块上下间距加大 */
  .iPro, .iBaoZhang, .iAbout, .iCase, .iNews{
    padding-top:80px !important;
    padding-bottom:80px !important;
  }

  /* 产品标题字号放大 + eyebrow 加大 */
  .iPro .right .proTitle .sub_left{ font-size:32px !important; }
  .iPro .right .proTitle .sub_left::before{ font-size:13px !important; }
  .iPro .right .proTitle .sub_right .more{ font-size:15px !important; padding:12px 24px 12px 14px !important; }
  .iPro .right .proTitle .sub_right .more::before{ width:28px !important; height:28px !important; }

  /* 章节 Eyebrow 字号同步放大 */
  .iPro::before,
  .iBaoZhang::before,
  .iAbout::before,
  .iCase::before,
  .iNews::before{ font-size:12px !important; margin-bottom:14px !important; }

  /* 卡片文字放大 */
  .iPro .shareProItem .three{ font-size:16px !important; }
  .iPro .shareProItem .two a{ font-size:13px !important; padding:7px 10px !important; }

  /* 左侧主分类字号微调 */
  .iPro .left_content .bigNav > a{ font-size:14px !important; padding:12px 16px !important; }

  /* 顶部导航允许更宽 */
  .top .center, .t_nav .center{ max-width:1440px !important; }
}

/* ---------- 19. 超大屏适配（1920px+）—— 内容进一步撑开 ---------- */
@media (min-width: 1920px){
  .iPro .center,
  .iBaoZhang .center,
  .iAbout .center,
  .iCase .center,
  .iNews .center{ max-width:1640px !important; padding-left:64px !important; padding-right:64px !important; }
  .iPro::before{ max-width:1640px !important; padding-left:64px !important; padding-right:64px !important; }

  .top .center, .t_nav .center{ max-width:1640px !important; }

  .iPro .pl_Box{ gap:48px !important; }
  .iPro .pl_Box > li.left{ flex:0 0 280px !important; width:280px !important; }
  .iPro .sContent > .pl{ gap:32px !important; }

  .iPro, .iBaoZhang, .iAbout, .iCase, .iNews{
    padding-top:96px !important;
    padding-bottom:96px !important;
  }

  .iPro .right .proTitle .sub_left{ font-size:34px !important; }
  .iPro .shareProItem .three{ font-size:17px !important; }
  .iPro .left_content .bigNav > a{ font-size:14.5px !important; padding:13px 18px !important; }
}

/* ---------- 20. 2K+（2560px+）—— 4K 显示器适配，避免过度拉伸 ---------- */
@media (min-width: 2560px){
  .iPro .center,
  .iBaoZhang .center,
  .iAbout .center,
  .iCase .center,
  .iNews .center{ max-width:1800px !important; padding-left:80px !important; padding-right:80px !important; }
  .iPro::before{ max-width:1800px !important; padding-left:80px !important; padding-right:80px !important; }
  .top .center, .t_nav .center{ max-width:1800px !important; }
  .iPro .sContent > .pl{ grid-template-columns:repeat(5, minmax(0,1fr)) !important; gap:36px !important; }
  .iPro .pl_Box > li.left{ flex:0 0 320px !important; width:320px !important; }
  .iPro .left_content .bigNav > a{ font-size:16px !important; padding:14px 20px !important; }
}

/* ---------- 21. 窗口缩放稳定性 —— 杜绝最大化/还原时遮挡、抖动、内容溢出 ---------- */
/* 这一段是兜底防线，覆盖全站所有可能受 resize 影响的元素 */

/* 1) 全局图片：消除行内 img 的 baseline 抖动 + 限制最大宽度 */
img{
  display:block;
  max-width:100%;
  height:auto;
}

/* 2) 内页 banner：cover + center，杜绝背景图被拉伸/偏移 */
.in_banner,
.bannerBox,
[class*="banner_"]{
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
}

/* 3) 整页大背景：禁用 fixed attachment（大屏/拖动时容易漂移） */
body{ background-attachment:scroll !important; }

/* 4) 关键卡片：合成层隔离，避免 hover transform 引发的邻居重排 */
.iPro .shareProItem,
.iCase .shareCaseItem,
.iNews .shareNewItem,
.iBaoZhang .iBaoZ-card{
  contain:layout paint;
  content-visibility:auto;
  contain-intrinsic-size:auto 500px;
}

/* 5) 全局 flex 容器：默认 min-width:0 防内容撑破（覆盖浏览器默认） */
.iPro .pl_Box,
.iPro .pl_Box > li,
.iPro .sContent > .pl,
.iPro .sContent > .pl > .shareProItem,
.iPro .left_content .ul_8,
.iPro .left_content .subBox{
  min-width:0;
}

/* 6) 全局 grid 容器：子项允许收缩（防御文字溢出） */
.iPro .sContent > .pl,
.iPro .left_content .subBox,
.iPro .left_content .ul_8{
  overflow-wrap:break-word;
  word-break:break-word;
}

/* 7) 区块在视口内才渲染（首屏外延后渲染，减少 resize 重排） */
.iPro, .iBaoZhang, .iAbout, .iCase, .iNews{
  overflow-x:clip;   /* 比 hidden 性能更好，不触发滚动条 */
  overflow-y:visible;
}
