/* ============================================================
   epoxysca product-table.css — v2 (2026-09-30 晚)
   本轮修复（对应用户反馈 ⑤）：
     1. 表头/行宽度不再锁死 900px，改为跟随各站主容器（消除留空）
     2. 新增 .epp-outer 两栏布局（左导航 260px + 右内容自适应）
        供 svc / cn 使用；gz / service / xxf 沿用各站既有左右栏
     3. 表头配色与左导航标题条统一（同色系渐变 + 同高）
     4. cn 中文站补表格样式（原为卡片，无表格）
   命名空间 .epp- / .eph- / .epn- ，不动既有 class，零回归风险。
   回滚：恢复同名 .bak-* 或删除本文件 link。
   ============================================================ */

/* ---------- 容器：跟随主容器，不再锁 900px ---------- */
.epp-wrap{width:100%;max-width:100%;margin:0 auto;padding:0 0 34px;box-sizing:border-box}
.epp-head,.epp-list,.epp-note,.epp-pagebar{width:100%;max-width:100%;margin-left:0;margin-right:0}

/* ---------- 两栏布局（左导航 + 右表格）：svc / cn 使用 ---------- */
.epp-outer{
  display:block;width:100%;max-width:1200px;margin:0 auto;padding:0 16px 40px;
  box-sizing:border-box;
}
.epp-outer::after{content:"";display:block;clear:both}
.epp-outer>.epn-box,
.epp-outer>.column_list,
.epp-outer>.sidebar-cate{
  float:left;width:260px;max-width:260px;margin:0 22px 0 0;box-sizing:border-box;
}
.epp-outer>.epp-wrap{
  float:right;width:calc(100% - 282px);max-width:none;margin:0;padding:0;
}
@media (max-width:900px){
  .epp-outer{padding:0 12px 30px}
  .epp-outer>.epn-box,.epp-outer>.column_list,.epp-outer>.sidebar-cate{
    float:none;width:100%;max-width:100%;margin:0 0 16px;
  }
  .epp-outer>.epp-wrap{float:none;width:100%}
}

