/* =========================产品列表Banner开始========================= */
.chanpin-banner {position:relative;height:550px;overflow:hidden;display:flex;align-items:center;justify-content:center;}
.chanpin-banner-bei {position:absolute;inset:0;background-image:url('../assets/cpbanner.jpg');background-size:cover;background-position:center;transform:scale(1.12);transition:transform 1.4s cubic-bezier(0.25,0.46,0.45,0.94);will-change:transform;}
.chanpin-banner--visible .chanpin-banner-bei {transform:scale(1);}
.chanpin-banner-mengban {position:absolute;inset:0;background:rgba(0,0,0,0.3);z-index:1;}
.chanpin-banner-neirong {position:relative;z-index:2;text-align:center;}
.chanpin-banner-biaoti {color:#ffffff;font-size:56px;font-weight:700;letter-spacing:2px;opacity:0;transform:translateY(30px);transition:opacity 0.8s ease 0.35s,transform 0.8s ease 0.35s;}
.chanpin-banner--visible .chanpin-banner-biaoti {opacity:1;transform:translateY(0);}
/* =========================产品列表Banner结束========================= */
/* =========================产品列表Tab导航开始========================= */
.chanpin-tab {background:#ffffff;border-bottom:1px solid #e0e0e0;display:flex;align-items:center;justify-content:center;height:80px;opacity:0;transform:translateY(-12px);transition:opacity 0.6s ease 0.8s,transform 0.6s ease 0.8s;}
.chanpin-banner--visible ~ .chanpin-tab {opacity:1;transform:translateY(0);}
.chanpin-tab-neicong {display:flex;align-items:center;gap:100px;}
.chanpin-tab-lianjie {display:flex;align-items:center;height:80px;font-size:16px;color:#333333;font-weight:400;position:relative;border-bottom:4px solid transparent;transition:color 0.3s ease,border-color 0.3s ease,font-weight 0.3s ease;white-space:nowrap;}
.chanpin-tab-lianjie:hover,.chanpin-tab-lianjie--active {color:#8ec31f;border-bottom-color:#8ec31f;font-weight:700;}
/* =========================产品列表Tab导航结束========================= */
/* =========================产品列表内容区开始========================= */
.chanpin-liebiao {background:#ffffff;padding:100px 60px 80px;}
.chanpin-liebiao-neicong {max-width:1800px;margin:0 auto;display:flex;flex-direction:column;gap:60px;}
.chanpin-liebiao-tobu {display:flex;flex-direction:column;gap:10px;}
.chanpin-liebiao-biaoti-xiao {font-size:18px;color:#8ec31f;letter-spacing:1.8px;text-transform:uppercase;font-weight:400;}
.chanpin-liebiao-biaoti-da {font-size:54px;font-weight:700;color:#0050b0;line-height:1.2;}
/* 产品卡片网格 */
.chanpin-liebiao-wangge {display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
/* 单个产品卡片 */
.chanpin-liebiao-ka {border:1px solid #c2c6d4;overflow:hidden;transition:box-shadow 0.35s ease;}
.chanpin-liebiao-ka:hover {box-shadow:0 8px 40px rgba(0,50,176,0.12);}
.chanpin-liebiao-ka-lianjie {display:flex;flex-direction:column;gap:30px;height:100%;padding-bottom:40px;}
/* 图片区 */
.chanpin-liebiao-ka-tupian-kuang {position:relative;height:405px;background:#f2f5f9;overflow:hidden;flex-shrink:0;display:flex;align-items:center;justify-content:center;}
.chanpin-liebiao-ka-tupian {width:90%;height:90%;object-fit:contain;transition:transform 0.45s ease;}
.chanpin-liebiao-ka:hover .chanpin-liebiao-ka-tupian {transform:scale(1.08);}
/* 文字内容区 */
.chanpin-liebiao-ka-neirong {display:flex;flex-direction:column;gap:16px;padding:0 40px;flex:1;}
.chanpin-liebiao-ka-fenlei {font-size:12px;color:#8ec31f;line-height:16px;}
.chanpin-liebiao-ka-wenben {display:flex;flex-direction:column;gap:20px;flex:1;}
.chanpin-liebiao-ka-biaoti {font-size:20px;font-weight:700;color:#0050b0;line-height:28px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.chanpin-liebiao-ka-miaoshu {font-size:16px;color:#424752;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
/* 按钮 */
.chanpin-liebiao-ka-anniu {display:flex;align-items:center;justify-content:center;gap:16px;border:1.5px solid #c2c6d4;padding:19px 0;transition:background 0.3s ease,border-color 0.3s ease;}
.chanpin-liebiao-ka:hover .chanpin-liebiao-ka-anniu {background:#8ec31f;border-color:#8ec31f;}
.chanpin-liebiao-ka-anniu-wenzi {font-size:14px;color:#0050b0;text-transform:uppercase;font-weight:400;transition:color 0.3s ease;white-space:nowrap;letter-spacing:0.5px;}
.chanpin-liebiao-ka:hover .chanpin-liebiao-ka-anniu-wenzi {color:#ffffff;}
/* 按钮箭头图标（CSS mask 着色） */
.chanpin-liebiao-ka-anniu-jiantou {display:inline-block;width:16px;height:16px;flex-shrink:0;background-color:#0050b0;-webkit-mask-image:url('../svg/icon-arrow-long-right.svg');mask-image:url('../svg/icon-arrow-long-right.svg');-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;transition:background-color 0.3s ease;}
.chanpin-liebiao-ka:hover .chanpin-liebiao-ka-anniu-jiantou {background-color:#ffffff;}
/* 页码 */
.chanpin-yema {display:flex;justify-content:center;align-items:center;gap:20px;padding-top:20px;}
.chanpin-yema-anniu {width:50px;height:50px;border-radius:50%;border:1px solid #e0e0e0;background:#ffffff;display:flex;align-items:center;justify-content:center;font-size:14px;color:#666666;cursor:pointer;box-shadow:15px 20px 40px rgba(0,34,63,0.12);transition:background 0.25s ease,color 0.25s ease,border-color 0.25s ease,transform 0.2s ease;font-family:Arial,sans-serif;text-decoration:none;flex-shrink:0;user-select:none;}
.chanpin-yema-anniu:hover {background:#f2f5f9;color:#0050b0;transform:translateY(-2px);}
.chanpin-yema-anniu--zuo {background:#0050b0;color:#ffffff;border-color:#0050b0;font-size:16px;}
.chanpin-yema-anniu--zuo:hover {background:#003d8a;color:#ffffff;}
.chanpin-yema-anniu--jidong {background:#0050b0;color:#ffffff;border-color:#0050b0;}
.chanpin-yema-anniu--jidong:hover {background:#003d8a;color:#ffffff;}
.chanpin-yema-anniu--you {border-color:#d6cae0;font-size:16px;cursor:pointer;}
.chanpin-yema-anniu--you:hover {background:#f2f5f9;color:#0050b0;}
.chanpin-yema-anniu--sheng {cursor:default;letter-spacing:2px;font-size:13px;}
.chanpin-yema-anniu--sheng:hover {background:#ffffff;color:#666666;transform:none;}
.chanpin-yema .pagination {display:flex;justify-content:center;align-items:center;gap:20px;margin:0;padding:0;list-style:none;}
.chanpin-yema .pagination li a,.chanpin-yema .pagination li span {width:50px;height:50px;border-radius:50%;border:1px solid #e0e0e0;background:#ffffff;display:flex;align-items:center;justify-content:center;font-size:14px;color:#666666;box-shadow:15px 20px 40px rgba(0,34,63,0.12);font-family:Arial,sans-serif;text-decoration:none;}
.chanpin-yema .pagination li.active a,.chanpin-yema .pagination li.active span {background:#0050b0;color:#ffffff;border-color:#0050b0;}
/* =========================产品列表内容区结束========================= */
/* =========================产品列表响应式开始========================= */
@media (max-width:1400px) {.chanpin-liebiao-biaoti-da {font-size:44px;}
}
@media (max-width:1200px) {.chanpin-liebiao-wangge {grid-template-columns:repeat(2,1fr);}
.chanpin-liebiao-biaoti-da {font-size:40px;}
}
@media (max-width:900px) {.chanpin-banner {height:400px;}
.chanpin-banner-biaoti {font-size:42px;}
.chanpin-liebiao {padding:60px 40px;}
.chanpin-liebiao-ka-tupian-kuang {height:300px;}
.chanpin-tab-neicong {gap:60px;}
}
@media (max-width:640px) {.chanpin-banner {height:300px;}
.chanpin-banner-biaoti {font-size:32px;}
.chanpin-liebiao {padding:40px 20px;}
.chanpin-liebiao-wangge {grid-template-columns:1fr;}
.chanpin-liebiao-biaoti-da {font-size:28px;}
.chanpin-liebiao-biaoti-xiao {font-size:14px;}
.chanpin-liebiao-ka-tupian-kuang {height:260px;}
.chanpin-liebiao-ka-neirong {padding:0 24px;}
.chanpin-tab-neicong {gap:32px;}
.chanpin-tab-lianjie {font-size:14px;}
.chanpin-yema {gap:10px;}
.chanpin-yema-anniu {width:40px;height:40px;font-size:12px;}
.chanpin-yema .pagination {gap:10px;}
.chanpin-yema .pagination li a,.chanpin-yema .pagination li span {width:40px;height:40px;font-size:12px;}
}
/* =========================产品列表响应式结束========================= */