/* ---------- 表头（渐变条）—— 与左导航标题同色系 ---------- */
.epp-head{
  display:flex;flex-wrap:wrap;align-items:stretch;
  width:100%;
  background-image:linear-gradient(90deg,var(--ep-green,#00833d) 0%,var(--ep-green-2,#00a049) 100%);
  border-radius:4px 4px 0 0;
  color:#fff;font-size:14px;font-weight:600;text-align:center;line-height:1.6;
  overflow:hidden;
}
.epp-head>span{
  flex:1;min-width:0;padding:13px 8px;
  display:flex;align-items:center;justify-content:center;
  border-right:1px solid rgba(255,255,255,.35);
  box-sizing:border-box;
}
.epp-head>span:last-child{border-right:0}
/* 五列比例：结构式 130 | 名称 30% | 牌号 15% | CAS 17% | 对应牌号 剩余 */
.epp-head .epp-c-img  {flex:0 0 130px}
.epp-head .epp-c-name {flex:0 0 30%}
.epp-head .epp-c-grade{flex:0 0 15%}
.epp-head .epp-c-cas  {flex:0 0 17%}

/* ---------- 数据行 ---------- */
.epp-list{width:100%;margin:0;padding:0;list-style:none;border:1px solid #e3e3e3;border-top:0}
.epp-row{
  display:flex;flex-wrap:wrap;align-items:stretch;
  width:100%;background:#fff;
  border-bottom:1px solid #e3e3e3;
  transition:box-shadow .3s ease,background .3s ease;
}
.epp-list .epp-row:last-child{border-bottom:0}
.epp-list .epp-row:nth-child(odd){background:#f7f9f8}
.epp-list .epp-row:nth-child(even){background:#fff}
.epp-row:hover{background:#eef6f1;box-shadow:0 3px 14px rgba(0,131,61,.10);position:relative;z-index:2}

.epp-cell{
  flex:1;min-width:0;
  display:flex;align-items:center;justify-content:center;
  padding:12px 10px;text-align:center;
  font-size:13.5px;font-family:Arial,'Helvetica Neue','Microsoft YaHei',sans-serif;
  color:#333;line-height:1.7;box-sizing:border-box;word-break:break-word;
}
.epp-c-img  {flex:0 0 130px;border-right:1px solid #e9ecef;padding:8px 6px}
.epp-c-name {flex:0 0 30%;border-right:1px solid #e9ecef;align-items:flex-start;text-align:left}
.epp-c-grade{flex:0 0 15%;border-right:1px solid #e9ecef}
.epp-c-cas  {flex:0 0 17%;border-right:1px solid #e9ecef;color:#555;font-variant-numeric:tabular-nums;letter-spacing:.2px}
.epp-c-ref  {flex:1 1 auto;color:#444;align-items:flex-start;text-align:left;font-size:12.5px;line-height:1.65}

/* 结构式图：contain 保证整幅可见（键线式特征） */
.epp-c-img a{display:block;width:100%;overflow:hidden}
.epp-c-img img{
  display:block;width:100%;height:104px;object-fit:contain;
  mix-blend-mode:multiply;transition:transform .4s ease;background:#fff;
}
.epp-row:hover .epp-c-img img{transform:scale(1.06)}

/* 名称链接 */
.epp-name-link{color:#333;text-decoration:none;font-weight:500;transition:color .35s ease;
  display:-webkit-box;width:100%;overflow:hidden;text-overflow:ellipsis;
  -webkit-line-clamp:3;-webkit-box-orient:vertical;line-clamp:3}
.epp-row:hover .epp-name-link{color:var(--ep-green,#00833d)}

/* 牌号标签 */
.epp-grade-tag{
  display:inline-block;padding:2px 8px;border-radius:3px;
  background:rgba(0,131,61,.08);color:var(--ep-green,#00833d);
  font-weight:600;font-size:12.5px;letter-spacing:.3px;white-space:nowrap;
}
.epp-cat-text{display:block;margin-top:4px;font-size:12.5px;color:#8a9099}
.epp-empty{color:#c4c9ce;font-size:13px}

/* ---------- 说明条 / 分页 ---------- */
.epp-note{
  width:100%;padding:11px 14px;box-sizing:border-box;
  background:#f7f9f8;border:1px solid #e3e3e3;border-top:0;
  font-size:12.5px;color:#6b7280;line-height:1.7;text-align:center;
}
.epp-note b{color:var(--ep-green,#00833d)}
.epp-pagebar{width:100%;padding-top:26px;text-align:center}

/* ============================================================
   响应式
   ============================================================ */
@media (max-width:768px){
  .epp-head{display:none}
  .epp-list{border:0}
  .epp-row{
    display:flex;flex-wrap:wrap;align-items:center;
    padding:12px 10px;border:1px solid #e9ecef;border-radius:8px;
    margin-bottom:10px;background:#fff!important;
  }
  .epp-row:hover{box-shadow:0 3px 12px rgba(0,0,0,.07)}
  .epp-c-img{flex:0 0 84px;width:84px;border:0;padding:0;margin-right:12px}
  .epp-c-img a{width:100%}
  .epp-c-img img{height:84px;object-fit:contain}
  .epp-c-name{flex:0 0 calc(100% - 96px);border:0;padding:0;text-align:left;align-items:flex-start;
    flex-direction:column;justify-content:center}
  .epp-name-link{-webkit-line-clamp:2;line-clamp:2;text-align:left}
  .epp-c-grade{flex:0 0 50%;border:0;padding:4px 0 0 96px;justify-content:flex-start;font-size:12.5px}
  .epp-c-cas{flex:0 0 50%;border:0;padding:4px 0 0;justify-content:flex-start;font-size:12.5px}
  .epp-c-grade::before{content:"牌号 ";color:#a8adb3}
  .epp-c-cas::before{content:"CAS ";color:#a8adb3}
  .epp-c-ref{flex:0 0 100%;border:0;padding:4px 0 0 96px;text-align:left;font-size:12px;color:#777}
  .epp-c-ref::before{content:"对应牌号 ";color:#a8adb3}
}
@media (max-width:420px){
  .epp-c-grade,.epp-c-cas,.epp-c-ref{padding-left:0}
}

/* ============================================================
   首页产品区：卡片网格
   ============================================================ */
.eph-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:18px;
  max-width:1200px;margin:0 auto;padding:0 16px;box-sizing:border-box;
}
.eph-card{
  position:relative;display:flex;flex-direction:column;
  background:#fff;border:1px solid #e9ecef;border-radius:10px;
  overflow:hidden;transition:transform .35s ease,box-shadow .35s ease;
}
.eph-card:hover{transform:translateY(-4px);box-shadow:0 10px 26px rgba(0,131,61,.14)}
.eph-thumb{
  position:relative;display:block;width:100%;padding-top:76%;
  background:#f7f9f8;overflow:hidden;
}
.eph-thumb img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:contain;mix-blend-mode:multiply;
  transition:transform .45s ease;padding:6px;box-sizing:border-box;
}
.eph-card:hover .eph-thumb img{transform:scale(1.06)}
.eph-grade{
  position:absolute;top:8px;left:8px;z-index:2;
  display:inline-block;padding:2px 9px;border-radius:11px;
  background-image:linear-gradient(90deg,var(--ep-green,#00833d) 0%,var(--ep-green-2,#00a049) 100%);
  color:#fff;font-size:12px;font-weight:600;letter-spacing:.4px;
  font-family:Arial,'Helvetica Neue',sans-serif;
  box-shadow:0 2px 6px rgba(0,131,61,.25);
  max-width:calc(100% - 16px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.eph-body{flex:1 1 auto;display:flex;flex-direction:column;padding:12px 13px 13px}
.eph-name{
  color:#333;font-size:14px;font-weight:500;line-height:1.55;text-decoration:none;
  transition:color .35s ease;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  min-height:2.6em;
}
.eph-card:hover .eph-name{color:var(--ep-green,#00833d)}
.eph-meta{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  margin-top:auto;padding-top:9px;border-top:1px dashed #eceff2;
}
.eph-cas{
  font-size:12px;color:#707070;font-family:Arial,'Helvetica Neue',sans-serif;
  font-variant-numeric:tabular-nums;letter-spacing:.2px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.eph-tag{
  flex:0 0 auto;font-size:11.5px;color:var(--ep-green,#00833d);
  background:rgba(0,131,61,.08);border-radius:3px;padding:1px 6px;white-space:nowrap;
}
.eph-more{
  display:block;width:max-content;margin:24px auto 0;
  padding:9px 26px;border-radius:22px;
  border:1px solid var(--ep-green,#00833d);
  color:var(--ep-green,#00833d);font-size:13.5px;text-decoration:none;
  transition:background .3s ease,color .3s ease;
}
.eph-more:hover{
  background-image:linear-gradient(90deg,var(--ep-green,#00833d) 0%,var(--ep-green-2,#00a049) 100%);
  color:#fff;border-color:transparent;
}
@media (max-width:1024px){.eph-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:768px){.eph-grid{grid-template-columns:repeat(2,1fr);gap:12px}.eph-body{padding:10px}}
@media (max-width:420px){.eph-grid{grid-template-columns:repeat(2,1fr);gap:10px}.eph-name{font-size:13px}}

/* ============================================================
   分类导航（手风琴）—— 与表头同色系
   ============================================================ */
.epn-box{width:100%;font-size:14px;font-family:Arial,'Helvetica Neue','Microsoft YaHei',sans-serif;
  box-sizing:border-box;margin:0;padding:0}
.epn-box>*{box-sizing:border-box}
.epn-list{margin:0;padding:0;list-style:none}

/* 左导航标题条：与表格表头同色系渐变、同高观感 */
.epn-box>.epn-titlebar,
div.column_list>.epn-titlebar,
div.sidebar-cate>.epn-titlebar{
  display:block;line-height:46px;padding:0 16px;
  background-image:linear-gradient(90deg,var(--ep-green,#00833d) 0%,var(--ep-green-2,#00a049) 100%);
  color:#fff;font-size:15px;font-weight:600;border-radius:4px 4px 0 0;
}

.epn-h{
  display:flex;align-items:center;width:100%;
  line-height:44px;font-size:15px;font-weight:bold;color:#333;
  background:#f5f5f5;border-bottom:1px solid #ebebeb;margin:0;padding:0;
  transition:background .3s,border-color .3s,color .3s;
}
.epn-h::before{content:"";flex:0 0 5px;align-self:stretch;background:var(--ep-green,#00833d);opacity:0;transition:opacity .3s}
.epn-h:hover,.epn-item.active>.epn-h{
  background-image:linear-gradient(90deg,var(--ep-green,#00833d) 0%,var(--ep-green-2,#00a049) 100%);
  border-bottom-color:var(--ep-green,#00833d);color:#fff;
}
.epn-h:hover::before,.epn-item.active>.epn-h::before{opacity:1;background:rgba(255,255,255,.85)}
.epn-h>a{flex:1 1 auto;min-width:0;padding-left:12px;color:inherit;text-decoration:none;display:flex;align-items:center}
.epn-h>a>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.epn-arrow{flex:0 0 auto;width:32px;text-align:center;font-size:12px;line-height:1;font-style:normal;
  transform:rotate(-90deg);transition:transform .3s;opacity:.6}
.epn-item.active>.epn-h .epn-arrow{transform:rotate(0deg);opacity:1}

.epn-sub{display:none;margin:0;padding:0;list-style:none}
.epn-item.active>.epn-sub{display:block}
.epn-s{
  display:block;line-height:40px;font-size:14px;color:#666;
  background:#ededed;border-bottom:1px solid #e1e1e1;
  padding:0 8px 0 24px;text-decoration:none;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  transition:color .3s,background .3s,padding-left .3s;
}
.epn-s:hover,.epn-sub>li.active>.epn-s{color:var(--ep-green,#00833d);background:#e4f1ea;padding-left:30px}
.epn-item:last-child>.epn-h{border-bottom:0}
.epn-sub>li:last-child>.epn-s{border-bottom:0}
.epn-item.epn-leaf>.epn-h .epn-arrow{visibility:hidden}
.epn-item[data-son="0"]>.epn-h .epn-arrow,
.epn-item[data-son="0"]:hover>.epn-h .epn-arrow{visibility:hidden}
.epn-list>.epn-item>.epn-sub{margin:0;padding:0;list-style:none}

@media (max-width:768px){
  .epn-box{position:relative}
  .epn-h{line-height:42px;font-size:15px}
  .epn-s{line-height:38px;font-size:14px}
  .epn-scroll{max-height:60vh;overflow-y:auto;-webkit-overflow-scrolling:touch}
}

/* 首页容器 */
.epn-homewrap{max-width:1200px;margin:0 auto;padding:24px 16px 0;box-sizing:border-box}
.epn-homewrap .l-wrap{width:100%}
.epn-homewrap .epn-box{max-width:100%}
@media (max-width:768px){.epn-homewrap{padding:16px 12px 0}}

/* ============================================================
   各站微调：把「表头 + 表格」与左导航对齐
   ============================================================ */
/* gz：.product .main > .list(240px) + .epp-wrap */
.product .epp-wrap{float:right;width:calc(100% - 284px);max-width:none;padding:0}
@media (max-width:900px){.product .epp-wrap{float:none;width:100%}}
/* service：.page-right 已是 930px 右栏，表格铺满即可 */
.page-right .epp-wrap{width:100%}
.page-right .epp-head,.page-right .epp-list{width:100%}
/* xxf：.abNyPro_Right 74% 右栏 */
.abNyPro_Right .epp-outer{padding:0;max-width:none}
.abNyPro_Right .epp-outer>.epp-wrap{width:100%;float:none}
/* cn：.sidebar-cate + .page-main */
.sidebar-cate .epn-titlebar{display:block}


/* ============================================================
   首页「左分类导航 + 右产品区」两栏布局（2026-09-30 修复）
   问题：各站导航块是独立 <section>，且站点自带 .abIdxPro_list ul li
        规则（width:31% / height:300px / float:left）会击中我们的
        .eph-card，导致导航无样式、卡片错乱、上浮压住产品区。
   方案：把导航 + 产品区收进 .epn-homelayout 两栏容器，并显式
        复位站点遗留规则。
   ============================================================ */
.epn-homelayout{
  display:block;width:100%;max-width:1300px;margin:0 auto;
  padding:34px 16px 10px;box-sizing:border-box;
}
.epn-homelayout::after{content:"";display:block;clear:both}

/* 左栏：分类导航 */
.epn-homelayout>.epn-homewrap{
  float:left;width:268px;max-width:268px;margin:0 24px 0 0;padding:0;
  box-sizing:border-box;
}
.epn-homelayout>.epn-homewrap .l-wrap{width:100%;max-width:none;padding:0}
.epn-homelayout>.epn-homewrap .bd,
.epn-homelayout>.epn-homewrap .epn-box{width:100%;max-width:100%}
.epn-homelayout .epn-box>.epn-titlebar{margin-bottom:0}

/* 右栏：产品区 */
.epn-homelayout>.abIdx_Pro,
.epn-homelayout>.products,
.epn-homelayout>.home-product{
  float:right;width:calc(100% - 292px);max-width:none;margin:0;padding:0;
  background:none;box-sizing:border-box;
}
.epn-homelayout>.abIdx_Pro .abIdxPro_list,
.epn-homelayout>.products>.eph-grid{
  width:100%;max-width:100%;margin:0;padding:0;
}

/* 关键：复位站点自带的案例卡片规则，避免击中 .eph-card */
.epn-homelayout .abIdxPro_list ul.eph-grid,
.epn-homelayout ul.eph-grid{width:100%;margin:0;padding:0;list-style:none}
.epn-homelayout .abIdxPro_list ul.eph-grid>li.eph-card,
.epn-homelayout ul.eph-grid>li.eph-card,
.epn-homelayout .eph-grid>.eph-card{
  float:none !important;
  width:auto !important;max-width:none !important;
  height:auto !important;min-height:0 !important;
  margin:0 !important;padding:0 !important;
  background:#fff !important;
  border-bottom:0 !important;
  box-shadow:none !important;
  display:block;
}
/* 首页标题区在右栏内左对齐 */
.epn-homelayout>.abIdx_Pro .abIdx_Title{margin:0 0 22px;text-align:left}
.epn-homelayout>.abIdx_Pro .abIdx_Title span,
.epn-homelayout>.abIdx_Pro .abIdx_Title p{text-align:left}

/* 首页产品栅格：2 列 */
.epn-homelayout .eph-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;align-items:stretch;
}
.epn-homelayout .eph-grid>.eph-card{box-sizing:border-box}

@media (max-width:1100px){
  .epn-homelayout{max-width:100%;padding:26px 14px 8px}
  .epn-homelayout>.epn-homewrap{width:238px;max-width:238px;margin-right:18px}
  .epn-homelayout>.abIdx_Pro,
  .epn-homelayout>.products,
  .epn-homelayout>.home-product{width:calc(100% - 256px)}
}
@media (max-width:768px){
  .epn-homelayout{padding:18px 12px 6px}
  .epn-homelayout>.epn-homewrap{
    float:none;width:100%;max-width:100%;margin:0 0 18px;
  }
  .epn-homelayout>.abIdx_Pro,
  .epn-homelayout>.products,
  .epn-homelayout>.home-product{float:none;width:100%}
  .epn-homelayout .eph-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;
  }
}


/* ------------------------------------------------------------
   gz / service 首页：导航本就在左栏（.list / .products-nav），
   只需让右侧产品栅格规整为 2 列并复位站点遗留卡片规则。
   ------------------------------------------------------------ */
.product .eph-grid,
.products-box .eph-grid,
.products .eph-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;align-items:stretch;width:100%;margin:0;padding:0;list-style:none;
}
.product ul.eph-grid>li.eph-card,
.products-box ul.eph-grid>li.eph-card,
.products ul.eph-grid>li.eph-card,
.product .eph-grid>.eph-card,
.products-box .eph-grid>.eph-card,
.products .eph-grid>.eph-card{
  float:none !important;width:auto !important;max-width:none !important;
  height:auto !important;min-height:0 !important;margin:0 !important;
  padding:0 !important;background:#fff !important;
  border-bottom:0 !important;box-shadow:none !important;display:block;
}
/* service 首页：把产品区放进两栏（沿用站点自带的 float 排布） */
.products-box .eph-grid.ph-orig{width:auto}
@media (max-width:768px){
  .product .eph-grid,.products-box .eph-grid,.products .eph-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;
  }
}


/* ------------------------------------------------------------
   gz / service 首页：左导航 + 右产品区 明确两栏（不改模板）
   gz  : .product > .main > (.list 左) + (.pic.eph-grid 右)
   svc2: .products-box > (.products-nav 左) + (.eph-grid.ph-orig 右)
   ------------------------------------------------------------ */
.product .main{display:block;width:100%;max-width:1400px;margin:0 auto;box-sizing:border-box}
.product .main::after{content:"";display:block;clear:both}
.product .main>.list{float:left;width:262px;max-width:262px;margin:0 22px 0 0}
.product .main>.pic.eph-grid{
  float:right;width:calc(100% - 284px);max-width:none;margin:0;
}
.products-box{display:block;width:100%;max-width:1200px;margin:0 auto;box-sizing:border-box}
.products-box::after{content:"";display:block;clear:both}
.products-box>.products-nav{float:left;width:260px;max-width:260px;margin:0 22px 0 0}
.products-box>.eph-grid.ph-orig{float:right;width:calc(100% - 282px);max-width:none;margin:0}
/* 让 .list / .products-nav 里旧的图片或列表不干扰 */
.product .main>.list .tit,
.products-box>.products-nav .title{margin-bottom:0}
@media (max-width:1000px){
  .product .main>.list,.products-box>.products-nav{float:none;width:100%;max-width:100%;margin:0 0 18px}
  .product .main>.pic.eph-grid,.products-box>.eph-grid.ph-orig{float:none;width:100%}
}


/* ============================================================
   终修（2026-09-30 晚）：截图实测问题清单
   ============================================================ */
/* 1) 表头文字强制白色（站点 CSS 曾把后两列刷成 #555） */
.epp-head span{color:#fff !important}

/* 2) 导航反冲突（通用）：站点旧 CSS 对 li 的浮动/宽度/底色一概复位 */
.epn-box ul.epn-list>li,
.epn-box ul.epn-sub>li{
  float:none !important;width:100% !important;max-width:100% !important;
  clear:both !important;background:transparent !important;
  box-shadow:none !important;border-bottom:0 !important;
  display:block !important;position:static !important;
}
.epn-box ul.epn-sub>li{display:block !important}
.epn-box ul.epn-sub{display:none !important}
.epn-box .epn-item.active>ul.epn-sub{display:block !important}
.epn-box .epn-h{position:relative;z-index:1}

/* 3) gz：站点蓝标题 .tit 刷成表头同款绿色渐变（产品页+首页通用） */
.product .main>.list .tit{
  background-image:linear-gradient(90deg,var(--ep-green,#00833d) 0%,var(--ep-green-2,#00a049) 100%) !important;
  background-color:var(--ep-green,#00833d) !important;
  border-radius:4px 4px 0 0;
}
.product .main>.list .tit p,
.product .main>.list .tit span{color:#fff !important}

/* 4) xxf：站点蓝标题 .cp_type .hd 刷成绿色渐变 */
.abNyPro_Left .cp_type>.hd{
  background-image:linear-gradient(90deg,var(--ep-green,#00833d) 0%,var(--ep-green-2,#00a049) 100%) !important;
  background-color:var(--ep-green,#00833d) !important;
  border-radius:4px 4px 0 0;
}
.abNyPro_Left .cp_type>.hd p,
.abNyPro_Left .cp_type>.hd span{color:#fff !important}

/* 5) gz 首页卡片填满栅格列 */
.product .main ul.eph-grid>li.eph-card{width:100% !important;max-width:100% !important}
.product .main .eph-thumb{display:block;width:100%}
.product .main .eph-thumb img{width:100%;height:auto;object-fit:contain}

/* 6) service 首页右栏卡片同样填满 */
.products-box ul.eph-grid>li.eph-card{width:100% !important;max-width:100% !important}
.products-box .eph-thumb{display:block;width:100%}
.products-box .eph-thumb img{width:100%;height:auto;object-fit:contain}


/* ================================================================
   v3 (0930 晚) —— service 暗色导航中和 / cn 产品页双栏 / 无结构式留空
   ================================================================ */

/* 1) 无结构式品类：空 ico 被 PbootCMS 替换为 nopic 占位图，直接隐藏实现留空 */
.eph-thumb img[src*="nopic"],
.epp-c-img img[src*="nopic"]{display:none !important}

/* 2) service：.left-nav-list 自带深底(193b38)/白字/50px 固定高 —— 全部中和
      首页容器类名为 .product-nav-list（内页为 .left-nav-list），两处同时漂白 */
.left-nav-list.epn-box,
.product-nav-list.epn-box{background:#fff !important;padding-top:4px !important;padding-bottom:4px !important}
.left-nav-list.epn-box ul li,
.product-nav-list.epn-box ul li{
  height:auto !important;min-height:44px;line-height:44px !important;
  background:transparent !important;border-bottom:1px solid #ececec !important;
}
.left-nav-list.epn-box ul li:last-child,
.product-nav-list.epn-box ul li:last-child{border-bottom:0 !important}
.left-nav-list.epn-box ul li a,
.product-nav-list.epn-box ul li a{color:#333 !important;font-size:14px !important}
.left-nav-list.epn-box ul li a:hover,
.product-nav-list.epn-box ul li a:hover{color:var(--ep-green,#00833d) !important}

/* 3) 组头标题文字一律深灰（修 xxf 首页白字），激活组头绿底白字 */
.epn-box .epn-h,
.epn-box .epn-h a,
.epn-box .epn-h a span,
.epn-box .epn-h span{color:#333 !important}
.epn-box .epn-item.active>.epn-h,
.epn-box .epn-item.active>.epn-h a,
.epn-box .epn-item.active>.epn-h a span,
.epn-box .epn-item.active>.epn-h span{color:#fff !important}
.epn-box .epn-item.active>.epn-h{
  background:#f5f5f5 !important;
  background-image:linear-gradient(90deg,var(--ep-green,#00833d) 0%,var(--ep-green-2,#00a049) 100%) !important;
}

/* 4) cn 产品页：page-container>page-container 的唯一子层 epp-outer 内做双栏
      （sidebar 400px + page-main 换行堆叠 → 改为左右并排，中文站独有 product-main 作用域） */
.product-main .epp-outer{
  display:flex;flex-wrap:nowrap;align-items:flex-start;
}
.product-main .epp-outer>.sidebar{flex:0 0 300px;width:300px;max-width:300px}
.product-main .epp-outer>.page-main{flex:1 1 0;min-width:0;width:auto}
.product-main .epp-outer>.page-main .epp-wrap{width:100% !important}
@media (max-width:900px){
  .product-main .epp-outer{flex-wrap:wrap}
  .product-main .epp-outer>.sidebar{flex:0 0 100%;width:100%;max-width:100%}
}


/* 5) gz 首页：.eph-grid 挂在 DIV 包装层(.pic>ul>li)，栅格必须打在内层 UL */
.product .main>.pic.eph-grid{display:block !important}
.product .main>.pic.eph-grid>ul{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;
  margin:0;padding:0;list-style:none;
}
.product .main>.pic.eph-grid>ul>li.eph-card{width:100% !important;max-width:100% !important;float:none !important}

/* 6) svc 首页（section.products 手写轮播：ul float + li absolute + a 宽高比 padding）
      —— 仅限 svc 的 .products 区块，彻底拉回文档流 */
.epn-homelayout>.products ul.eph-grid{float:none !important;height:auto !important;max-height:none !important}
.epn-homelayout>.products ul.eph-grid>li{
  position:static !important;height:auto !important;min-height:0 !important;
  overflow:visible !important;opacity:1 !important;transform:none !important;
}
.epn-homelayout>.products ul.eph-grid>li>a{
  position:static !important;height:auto !important;min-height:0 !important;
  padding-top:0 !important;overflow:visible !important;
}
.epn-homelayout>.products ul.eph-grid>li>a img{
  position:static !important;width:100% !important;height:auto !important;
}
.epn-homelayout>.products ul.eph-grid>li .eph-body{
  position:static !important;height:auto !important;
}

/* 7) 导航项外边距清零（svc 站 li 自带 margin 呈芯片化） */
.epn-box ul.epn-list>li,.epn-box ul.epn-sub>li{margin:0 !important}

/* 8) 其余场景（cn 首页轮播 .eph-imgwrap 等）的 nopic 占位图同样留空 */
img[src*="nopic"]{visibility:hidden !important}

/* ================= v4 (2026-09-30 晚) ================= */

/* 9) 导航二级项芯片化修复：svc 站点 CSS 把 .epn-s 挤成 104px 浮块 —— 强制整行 */
.epn-box .epn-s,
.epn-box .epn-sub > li > a{
  display:block !important;float:none !important;width:100% !important;
  box-sizing:border-box !important;clear:both !important;
  padding:0 8px 0 22px !important;height:40px !important;line-height:40px !important;
  background:#ededed !important;border-bottom:1px solid #e1e1e1 !important;
  color:#666 !important;font-size:15px !important;text-align:left !important;
}
.epn-box .epn-sub > li:last-child > a{border-bottom:0 !important}
.epn-box .epn-s:hover{color:var(--ep-green,#00833d) !important;background:#e4e4e4 !important}

/* 10) xxf 产品详情页顶部：.pro_detail_main 写死 1420px 导致横向溢出 —— 收敛自适应 */
.NyProDetail_Pic{width:auto !important;max-width:1200px !important;margin:0 auto !important}
.pro_detail_text{
  width:auto !important;max-width:calc(100% - 490px) !important;
  box-sizing:border-box !important;
}
.pro_detail_text h1{overflow-wrap:anywhere !important;white-space:normal !important}
.pro_detail_text .jyms p{overflow-wrap:anywhere !important}
#preview,.jqzoom,#ceshi{max-width:100% !important}
#ceshi img{max-width:100% !important;height:auto !important}
@media (max-width:900px){
  .pro_detail_text{max-width:100% !important;float:none !important}
}

/* ================= R3 列错位修复 (2026-09-30r3) =================
   现象：对应牌号列文字较长时整列折到下一行（gz/xxf/service/cn），
         svc 部分行从结构式列开始错位。
   根因：.epp-row flex-wrap:wrap + .epp-c-ref flex:1 1 auto，
         ref 的 min-content 超出剩余空间时触发换行。
   修复：桌面端强制单行布局，ref 以 flex-basis:0 参与分配并在列内折行。
   ≤768px 卡片式回退不受影响（媒体查询内已显式 flex-wrap:wrap）。
   回滚：删除本块，或恢复 .bak-r3-0930 备份。
   ================================================================ */
.epp-head,.epp-row{flex-wrap:nowrap}
.epp-cell{min-width:0}
.epp-c-ref{flex:1 1 0;min-width:0;overflow-wrap:anywhere;word-break:break-word;overflow:hidden}
.epp-c-name{min-width:0;overflow:hidden}
.epp-head .epp-c-ref{flex:1 1 0;min-width:0}
/* ====================== R3 修复结束 ====================== */