﻿/* ================= CSS 变量 ================= */
:root {
  --xkr-blue: #1e9dd8;
  --xkr-blue-dark: #1683b8;
}

/* ================= 通用重置 ================= */
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
	font-size: 14px;
	font-family: PingFang SC, Hiragino Sans GB, Microsoft YaHei UI, Microsoft YaHei, Source Han Sans CN, sans-serif;
	/* background: linear-gradient(180deg, #cfe0f5 0%, #e8f1fb 40%, #ffffff 100%); */
	color: #1f2a44;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
h1, h2, h3 { font-weight: 500; }
img { border: none; max-width: 100%; }
a { cursor: pointer; color: #1f2a44; text-decoration: none !important; outline: none; -webkit-tap-highlight-color: transparent; transition: color .3s ease; }
a:focus, a:active { outline: none; box-shadow: none; }
button:focus, button:active { outline: none; box-shadow: none; }
a:hover { color: #0e63c7; }
ul { list-style: none; }
input, textarea, button { font-family: inherit; outline: none; border: none; }
input::-webkit-input-placeholder { color: #b1bacb; }
.clearfix::after { content: ""; display: block; clear: both; }

/* ================= 头部：磨砂玻璃固定顶栏 ================= */
.header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 110px;
	z-index: 1000;
	background: rgba(255, 255, 255, 0.2);
	-webkit-backdrop-filter: blur(14px) saturate(180%);
	backdrop-filter: blur(14px) saturate(180%);
	border-bottom: 1px solid rgba(255, 255, 255, 0.35);
	transition: all .35s cubic-bezier(.4, 0, .2, 1);
	/* 裁掉 .mega 左右溢出的部分，实现通栏又不产生横向滚动条。
	   必须用 clip 而不是 hidden：hidden 会同时在纵向裁剪，
	   把向下展开的 mega 面板切掉。clip 配合 overflow-y:visible 只裁横向。 */
	overflow-x: clip;
	overflow-y: visible;
}
.header.scrolled {
	height: 80px;
	background: rgba(255, 255, 255, 0.75);
	box-shadow: 0 6px 24px rgba(31, 42, 68, 0.08);
	border-bottom-color: rgba(31, 42, 68, 0.06);
}

/* 版心：默认 1700px，逐级适配 */
.header-container {
	max-width: 1700px;
	height: 100%;
	margin: 0 auto;
	padding: 0 40px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
}

/* Logo */
.logo { flex-shrink: 0; display: flex; align-items: center; }
.logo img {
	height: 64px;
	display: block;
	transition: height .35s ease;
}
.header.scrolled .logo img { height: 50px; }

/* ========= PC 导航 ========= */
.nav-pc {
	display: flex;
	align-items: center;
	flex: 1;
	justify-content: flex-end;
	gap: 8px;
	height: 100%;
}
.nav-item {
	height: 100%;
	display: flex;
	align-items: center;
}
/* 普通下拉菜单需要相对定位 */
.has-dropdown:not(.has-mega) {
	position: relative;
}
.nav-link {
	position: relative;
	display: inline-block;
	padding: 12px 20px;
	font-size: 20px;
	font-weight: 500;
	color: #1f2a44;
	letter-spacing: .5px;
	line-height: 1;
	transition: color .3s ease;
}
.nav-link::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: 4px;
	transform: translateX(-50%);
	width: 0;
	height: 2px;
	background: linear-gradient(90deg, #0e63c7, #4d9bff);
	border-radius: 2px;
	transition: width .35s ease;
}
.nav-link:hover,
.nav-link.active { color: #0e63c7; }
.nav-link:hover::after,
.nav-link.active::after { width: calc(100% - 40px); }

/* ========= 简洁二级下拉菜单 ========= */
/* 有下拉菜单的导航项添加下箭头指示器 */
.has-dropdown > .nav-link::before {
	content: "";
	position: absolute;
	right: 4px;
	top: 50%;
	width: 0;
	height: 0;
	border-left: 4px solid transparent;
	border-right: 4px solid transparent;
	border-top: 4px solid currentColor;
	transform: translateY(-50%);
	opacity: 0.6;
	transition: all .3s ease;
}
.has-dropdown:hover > .nav-link::before {
	opacity: 1;
	transform: translateY(-30%);
}

/* 下拉菜单容器 */
.nav-pc .dropdown-menu {
	display: block !important;  /* 覆盖Bootstrap的display:none */
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 220px;
	background: #ffffff;
	border-radius: 12px;
	box-shadow: 0 8px 32px rgba(31, 42, 68, 0.12), 
	            0 2px 8px rgba(31, 42, 68, 0.06);
	padding: 8px;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-12px);
	transition: all .32s cubic-bezier(.4, 0, .2, 1);
	z-index: 1001;
	/* 确保菜单不会被header裁剪 */
	pointer-events: none;
	margin-top: 0;
}

/* 悬停时显示下拉菜单 */
.has-dropdown:hover .dropdown-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
	pointer-events: auto;
}

/* 下拉菜单项 */
.dropdown-item {
	display: block;
	padding: 12px 18px;
	font-size: 14px;
	color: #4a5464;
	border-radius: 8px;
	white-space: nowrap;
	transition: all .25s ease;
	position: relative;
	overflow: hidden;
}

/* 下拉菜单项的微妙背景动画 */
.dropdown-item::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 100%;
	background: linear-gradient(90deg, 
		rgba(14, 99, 199, 0.08), 
		rgba(77, 155, 255, 0.08));
	transition: width .3s cubic-bezier(.4, 0, .2, 1);
	z-index: -1;
}

.dropdown-item:hover::before {
	width: 100%;
}

.dropdown-item:hover {
	color: #0e63c7;
	transform: translateX(4px);
	padding-left: 22px;
}

/* 下拉菜单的精致入场动画（逐项错开） */
.has-dropdown:hover .dropdown-item {
	animation: dropdownItemIn .35s cubic-bezier(.25, .8, .35, 1) both;
}

@keyframes dropdownItemIn {
	from {
		opacity: 0;
		transform: translateX(-10px);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

.has-dropdown:hover .dropdown-item:nth-child(1) { animation-delay: .05s; }
.has-dropdown:hover .dropdown-item:nth-child(2) { animation-delay: .08s; }
.has-dropdown:hover .dropdown-item:nth-child(3) { animation-delay: .11s; }
.has-dropdown:hover .dropdown-item:nth-child(4) { animation-delay: .14s; }
.has-dropdown:hover .dropdown-item:nth-child(5) { animation-delay: .17s; }
.has-dropdown:hover .dropdown-item:nth-child(6) { animation-delay: .20s; }
.has-dropdown:hover .dropdown-item:nth-child(7) { animation-delay: .23s; }
.has-dropdown:hover .dropdown-item:nth-child(8) { animation-delay: .26s; }

/* 低性能设备优化 */
@media (prefers-reduced-motion: reduce) {
	.dropdown-menu,
	.dropdown-item,
	.has-dropdown > .nav-link::before {
		animation: none !important;
		transition-duration: .05s;
	}
	.dropdown-item:hover {
		transform: translateX(2px);
	}
}

/* ========= 全屏 Mega Menu（产品中心专用） ========= */
.mega-menu {
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	height: 200px;
	background: #ffffff;
	box-shadow: 0 8px 32px rgba(31, 42, 68, 0.1);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: all .35s cubic-bezier(.4, 0, .2, 1);
	z-index: 1001;
	overflow: hidden;
}

.has-mega:hover .mega-menu {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

/* 内容容器：左右居中 */
.mega-container {
	max-width: 1400px;
	height: 100%;
	margin: 0 auto;
	padding: 30px 40px;
	display: flex;
	align-items: center;
}

/* 4列网格布局 */
.mega-grid {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 20px;
	width: 100%;
}

/* 单个卡片列 */
.mega-col {
	height: 100%;
	display: flex;
	align-items: center;
	background: #EDEDED;
	border-radius: 8px;
	padding: 20px 16px;
	transition: all .35s cubic-bezier(.4, 0, .2, 1);
	cursor: pointer;
	position: relative;
	overflow: hidden;
}

/* 悬停背景渐变效果 */
.mega-col::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(135deg, 
		rgba(14, 99, 199, 0.04), 
		rgba(77, 155, 255, 0.04));
	opacity: 0;
	transition: opacity .35s ease;
	z-index: 0;
}

.mega-col:hover::before {
	opacity: 1;
}

.mega-col:hover {
	background: rgba(255, 255, 255, 0.9);
	box-shadow: 0 8px 24px rgba(14, 99, 199, 0.15);
	transform: translateY(-4px);
}

/* 卡片容器：左图右文 */
.mega-card {
	display: flex;
	align-items: center;
	gap: 16px;
	background: transparent;
	position: relative;
	z-index: 1;
	width: 100%;
}

/* 左侧图片 */
.mega-pic {
	flex-shrink: 0;
	width: 60px;
	height: 60px;
	border-radius: 8px;
	overflow: hidden;
	background: #f4f6fb;
	position: relative;
	z-index: 1;
	transition: transform .35s cubic-bezier(.4, 0, .2, 1);
}

.mega-col:hover .mega-pic {
	transform: scale(1.08) rotate(2deg);
}

.mega-pic img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* 右侧文字 */
.mega-text {
	flex: 1;
	min-width: 0;
	position: relative;
	z-index: 1;
}

.mega-title {
	font-size: 14px;
	font-weight: 600;
	color: #1f2a44;
	margin: 0 0 6px;
	line-height: 1.4;
	transition: color .3s ease;
}

.mega-card:hover .mega-title {
	color: #0e63c7;
}

.mega-desc {
	font-size: 12px;
	color: #6b7787;
	line-height: 1.5;
	margin: 0;
	display: none;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	transition: color .3s ease;
}

.mega-col:hover .mega-desc {
	color: #4a5464;
}

/* 入场动画：逐卡错开 */
.has-mega:hover .mega-col {
	animation: megaColIn .45s cubic-bezier(.25, .8, .35, 1) both;
}

@keyframes megaColIn {
	from {
		opacity: 0;
		transform: translateY(20px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.has-mega:hover .mega-col:nth-child(1) { animation-delay: .08s; }
.has-mega:hover .mega-col:nth-child(2) { animation-delay: .14s; }
.has-mega:hover .mega-col:nth-child(3) { animation-delay: .20s; }
.has-mega:hover .mega-col:nth-child(4) { animation-delay: .26s; }

/* 低性能设备优化 */
@media (prefers-reduced-motion: reduce) {
	.mega-menu,
	.mega-col,
	.mega-pic {
		transition-duration: .05s;
	}
	.has-mega:hover .mega-col {
		animation: none !important;
	}
	.mega-col:hover {
		transform: translateY(-2px);
	}
	.mega-col:hover .mega-pic {
		transform: scale(1.04);
	}
}

/* ========= 全屏二级菜单 mega ========= */
.mega {
	position: absolute;
	/* 相对自己的 .nav-item 定位（每个面板独立，互不重叠）。
	   .header 有 1px 下边框，top:100% 会落在边框外侧，
	   导航项底边与面板之间出现 1px 空档、鼠标会掉出去，
	   所以用 calc(100% + 1px) 让面板向上盖住那条边框。 */
	top: calc(100% + 1px);
	/* 通栏宽度：由 JS（header.js 之外的内联 IIFE）把 --mega-l / --mega-r
	   设成「导航项左边到视口左边」「导航项右边到视口右边」的距离，
	   这样面板正好铺满视口宽，且不依赖 100vw（100vw 含滚动条宽会溢出）。
	   变量缺失时回退到一个足够大的负值，由 .header 的 overflow-x:clip 兜底裁剪。 */
	left: calc(-1 * var(--mega-l, 2000px));
	right: calc(-1 * var(--mega-r, 2000px));
	height: 400px;
	background: #fff;
	box-shadow: 0 12px 30px rgba(31, 42, 68, .08);
	/* 按需求改为 display 开关：未展开时元素完全不生成盒子，
	   既不占位、也绝不可能拦截鼠标。
	   代价：display 不是可动画属性，面板本身没有淡入淡出，
	   入场动画改由内层 .mega_inner 承担（见下）。 */
	display: none;
	z-index: 999;
	overflow: hidden;
}
.nav-item:hover .mega {
	display: block;
	/* 当前悬停的面板抬到同级最上层 */
	z-index: 1000;
}

.mega_inner {
	height: 100%;
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	padding-top: 34px;
	padding-bottom: 34px;
	gap: 40px;
	/* 保证内层始终铺满整个面板，任何时候鼠标进入面板范围都有实体接住。
	   （曾因内层被入场位移带走而出现「第一次 hover 进不去」的问题） */
	position: relative;
	z-index: 1;
}
/* 入场动画放在内层：外层 display:block 让盒子瞬间存在（鼠标立刻能接住），
   内层再用 animation 做淡入+下滑。用 animation 而不是 transition，
   因为元素刚从 display:none 出现时不存在「前一帧状态」，transition 不会触发。

   ⚠ 关键：这里只能做「淡入」，绝不能用 translateY 做位移。
   曾经用 from{translateY(-18px)} 让内容从上方滑入，导致一个只在
   「第一次 hover」出现的诡异 bug：动画期间内容整体上移 18px，
   鼠标从导航项往下移动时会经过一段「内容还没到位」的空白区，
   :hover 断开 → 外层 display:none → 面板瞬间消失；
   第二次 hover 时动画已播完（fill-mode:both 保持终态），
   内容不再位移，所以就正常了。
   位移动画交给内部元素（.mega_pic / .mega_slogan / li 等）去做，
   它们位移不影响 .mega_inner 自身的命中区域。 */
.nav-item:hover .mega_inner {
	animation: megaIn .38s cubic-bezier(.25, .8, .35, 1) both;
}
@keyframes megaIn {
	from { opacity: 0; }
	to   { opacity: 1; }
}

/* overflow-x:clip 的降级：老浏览器不支持 clip 时，
   退回 hidden 会把向下展开的面板裁掉，所以改为放弃负值溢出、
   让面板只占导航项宽度以内的安全范围（不通栏，但不破版）。
   注意：不能给 body 加 overflow-x:hidden —— 会让面包屑的
   position:sticky 失效（sticky 需要祖先链上没有裁剪上下文）。 */
@supports not (overflow-x: clip) {
	.header { overflow: visible; }
	.mega {
		left: calc(-1 * var(--mega-l, 0px));
		right: calc(-1 * var(--mega-r, 0px));
	}
}

/* 左侧图片 */
.mega_pic {
	flex-shrink: 0;
	width: 28%;
	height: 100%;
	overflow: hidden;
}
.mega_pic img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* 中间分类 */
.mega_cats {
	flex-shrink: 0;
	width: 14%;
	padding-top: 6px;
	display: flex;
	flex-direction: column;
	gap: 20px;
}
.mega_cat {
	font-size: 15px;
	color: #6b7787;
	white-space: nowrap;
	transition: color .3s ease;
}
.mega_cat:hover,
.mega_cat.active { color: #2d8ac0; }

/* 右侧主体 */
.mega_main {
	flex: 1;
	min-width: 0;
	position: relative;
	height: 100%;
	display: flex;
	flex-direction: column;
}
.mega_slogan {
	font-size: 14px;
	color: #6b7787;
	margin: 0 0 26px;
	line-height: 1.6;
}
.mega_cols {
	display: flex;
	gap: 40px;
	flex: 1;
}
.mega_links {
	flex: 1;
	min-width: 0;
	list-style: none;
	padding: 0;
	margin: 0;
	position: relative;
}
/* 右列左侧绿色虚线分隔（仅用于「两个并列 ul」的旧结构，如其它页面尚未改造的菜单）
   注意：三级联动结构里，.mega_lv2_wrap 内部多个 .mega_lv2 互为相邻兄弟且都带 .mega_links，
   会被这条规则命中而多画一根虚线，所以必须显式排除 .mega_lv2。
   三级结构的虚线由 .mega_lv2_wrap 负责。 */
.mega_links + .mega_links:not(.mega_lv2) {
	padding-left: 40px;
	border-left: 1px dashed #7fc48b;
}
.mega_links li { line-height: 30px; }
.mega_links li a {
	display: block;
	font-size: 14px;
	color: #4a5464;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	transition: color .3s ease;
}
.mega_links li a:hover { color: #2d8ac0; }

/* 查看更多按钮 */
.mega_more {
	position: absolute;
	right: 0;
	bottom: 0;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	height: 40px;
	padding: 0 22px;
	background: #2d8ac0;
	color: #fff;
	font-size: 14px;
	border-radius: 4px;
	transition: background .3s ease;
}
.mega_more i {
	font-style: normal;
	transition: transform .3s ease;
}
.mega_more:hover {
	background: #1f7ab0;
	color: #fff;
}
.mega_more:hover i { transform: translateX(4px); }

/* ========= mega 内部内容：逐级依次入场（stagger） =========
   外层 .mega 改用 display 开关后，transition 不再触发
   （元素从 display:none 出现时没有可插值的前一帧状态），
   因此这里统一改为 animation + animation-delay 实现错开入场。
   关闭时随父级 display:none 一起消失，无需写淡出。 */
.mega_pic,
.mega_slogan,
.mega_cats,
.mega_links li,
.mega_more {
	opacity: 0;
}
/* .mega_more 保留自身的 background 过渡 */
.mega_more { transition: background .3s ease; }

.nav-item:hover .mega_slogan,
.nav-item:hover .mega_cats,
.nav-item:hover .mega_links li,
.nav-item:hover .mega_more {
	animation: megaItemIn .45s cubic-bezier(.25, .8, .35, 1) both;
}
/* 左侧大图：轻微放大 + 淡入，层次更明显 */
.nav-item:hover .mega_pic {
	animation: megaPicIn .45s cubic-bezier(.25, .8, .35, 1) both;
	animation-delay: .08s;
}
@keyframes megaItemIn {
	from { opacity: 0; transform: translateY(14px); }
	to   { opacity: 1; transform: translateY(0); }
}
@keyframes megaPicIn {
	from { opacity: 0; transform: translateY(14px) scale(1.04); }
	to   { opacity: 1; transform: translateY(0) scale(1); }
}

.nav-item:hover .mega_cats   { animation-delay: .14s; }
.nav-item:hover .mega_slogan { animation-delay: .18s; }
/* 链接逐条错开，每条相差 45ms */
.nav-item:hover .mega_links li:nth-child(1) { animation-delay: .22s; }
.nav-item:hover .mega_links li:nth-child(2) { animation-delay: .265s; }
.nav-item:hover .mega_links li:nth-child(3) { animation-delay: .31s; }
.nav-item:hover .mega_links li:nth-child(4) { animation-delay: .355s; }
.nav-item:hover .mega_links li:nth-child(5) { animation-delay: .40s; }
.nav-item:hover .mega_links li:nth-child(6) { animation-delay: .445s; }
.nav-item:hover .mega_links li:nth-child(7) { animation-delay: .49s; }
.nav-item:hover .mega_links li:nth-child(8) { animation-delay: .535s; }

.nav-item:hover .mega_more { animation-delay: .50s; }

/* 分类项文字本身的 hover 颜色过渡不受入场动画影响 */
.mega_cat { transition: color .3s ease; }

/* 低性能 / 用户关闭动效时，直接显示，不做位移 */
@media (prefers-reduced-motion: reduce) {
	/* 入场改成了 animation，这里必须一并压掉，
	   否则 both 填充模式会把元素卡在 opacity:0 的起始帧上。 */
	.mega_inner,
	.mega_pic,
	.mega_slogan,
	.mega_cats,
	.mega_links li,
	.mega_more,
	.nav-item:hover .mega_inner,
	.nav-item:hover .mega_pic,
	.nav-item:hover .mega_slogan,
	.nav-item:hover .mega_cats,
	.nav-item:hover .mega_links li,
	.nav-item:hover .mega_more {
		animation-duration: .01s !important;
		animation-delay: 0s !important;
		transition-duration: .01s;
		transition-delay: 0s;
		transform: none;
	}
	.mega_pane,
	.mega_pic_item,
	.mega_lv2 {
		transition-duration: .01s !important;
	}
}

/* ========= mega 分类切换（hover mega_cat 切换左图 + 右侧整块） =========
   注意：外层 .mega 是 display 开关（整块菜单的显示/隐藏），
   而这里的分类切换仍然用「绝对定位叠放 + opacity」，两者不冲突。
   分类切换之所以不用 display，原因有两个：
   1) display 切换无法做过渡动画，切分类会硬跳；
   2) 各分类内容行数不同，绝对定位叠放可避免切换时高度抖动。 */

/* ---- 左图：多张叠放，跟随分类切换 ---- */
.mega_pic {
	position: relative;   /* 作为多张图的定位父级 */
}
.mega_pic_item {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	visibility: hidden;
	transition: opacity .45s cubic-bezier(.25, .8, .35, 1),
	            visibility 0s linear .45s;
}
.mega_pic_item.active {
	opacity: 1;
	visibility: visible;
	transition: opacity .45s cubic-bezier(.25, .8, .35, 1),
	            visibility 0s linear 0s;
}
.mega_pic_item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* ---- 分类项：加一条左侧指示条，hover/选中时展开 ---- */
.mega_cat {
	position: relative;
	padding-left: 14px;
	line-height: 1.5;
}
.mega_cat::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 3px;
	height: 0;
	background: #2d8ac0;
	border-radius: 2px;
	transition: height .3s ease;
}
.mega_cat:hover::before,
.mega_cat.active::before { height: 100%; }

/* ---- 右侧面板：叠放切换 ---- */
.mega_panes {
	position: relative;
	flex: 1;
	min-height: 0;
}
.mega_pane {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	opacity: 0;
	visibility: hidden;
	transform: translateY(10px);
	transition: opacity .4s cubic-bezier(.25, .8, .35, 1),
	            transform .4s cubic-bezier(.25, .8, .35, 1),
	            visibility 0s linear .4s;
	pointer-events: none;   /* 未激活面板不可点，防止挡住当前面板 */
}
.mega_pane.active {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
	transition: opacity .4s cubic-bezier(.25, .8, .35, 1),
	            transform .4s cubic-bezier(.25, .8, .35, 1),
	            visibility 0s linear 0s;
	pointer-events: auto;
}

/* 面板内的元素：入场动画由 .mega_pane 整体负责，
   必须把 stagger 的 animation 关掉，否则两套动画会打架
   （分类切换时内部元素会重新逐条闪一遍）。 */
.mega_pane .mega_slogan,
.mega_pane .mega_links li,
.mega_pane .mega_more {
	opacity: 1;
	transform: none;
	animation: none !important;
}
.mega_pane .mega_slogan,
.mega_pane .mega_links li {
	transition: none;
}
.mega_pane .mega_more {
	transition: background .3s ease;
}

/* 纯文案型面板（如「应用领域」）：没有链接列表，只有一段说明文字 */
.mega_pane_text .mega_slogan {
	font-size: 15px;
	line-height: 2;
	color: #4a5464;
	margin-bottom: 0;
	max-width: 88%;
}
.mega_pane_text .mega_txt_more {
	margin-top: 18px;
	font-size: 14px;
	color: #6b7787;
	line-height: 1.9;
	max-width: 88%;
}

/* ========= mega 三级联动（hover 左侧一级 → 切换右侧二级） =========
   结构：.mega_cols > ul.mega_links.mega_lv1  +  .mega_lv2_wrap > ul.mega_links.mega_lv2
   原来 .mega_cols 里是两个并列 ul，现在右侧换成了一个包裹层 div，
   因此原先的 .mega_links + .mega_links 虚线分隔选择器已经匹配不到，
   必须把同样的分隔样式补回到 .mega_lv2_wrap 上。 */
.mega_cols {
	/* 两列仍然等分：左列是 ul（自带 flex:1），右列是包裹 div */
	align-items: stretch;
}
.mega_lv2_wrap {
	position: relative;   /* 多个二级列表叠放的定位父级 */
	flex: 1;
	min-width: 0;
	/* 找回原 .mega_links + .mega_links 的绿色虚线分隔 */
	padding-left: 40px;
	border-left: 1px dashed #7fc48b;
}
/* 二级列表：绝对定位叠放，避免各组条数不同导致面板高度抖动，
   同时和 .mega_pane 的切换逻辑保持一致（opacity + visibility）。
   注意 toggle 加在 ul 上，而上面的中和规则
   .mega_pane .mega_links li { opacity: 1 } 作用于 li，两者不冲突。 */
.mega_lv2 {
	position: absolute;
	left: 40px;           /* 与 .mega_lv2_wrap 的 padding-left 对齐 */
	top: 0;
	width: calc(100% - 40px);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translateY(6px);
	transition: opacity .3s cubic-bezier(.25, .8, .35, 1),
	            transform .3s cubic-bezier(.25, .8, .35, 1),
	            visibility 0s linear .3s;
}
.mega_lv2.active {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translateY(0);
	transition: opacity .3s cubic-bezier(.25, .8, .35, 1),
	            transform .3s cubic-bezier(.25, .8, .35, 1),
	            visibility 0s linear 0s;
}
/* 二级列表本身不再参与 flex 布局（已绝对定位），清掉继承的 flex；
   并且强制清掉可能从 .mega_links + .mega_links 继承来的左侧虚线/内边距，
   避免出现两根虚线（虚线只由 .mega_lv2_wrap 提供）。 */
.mega_lv2,
.mega_links + .mega_links.mega_lv2 {
	flex: none;
	padding-left: 0;
	border-left: 0;
}

/* ---- 一级项：加左侧指示条 + 右侧箭头，hover/选中高亮 ---- */
.mega_lv1 li {
	position: relative;
	padding-left: 14px;
	padding-right: 18px;
}
.mega_lv1 li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 3px;
	height: 0;
	background: #2d8ac0;
	border-radius: 2px;
	transition: height .3s ease;
}
.mega_lv1 li:hover::before,
.mega_lv1 li.active::before { height: 60%; }
/* 右侧小箭头：默认隐藏，选中时淡入右移 */
.mega_lv1 li::after {
	content: "";
	position: absolute;
	right: 4px;
	top: 50%;
	width: 6px;
	height: 6px;
	border-right: 1px solid #2d8ac0;
	border-top: 1px solid #2d8ac0;
	transform: translateY(-50%) rotate(45deg) translateX(-4px);
	opacity: 0;
	transition: opacity .3s ease, transform .3s ease;
}
.mega_lv1 li:hover::after,
.mega_lv1 li.active::after {
	opacity: 1;
	transform: translateY(-50%) rotate(45deg) translateX(0);
}
.mega_lv1 li:hover > a,
.mega_lv1 li.active > a { color: #2d8ac0; }

/* ========= 右侧工具区 ========= */
.header-tools {
	display: flex;
	align-items: center;
	gap: 14px;
	flex-shrink: 0;
}
.language-current,
.search-icon {
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	color: #1f2a44;
	cursor: pointer;
	transition: all .3s ease;
	background: rgba(255, 255, 255, 0);
}
.language-current svg,
.search-icon svg { width: 26px; height: 26px; }
.language-current:hover,
.search-icon:hover {
	background: rgba(14, 99, 199, 0.1);
	color: #0e63c7;
	transform: translateY(-1px);
}

/* ========= 移动端菜单按钮 ========= */
.menu-toggle {
	display: none;
	background: none;
	cursor: pointer;
	width: 30px;
	height: 28px;
	position: relative;
	padding: 0;
}
.menu-toggle span {
	display: block;
	position: absolute;
	height: 2px;
	width: 100%;
	background: #1f2a44;
	border-radius: 2px;
	left: 0;
	transition: .3s ease-in-out;
}
.menu-toggle span:nth-child(1) { top: 4px; }
.menu-toggle span:nth-child(2),
.menu-toggle span:nth-child(3) { top: 13px; }
.menu-toggle span:nth-child(4) { top: 22px; }
.menu-toggle.active span:nth-child(1),
.menu-toggle.active span:nth-child(4) { opacity: 0; }
.menu-toggle.active span:nth-child(2) { transform: rotate(45deg); }
.menu-toggle.active span:nth-child(3) { transform: rotate(-45deg); }

/* ================= 移动端导航侧滑 ================= */
.nav-mobile {
	position: fixed;
	top: 0;
	right: -100%;
	width: 82%;
	max-width: 380px;
	height: 100vh;
	background: #fff;
	box-shadow: -10px 0 40px rgba(31, 42, 68, 0.15);
	transition: right .4s cubic-bezier(.4, 0, .2, 1);
	z-index: 1100;
	overflow-y: auto;
	padding: 80px 0 30px;
}
.nav-mobile.active { right: 0; }
.nav-mobile-close {
	position: absolute;
	top: 22px;
	right: 22px;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: #f4f6fb;
	font-size: 24px;
	color: #1f2a44;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all .3s ease;
}
.nav-mobile-close:hover { background: #0e63c7; color: #fff; transform: rotate(90deg); }

.nav-mobile-list { padding: 0 8px; }
.nav-mobile-item { border-bottom: 1px solid #eef1f6; }
.mobile-menu-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	position: relative;
}
.nav-mobile-link {
	flex: 1;
	display: block;
	padding: 16px 20px;
	font-size: 16px;
	font-weight: 500;
	color: #1f2a44;
}
.nav-mobile-link.active { color: #0e63c7; }
/* 展开按钮：用纯 CSS 画的 V 形箭头（不再用 + / ✕ 文字符号）。
   收起时箭头朝下，展开时整体旋转 180° 变成朝上，语义更符合「展开/收起」。
   箭头由 ::before 的两条边框 + rotate(45deg) 构成，
   旋转动画作用在按钮本身，两者互不干扰。
   注意：HTML 里 span 内不要再放 + 号等文字，
   header.js 中原本会改写 textContent 的两处也已一并去掉。 */
.mobile-expand-btn {
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #7b869a;
	cursor: pointer;
	transition: transform .3s ease, color .3s ease;
	margin-right: 8px;
	/* 防止 span 里万一残留文字被显示出来 */
	font-size: 0;
	line-height: 0;
}
.mobile-expand-btn::before {
	content: "";
	display: block;
	width: 9px;
	height: 9px;
	/* 只留右、下两条边 → 旋转 45° 后形成一个朝下的 V */
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	/* 视觉居中：V 形的重心偏下，往上提 2px 更平衡 */
	margin-top: -3px;
	border-radius: 1px;
}
.mobile-expand-btn.active {
	transform: rotate(180deg);
	color: #0e63c7;
}
.nav-mobile-sublist {
	max-height: 0;
	overflow: hidden;
	background: #f7f9fc;
	transition: max-height .35s ease;
}
/* 二级展开高度：内部三级展开后整体会变高，
   这里必须留足余量，否则三级内容会被 overflow:hidden 裁掉。
   （max-height 只是动画用的上限，不会真的把菜单撑到这么高） */
.nav-mobile-sublist.active { max-height: 1600px; }
.nav-mobile-sublist li { border-top: 1px solid #eef1f6; }
.nav-mobile-sublink {
	display: block;
	padding: 12px 20px 12px 40px;
	font-size: 14px;
	color: #4a5468;
}
.nav-mobile-sublink:hover { color: #0e63c7; }

/* ========= 移动端三级菜单 =========
   结构：.nav-mobile-sublist > li.has-child
           > .mobile-sub-row ( a.nav-mobile-sublink + span.mobile-expand-btn.is-sub )
           > ul.nav-mobile-thirdlist > li > a.nav-mobile-thirdlink
   二级里带三级的项，链接和箭头要并排，所以外面包一层 flex 行。 */
.mobile-sub-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.mobile-sub-row .nav-mobile-sublink {
	flex: 1;
	min-width: 0;
}
/* 三级的箭头比二级小一号，颜色更淡，形成层级差 */
.mobile-expand-btn.is-sub {
	width: 38px;
	height: 38px;
	margin-right: 4px;
	color: #9aa4b5;
}
.mobile-expand-btn.is-sub::before {
	width: 7px;
	height: 7px;
	border-right-width: 1.5px;
	border-bottom-width: 1.5px;
}

.nav-mobile-thirdlist {
	max-height: 0;
	overflow: hidden;
	/* 三级底色比二级更深一点，层级更清晰 */
	background: #eef2f8;
	transition: max-height .3s ease;
}
.nav-mobile-thirdlist.active { max-height: 600px; }
.nav-mobile-thirdlist li { border-top: 1px solid #e2e8f2; }
.nav-mobile-thirdlink {
	display: block;
	/* 比二级再缩进一级：40px → 58px */
	padding: 11px 20px 11px 58px;
	font-size: 13px;
	color: #6b7787;
	position: relative;
}
/* 三级项前面加一个小圆点，进一步区分层级 */
.nav-mobile-thirdlink::before {
	content: "";
	position: absolute;
	left: 42px;
	top: 50%;
	transform: translateY(-50%);
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: #c3ccda;
	transition: background .3s ease;
}
.nav-mobile-thirdlink:hover { color: #0e63c7; }
.nav-mobile-thirdlink:hover::before { background: #0e63c7; }

/* 移动端工具区 */
.mobile-functions {
	display: flex;
	gap: 16px;
	padding: 24px 20px;
	margin-top: 10px;
	border-top: 1px solid #eef1f6;
}
.mobile-tool {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 12px 16px;
	background: linear-gradient(135deg, #f4f6fb, #eaeff8);
	border-radius: 10px;
	color: #1f2a44;
	font-size: 14px;
	cursor: pointer;
	transition: all .3s ease;
}
.mobile-tool svg { width: 18px; height: 18px; }
.mobile-tool:hover {
	background: linear-gradient(135deg, #0e63c7, #4d9bff);
	color: #fff;
	transform: translateY(-2px);
	box-shadow: 0 6px 18px rgba(14, 99, 199, 0.3);
}

/* ================= 遮罩层 ================= */
.overlay {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.4);
	opacity: 0;
	visibility: hidden;
	transition: all .3s ease;
	z-index: 1050;
}
.overlay.active { opacity: 1; visibility: visible; }

/* ================= 全屏搜索弹窗 ================= */
.search-modal {
	position: fixed;
	inset: 0;
	background: rgba(15, 25, 50, 0.85);
	-webkit-backdrop-filter: blur(20px);
	backdrop-filter: blur(20px);
	z-index: 2000;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	visibility: hidden;
	transition: all .4s cubic-bezier(.4, 0, .2, 1);
}
.search-modal.active { opacity: 1; visibility: visible; }
.search-modal-close {
	position: absolute;
	top: 32px;
	right: 40px;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.1);
	color: #fff;
	font-size: 32px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all .3s ease;
}
.search-modal-close:hover {
	background: #fff;
	color: #1f2a44;
	transform: rotate(90deg);
}
.search-modal-inner {
	width: 100%;
	max-width: 720px;
	padding: 0 30px;
	transform: translateY(30px);
	opacity: 0;
	transition: all .5s cubic-bezier(.4, 0, .2, 1) .1s;
}
.search-modal.active .search-modal-inner {
	transform: translateY(0);
	opacity: 1;
}
.search-modal-title {
	color: rgba(255, 255, 255, 0.9);
	font-size: 42px;
	font-weight: 600;
	letter-spacing: 6px;
	text-align: center;
	margin-bottom: 40px;
	background: linear-gradient(135deg, #ffffff, #a9c9ff);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}
.search-modal-form {
	display: flex;
	align-items: center;
	background: rgba(255, 255, 255, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-radius: 60px;
	padding: 8px 8px 8px 32px;
	backdrop-filter: blur(10px);
	transition: all .3s ease;
}
.search-modal-form:focus-within {
	border-color: rgba(255, 255, 255, 0.5);
	background: rgba(255, 255, 255, 0.14);
	box-shadow: 0 10px 40px rgba(77, 155, 255, 0.25);
}
.search-modal-form input {
	flex: 1;
	background: transparent;
	color: #fff;
	font-size: 18px;
	height: 60px;
	padding-right: 20px;
}
.search-modal-form input::placeholder { color: rgba(255, 255, 255, 0.5); }
.search-modal-form button {
	display: flex;
	align-items: center;
	height: 60px;
	padding: 0 34px;
	background: linear-gradient(135deg, #0e63c7, #4d9bff);
	color: #fff;
	font-size: 16px;
	font-weight: 500;
	border-radius: 60px;
	cursor: pointer;
	transition: all .3s ease;
}
.search-modal-form button:hover {
	background: linear-gradient(135deg, #4d9bff, #0e63c7);
	transform: translateX(2px);
	box-shadow: 0 6px 20px rgba(77, 155, 255, 0.5);
}
.search-modal-hint {
	text-align: center;
	color: rgba(255, 255, 255, 0.5);
	font-size: 13px;
	margin-top: 24px;
	letter-spacing: 1px;
}
.search-modal-hint kbd {
	display: inline-block;
	padding: 3px 10px;
	margin: 0 4px;
	background: rgba(255, 255, 255, 0.1);
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-radius: 4px;
	font-family: inherit;
	font-size: 12px;
	color: #fff;
}

/* ================= 语言切换：图标下方气泡下拉 ================= */
.lang-wrap { position: relative; }

.lang-dropdown {
	position: absolute;
	top: calc(100% + 14px);
	right: -6px;
	min-width: 200px;
	background: #fff;
	border-radius: 14px;
	box-shadow: 0 12px 40px rgba(15, 25, 50, 0.14), 0 2px 8px rgba(15, 25, 50, 0.06);
	padding: 8px;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-10px) scale(.96);
	transform-origin: top right;
	transition: opacity .25s ease, transform .25s cubic-bezier(.4, 0, .2, 1), visibility .25s;
	z-index: 1200;
}
.lang-dropdown::before {
	content: "";
	position: absolute;
	top: -6px;
	right: 20px;
	width: 12px;
	height: 12px;
	background: #fff;
	transform: rotate(45deg);
	border-radius: 2px;
	box-shadow: -2px -2px 6px rgba(15, 25, 50, 0.04);
}
.lang-wrap:hover .lang-dropdown {
	opacity: 1;
	visibility: visible;
	transform: translateY(0) scale(1);
}
.lang-dropdown a {
	position: relative;
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 14px;
	border-radius: 10px;
	color: #1f2a44;
	font-size: 14px;
	transition: all .25s ease;
}
.lang-dropdown a:hover {
	background: linear-gradient(135deg, rgba(14, 99, 199, 0.08), rgba(77, 155, 255, 0.08));
	color: #0e63c7;
}
.lang-dropdown a.active {
	background: linear-gradient(135deg, #0e63c7, #4d9bff);
	color: #fff;
	box-shadow: 0 6px 16px rgba(14, 99, 199, 0.28);
}

.lang-dropdown .lang-name {
	flex: 1;
	font-weight: 500;
}
.lang-dropdown .lang-code {
	font-size: 11px;
	letter-spacing: 1px;
	color: #b1bacb;
	font-weight: 500;
}
.lang-dropdown a.active .lang-code { color: rgba(255, 255, 255, .85); }
.lang-dropdown a:hover .lang-code { color: #0e63c7; }

/* 触发图标激活态 */
.lang-wrap:hover .language-current {
	background: rgba(14, 99, 199, 0.12);
	color: #0e63c7;
}

/* ================= 响应式断点 ================= */
/* 1700 - 1600 */
@media (max-width: 1700px) {
	.header-container { max-width: 1600px; padding: 0 32px; }
}
/* 1600 - 1400 */
@media (max-width: 1600px) {
	.header-container { max-width: 1400px; }
	.nav-link { padding: 12px 16px; font-size: 15px; }
}
/* 1400 - 1200 */
@media (max-width: 1400px) {
	.header-container { max-width: 1200px; padding: 0 24px; }
	.nav-link { padding: 12px 14px; }
	.header-tools { gap: 10px; }
}
/* 1200 - 1000 */
@media (max-width: 1200px) {
	.header-container { max-width: 1000px; gap: 16px; }
	.nav-pc { gap: 2px; }
	.nav-link { padding: 12px 10px; font-size: 14px; letter-spacing: 0; }
	.logo img { height: 46px; }
	.header.scrolled .logo img { height: 38px; }
}
/* 1000 - 992 */
@media (max-width: 1000px) {
	.header { height: 90px; }
	.header.scrolled { height: 70px; }
	.header-container { max-width: 100%; padding: 0 20px; }
	.nav-pc { display: none; }
	.menu-toggle { display: block; }
	.logo img { height: 42px; }
	.header.scrolled .logo img { height: 36px; }
}
/* 手机 */
@media (max-width: 768px) {
	.header { height: 70px; }
	.header.scrolled { height: 60px; }
	.header-container { padding: 0 16px; gap: 8px; }
	.logo img { height: 36px; }
	.header.scrolled .logo img { height: 32px; }
	.header-tools { gap: 4px; }
	.language-current,
	.search-icon { width: 34px; height: 34px; }
	.language-current svg,
	.search-icon svg { width: 22px;
        height: 22px;}

	.search-modal-close { top: 18px; right: 18px; width: 44px; height: 44px; font-size: 26px; }
	.search-modal-title { font-size: 26px; letter-spacing: 3px; margin-bottom: 24px; }
	.search-modal-form { padding: 6px 6px 6px 20px; border-radius: 40px; }
	.search-modal-form input { height: 48px; font-size: 15px; }
	.search-modal-form button { height: 48px; padding: 0 22px; font-size: 14px; }

	.lang-dropdown { min-width: 190px; padding: 6px; }
	.lang-dropdown a { padding: 9px 12px; font-size: 13px; }
		.search-icon{
			display: none;
		}.lang-wrap{margin-right: 10px;}
		
}
@media (max-width: 480px) {
	.nav-mobile { width: 88%; }
	.search-modal-form button span { display: none; }
}


/* ================= Banner 轮播 ================= */
.banner-swiper {
	position: relative;
	width: 100%;
	overflow: hidden;
	margin-top: 110px;
}
.banner-swiper .swiper-slide img {
	display: block;
	width: 100%;
	height: auto;
}
/* 左右箭头 */
.banner-swiper .swiper-button-prev,
.banner-swiper .swiper-button-next {
	width: 50px;
	height: 50px;
	border: 2px solid #fff;
	border-radius: 50%;
	background: transparent;
	background-image: none;
	transition: all .3s ease;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 10;
	cursor: pointer;
}
.banner-swiper .swiper-button-prev { left: 30px; }
.banner-swiper .swiper-button-next { right: 30px; }
/* 用伪元素画箭头 */
.banner-swiper .swiper-button-prev::after,
.banner-swiper .swiper-button-next::after {
	content: "";
	display: block;
	width: 12px;
	height: 12px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	position: absolute;
	top: 50%;
}
.banner-swiper .swiper-button-prev::after {
	transform: translate(-50%, -50%) rotate(-135deg);
	left: 55%;
}
.banner-swiper .swiper-button-next::after {
	transform: translate(-50%, -50%) rotate(45deg);
	left: 45%;
}
.banner-swiper .swiper-button-prev:hover,
.banner-swiper .swiper-button-next:hover {
	background: rgba(14, 99, 199, 0.85);
	border-color: rgba(14, 99, 199, 0.85);
}
.banner-swiper .swiper-button-prev:hover::after,
.banner-swiper .swiper-button-next:hover::after {
	border-color: #fff;
}
/* 滚动后 header 变矮，banner 跟着调整 */
@media (max-width: 1000px) {
	.banner-swiper { margin-top: 90px; }
}
@media (max-width: 768px) {
	.banner-swiper { margin-top: 70px; }
	.banner-swiper .swiper-button-prev,
	.banner-swiper .swiper-button-next { width: 36px; height: 36px; }
	.banner-swiper .swiper-button-prev::after,
	.banner-swiper .swiper-button-next::after { font-size: 14px; }
}

/* ===== 入场动画 ===== */
@keyframes xkrSlideUp {
  from { transform: translateY(60px); opacity: 0; }
  to   { transform: translateY(0);    opacity: 1; }
}
.xkr-reveal { opacity: 0; }
.xkr-reveal.xkr-show { animation: xkrSlideUp .8s ease both; }

/* ===== 外层容器 ===== */
.xkr-arczone { background: #0d1b26; }
.xkr-stage {
  height: 860px;
  overflow: hidden;
  position: relative;
}

/* ===== 背景图层 ===== */
.xkr-bglay {
  position: absolute;
  left: 0; top: 0;
  width: 100%; height: 100%;
  z-index: 1;
}
.xkr-bglay:after {
  content: '';
  position: absolute;
  left: 0; top: 0;
  width: 100%; height: 100%;
  background: rgba(0, 0, 0, 0.45);
  z-index: 1;
}
.xkr-bglay span {
  display: block;
  width: 100%; height: 100%;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  transition: opacity .5s;
}

/* ===== 巨型圆盘 ===== */
.xkr-orbit {
  position: absolute;
  left: 50%;
  top: 200px;
  width: 240vw;
  height: 240vw;
  transform: translateX(-50%);
  z-index: 2;
}
.xkr-ring {
  width: 100%; height: 100%;
  border: 1px dashed rgba(255, 255, 255, 0.4);
  border-radius: 50%;
}
.xkr-ring-nodes {
  width: 100%; height: 100%;
  position: relative;
  transition: transform .6s cubic-bezier(.4, 0, .2, 1);
}
.xkr-ring-nodes li {
  width: 100%; height: 100%;
  position: absolute;
  left: 0; top: 0;
  visibility: hidden;
}
.xkr-ring-nodes li .xkr-dot {
  width: 88px; height: 88px;
  background: #fff;
  border-radius: 50%;
  overflow: hidden;
  visibility: visible;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: 50%; top: -44px;
  margin-left: -44px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, .3);
  transition: transform .6s cubic-bezier(.4, 0, .2, 1),
              opacity .5s, width .45s, height .45s, margin .45s, top .45s, background .45s;
}
.xkr-ring-nodes li .xkr-dot img {
  width: 46%; height: 46%;
  object-fit: contain;
}
.xkr-ring-nodes li .xkr-dot .xkr-ico-lit { display: none; }
.xkr-ring-nodes li.xkr-active .xkr-dot .xkr-ico-dim { display: none; }
.xkr-ring-nodes li.xkr-active .xkr-dot .xkr-ico-lit { display: block; }

/* 选中态：放大、蓝底 */
.xkr-ring-nodes li.xkr-active .xkr-dot {
  width: 124px; height: 124px;
  top: -62px; margin-left: -62px;
  background: var(--xkr-blue);
  box-shadow: 0 8px 26px rgba(30, 157, 216, .6);
}

/* ===== 中央文字区 ===== */
.xkr-infobox {
  position: absolute;
  left: 50%; top: 64%;
  transform: translate(-50%, -50%);
  width: 90%;
  max-width: 720px;
  z-index: 3;
  text-align: center;
  color: #fff;
  pointer-events: none;
}
.xkr-infoslide {
  display: none;
  pointer-events: auto;
}
.xkr-infoslide.xkr-active {
  display: block;
  animation: xkrSlideUp .6s ease both;
}

.xkr-infoslide .xkr-heading {
  margin-bottom: 18px;
}
.xkr-infoslide .xkr-heading .xkr-en {
  display: block;
  font-size: 66px;
  line-height: 1.1;
  font-weight: 700;
  text-transform: uppercase;
  white-space: nowrap;
  color: transparent;
  -webkit-text-stroke: 1px rgba(255, 255, 255, .55);
}
.xkr-infoslide .xkr-heading .xkr-cn {
  display: block;
  font-size: 36px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: 2px;
  margin-top: 6px;
}
.xkr-infoslide .xkr-desc {
  font-size: 16px;
  line-height: 32px;
  max-width: 560px;
  margin: 0 auto 34px;
  color: rgba(255, 255, 255, .9);
}
.xkr-infoslide .xkr-morebtn {
  display: inline-block;
  padding: 0 38px;
  height: 48px;
  line-height: 48px;
  background: var(--xkr-blue);
  border-radius: 4px;
  font-size: 15px;
  color: #fff;
  transition: background .3s;
}
.xkr-infoslide .xkr-morebtn:hover { background: var(--xkr-blue-dark); }

/* ===== 左右箭头 ===== */
.xkr-arrow {
  width: 50px; height: 50px;
  padding: 0;
  outline: 0;
  cursor: pointer;
  border: 1px solid #fff;
  border-radius: 50%;
  background: transparent;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 66%;
  transform: translateY(-50%);
  z-index: 4;
  transition: background .3s;
}
.xkr-arrow:hover { background: rgba(255, 255, 255, .18); }
.xkr-arrow::before {
  content: '';
  width: 11px; height: 11px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
}
.xkr-arrow-next::before { transform: translateX(-2px) rotate(45deg); }
.xkr-arrow-prev::before { transform: translateX(2px) rotate(-135deg); }
.xkr-arrow-prev { left: calc(50% - 400px); }
.xkr-arrow-next { right: calc(50% - 400px); }

/* ===== 响应式 ===== */
@media (max-width: 1680px) {
  .xkr-stage { height: 900px; }
}
@media (max-width: 1440px) {
  .xkr-stage { height: 780px; }
  .xkr-orbit { top: 180px; }
  .xkr-infoslide .xkr-heading .xkr-en { font-size: 64px; }
}
@media (max-width: 1180px) {
  .xkr-stage { height: 640px; }
  .xkr-orbit { top: 150px; }
  .xkr-infoslide .xkr-heading .xkr-en { font-size: 52px; }
  .xkr-infoslide .xkr-heading .xkr-cn { font-size: 32px; }
  .xkr-arrow-prev { left: calc(50% - 350px); }
  .xkr-arrow-next { right: calc(50% - 350px); }
}
@media (max-width: 768px) {
  .xkr-stage { height: 520px; }
  .xkr-orbit { top: 110px; }
  .xkr-ring-nodes li .xkr-dot { width: 60px; height: 60px; top: -30px; margin-left: -30px; }
  .xkr-ring-nodes li.xkr-active .xkr-dot { width: 84px; height: 84px; top: -42px; margin-left: -42px; }
  .xkr-infobox { top: 54%; width: 92%; }
  .xkr-infoslide .xkr-heading { height: 72px; margin-bottom: 14px; }
  .xkr-infoslide .xkr-heading .xkr-en { font-size: 36px; }
  .xkr-infoslide .xkr-heading .xkr-cn { font-size: 26px; }
  .xkr-infoslide .xkr-desc { font-size: 13px; line-height: 24px; margin-bottom: 22px; }
  .xkr-infoslide .xkr-morebtn { height: 42px; line-height: 42px; padding: 0 28px; font-size: 14px; }
  .xkr-arrow { width: 40px; height: 40px; top: 56%; }
  .xkr-arrow-prev { left: 4%; }
  .xkr-arrow-next { right: 4%; }
}
@media (max-width: 480px) {
  .xkr-stage { height: 440px; }
  .xkr-orbit { top: 88px; }
  .xkr-infoslide .xkr-heading .xkr-en { font-size: 27px; }
  .xkr-infoslide .xkr-heading .xkr-cn { font-size: 21px; }
  .xkr-infoslide .xkr-desc { display: none; }
  .xkr-arrow { top: 52%; }
  .xkr-arrow-prev { left: 3%; }
  .xkr-arrow-next { right: 3%; }
}

/* ================= 关于我们 About Us (fp_box_1) ================= */
.fp_box_1 {
	width: 100%;
	background: #fff;
	padding: 110px 0 90px;
	overflow: hidden;
}
.ab1_con {
	max-width: 1420px;
	margin: 0 auto;
	padding: 0 20px;
	display: flex;
	align-items: stretch;
	gap: 70px;
}

/* ---- 左侧：年份 + 图片 ---- */
.ab1_left {
	flex-shrink: 0;
	width: 405px;
	position: relative;
}
.ab1_year {
	position: relative;
	z-index: 2;
	margin-bottom: 0px;
}
.ab1_year img {
	width: 417px;
	display: block;
}
.ab1_year p {
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 3px;
	color: #1f2a44;
	margin-top: 4px;
}
.ab1_pic {
	position: relative;
	width: 405px;
	height: 650px;
}
.ab1_pic::before {
	content: "";
	position: absolute;
	right: -16px;
	bottom: -16px;
	width: 100%;
	height: 100%;
	background: var(--xkr-blue);
	z-index: 0;
}
.ab1_pic img {
	position: relative;
	z-index: 1;
	display: block;
	width: 405px;
	height: 650px;
	object-fit: cover;
}

/* ---- 右侧：标题 + 简介 + 数据 ---- */
.ab1_right {
	flex: 1;
	position: relative;
	min-width: 0;
	padding-top: 6px;
	display: flex;
	flex-direction: column;
}
.ab1_bg {
	position: absolute;
	top: -10px;
	right: 0;
	width: 395px;
	height: 632px;
	background-image: url('../images/as2.png');
	background-repeat: no-repeat;
	background-position: top right;
	background-size: contain;
	z-index: 0;
	pointer-events: none;
	user-select: none;
}
.ab1_en {
	position: relative;
	z-index: 1;
	font-size: 150px;
	font-weight: 800;
	letter-spacing: 4px;
	line-height: 1;
	color: #dbe1ec;
	margin: 130px 0 34px;
}
.ab1_en span {
	color: var(--xkr-blue);
	-webkit-text-stroke: 0;
}
.ab1_title {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	gap: 14px;
	margin-bottom: 20px;
}
.ab1_ico {
	flex-shrink: 0;
	width: 32px;
	height: 32px;
	border-radius: 4px;
	position: relative;
	display: inline-block;
}

.ab1_title h3 {
	font-size: 24px;
	font-weight: 700;
	color: #1f2a44;
}
.ab1_desc {
	position: relative;
	z-index: 1;
	font-size: 15px;
	line-height: 30px;
	color: #737d90;
	max-width: 720px;
	margin: 0 0 32px;
}
.ab1_more {
	position: relative;
	z-index: 1;
	display: inline-block;
	width: 130px;
	height: 44px;
	line-height: 44px;
	text-align: center;
	background: var(--xkr-blue);
	color: #fff;
	border-radius: 22px;
	font-size: 14px;
	margin-bottom: 64px;
	transition: all .3s ease;
}
.ab1_more:hover {
	background: var(--xkr-blue-dark);
	color: #fff;
	box-shadow: 0 10px 24px rgba(30, 157, 216, .35);
}

.ab1_data {
	position: relative;
	z-index: 1;
	display: flex;
	gap: 24px;
	margin-top: auto;
}
.ab1_data li {
	flex: 1;
	background: #f4f6f8;
	padding: 26px 28px;
}
.ab1_line {
	display: block;
	width: 24px;
	height: 2px;
	background: var(--xkr-blue);
	margin-bottom: 16px;
}
.ab1_label {
	font-size: 15px;
	color: #737d90;
	margin-bottom: 10px;
}
.ab1_num {
	font-size: 42px;
	font-weight: 700;
	color: #1f2a44;
	line-height: 1;
}
.ab1_num em {
	font-size: 16px;
	font-weight: 400;
	font-style: normal;
	color: #737d90;
	margin-left: 4px;
}

/* ---- 响应式：1420 / 1200 / 1000 / 手机 ---- */
@media (max-width: 1420px) {
	.ab1_con { max-width: 1200px; gap: 50px; }
	.ab1_en { font-size: 56px; }
}
@media (max-width: 1200px) {
	.ab1_con { max-width: 1000px; gap: 40px; }
	.ab1_left { width: 260px; }
	.ab1_en { font-size: 46px; margin-bottom: 24px; }
	.ab1_bg { width: 240px; }
	.ab1_data { gap: 50px; }
	.ab1_num { font-size: 34px; }
}
@media (max-width: 1000px) {
	.fp_box_1 { padding: 80px 0 60px; }
	.ab1_con { flex-direction: column; gap: 40px; }
	.ab1_left { width: 100%; max-width: 320px; }
	.ab1_bg { width: 200px; top: -6px; }
	.ab1_en { font-size: 42px; margin-top: 0; }
	.ab1_data { gap: 40px; flex-wrap: wrap; }
}
@media (max-width: 768px) {
	.fp_box_1 { padding: 60px 0 50px; }
	.ab1_con { padding: 0 16px; gap: 30px; }
	.ab1_left { max-width: 100%; width: 100%; }
	.ab1_pic { width: 100%; height: auto; }
	.ab1_pic img { width: 100%; height: auto; }
	.ab1_pic::before { display: none; }
	.ab1_year img { width: 170px; }
	.ab1_bg { display: none; }
	.ab1_en { font-size: 32px; margin-bottom: 18px; }
	.ab1_title h3 { font-size: 19px; }
	.ab1_desc { font-size: 14px; line-height: 26px; margin-bottom: 24px; }
	.ab1_more { height: 44px; line-height: 44px; padding: 0 24px; margin-bottom: 40px; font-size: 14px; }
	.ab1_data { gap: 16px; }
	.ab1_data li { padding: 18px 14px; }
	.ab1_num { font-size: 26px; }
	.ab1_label { font-size: 13px; }
}
@media (max-width: 480px) {
	.ab1_en { font-size: 26px; }
	.ab1_data { gap: 12px; flex-wrap: wrap; }
	.ab1_data li { flex: 1 1 45%; }
	.ab1_num { font-size: 22px; }
}


/* ================= 产品中心 fp_box_2 ================= */
.fp_box_2 {
	position: relative;
	width: 100%;
	height: 1120px;
	overflow: hidden;
}
/* 可切换背景层 */
.pc_bgs {
	position: absolute;
	inset: 0;
	z-index: 0;
}
.pc_bg {
	position: absolute;
	inset: 0;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	opacity: 0;
	transition: opacity .8s ease;
}
.pc_bg.active { opacity: 1; }
.fp_box_2 .container {
	position: relative;
	z-index: 1;
	height: 100%;
	padding-top: 90px;
	padding-bottom: 60px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

/* ---- 顶部标题 ---- */
.pc_head { color: #fff; }
.pc_title { margin-bottom: 34px; }
.pc_title img {
	display: block;
	width: auto;
	max-width: 100%;
}
.pc_sub {
	font-size: 30px;
	font-weight: 600;
	color: #fff;
	line-height: 1.55;
	letter-spacing: 1px;
}

/* ---- 4 个产品面板 ---- */
.pc_list {
	display: flex;
	align-items: flex-end;
	min-height: 560px;
	gap: 20px;
	perspective: 1000px;
}
.pc_item {
	position: relative;
	width: 400px;
	height: 205px;
	background: rgba(255, 255, 255, 0.7);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	border: 1px solid rgba(255, 255, 255, 0.32);
	color: #fff;
	overflow: hidden;
	cursor: pointer;
	transform-origin: center bottom;
	transition: height .55s cubic-bezier(.22, 1, .36, 1),
	            background .45s ease,
	            border-color .45s ease,
	            box-shadow .5s ease,
	            transform .55s cubic-bezier(.22, 1, .36, 1);
}
/* 顶部装饰亮线：hover 时从中间向两侧展开 */
.pc_item::after {
	content: "";
	position: absolute;
	top: 0;
	left: 50%;
	width: 0;
	height: 3px;
	background: linear-gradient(90deg, transparent, #2d8ac0, transparent);
	transform: translateX(-50%);
	transition: width .6s cubic-bezier(.22, 1, .36, 1) .05s;
	z-index: 3;
}

/* ---- 默认层（覆盖整个面板） ---- */
.pc_default {
	position: absolute;
	inset: 0;
	padding: 30px 30px 24px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	opacity: 1;
	transition: opacity .3s ease;
	z-index: 2;
}
.pc_default h4 {
	font-size: 22px;
	font-weight: 700;
	color: #2d8ac0;
	margin: 0 0 14px;
	letter-spacing: 1px;
}
.pc_default p {
	font-size: 14px;
	line-height: 24px;
	color: #2d8ac0;
	margin: 0;
}
.pc_num--sm {
	position: absolute;
	right: 26px;
	bottom: 20px;
	font-size: 28px;
	font-weight: 700;
	color: #2d8ac0;
	line-height: 1;
	letter-spacing: 1px;
	font-family: "Helvetica Neue", Arial, sans-serif;
}

/* ---- 展开层（默认隐藏，hover 时显示） ---- */
.pc_detail {
	position: absolute;
	inset: 0;
	padding: 36px 2px 22px 18px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	opacity: 0;
	visibility: hidden;
	transform: translateY(24px);
	transition: opacity .35s ease,
	            transform .5s cubic-bezier(.22, 1, .36, 1),
	            visibility .5s;
	z-index: 1;
}

.pc_groups {
	flex: 1;
	overflow-y: auto;
	overflow-x: hidden;
	padding-right: 6px;
}
/* 细滚动条 */
.pc_groups::-webkit-scrollbar { width: 4px; }
.pc_groups::-webkit-scrollbar-thumb {
	background: rgba(45, 138, 192, .35);
	border-radius: 2px;
}
.pc_groups::-webkit-scrollbar-track { background: transparent; }
.pc_group + .pc_group { margin-top: 22px; }
.pc_group h5 {
	position: relative;
	padding-left: 20px;
	font-size: 17px;
	font-weight: 700;
	color: #2d8ac0;
	line-height: 1.3;
	margin: 0 0 14px;
	letter-spacing: .5px;
	opacity: 0;
	transform: translateY(10px);
	transition: opacity .4s ease, transform .4s ease;
}
.pc_group h5::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: #2d8ac0;
}
.pc_group ul { padding: 0; margin: 0; list-style: none; }
.pc_group ul li {
	position: relative;
	padding-left: 30px;
	font-size: 14px;
	line-height: 24px;
	margin-bottom: 10px;
	margin-top: 10px;
	color: #393939;
	opacity: 0;
	transform: translateY(8px);
	transition: opacity .35s ease, transform .35s ease;
}
.pc_group ul li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 18px;
	height: 18px;
	margin-top: -9px;
	border: 1px solid #b8ccd6;
	border-radius: 50%;
	background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232d8ac0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='9 6 15 12 9 18'/></svg>") no-repeat center center;
	background-size: 10px 10px;
}

/* 底部：了解详情 + 大数字 */
.pc_foot {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	margin-top: 20px;
	opacity: 0;
	transform: translateY(10px);
	transition: opacity .4s ease, transform .4s ease;
}
.pc_more {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-size: 22px;
	font-weight: 400;
	color: #393939;
	line-height: 1;
	transition: color .3s ease, transform .3s ease;
}
.pc_more img {
	width: 22px;
	height: 22px;
	object-fit: contain;
	transition: transform .35s cubic-bezier(.22, 1, .36, 1);
}
.pc_more:hover {
	color: #2d8ac0;
}
.pc_more:hover img {
	transform: translate(6px, -6px);
}
.pc_num--lg {
	font-size: 60px;
	font-weight: 700;
	color: #2d8ac0;
	line-height: 1;
	letter-spacing: 1px;
	font-family: "Helvetica Neue", Arial, sans-serif;
}

/* ---- 展开态（点击 active） ---- */
.pc_item.active {
	height: 560px;
	background: rgba(255, 255, 255, 0.7);
	border-color: transparent;
	box-shadow: 0 30px 70px rgba(0, 0, 0, .22),
	            0 10px 24px rgba(45, 138, 192, .12);
}
.pc_item.active::after { width: 100%; }

.pc_item.active .pc_default {
	opacity: 0;
	pointer-events: none;
}
.pc_item.active .pc_detail {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
	transition-delay: .08s;
	z-index: 2;
}

/* 内部元素错落进入 */
.pc_item.active .pc_group h5 {
	opacity: 1;
	transform: translateY(0);
	transition-delay: .18s;
}
.pc_item.active .pc_group + .pc_group h5 {
	transition-delay: .34s;
}
.pc_item.active .pc_group:first-child ul li:nth-child(1) { transition-delay: .22s; }
.pc_item.active .pc_group:first-child ul li:nth-child(2) { transition-delay: .26s; }
.pc_item.active .pc_group:first-child ul li:nth-child(3) { transition-delay: .30s; }
.pc_item.active .pc_group:first-child ul li:nth-child(4) { transition-delay: .34s; }
.pc_item.active .pc_group + .pc_group ul li:nth-child(1) { transition-delay: .38s; }
.pc_item.active .pc_group + .pc_group ul li:nth-child(2) { transition-delay: .42s; }
.pc_item.active .pc_group + .pc_group ul li:nth-child(3) { transition-delay: .46s; }
.pc_item.active .pc_group + .pc_group ul li:nth-child(4) { transition-delay: .50s; }

.pc_item.active .pc_group ul li {
	opacity: 1;
	transform: translateY(0);
}
.pc_item.active .pc_foot {
	opacity: 1;
	transform: translateY(0);
	transition-delay: .52s;
}

/* ---- 响应式 ---- */
@media (max-width: 1720px) {
	.pc_item { width: 370px; }
}
@media (max-width: 1600px) {
	.pc_item { width: 340px; }
	.pc_sub { font-size: 26px; }
	.pc_num--lg { font-size: 54px; }
}
@media (max-width: 1400px) {
	.fp_box_2 { height: 1000px; }
	.pc_list { gap: 16px; min-height: 520px; }
	.pc_item { width: calc((100% - 48px) / 4); height: 200px; }
	.pc_default { padding: 24px 22px 20px; }
	.pc_detail { padding: 30px 26px 22px; }
	.pc_default h4 { font-size: 19px; }
	.pc_item.active { height: 520px; }
	.pc_sub { font-size: 22px; }
	.pc_group h5 { font-size: 18px; }
	.pc_group ul li { font-size: 15px; line-height: 32px; }
	.pc_more { font-size: 22px; }
	.pc_num--lg { font-size: 48px; }
}
@media (max-width: 1200px) {
	.fp_box_2 { height: 900px; }
	.pc_sub { font-size: 20px; }
	.pc_default { padding: 20px 18px; }
	.pc_detail { padding: 24px 22px 20px; }
	.pc_item { height: 190px; }
	.pc_default h4 { font-size: 17px; margin-bottom: 10px; }
	.pc_default p { font-size: 13px; line-height: 22px; }
	.pc_item.active { height: 480px; }
	.pc_group h5 { font-size: 16px; margin-bottom: 10px; }
	.pc_group ul li { font-size: 14px; line-height: 28px; padding-left: 26px; }
	.pc_group ul li::before { width: 16px; height: 16px; margin-top: -8px; }
	.pc_more { font-size: 20px; }
	.pc_num--sm { font-size: 24px; right: 20px; bottom: 16px; }
	.pc_num--lg { font-size: 42px; }
}
@media (max-width: 1000px) {
	.fp_box_2 { height: auto; padding: 70px 0 60px; }
	.fp_box_2 .container { display: block; padding-top: 0; padding-bottom: 0; }
	.pc_head { margin-bottom: 40px; }
	.pc_sub { font-size: 18px; }
	.pc_list { flex-wrap: wrap; gap: 14px; }
	.pc_item { width: calc((100% - 14px) / 2); height: 210px; }
	.pc_item.active { height: 480px; }
}
@media (max-width: 768px) {
	/* 背景铺满整块，不再裁切留白 */
	.fp_box_2 {
		padding: 20px 0 20px;
	background: linear-gradient(to bottom, #2d8ac0, #a2ddff);
	}
	/* 手机端不启用背景切换 */
	.pc_bgs { display: none; }
	.pc_title img { height: 30px; }
	.pc_sub { font-size: 15px; }
	.pc_list { min-height: 0; gap: 14px; }

	/* 手机端所有面板默认就是"展开态"：白底 + 详细内容 */
	.pc_item {
		width: 100%;
		height: auto;
		background: #fff;
		border-color: transparent;
		box-shadow: 0 10px 30px rgba(0, 0, 0, .08);
		transform: none;
	}
	.pc_item::before { opacity: 1; }
	.pc_item .pc_default { display: none; }
	.pc_item .pc_detail {
		position: relative;
		opacity: 1;
		visibility: visible;
		transform: none;
		padding: 24px 20px 20px;
	}
	.pc_item.active { height: auto; min-height: 0; transform: none; box-shadow: 0 10px 30px rgba(0, 0, 0, .08); }

	/* 缩小内部字号 */
	.pc_group h5 { font-size: 16px; margin-bottom: 10px; padding-left: 16px; }
	.pc_group h5::before { width: 8px; height: 8px; }
	.pc_group ul li { font-size: 13px; line-height: 26px; padding-left: 22px; }
	.pc_group ul li::before { width: 14px; height: 14px; margin-top: -7px; background-size: 8px 8px; }
	.pc_group + .pc_group { margin-top: 16px; }

	.pc_foot { margin-top: 14px; opacity: 1; transform: none; }
	.pc_more { font-size: 15px; gap: 8px; }
	.pc_more img { width: 16px; height: 16px; }
	.pc_num--sm { display: none; }
	.pc_num--lg { font-size: 34px; }

	/* 手机端所有入场动画关闭，元素直接可见 */
	.pc_item .pc_group h5,
	.pc_item .pc_group ul li,
	.pc_item .pc_foot { opacity: 1 !important; transform: none !important; animation: none !important; }
}
@media (max-width: 480px) {
	.pc_head { margin-bottom: 30px; }
	.pc_title { margin-bottom: 20px; }
	.pc_title img { height: 50px; }
	.pc_sub { font-size: 13px; }
	.pc_item .pc_detail { padding: 20px 16px 16px; }
	.pc_group h5 { font-size: 15px; }
	.pc_group ul li { font-size: 12px; line-height: 24px; }
	.pc_more { font-size: 14px; }
	.pc_num--lg { font-size: 28px; }
}


/* ================= 优势卡片 fp_box_3 ================= */
.fp_box_3 {
	position: relative;
	width: 100%;
	padding: 90px 0 120px;
	background:  url('../images/bg2.png') no-repeat center bottom;
	background-size: 100% auto;
	overflow: visible;
}
/* 右上角装饰背景图，向上溢出到 fp_box_2 区域 */
.fp_box_3::after {
	opacity: 0;
	content: "";
	position: absolute;
	top: -50px;
	right: 0;
	z-index: 5;
	width: 480px;
	height: 480px;
	background: url('../images/bg1.png') no-repeat right top;
	background-size: contain;
	pointer-events: none;
}

/* ---- 标题 ---- */
.fp3_title {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	margin-bottom: 70px;
	color: #1f2a44;
	font-size: 30px;
	font-weight: 700;
	letter-spacing: 1px;
}
.fp3_title_ico {
	height: 60px;
	width: auto;
	display: block;
	transform: translateY(2px);
}
.fp3_title span {
	position: relative;
	z-index: 1;
	margin-left: -46px;
	padding-left: 4px;
}

/* ---- 卡片轮播 ---- */
/* 外层容器：负责定位箭头 */
.fp3_wrap {
	position: relative;
}
/* swiper 本体左右收窄，让出箭头位置，且不会露出溢出的 slide */
.fp3_swiper {
	position: relative;
	overflow: hidden;
	margin: 0 70px;
}
.fp3_card {
	--lift: 320px; /* hover 时文字上移距离 */
	position: relative;
	height: 500px;
	cursor: pointer;
	overflow: hidden;
	border-radius: 20px;
	box-sizing: border-box;
}

/* 左右箭头 */
.fp3_prev,
.fp3_next {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 10;
	width: 50px;
	height: 50px;
	border: 1px solid #c9d3de;
	border-radius: 50%;
	background: #fff;
	cursor: pointer;
	transition: all .3s ease;
}
.fp3_prev { left: 0; }
.fp3_next { right: 0; }
.fp3_prev::after,
.fp3_next::after {
	content: "";
	position: absolute;
	top: 50%;
	width: 11px;
	height: 11px;
	border-top: 2px solid #6b7787;
	border-right: 2px solid #6b7787;
	transition: border-color .3s ease;
}
.fp3_prev::after {
	left: 55%;
	transform: translate(-50%, -50%) rotate(-135deg);
}
.fp3_next::after {
	left: 45%;
	transform: translate(-50%, -50%) rotate(45deg);
}
.fp3_prev:hover,
.fp3_next:hover {
	background: #2d8ac0;
	border-color: #2d8ac0;
}
.fp3_prev:hover::after,
.fp3_next:hover::after {
	border-top-color: #fff;
	border-right-color: #fff;
}

/* 图片层 */
.fp3_pic {
	position: absolute;
	inset: 0;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	
}

/* 灰色透明遮罩层：默认淡一层保证白字可读，hover 时加深 */
.fp3_mask {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(8, 13, 26, .62) 0%, rgba(8, 13, 26, .92) 100%);
	opacity: 0;
	transition: opacity .45s ease;
}
.fp3_card:hover .fp3_mask { opacity: 1; }

/* 文字内容：默认只显示标题(贴底)，hover 时整体上移到中上位置 */
.fp3_body {
	position: absolute;
	left: 30px;
	right: 30px;
	bottom: 34px;
	z-index: 2;
	color: #fff;
	transform: translateY(0);
	transition: transform .55s cubic-bezier(.22, 1, .36, 1);
}
.fp3_card:hover .fp3_body {
	transform: translateY(calc(-1 * var(--lift)));
}
.fp3_name {
	font-size: 20px;
	font-weight: 700;
	margin: 0;
	line-height: 1.4;
	letter-spacing: 1px;
}
.fp3_desc {
	max-width: 80%;
	margin: 16px 0 0;
	font-size: 14px;
	line-height: 26px;
	color: rgba(255, 255, 255, .9);
	opacity: 0;
	transform: translateY(14px);
	transition: opacity .45s ease .12s, transform .5s ease .12s;
}
.fp3_card:hover .fp3_desc {
	opacity: 1;
	transform: translateY(0);
}

/* 右下角箭头按钮：浮在凹弧缺口中，四周与图片留有透明间隔 */
.fp3_btn {
	position: absolute;
	right: 0;
	bottom: 0;
	z-index: 3;
	width: 56px;
	height: 56px;
	border-radius: 14px;
	background: #2d8ac0;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background .3s ease, transform .3s ease;
}
.fp3_btn svg {
	width: 26px;
	height: 26px;
	transition: transform .35s cubic-bezier(.22, 1, .36, 1);
}
.fp3_btn:hover {
	background: #1f7ab0;
	color: #fff;
}
.fp3_btn:hover svg { transform: translateX(3px); }

/* ---- 响应式 ---- */
@media (max-width: 1400px) {
	.fp3_card { height: 460px; --lift: 290px; }
	.fp3_title { font-size: 26px; }
	.fp3_title_ico { height: 54px; }
}
@media (max-width: 1200px) {
	.fp_box_3 { padding: 70px 0 100px; }
	.fp3_card { height: 420px; --lift: 260px; }
	.fp3_title { font-size: 24px; margin-bottom: 50px; }
	.fp3_title_ico { height: 48px; }
	.fp3_title span { margin-left: -38px; }
	.fp3_btn { width: 52px; height: 52px; }
	.fp3_btn svg { width: 22px; height: 22px; }
}
@media (max-width: 1000px) {
	.fp_box_3 { padding: 60px 0 90px; }
	.fp3_card { height: 380px; --lift: 230px; }
	.fp3_title { font-size: 22px; margin-bottom: 40px; }
	.fp3_title_ico { height: 44px; }
	.fp3_title span { margin-left: -34px; }
}
@media (max-width: 768px) {
	.fp_box_3 { padding: 30px 0 30px; background-size: 200% auto; }
	.fp3_card { height: 320px; --lift: 190px; --nr: 60px; }
	.fp3_swiper { margin: 0 46px; }
	.fp3_prev, .fp3_next { width: 36px; height: 36px; }
	.fp3_prev::after, .fp3_next::after { width: 9px; height: 9px; }
	.fp3_title { font-size: 18px; margin-bottom: 30px; }
	.fp3_title_ico { height: 36px; }
	.fp3_title span { margin-left: -28px; }
	/* 手机端默认展开：蒙层常驻，文字上下居中，字号稍大 */
	.fp3_mask { opacity: 1; }
	.fp3_body {
		left: 20px;
		right: 20px;
		top: 50%;
		bottom: auto;
		transform: translateY(-50%) !important;
		text-align: left;
	}
	.fp3_name { font-size: 19px; }
	.fp3_desc { font-size: 14px; line-height: 26px; margin-top: 12px; opacity: 1 !important; max-width: 100%; }
	.fp3_btn { width: 46px; height: 46px; right: 0; bottom: 0; border-radius: 12px; }
	.fp3_btn svg { width: 18px; height: 18px; }
}
@media (max-width: 480px) {
	.fp3_card { height: 340px; --lift: 200px; }
	.fp3_desc { max-width: 90%; }
}


/* ================= 技术积淀横幅 fp_box_4 ================= */
.fp_box_4 {
	width: 100%;
	background: #2d8ac0;
	padding: 26px 0;
	overflow: hidden;
}

/* ---- 通用跑马灯（可复用到其他页面） ---- */
.marquee {
	width: 100%;
	overflow: hidden;
}
.marquee_track {
	display: inline-flex;
	align-items: center;
	white-space: nowrap;
	will-change: transform;
}
.marquee_item {
	display: inline-block;
	padding-right: 80px;
	font-size: 30px;
	font-weight: 700;
	line-height: 1.5;
	color: #fff;
	letter-spacing: 1px;
	white-space: nowrap;
}

/* ---- 响应式 ---- */
@media (max-width: 1600px) {
	.marquee_item { font-size: 30px; }
}
@media (max-width: 1200px) {
	.marquee_item { font-size: 24px; padding-right: 60px; }
}
@media (max-width: 1000px) {
	.fp_box_4 { padding: 22px 0; }
	.marquee_item { font-size: 20px; padding-right: 50px; }
}
@media (max-width: 768px) {
	.fp_box_4 { padding: 18px 0; }
	.marquee_item { font-size: 16px; padding-right: 40px; }
}
@media (max-width: 480px) {
	.marquee_item { font-size: 14px; padding-right: 30px; }
}

/* ================= 新闻资讯 fp_box_5 ================= */
.fp_box_5 {
	width: 100%;
	background: #fff;
	padding: 90px 0 100px;
}

/* ---- 标题 ---- */
.fp5_title {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0 0 40px;
	color: #1f2a44;
	font-size: 30px;
	font-weight: 700;
}
.fp5_title_ico {
	height: 60px;
	width: auto;
	display: block;
}
.fp5_title span {
	margin-left: -44px;
	position: relative;
}

/* ---- 主区：左头条 + 右图 ---- */
.fp5_top {
	display: flex;
	gap: 60px;
	align-items: stretch;
	padding-bottom: 40px;
	border-bottom: 1px solid #e8ebf0;
	margin-bottom: 30px;
}
.fp5_lead {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	padding-top: 6px;
}
.fp5_lead_head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 20px;
	margin-bottom: 22px;
}
.fp5_lead_title {
	font-size: 22px;
	font-weight: 700;
	color: #1f2a44;
	margin: 0;
	line-height: 1.5;
	transition: color .3s ease;
}
.fp5_lead:hover .fp5_lead_title {
	color: #2d8ac0;
}
.fp5_date {
	flex-shrink: 0;
	font-size: 15px;
	color: #9aa3b2;
	font-family: Arial, sans-serif;
}
.fp5_lead_desc {
	font-size: 15px;
	line-height: 30px;
	color: #7a8493;
	margin: 0 0 auto;
	display: -webkit-box;
	-webkit-line-clamp: 4;
	line-clamp: 4;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* 查看更多：左右结构 + 边线 + 中间分隔 */
.fp5_more {
	align-self: flex-start;
	display: inline-flex;
	align-items: stretch;
	margin-top: 34px;
	border: 1px solid #d2d8e0;
	color: #7a8493;
	transition: all .3s ease;
}
.fp5_more span {
	display: flex;
	align-items: center;
	padding: 0 26px;
	height: 44px;
	font-size: 14px;
	letter-spacing: 1px;
}
.fp5_more i {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-left: 1px solid #d2d8e0;
	font-style: normal;
	font-size: 15px;
	transition: all .3s ease;
}
.fp5_more:hover {
	border-color: #2d8ac0;
	color: #fff;
}
.fp5_more:hover span {
	background: #2d8ac0;
	color: #fff;
}
.fp5_more:hover i {
	background: #2d8ac0;
	border-left-color: rgba(255, 255, 255, .4);
	color: #fff;
}

/* 右侧图片 */
.fp5_pic {
	flex-shrink: 0;
	width: 500px;
	display: block;
	overflow: hidden;
}
.fp5_pic img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .6s cubic-bezier(.22, 1, .36, 1);
}
.fp5_pic:hover img {
	transform: scale(1.05);
}

/* ---- 底部 4 条新闻，两列两行 ---- */
.fp5_list {
	position: relative;
	display: flex;
	flex-wrap: wrap;
}
/* 中间竖线：只在两行之间，不贴顶不贴底横线 */
.fp5_list::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 22px;
	bottom: 22px;
	width: 1px;
	background: #eef1f5;
	pointer-events: none;
	opacity: 0;
}
.fp5_list li {
	width: 50%;
	box-sizing: border-box;
	border-bottom: 1px solid #eef1f5;
}
.fp5_list li:nth-child(odd) a {
	padding-right: 40px;
}
.fp5_list li:nth-child(even) a {
	padding-left: 40px;
}
.fp5_list li a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	padding: 22px 0;
}
.fp5_item_title {
	position: relative;
	min-width: 0;
	font-size: 16px;
	color: #4a5464;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	transition: color .3s ease;
}

.fp5_list li a:hover .fp5_item_title {
	color: #2d8ac0;
}


/* ---- 响应式 ---- */
@media (max-width: 1400px) {
	.fp5_pic { width: 440px; }
	.fp5_top { gap: 40px; }
	.fp5_list { column-gap: 60px; }
	.fp5_list li { width: calc(50% - 30px); }
}
@media (max-width: 1200px) {
	.fp_box_5 { padding: 70px 0 80px; }
	.fp5_pic { width: 380px; }
	.fp5_lead_title { font-size: 20px; }
	.fp5_title_ico { height: 52px; }
	.fp5_title span { margin-left: -40px; }
}
@media (max-width: 1000px) {
	.fp5_top { flex-direction: column; gap: 26px; }
	.fp5_pic { width: 100%; height: 300px; order: -1; }
	.fp5_list { column-gap: 0; }
	.fp5_list::before { display: none; }
	.fp5_list li { width: 100%; }
	.fp5_list li:nth-child(odd) a { padding-right: 0; }
	.fp5_list li:nth-child(even) a { padding-left: 0; }
}
@media (max-width: 768px) {
	.fp_box_5 { padding: 50px 0 60px; }
	.fp5_title { font-size: 22px; margin-bottom: 30px; }
	.fp5_title_ico { height: 44px; }
	.fp5_title span { margin-left: -34px; }
	.fp5_lead_head { flex-direction: column; gap: 6px; margin-bottom: 16px; }
	.fp5_lead_title { font-size: 18px; }
	.fp5_lead_desc { font-size: 14px; line-height: 26px; -webkit-line-clamp: 3; line-clamp: 3; }
	.fp5_date { font-size: 13px; }
	.fp5_pic { height: 220px; }
	.fp5_item_title { font-size: 14px; }
	.fp5_list li a { padding: 16px 0; }
}
@media (max-width: 480px) {
	.fp5_more span { padding: 0 20px; height: 40px; }
	.fp5_more i { width: 40px; height: 40px; }
}


/* ================= 联系我们 fp_box_6 ================= */
.fp_box_6 {
	width: 100%;
	background: #f7f7f7;
	padding: 60px 0;
}
.fp6_form {
	display: block;
}
.fp6_title {
	font-size: 24px;
	font-weight: 700;
	color: #1f2a44;
	margin: 0 0 28px;
	text-align: center;
}
.fp6_row {
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: nowrap;
}
.fp6_field {
	position: relative;
	flex: 1;
	min-width: 0;
}
.fp6_field input {
	width: 100%;
	height: 46px;
	padding: 0 34px 0 18px;
	background: #fff;
	border: 1px solid #e6e8ec;
	border-radius: 4px;
	font-size: 14px;
	color: #1f2a44;
	outline: none;
	transition: border-color .3s ease, box-shadow .3s ease;
}
.fp6_field input::placeholder {
	color: #9099a6;
}
.fp6_field input:focus {
	border-color: #2d8ac0;
	box-shadow: 0 0 0 3px rgba(45, 138, 192, .12);
}
.fp6_star {
	position: absolute;
	left: 100px;
	top: 50%;
	transform: translateY(-50%);
	color: #e74c3c;
	font-size: 14px;
	pointer-events: none;
}
/* 星号跟在 placeholder 文字末尾：用 JS 定位不方便,这里改用 input 内嵌的方式 —— 
   实际视觉上让星号出现在 placeholder 尾部,使用绝对定位 + 靠占位内容长度估算是不稳的。
   改用 :placeholder-shown 时显示星号在输入框内部右上角小圆点位置更稳。*/
.fp6_star {
	left: auto;
	right: 14px;
	top: 50%;
	transform: translateY(-50%);
	color: #e74c3c;
	font-size: 16px;
	font-weight: 700;
	line-height: 1;
}
/* 输入后隐藏星号 */
.fp6_field input:not(:placeholder-shown) + .fp6_star {
	display: none;
}
.fp6_submit {
	flex-shrink: 0;
	height: 46px;
	padding: 0 34px;
	background: #2d8ac0;
	color: #fff;
	border: none;
	border-radius: 4px;
	font-size: 15px;
	font-weight: 500;
	letter-spacing: 2px;
	cursor: pointer;
	transition: background .3s ease, transform .2s ease;
}
.fp6_submit:hover {
	background: #1f7ab0;
}
.fp6_submit:active {
	transform: translateY(1px);
}

/* ---- 响应式 ---- */
@media (max-width: 1400px) {
	.fp6_form { gap: 16px; }
	.fp6_row { gap: 10px; }
	.fp6_title { font-size: 20px; }
	.fp6_field input { padding: 0 30px 0 14px; font-size: 13px; }
	.fp6_submit { padding: 0 26px; font-size: 14px; }
}
@media (max-width: 1200px) {
	.fp_box_6 { padding: 50px 0; }
	.fp6_title { margin-bottom: 24px; }
	.fp6_row { flex-wrap: wrap; }
	.fp6_field { flex: 1 1 calc(33.33% - 10px); }
	.fp6_field--wide { flex: 1 1 100%; }
	.fp6_submit { width: 100%; }
}
@media (max-width: 768px) {
	.fp_box_6 { padding: 40px 0; }
	.fp6_title { font-size: 18px; }
	.fp6_field { flex: 1 1 100%; }
	.fp6_field input { height: 44px; }
	.fp6_submit { height: 44px; }
}


/* ================= 页脚 footer ================= */
.ft {
	width: 100%;
	background: #343434;
	color: #b5b5b5;
}
.ft_top {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 60px;
	padding-top: 60px;
	padding-bottom: 60px;
}

/* 左侧品牌区 */
.ft_brand {
	flex-shrink: 0;
	max-width: 340px;
}
.ft_logo {
	display: block;
	height: 46px;
	width: auto;
	margin-bottom: 26px;
}
.ft_contact {
	list-style: none;
	padding: 0;
	margin: 0;
}
.ft_contact li {
	font-size: 14px;
	line-height: 30px;
	color: #b5b5b5;
}
.ft_contact li span {
	color: #b5b5b5;
	margin-right: 4px;
}

/* 右侧导航 */
.ft_nav {
	flex: 1;
	display: flex;
	justify-content: space-between;
	gap: 40px;
}
.ft_col h4 {
	font-size: 15px;
	font-weight: 700;
	color: #fff;
	margin: 0 0 22px;
}
.ft_col ul {
	list-style: none;
	padding: 0;
	margin: 0;
}
.ft_col ul li {
	line-height: 30px;
}
.ft_col ul li a {
	font-size: 14px;
	color: #9a9a9a;
	transition: color .3s ease;
}
.ft_col ul li a:hover {
	color: #fff;
}

/* 底部版权栏 */
.ft_bar {
	border-top: 1px solid rgba(255, 255, 255, .08);
	background: #343434;
}
.ft_bar_inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-top: 22px;
	padding-bottom: 22px;
	gap: 20px;
	flex-wrap: wrap;
}
.ft_copy,
.ft_icp {
	margin: 0;
	font-size: 13px;
	color: #8b8b8b;
	line-height: 1.6;
}
.ft_icp a {
	color: #8b8b8b;
	margin-left: 18px;
	transition: color .3s ease;
}
.ft_icp a:first-child { margin-left: 0; }
.ft_icp a:hover { color: #fff; }

/* ---- 响应式 ---- */
@media (max-width: 1400px) {
	.ft_top { gap: 40px; }
	.ft_nav { gap: 28px; }
}
@media (max-width: 1200px) {
	.ft_top { flex-direction: column; gap: 40px; padding-top: 50px; padding-bottom: 50px; }
	.ft_brand { max-width: 100%; }
	.ft_nav { width: 100%; }
}
@media (max-width: 1000px) {
	/* 手机端：右侧 6 列导航用浮动一行放 2 个（共 3 排） */
	.ft_nav { display: block; }
	.ft_nav::after { content: ""; display: block; clear: both; }
	.ft_col {
		float: left;
		width: 50%;
		min-height: 200px; /* 锁最小高度，避免不同栏目条目数不同造成乱版 */
		box-sizing: border-box;
		padding-right: 20px;
	}
}
@media (max-width: 768px) {
	.ft_top { gap: 30px; padding-top: 40px; padding-bottom: 0px; }
	.ft_logo { height: 40px; margin-bottom: 20px; }
	.ft_contact li { font-size: 13px; line-height: 26px; }
	.ft_col { min-height: 180px; padding-right: 14px; }
	.ft_col h4 { margin-bottom: 14px; font-size: 14px; }
	.ft_col ul li { line-height: 26px; }
	.ft_col ul li a { font-size: 13px; }
	.ft_bar_inner { flex-direction: column; align-items: flex-start; padding-top: 16px; padding-bottom: 16px; }
	.ft_copy, .ft_icp { font-size: 12px; }
	.ft_icp a { margin-left: 12px; }
}
@media (max-width: 480px) {
	.ft_col { min-height: 200px; padding-right: 10px; }
	.ft_icp a { display: inline-block; margin: 0 12px 4px 0; }
}


/* ================= 内页通用：产品列表页 ================= */
.pro_page {
	width: 100%;
	background: #fff;
	padding-top: 70px;
	padding-bottom: 80px;
	min-height: 300px;
}
@media (max-width: 1000px) {
	.pro_page { padding-top: 50px; padding-bottom: 60px; }
}
@media (max-width: 768px) {
	.pro_page { padding-top: 40px; padding-bottom: 50px; }
}


/* ================= 子页面 Banner ================= */
.sub_banner {
	position: relative;
	width: 100%;
	overflow: hidden;
	/* 避开固定头部 */
	margin-top: 100px;
}



.sub_banner2 {
	position: relative;
	width: 100%;
	overflow: hidden;
	/* 避开固定头部 */
	margin-top: 70px;
}




/* PC：图片原始比例撑开高度 */
.sub_banner_bg {
	display: block;
	width: 100%;
	height: auto;
}
/* 文字层：限制在版心内，左对齐、垂直居中 */
.sub_banner_inner {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	height: auto;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	z-index: 2;
}
.sub_banner_txt {
	color: #fff;
}
.sub_banner_cn {
	display: flex;
	align-items: center;
	gap: 14px;
	font-size: 24px;
	font-weight: 500;
	letter-spacing: 2px;
	margin: 0 0 10px;
	color: #fff;
}
/* 中文标题后的短横线 */
.sub_banner_cn i {
	display: inline-block;
	width: 40px;
	height: 1px;
	background: #fff;
}
.sub_banner_en {
	font-size: 30px;
	font-weight: 400;
	letter-spacing: 2px;
	margin: 0;
	color: #fff;
	text-transform: uppercase;
}

/* ---- 响应式 ---- */
@media (max-width: 1400px) {
	.sub_banner_cn { font-size: 22px; }
	.sub_banner_en { font-size: 26px; }
}
@media (max-width: 1000px) {
	.sub_banner { margin-top: 90px; }
	.sub_banner_cn { font-size: 20px; }
	.sub_banner_en { font-size: 22px; }
}
/* 手机端：固定高度 250px，图片裁切填充 */
@media (max-width: 768px) {
	.sub_banner { height: 250px; margin-top: 70px; }
	.sub_banner2 { height: 250px; margin-top: 50px; }
	.sub_banner_bg {
		height: 100%;
		object-fit: cover;
	}
	.sub_banner_cn { font-size: 18px; gap: 10px; margin-bottom: 6px; }
	.sub_banner_cn i { width: 28px; }
	.sub_banner_en { font-size: 18px; letter-spacing: 1px; }
}
@media (max-width: 480px) {
	.sub_banner_cn { font-size: 16px; }
	.sub_banner_en { font-size: 15px; }
}


/* ================= 面包屑 mbx_box_1 ================= */
.mbx_box_1 {
	width: 100%;
	height: 40px;
	background: #f7f7f7;
}
.mbx_inner {
	height: 100%;
	display: flex;
	align-items: center;
	gap: 8px;
	white-space: nowrap;
	overflow-x: auto;
}
.mbx_inner::-webkit-scrollbar { display: none; }

/* home 图标 */
.mbx_home {
	display: inline-flex;
	align-items: center;
	flex-shrink: 0;
	margin-right: 2px;
}
.mbx_home img {
	width: 15px;
	height: auto;
	display: block;
}

/* 链接 */
.mbx_inner a {
	font-size: 13px;
	color: #666;
	transition: color .3s ease;
	flex-shrink: 0;
}
.mbx_inner a:hover { color: #2d8ac0; }

/* 分隔符 */
.mbx_sep {
	font-style: normal;
	font-size: 12px;
	color: #b5b5b5;
	flex-shrink: 0;
	margin: 0 2px;
}

/* 当前页 */
.mbx_now {
	font-size: 13px;
	color: #666;
	flex-shrink: 0;
}

/* ---- 响应式 ---- */
@media (max-width: 768px) {
	.mbx_inner a,
	.mbx_now { font-size: 12px; }
	.mbx_home img { width: 13px; }
	.mbx_inner { gap: 6px; }
}


/* ================= 产品列表 + 侧边分类 list_box_1 ================= */
.list_box_1 {
	display: flex;
	align-items: stretch;
	width: 100%;
}

/* ---------- 左侧：产品卡片区 ---------- */
.lb1_left {
	flex: 1;
	min-width: 0;
	background: #e6e6e6;
	padding: 60px 100px;
}
.lb1_grid {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px;
}
.lb1_card {
	position: relative;
	background: #fff;
	display: flex;
	flex-direction: column;
	transition: box-shadow .35s ease, transform .35s ease;
}
.lb1_card:hover {
	box-shadow: 0 16px 40px rgba(0, 0, 0, .1);
	transform: translateY(-4px);
}

/* 右上角箭头 */
.lb1_arrow {
	position: absolute;
	right: 18px;
	top: 18px;
	z-index: 2;
	width: 26px;
	height: 26px;
	color: #b9c0c9;
	transition: color .3s ease;
}
.lb1_arrow svg { width: 100%; height: 100%; display: block; }
.lb1_card:hover .lb1_arrow { color: #2d8ac0; }

/* 产品图 */
.lb1_pic {
	height: 190px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 34px 24px 10px;
}
.lb1_pic img {
	max-width: 78%;
	max-height: 100%;
	object-fit: contain;
	display: block;
	transition: transform .45s ease;
}
.lb1_card:hover .lb1_pic img { transform: scale(1.06); }

/* 标题 */
.lb1_head {
	text-align: center;
	padding: 0 20px 22px;
	border-bottom: 1px solid #eef0f3;
}
.lb1_head h3 {
	font-size: 17px;
	font-weight: 700;
	color: #1f2a44;
	margin: 0 0 6px;
	letter-spacing: .5px;
}
.lb1_head p {
	font-size: 13px;
	color: #1f2a44;
	margin: 0;
	line-height: 1.5;
}

/* 参数列表 */
.lb1_params {
	list-style: none;
	padding: 22px 24px 0;
	margin: 0 0 auto;
}
.lb1_params li {
	position: relative;
	padding-left: 14px;
	font-size: 12px;
	line-height: 26px;
	color: #7a8493;
}
.lb1_params li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 11px;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: #b9c0c9;
}

/* 按钮 */
.lb1_btn {
	display: block;
	margin: 24px 24px 26px;
	height: 40px;
	line-height: 38px;
	text-align: center;
	font-size: 13px;
	color: #8a93a0;
	border: 1px solid #e2e5ea;
	transition: all .3s ease;
}
.lb1_btn:hover {
	background: #2d8ac0;
	border-color: #2d8ac0;
	color: #fff;
}

/* 分页 */
.lb1_page {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin-top: 50px;
}
.lb1_pg {
	min-width: 30px;
	height: 30px;
	padding: 0 8px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 13px;
	color: #7a8493;
	background: #fff;
	border: 1px solid #e2e5ea;
	transition: all .3s ease;
}
.lb1_pg:hover,
.lb1_pg.active {
	background: #2d8ac0;
	border-color: #2d8ac0;
	color: #fff;
}

/* ---------- 右侧：分类手风琴 ---------- */
.lb1_side {
	flex: 0 0 300px;
	background: #f5f6fb;
}
.lb1_acc { width: 100%; }

/* 标题条 */
.lb1_tt {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	height: 44px;
	padding: 0 22px;
	background: #7a7a7a;
	color: #fff;
	font-size: 14px;
	cursor: pointer;
	transition: background .3s ease;
	border-bottom: 1px solid rgba(255, 255, 255, .12);
}
.lb1_tt:hover { background: #6c6c6c; }
.lb1_item.open .lb1_tt { background: #2d8ac0; }

/* +/- 图标 */
.lb1_tt i {
	position: relative;
	flex-shrink: 0;
	width: 14px;
	height: 14px;
}
.lb1_tt i::before,
.lb1_tt i::after {
	content: "";
	position: absolute;
	background: #fff;
	transition: opacity .3s ease, transform .3s ease;
}
.lb1_tt i::before {
	left: 0;
	top: 50%;
	width: 100%;
	height: 1.5px;
	transform: translateY(-50%);
}
.lb1_tt i::after {
	left: 50%;
	top: 0;
	width: 1.5px;
	height: 100%;
	transform: translateX(-50%);
}
.lb1_item.open .lb1_tt i::after { opacity: 0; }

/* 展开面板 */
.lb1_panel {
	display: none;
	padding: 26px 22px 10px;
}
.lb1_item.open .lb1_panel { display: block; }

.lb1_group + .lb1_group { margin-top: 26px; }
.lb1_group h4 {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 14px;
	font-weight: 700;
	color: #2d8ac0;
	margin: 0 0 14px;
	line-height: 1.4;
}
.lb1_group h4 em {
	flex-shrink: 0;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #2d8ac0;
}
.lb1_group ul {
	list-style: none;
	padding: 0;
	margin: 0;
}
.lb1_group ul li { margin-bottom: 4px; }
.lb1_group ul li a {
	position: relative;
	display: block;
	padding: 5px 0 5px 26px;
	font-size: 12.5px;
	line-height: 1.6;
	color: #7a8493;
	transition: color .3s ease;
}
/* 圆圈箭头小图标 */
.lb1_group ul li a::before {
	content: "";
	position: absolute;
	left: 0;
	top: 7px;
	width: 15px;
	height: 15px;
	border: 1px solid #cfd6de;
	border-radius: 50%;
	background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23aab3bd' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'><polyline points='9 6 15 12 9 18'/></svg>") no-repeat center center;
	background-size: 8px 8px;
	transition: all .3s ease;
}
.lb1_group ul li a:hover { color: #2d8ac0; }
.lb1_group ul li a:hover::before { border-color: #2d8ac0; }

/* ---------- 响应式 ---------- */
@media (max-width: 1600px) {
	.lb1_left { padding: 50px 70px; }
	.lb1_grid { gap: 24px; }
	.lb1_side { flex: 0 0 280px; }
}
@media (max-width: 1400px) {
	.lb1_left { padding: 44px 50px; }
	.lb1_grid { gap: 20px; }
	.lb1_side { flex: 0 0 260px; }
	.lb1_pic { height: 165px; padding: 28px 20px 8px; }
	.lb1_head h3 { font-size: 16px; }
}
@media (max-width: 1200px) {
	.lb1_left { padding: 40px 34px; }
	.lb1_grid { grid-template-columns: repeat(2, 1fr); }
	.lb1_side { flex: 0 0 240px; }
	.lb1_tt { padding: 0 16px; font-size: 13px; }
	.lb1_panel { padding: 20px 16px 8px; }
}
@media (max-width: 1000px) {
	/* 上下堆叠：分类放到列表上方 */
	.list_box_1 { flex-direction: column; }
	.lb1_side {
		flex: none;
		width: 100%;
		order: -1;
		display: none;
	}
	.lb1_left { padding: 34px 24px; }
	.lb1_grid { gap: 18px; }
	.lb1_page { margin-top: 34px; }
}
@media (max-width: 768px) {
	.lb1_left { padding: 26px 16px; }
	.lb1_grid { grid-template-columns: 1fr; gap: 16px; }
	.lb1_pic { height: 200px; padding: 30px 24px 10px; }
	.lb1_pic img { max-width: 62%; }
	.lb1_head { padding: 0 20px 20px; }
	.lb1_head h3 { font-size: 18px; }
	.lb1_head p { font-size: 13.5px; }
	.lb1_params { padding: 20px 22px 0; }
	.lb1_params li { font-size: 13px; line-height: 28px; }
	.lb1_btn { margin: 22px 22px 24px; height: 44px; line-height: 42px; font-size: 14px; }
	.lb1_arrow { width: 24px; height: 24px; right: 14px; top: 14px; }

	/* 手机端分类面板：压缩间距，尽量一屏可见 */
	.lb1_tt { height: 40px; font-size: 13px; padding: 0 16px; }
	.lb1_panel { padding: 14px 16px 8px; }
	.lb1_group + .lb1_group { margin-top: 14px; }
	.lb1_group h4 { font-size: 13px; margin-bottom: 8px; gap: 8px; }
	.lb1_group h4 em { width: 6px; height: 6px; }
	.lb1_group ul li { margin-bottom: 0; }
	.lb1_group ul li a {
		font-size: 12px;
		line-height: 1.4;
		padding: 4px 0 4px 22px;
	}
	.lb1_group ul li a::before {
		top: 5px;
		width: 13px;
		height: 13px;
		background-size: 7px 7px;
	}

	.lb1_page { gap: 8px; margin-top: 28px; }
	.lb1_pg { min-width: 28px; height: 28px; font-size: 12px; }
}
@media (max-width: 480px) {
	.lb1_left { padding: 20px 12px; }
	.lb1_pic { height: 180px; }
	.lb1_tt { height: 38px; font-size: 12.5px; padding: 0 14px; }
	.lb1_panel { padding: 12px 14px 6px; }
	.lb1_group + .lb1_group { margin-top: 12px; }
	.lb1_group h4 { font-size: 12.5px; margin-bottom: 6px; }
	.lb1_group ul li a { font-size: 11.5px; padding: 3px 0 3px 20px; }
	.lb1_group ul li a::before { top: 4px; width: 12px; height: 12px; background-size: 6px 6px; }
}


/* ================= 产品详情：概览区 left_box_1 ================= */
.left_box_1 {
	display: flex;
	align-items: flex-start;
	gap: 60px;
	background: #fff;
	padding: 50px;
	border-radius: 12px;   /* 板块圆角 */
}

/* ---------- 左：大小图联动 ---------- */
.pd_gallery {
	flex: 0 0 46%;
	max-width: 46%;
}
/* 大图 */
.pd_big {
	width: 100%;
	overflow: hidden;
	background: #fff;
	border-radius: 12px;
}
.pd_big .swiper-slide {
	height: 420px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
}
.pd_big .swiper-slide img {
	max-width: 90%;
	max-height: 100%;
	object-fit: contain;
	display: block;
}

/* 小图区 */
.pd_thumbs_wrap {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 24px;
}
.pd_thumbs {
	flex: 1;
	min-width: 0;
	overflow: hidden;
}
.pd_thumbs .swiper-slide {
	width: 72px;
	height: 72px;
	border: 1px solid #e5e8ec;
	border-radius: 10px;
	background: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 10px;
	cursor: pointer;
	box-sizing: border-box;
	overflow: hidden;
	transition: border-color .3s ease, box-shadow .3s ease;
}
.pd_thumbs .swiper-slide:hover {
	border-color: #bcd4e4;
}
.pd_thumbs .swiper-slide img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
	display: block;
}
/* 当前选中小图 */
.pd_thumbs .swiper-slide.active {
	border-color: #2d8ac0;
	box-shadow: 0 0 0 1px #2d8ac0 inset;
}

/* 小图左右箭头 */
.pd_tprev,
.pd_tnext {
	flex-shrink: 0;
	position: relative;
	width: 26px;
	height: 34px;
	border: 1px solid #e5e8ec;
	border-radius: 8px;
	background: #fff;
	cursor: pointer;
	transition: all .3s ease;
}
.pd_tprev::after,
.pd_tnext::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: 6px;
	height: 6px;
	border-top: 1.5px solid #b0b8c1;
	border-right: 1.5px solid #b0b8c1;
	transition: border-color .3s ease;
}
.pd_tprev::after { transform: translate(-50%, -50%) rotate(-135deg); }
.pd_tnext::after { transform: translate(-50%, -50%) rotate(45deg); }
.pd_tprev:hover,
.pd_tnext:hover { border-color: #2d8ac0; }
.pd_tprev:hover::after,
.pd_tnext:hover::after {
	border-top-color: #2d8ac0;
	border-right-color: #2d8ac0;
}

/* ---------- 右：产品信息 ---------- */
.pd_info {
	flex: 1;
	min-width: 0;
	padding-top: 6px;
}
.pd_name {
	font-size: 26px;
	font-weight: 700;
	color: #1f2a44;
	line-height: 1.4;
	margin: 0 0 30px;
}
.pd_block { margin-bottom: 28px; }
.pd_sub {
	font-size: 16px;
	font-weight: 700;
	color: #1f2a44;
	margin: 0 0 14px;
}
.pd_list {
	list-style: none;
	padding: 0;
	margin: 0;
}
.pd_list li {
	position: relative;
	padding-left: 18px;
	font-size: 14px;
	line-height: 32px;
	color: #4a5464;
}
.pd_list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 13px;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #8f98a4;
}

/* 按钮组 */
.pd_btns {
	display: flex;
	gap: 20px;
	margin-top: 34px;
}
.pd_btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 175px;
	height: 52px;
	font-size: 16px;
	color: #fff;
	transition: all .3s ease;
}
.pd_btn--blue { background: #4a9dd0; }
.pd_btn--blue:hover { background: #2d8ac0; color: #fff; }
.pd_btn--gray { background: #a9a9a9; }
.pd_btn--gray:hover { background: #8f8f8f; color: #fff; }

/* ---------- 响应式 ---------- */
@media (max-width: 1600px) {
	.left_box_1 { gap: 46px; padding: 44px; }
	.pd_name { font-size: 24px; }
	.pd_big .swiper-slide { height: 380px; }
}
@media (max-width: 1400px) {
	.left_box_1 { gap: 36px; padding: 36px; }
	.pd_name { font-size: 21px; margin-bottom: 24px; }
	.pd_big .swiper-slide { height: 330px; }
	.pd_thumbs .swiper-slide { width: 66px; height: 66px; }
	.pd_btn { min-width: 150px; height: 48px; font-size: 15px; }
}
@media (max-width: 1200px) {
	.left_box_1 { gap: 28px; padding: 30px; }
	.pd_gallery { flex: 0 0 44%; max-width: 44%; }
	.pd_name { font-size: 19px; }
	.pd_big .swiper-slide { height: 290px; }
	.pd_sub { font-size: 15px; }
	.pd_list li { font-size: 13px; line-height: 28px; }
	.pd_list li::before { top: 11px; }
	.pd_btns { gap: 14px; margin-top: 26px; }
	.pd_btn { min-width: 130px; height: 44px; font-size: 14px;  }
}
@media (max-width: 1000px) {
	/* 上下堆叠 */
	.left_box_1 { flex-direction: column; gap: 30px; padding: 26px; }
	.pd_gallery { flex: none; max-width: 100%; width: 100%; }
	.pd_info { width: 100%; padding-top: 0; }
	.pd_big .swiper-slide { height: 320px; }
}
@media (max-width: 768px) {
	.left_box_1 { padding: 20px 16px; gap: 24px; border-radius: 8px; }
	.pd_big .swiper-slide { height: 260px; padding: 10px; }
	.pd_thumbs_wrap { margin-top: 16px; gap: 8px; }
	.pd_thumbs .swiper-slide { width: 58px; height: 58px; padding: 8px; border-radius: 8px; }
	.pd_tprev, .pd_tnext { width: 22px; height: 30px; border-radius: 6px; }
	.pd_name { font-size: 17px; margin-bottom: 20px; }
	.pd_block { margin-bottom: 22px; }
	.pd_sub { font-size: 14px; margin-bottom: 10px; }
	.pd_list li { font-size: 13px; line-height: 26px; padding-left: 16px; }
	.pd_list li::before { top: 10px; width: 5px; height: 5px; }
	.pd_btns { gap: 12px; margin-top: 22px; }
	.pd_btn { flex: 1; min-width: 0; height: 42px; font-size: 14px; }
}
@media (max-width: 480px) {
	.pd_big .swiper-slide { height: 220px; }
	.pd_thumbs .swiper-slide { width: 50px; height: 50px; padding: 6px; }
	.pd_name { font-size: 16px; }
}


/* ================= 产品详情：Tab 切换区 left_box_2 ================= */
.left_box_2 {
	background: #e6e6e6;
	padding: 0 0 50px;
}

/* ===== 切换按钮 ===== */
.pd-tab {
  background: #e6e6e6;
  padding: 38px 60px 22px 0;   /* 底部留灰色间距，圆点不贴住下面的白色面板 */
}

.pd-tab-nav {
  display: inline-flex;   /* 靠左：宽度只包裹内容，不再平分整行 */
  margin: 0;
  padding: 0;
  list-style: none;
  position: relative;
}

/* 虚线：连接第一个到最后一个圆点（4 个等宽项，中心在 12.5% / 87.5%）
   bottom:7px + border-top:2px → 描边占 7~9px，中心 8px，正好穿过 16px 圆环的圆心 */
.pd-tab-nav::before {
  content: "";
  position: absolute;
  left: 12.5%;
  right: 12.5%;
  bottom: 7px;
  border-top: 2px dashed #fff;
  z-index: 0;
}

.pd-tab-item {
  width: 150px;           /* 固定宽度，靠左排列 */
  text-align: center;
  position: relative;
  padding-bottom: 30px;
  cursor: pointer;
  font-size: 20px;
  font-weight: 700;
  color: #333;
  transition: color .3s;
}

.pd-tab-item:hover { color: #2d8ac0; }
.pd-tab-item.active { color: #2d8ac0; }

/* 圆点：白色圆环，环心填灰底色（同时遮住穿过的虚线） */
.pd-tab-dot {
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 16px;
  height: 16px;
  transform: translateX(-50%);
  border: 4px solid #fff;
  border-radius: 50%;
  background: #e6e6e6;
  box-sizing: border-box;
  z-index: 1;
  transition: background-color .3s;
}

/* 选中：圆环大小、白边完全一致，只把中间填成蓝色点 */
.pd-tab-item.active .pd-tab-dot {
  background: #2d8ac0;
}

/* 选中项下方的白色小三角，指向下面的内容区 */
.pd-tab-item.active::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -22px;            /* 底边贴住下方白色面板的顶边 */
  margin-left: -9px;
  border-left: 9px solid transparent;
  border-right: 9px solid transparent;
  border-bottom: 8px solid #fff;   /* 压扁一些，不要太高 */
}

/* ===== 内容区 ===== */
.pd-tab-panels {
  background: #fff;
  padding: 70px 60px 90px;
  min-height: 420px;
  border-radius: 12px;   /* 板块圆角 */
}

.pd-tab-panel { display: none; }
.pd-tab-panel.active {
  display: block;
  animation: pdTabFadeIn .4s ease both;
}
@keyframes pdTabFadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}

.pd-cols {
  display: flex;
  flex-wrap: wrap;
}

.pd-col {
  width: 50%;
  padding-right: 40px;
  box-sizing: border-box;
}

.pd-col h3 {
  font-size: 26px;
  font-weight: 700;
  color: #222;
  margin: 0 0 46px;
}

.pd-col p {
  font-size: 16px;
  color: #666;
  line-height: 1.8;
  margin: 0 0 28px;
}

/* ===== 平板 / 中等屏幕 ===== */
@media (min-width: 769px) and (max-width: 1200px) {
  .pd-tab { padding: 30px 30px 20px 0; }
  .pd-tab-item { width: 120px; font-size: 19px; }
  .pd-tab-panels { padding: 50px 30px 60px; }
  .pd-col h3 { font-size: 22px; margin-bottom: 34px; }
  .pd-col { padding-right: 24px; }
}

/* ===== 移动端 ===== */
@media (max-width: 768px) {
  .pd-tab { padding: 26px 16px 18px; }
  .pd-tab-nav { display: flex; width: 100%; }
  .pd-tab-item {
    width: auto;
    flex: 1;
    font-size: 15px;
    padding-bottom: 22px;
  }

  /* 圆环缩小一号 */
  .pd-tab-dot { width: 12px; height: 12px; border-width: 3px; }

  /* 虚线跟着圆心走：bottom:5px + 2px 描边 → 中心 6px = 12px 圆环圆心 */
  .pd-tab-nav::before { left: 12.5%; right: 12.5%; bottom: 5px; }

  /* 三角同比缩小，底边仍贴住白色面板顶边 */
  .pd-tab-item.active::after {
    bottom: -18px;
    margin-left: -7px;
    border-left-width: 7px;
    border-right-width: 7px;
    border-bottom-width: 6px;
  }

  .pd-tab-panels { padding: 40px 20px 50px; border-radius: 8px; }
  .pd-col { width: 100%; padding-right: 0; margin-bottom: 30px; }
  .pd-col h3 { font-size: 20px; margin-bottom: 24px; }
  .pd-col p { font-size: 14px; margin-bottom: 20px; }
}

/* ================= 产品详情：相关应用领域 left_box_3 ================= */
.left_box_3 {
  background: #fff;
  border-radius: 12px;   /* 板块圆角 */
  overflow: hidden;
}

.pd-app {
  padding: 60px 60px 70px;
}

.pd-app-tt {
  font-size: 30px;
  font-weight: 700;
  color: #222;
  margin: 0 0 40px;
}

/* Swiper 容器：loop 时必须裁掉溢出 */
.pd-app-sw {
  overflow: hidden;
  position: relative;
  padding-bottom: 46px;   /* 给分页器留位置 */
}

.pd-app-card {
  display: block;
  background: #fff;
  text-decoration: none;
  overflow: hidden;
  border-radius: 10px;   /* 卡片圆角，overflow:hidden 会一起裁掉图片和标题条 */
}

/* 图片区：PC 默认高 280px */
.pd-app-pic {
  height: 280px;
  overflow: hidden;
}

.pd-app-pic img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;      /* 不同比例的图也不变形 */
  transition: transform .5s;
}

.pd-app-card:hover .pd-app-pic img {
  transform: scale(1.06);
}

/* 图片下方的浅灰标题条 */
.pd-app-txt {
  background: #f4f4f4;
  height: 62px;
  line-height: 62px;
  text-align: center;
  font-size: 17px;
  color: #333;
  padding: 0 14px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  transition: color .3s, background-color .3s;
}

.pd-app-card:hover .pd-app-txt {
  color: #2d8ac0;
}

/* ===== 分页器：选中的蓝色且更宽 ===== */
.pd-app-dots {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 6px;
  text-align: center;
  line-height: 0;
  z-index: 2;
}

.pd-app-dots .swiper-pagination-bullet {
  display: inline-block;
  width: 10px;
  height: 10px;
  margin: 0 5px;
  border-radius: 5px;
  background: #cfcfcf;
  opacity: 1;
  vertical-align: middle;
  transition: width .3s, background-color .3s;
}

.pd-app-dots .swiper-pagination-bullet-active {
  width: 30px;            /* 选中：加宽成胶囊 */
  background: #2d8ac0;    /* 选中：品牌蓝 */
}

/* ===== 平板 / 中等屏幕 ===== */
@media (min-width: 993px) and (max-width: 1200px) {
  .pd-app { padding: 50px 30px 60px; }
  .pd-app-tt { font-size: 26px; margin-bottom: 32px; }
  .pd-app-pic { height: 240px; }
  .pd-app-txt { height: 56px; line-height: 56px; font-size: 16px; }
}

@media (min-width: 769px) and (max-width: 992px) {
  .pd-app { padding: 44px 24px 54px; }
  .pd-app-tt { font-size: 24px; margin-bottom: 28px; }
  .pd-app-pic { height: 210px; }
  .pd-app-txt { height: 52px; line-height: 52px; font-size: 15px; }
}

/* ===== 移动端 ===== */
@media (max-width: 768px) {
  .left_box_3 { border-radius: 8px; }
  .pd-app-card { border-radius: 8px; }
  .pd-app { padding: 36px 16px 44px; }
  .pd-app-tt { font-size: 21px; margin-bottom: 22px; }
  .pd-app-sw { padding-bottom: 38px; }
  .pd-app-pic { height: 190px; }
  .pd-app-txt { height: 48px; line-height: 48px; font-size: 15px; }

  .pd-app-dots .swiper-pagination-bullet { width: 8px; height: 8px; margin: 0 4px; }
  .pd-app-dots .swiper-pagination-bullet-active { width: 24px; }
}

@media (max-width: 480px) {
  .pd-app { padding: 30px 16px 38px; }
  .pd-app-tt { font-size: 19px; margin-bottom: 18px; }
  .pd-app-pic { height: 200px; }
  .pd-app-txt { height: 46px; line-height: 46px; font-size: 14px; }
}

/* ================= 产品详情：相关资料下载 left_box_4 ================= */
.left_box_4 {
  background: #fff;
  border-radius: 12px;   /* 板块圆角 */
  overflow: hidden;
  margin-top: 50px;      /* 与上面 left_box_3 之间留出灰色间距 */
}

.pd-dl {
  padding: 60px 60px 70px;
}

.pd-dl-tt {
  font-size: 30px;
  font-weight: 700;
  color: #222;
  margin: 0 0 30px;
}

.pd-dl-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* 每一行：图标 + 标题 + 右侧下载，最后一行也保留分割线 */
.pd-dl-item {
  display: flex;
  align-items: center;
  min-height: 86px;
  padding: 18px 0;
  border-bottom: 1px solid #b5b5b5;
  box-sizing: border-box;
}

.pd-dl-ico {
  flex: 0 0 auto;
  width: 34px;
  margin-right: 18px;
  line-height: 0;
}

.pd-dl-ico img {
  display: block;
  width: 100%;
  height: auto;
}

.pd-dl-name {
  flex: 1;
  min-width: 0;          /* 允许长英文标题在窄屏收缩换行 */
  font-size: 18px;
  color: #333;
  line-height: 1.6;
  padding-right: 24px;
  transition: color .3s;
}

.pd-dl-item:hover .pd-dl-name { color: #2d8ac0; }

.pd-dl-btn {
  flex: 0 0 auto;
  font-size: 14px;
  color: #2d8ac0;
  text-decoration: none;
  transition: opacity .3s;
}

.pd-dl-btn:hover {
  color: #2d8ac0;
  text-decoration: underline;
  opacity: .8;
}

/* ===== 平板 / 中等屏幕 ===== */
@media (min-width: 993px) and (max-width: 1200px) {
  .pd-dl { padding: 50px 30px 60px; }
  .pd-dl-tt { font-size: 26px; margin-bottom: 24px; }
  .pd-dl-item { min-height: 78px; }
  .pd-dl-name { font-size: 17px; padding-right: 18px; }
  .pd-dl-ico { width: 30px; margin-right: 14px; }
}

@media (min-width: 769px) and (max-width: 992px) {
  .pd-dl { padding: 44px 24px 54px; }
  .pd-dl-tt { font-size: 24px; margin-bottom: 20px; }
  .pd-dl-item { min-height: 72px; }
  .pd-dl-name { font-size: 16px; padding-right: 16px; }
  .pd-dl-ico { width: 28px; margin-right: 12px; }
  .pd-dl-btn { font-size: 13px; }
}

/* ===== 移动端 ===== */
@media (max-width: 768px) {
  .left_box_4 { border-radius: 8px; margin-top: 30px; }
  .pd-dl { padding: 36px 16px 44px; }
  .pd-dl-tt { font-size: 21px; margin-bottom: 16px; }

  /* 窄屏：图标 + 标题占一行（标题可换行），下载按钮换到下一行右对齐 */
  .pd-dl-item {
    flex-wrap: wrap;
    min-height: 0;
    padding: 22px 0;
  }
  .pd-dl-ico { width: 26px; margin-right: 12px; }
  .pd-dl-name {
    font-size: 15px;
    line-height: 1.5;
    padding-right: 0;
    /* 图标 26px + 间距 12px，标题占满剩余宽度 */
    flex: 1 1 calc(100% - 38px);
  }
  .pd-dl-btn {
    width: 100%;
    margin-top: 8px;
    text-align: right;
    font-size: 13px;
  }
}

@media (max-width: 480px) {
  .pd-dl { padding: 30px 16px 38px; }
  .pd-dl-tt { font-size: 19px; margin-bottom: 14px; }
  .pd-dl-item { padding: 18px 0; }
  .pd-dl-ico { width: 24px; margin-right: 10px; }
  .pd-dl-name { font-size: 14px; flex: 1 1 calc(100% - 34px); }
  .pd-dl-btn { font-size: 12.5px; margin-top: 6px; }
}

/* ============ 面包屑：左右结构变体 mbx_ab（关于我们） ============ */
/* 产品页是单行长路径，这里是"左路径 + 右栏目导航"，所以单独写一套，
   仅在 .mbx_box_1.mbx_ab 下生效，不影响产品页的 .mbx_inner */
.mbx_box_1.mbx_ab {
	height: auto;          /* 高度改由内容撑开，手机端换行才不会被裁掉 */
	min-height: 50px;

	/* ---- 吸顶：跟随页面滚动停在头部正下方，保证右侧锚链接始终可点 ---- */
	position: -webkit-sticky;
	position: sticky;
	/* 头部滚动后会从 110px 收缩到 80px；面包屑真正吸顶时头部一定已是收缩态，
	   所以这里必须用 80px 而不是 110px。JS 会用 --hd-h 实时覆盖，
	   上面那行是不支持 var() 的旧浏览器兜底值，两行顺序不能颠倒。 */
	top: 80px;
	top: var(--hd-h, 80px);
	z-index: 900;          /* 低于 header 的 1000，高于正文内容 */
	background: #f7f7f7;   /* 吸顶后会盖住正文，必须给实底色 */
	transition: box-shadow .3s ease, background-color .3s ease;
}

/* 吸顶生效时的视觉强化（由 JS 加 .is_stuck）。
   注意：这里只允许改「外观」，绝不能改 height / padding —
   sticky 元素依然占据文档流，一旦改高度，后面所有内容都会跳一下。 */
.mbx_box_1.mbx_ab.is_stuck {
	background: rgba(247, 247, 247, .96);
	-webkit-backdrop-filter: saturate(180%) blur(10px);
	backdrop-filter: saturate(180%) blur(10px);
	box-shadow: 0 4px 16px rgba(31, 42, 68, .10);
}

/* 锚点落点偏移：原生跳转时也不会被「固定头部 + 吸顶面包屑」压住标题。
   --anchor-offset 同样由 JS 实时计算写入。 */
#ab_intro,
#ab_culture,
#ab_honor,
#ab_partner {
	scroll-margin-top: 138px;
	scroll-margin-top: var(--anchor-offset, 138px);
}

.mbx_ab_inner {
	min-height: 50px;
	display: flex;
	align-items: center;
	justify-content: space-between;   /* 左右结构 */
	gap: 20px;
	flex-wrap: wrap;
}

/* 关键：Bootstrap 给 .container 加了 clearfix 伪元素（content:" ";display:table），
   容器一旦变成 flex，这两个伪元素会变成两个 flex 子项，
   space-between 就会把它们顶到最左/最右，真正的内容反而被挤到中间看起来像居中。
   这里必须把它们干掉。 */
.mbx_ab_inner::before,
.mbx_ab_inner::after {
	display: none;
}

/* ---------- 左：面包屑路径 ---------- */
.mbx_ab_crumb {
	display: flex;
	align-items: center;
	gap: 8px;
	white-space: nowrap;
	overflow-x: auto;
	min-width: 0;
	margin-right: auto;   /* 焊死在左端 */
}
.mbx_ab_crumb::-webkit-scrollbar { display: none; }

.mbx_ab_crumb a {
	font-size: 13px;
	color: #666;
	transition: color .3s ease;
	flex-shrink: 0;
}
.mbx_ab_crumb a:hover { color: #2d8ac0; }

/* ---------- 右：栏目导航 ---------- */
.mbx_ab_nav {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	align-items: center;
	gap: 46px;
	flex-shrink: 0;
	margin-left: auto;   /* 焊死在右端 */
}

.mbx_ab_nav li { line-height: 1; }

.mbx_ab_nav a {
	position: relative;
	display: inline-block;
	padding: 16px 0;
	font-size: 15px;
	color: #333;
	transition: color .3s ease;
}

/* hover / 当前栏目：蓝色 + 底部蓝线 */
.mbx_ab_nav a::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 2px;
	background: #2d8ac0;
	transform: scaleX(0);
	transition: transform .3s ease;
}
.mbx_ab_nav a:hover,
.mbx_ab_nav li.active a { color: #2d8ac0; }
.mbx_ab_nav a:hover::after,
.mbx_ab_nav li.active a::after { transform: scaleX(1); }

/* ---------- 响应式 ---------- */
@media (max-width: 1200px) {
	.mbx_ab_nav { gap: 30px; }
	.mbx_ab_nav a { font-size: 14px; }
}

/* 头部高度在 1000px / 768px 两个断点变化（收缩态 80→70→60），
   吸顶 top 必须同步。JS 会用 --hd-h 覆盖，这里是兜底值。
   注意断点写 1000 而不是 992，是为了和头部保持一致。 */
@media (max-width: 1000px) {
	.mbx_box_1.mbx_ab {
		top: 70px;
		top: var(--hd-h, 70px);
	}

	#ab_intro,
	#ab_culture,
	#ab_honor,
	#ab_partner {
		scroll-margin-top: 128px;
		scroll-margin-top: var(--anchor-offset, 128px);
	}
}

@media (max-width: 992px) {
	.mbx_ab_nav { gap: 22px; }
	.mbx_ab_nav a { font-size: 13.5px; padding: 14px 0; }
}

/* 手机端：上下两行——路径在上，栏目导航在下并可横向滑动 */
@media (max-width: 768px) {
	.mbx_box_1.mbx_ab {
		min-height: 0;
		top: 60px;
		top: var(--hd-h, 60px);
	}

	#ab_intro,
	#ab_culture,
	#ab_honor,
	#ab_partner {
		scroll-margin-top: 148px;
		scroll-margin-top: var(--anchor-offset, 148px);
	}

	.mbx_ab_inner {
		min-height: 0;
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		padding-top: 8px;
		padding-bottom: 2px;
	}

	.mbx_ab_crumb { gap: 6px; margin-right: 0; }
	.mbx_ab_crumb a,
	.mbx_ab_crumb .mbx_now { font-size: 12px; }
	.mbx_ab_crumb .mbx_home img { width: 13px; }

	.mbx_ab_nav {
		gap: 20px;
		overflow-x: auto;          /* 4 个栏目放不下时横向滑动，不挤压 */
		white-space: nowrap;
		border-top: 1px solid #e6e6e6;
		margin-top: 8px;
		margin-left: 0;            /* 竖排时取消右靠，改为整行左起 */
	}
	.mbx_ab_nav::-webkit-scrollbar { display: none; }
	.mbx_ab_nav li { flex-shrink: 0; }
	.mbx_ab_nav a { font-size: 13px; padding: 11px 0; }
}

@media (max-width: 480px) {
	.mbx_ab_crumb a,
	.mbx_ab_crumb .mbx_now { font-size: 11.5px; }
	.mbx_ab_nav { gap: 16px; }
	.mbx_ab_nav a { font-size: 12.5px; padding: 10px 0; }
}


/* ================= 关于我们：公司简介 about_box_1 ================= */
.about_box_1 {
	width: 100%;
	padding: 80px 0 90px;
	background: url(../images/bgabout.png) no-repeat center bottom;
	background-size: cover;
}

/* 左右两栏：真正的并排结构（flex），不是文字环绕 */
.abt1_wrap {
	display: flex;
	align-items: flex-start;
	gap: 60px;
	margin-bottom: 60px;
}

/* ---------- 左栏：标题 + 数据（固定宽度，不压缩） ---------- */
.abt1_side {
	flex: 0 0 300px;
	max-width: 300px;
}

.abt1_head { margin-bottom: 46px; }

.abt1_cn {
	font-size: 36px;
	font-weight: 400;
	color: #1a1a1a;
	line-height: 1.2;
	margin: 0 0 8px;
}
.abt1_en {
	font-size: 14px;
	color: #999;
	letter-spacing: 1px;
	text-transform: uppercase;
	margin: 0;
}

/* ---------- 三项数据 ---------- */
.abt1_data {
	list-style: none;
	margin: 0;
	padding: 0;
}
.abt1_data li {
	display: flex;
	align-items: center;
	gap: 18px;
	margin-bottom: 40px;
}
.abt1_data li:last-child { margin-bottom: 0; }

.abt1_ico {
	flex-shrink: 0;
	width: 46px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.abt1_ico img {
	max-width: 100%;
	height: auto;
	display: block;
}

.abt1_info { min-width: 0; }

/* 文字 20px */
.abt1_label {
	font-size: 20px;
	color: #333;
	line-height: 1.4;
	margin: 0 0 6px;
}

/* 数字 55px */
.abt1_num {
	font-size: 55px;
	font-weight: 700;
	color: #1a1a1a;
	line-height: 1;
	margin: 0;
}
/* 数字后面的单位跟随文字号 20px */
.abt1_num em {
	font-size: 20px;
	font-weight: 400;
	font-style: normal;
	color: #333;
	margin-left: 8px;
}

/* ---------- 右栏：正文（占据剩余宽度） ---------- */
.abt1_main {
	flex: 1;
	min-width: 0;          /* 防止长串英文/网址把栏目撑破 */
}

/* 标题 48px */
.abt1_title {
	font-size: 48px;
	font-weight: 700;
	color: #2d8ac0;
	line-height: 1.35;
	margin: 0 0 34px;
}

/* 正文 20px */
.abt1_p {
	font-size: 20px;
	line-height: 2;
	color: #444;
	text-align: justify;
	text-indent: 2em;
	margin: 0 0 22px;
}
.abt1_p:last-child { margin-bottom: 0; }

/* ---------- 底部通栏大图 ---------- */
.abt1_pic {
	width: 100%;
	border-radius: 12px;
	overflow: hidden;
	line-height: 0;
}
.abt1_pic img {
	width: 100%;
	height: auto;
	display: block;
}

/* ================= 响应式 ================= */
/* ===== 大屏 1400 - 1200 ===== */
@media (max-width: 1400px) {
	.about_box_1 { padding: 70px 0 80px; }
	.abt1_wrap { gap: 50px; }
	.abt1_side { flex-basis: 280px; max-width: 280px; }
	.abt1_cn { font-size: 32px; }
	.abt1_num { font-size: 50px; }
	.abt1_label { font-size: 19px; }
	.abt1_num em { font-size: 19px; }
	.abt1_title { font-size: 42px; margin-bottom: 30px; }
	.abt1_p { font-size: 19px; line-height: 1.95; }
}

/* ===== 中屏 1200 - 992 ===== */
@media (max-width: 1200px) {
	.about_box_1 { padding: 60px 0 70px; }
	.abt1_wrap { gap: 40px; margin-bottom: 50px; }
	.abt1_side { flex-basis: 250px; max-width: 250px; }
	.abt1_head { margin-bottom: 38px; }
	.abt1_cn { font-size: 28px; }
	.abt1_en { font-size: 13px; }
	.abt1_data li { gap: 14px; margin-bottom: 32px; }
	.abt1_ico { width: 40px; }
	.abt1_label { font-size: 18px; }
	.abt1_num { font-size: 44px; }
	.abt1_num em { font-size: 18px; }
	.abt1_title { font-size: 36px; margin-bottom: 26px; }
	.abt1_p { font-size: 18px; line-height: 1.9; margin-bottom: 20px; }
}

/* ===== 平板 992 - 769：两栏改为上下堆叠 ===== */
@media (max-width: 992px) {
	.about_box_1 { padding: 50px 0 60px; }

	/* 不再左右并排，左栏整块置顶，数据横向三列 */
	.abt1_wrap {
		flex-direction: column;
		gap: 40px;
		margin-bottom: 40px;
	}
	.abt1_side {
		flex: none;
		width: 100%;
		max-width: none;
	}
	.abt1_main { width: 100%; }

	.abt1_head { margin-bottom: 30px; }
	.abt1_cn { font-size: 26px; }

	.abt1_data {
		display: flex;
		gap: 24px;
	}
	.abt1_data li {
		flex: 1;
		margin-bottom: 0;
		gap: 12px;
	}
	.abt1_ico { width: 36px; }
	.abt1_label { font-size: 17px; margin-bottom: 4px; }
	.abt1_num { font-size: 38px; }
	.abt1_num em { font-size: 17px; margin-left: 6px; }

	.abt1_title { font-size: 30px; margin-bottom: 22px; }
	.abt1_p { font-size: 17px; line-height: 1.85; margin-bottom: 18px; }

	.abt1_pic { border-radius: 10px; }
}

/* ===== 手机 ≤768 ===== */
@media (max-width: 768px) {
	.about_box_1 {
		padding: 40px 0 46px;
		background-size: cover;
		background-position: center bottom;
	}
	.abt1_wrap { gap: 32px; margin-bottom: 30px; }

	.abt1_head { margin-bottom: 24px; }
	.abt1_cn { font-size: 23px; }
	.abt1_en { font-size: 12px; }

	/* 三项数据竖排，避免挤成一团 */
	.abt1_data {
		display: block;
	}
	.abt1_data li {
		gap: 12px;
		margin-bottom: 22px;
		padding-bottom: 22px;
		border-bottom: 1px solid rgba(0, 0, 0, .08);
	}
	.abt1_data li:last-child {
		margin-bottom: 0;
		padding-bottom: 0;
		border-bottom: none;
	}
	.abt1_ico { width: 32px; }
	.abt1_label { font-size: 15px; }
	.abt1_num { font-size: 32px; }
	.abt1_num em { font-size: 15px; margin-left: 5px; }

	.abt1_title { font-size: 22px; line-height: 1.4; margin-bottom: 18px; }
	.abt1_p {
		font-size: 15px;
		line-height: 1.85;
		margin-bottom: 14px;
		text-align: left;    /* 窄屏两端对齐会出现大空隙 */
	}

	.abt1_pic { border-radius: 8px; }
}

/* ===== 小屏手机 ≤480 ===== */
@media (max-width: 480px) {
	.about_box_1 { padding: 32px 0 38px; }
	.abt1_cn { font-size: 20px; }
	.abt1_head { margin-bottom: 20px; }
	.abt1_data li { margin-bottom: 18px; padding-bottom: 18px; }
	.abt1_ico { width: 28px; }
	.abt1_label { font-size: 14px; }
	.abt1_num { font-size: 28px; }
	.abt1_num em { font-size: 13px; }
	.abt1_title { font-size: 19px; margin-bottom: 15px; }
	.abt1_p { font-size: 14px; line-height: 1.8; margin-bottom: 12px; }
}

/* ================= 关于我们：希磁科技 / SENSITEC about_box_2（全屏通栏） ================= */
.about_box_2 {
	width: 100%;
	overflow: hidden;
	background: #ededed;
}

/* ---------- 每一行：图 50% + 文 50%，等高 ---------- */
.abt2_row {
	display: flex;
	align-items: stretch;
	width: 100%;
}

/* 第二行：桌面端反向排列 —— 文字在左、图片在右。
   图片在 HTML 里始终写在前面，所以手机端拿掉 row-reverse 后图片天然在上方 */
.abt2_row_rev {
	flex-direction: row-reverse;
}

/* ---------- 图片半屏 ---------- */
.abt2_pic {
	flex: 0 0 50%;
	max-width: 50%;
	line-height: 0;
	overflow: hidden;
}
.abt2_pic img {
	width: 100%;
	height: 100%;
	min-height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
}

/* ---------- 文字半屏 ---------- */
.abt2_txt {
	flex: 0 0 50%;
	max-width: 50%;
	background: #ededed;
	display: flex;
	align-items: center;
	padding: 70px 6% 70px 5%;
	box-sizing: border-box;
}
.abt2_inner {
	width: 100%;
	max-width: 700px;
}

.abt2_title {
	font-size: 26px;
	font-weight: 700;
	color: #1a1a1a;
	line-height: 1.45;
	margin: 0 0 26px;
}

/* 正文 18px */
.abt2_p {
	font-size: 18px;
	line-height: 1.95;
	color: #444;
	text-align: justify;
	text-indent: 2em;
	margin: 0 0 14px;
}
/* 不需要首行缩进的段落（核心产品／产品优势） */
.abt2_p_flat { text-indent: 0; }

/* ---------- 产品优势列表 ---------- */
.abt2_list {
	list-style: none;
	margin: 0;
	padding: 0;
}
.abt2_list li {
	position: relative;
	font-size: 18px;
	line-height: 1.95;
	color: #444;
	padding-left: 20px;
	margin-bottom: 6px;
}
.abt2_list li:last-child { margin-bottom: 0; }
.abt2_list li::before {
	content: "";
	position: absolute;
	left: 2px;
	top: 15px;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #333;
}

/* ================= 响应式 ================= */
/* ===== 大屏 ≤1400 ===== */
@media (max-width: 1400px) {
	.abt2_txt { padding: 55px 5% 55px 4.5%; }
	.abt2_title { font-size: 24px; margin-bottom: 22px; }
	.abt2_p { font-size: 17px; line-height: 1.9; }
	.abt2_list li { font-size: 17px; line-height: 1.9; }
	.abt2_list li::before { top: 14px; }
}

/* ===== 中屏 ≤1200 ===== */
@media (max-width: 1200px) {
	.abt2_txt { padding: 42px 4.5% 42px 4%; }
	.abt2_title { font-size: 21px; margin-bottom: 18px; }
	.abt2_p { font-size: 16px; line-height: 1.85; margin-bottom: 12px; }
	.abt2_list li { font-size: 16px; line-height: 1.85; padding-left: 18px; }
	.abt2_list li::before { top: 13px; width: 6px; height: 6px; }
}

/* ===== 平板 ≤992：文字仍可并排，但进一步压缩留白 ===== */
@media (max-width: 992px) {
	.abt2_txt { padding: 32px 4% 32px 3.5%; }
	.abt2_title { font-size: 19px; margin-bottom: 15px; }
	.abt2_p { font-size: 15px; line-height: 1.8; margin-bottom: 10px; }
	.abt2_list li { font-size: 15px; line-height: 1.8; }
	.abt2_list li::before { top: 12px; }
}

/* ===== 手机 ≤768：上下堆叠，图片始终在上方 ===== */
@media (max-width: 768px) {
	.abt2_row,
	.abt2_row_rev {
		display: block;          /* 取消 flex / row-reverse，回归 DOM 顺序：图在上、文在下 */
	}

	.abt2_pic {
		width: 100%;
		max-width: 100%;
	}
	.abt2_pic img {
		height: auto;            /* 手机端按原始比例完整显示 */
		min-height: 0;
		max-height: 280px;
		object-fit: cover;
	}

	.abt2_txt {
		width: 100%;
		max-width: 100%;
		display: block;
		padding: 30px 20px 34px;
	}
	.abt2_inner { max-width: none; }

	.abt2_title { font-size: 18px; line-height: 1.5; margin-bottom: 14px; }
	.abt2_p {
		font-size: 15px;
		line-height: 1.85;
		margin-bottom: 12px;
		text-align: left;        /* 窄屏两端对齐会出现大空隙 */
	}
	.abt2_list li { font-size: 15px; line-height: 1.85; padding-left: 17px; }
	.abt2_list li::before { top: 12px; left: 1px; }
}

/* ===== 小屏手机 ≤480 ===== */
@media (max-width: 480px) {
	.abt2_pic img { max-height: 210px; }
	.abt2_txt { padding: 24px 16px 28px; }
	.abt2_title { font-size: 16px; margin-bottom: 12px; }
	.abt2_p { font-size: 14px; line-height: 1.8; margin-bottom: 10px; }
	.abt2_list li { font-size: 14px; line-height: 1.8; padding-left: 15px; }
	.abt2_list li::before { top: 11px; width: 5px; height: 5px; }
}

/* ================= 关于我们：企业文化 about_box_3（Tab 切换） ================= */
.about_box_3 {
	width: 100%;
	padding-top: 70px;
	background: #fff;
	overflow: hidden;
}

/* ---------- 标题 ---------- */
.abt3_head {
	text-align: center;
	margin-bottom: 70px;
}
.abt3_en {
	font-size: 38px;
	font-weight: 400;
	color: #2d8ac0;
	letter-spacing: 1px;
	line-height: 1.2;
	margin: 0 0 8px;
	text-transform: uppercase;
}
.abt3_cn {
	font-size: 30px;
	font-weight: 400;
	color: #333;
	line-height: 1.3;
	margin: 0;
}

/* ---------- 切换导航：三等分 ---------- */
.abt3_nav {
	list-style: none;
	margin: 0 0 34px;
	padding: 0;
	display: flex;
}
.abt3_nav_item {
	flex: 1;
	text-align: center;
	cursor: pointer;
	user-select: none;
}
.abt3_nav_item span {
	position: relative;
	display: inline-block;
	font-size: 18px;
	font-weight: 700;
	color: #333;
	line-height: 1.6;
	padding-bottom: 10px;
	transition: color .3s;
}
/* 下划线：默认透明，选中变蓝 */
.abt3_nav_item span::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 2px;
	background: #2d8ac0;
	transform: scaleX(0);
	transition: transform .3s;
}
.abt3_nav_item:hover span { color: #2d8ac0; }
.abt3_nav_item.active span { color: #2d8ac0; }
.abt3_nav_item.active span::after { transform: scaleX(1); }

/* ---------- 面板：图片通栏 + 文字压在图上 ---------- */
.abt3_panels {
	position: relative;
	width: 100%;
}
.abt3_panel {
	display: none;
	position: relative;
	width: 100%;
}
.abt3_panel.active {
	display: block;
	animation: abt3FadeIn .45s ease both;
}
@keyframes abt3FadeIn {
	from { opacity: 0; }
	to   { opacity: 1; }
}

/* 背景大图 */
.abt3_bg {
	width: 100%;
	line-height: 0;
}
.abt3_bg img {
	width: 100%;
	height: auto;
	display: block;
}

/* 文字层：绝对定位覆盖在图片之上，垂直居中偏上 */
.abt3_txt_wrap {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	z-index: 2;
}
.abt3_txt {
	max-width: 620px;
}

.abt3_title {
	position: relative;
	font-size: 48px;
	font-weight: 700;
	color: #fff;
	line-height: 1.3;
	margin: 0 0 30px;
	padding-bottom: 24px;
}
/* 标题下方短横线 */
.abt3_title::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 110px;
	height: 2px;
	background: rgba(255, 255, 255, .85);
}

.abt3_lead {
	font-size: 30px;
	font-weight: 700;
	color: #fff;
	line-height: 1.7;
	margin: 0 0 22px;
}

.abt3_desc {
	font-size: 18px;
	color: rgba(255, 255, 255, .92);
	line-height: 2;
	text-align: justify;
	margin: 0;
}

/* ================= 响应式 ================= */
/* ===== 大屏 ≤1400 ===== */
@media (max-width: 1400px) {
	.about_box_3 { padding-top: 60px; }
	.abt3_head { margin-bottom: 60px; }
	.abt3_en { font-size: 34px; }
	.abt3_cn { font-size: 27px; }
	.abt3_txt { max-width: 560px; }
	.abt3_title { font-size: 42px; margin-bottom: 26px; padding-bottom: 21px; }
	.abt3_title::after { width: 100px; }
	.abt3_lead { font-size: 27px; margin-bottom: 19px; }
	.abt3_desc { font-size: 17px; line-height: 1.95; }
}

/* ===== 中屏 ≤1200 ===== */
@media (max-width: 1200px) {
	.about_box_3 { padding-top: 50px; }
	.abt3_head { margin-bottom: 50px; }
	.abt3_en { font-size: 29px; }
	.abt3_cn { font-size: 24px; }
	.abt3_nav { margin-bottom: 28px; }
	.abt3_nav_item span { font-size: 17px; }
	.abt3_txt { max-width: 480px; }
	.abt3_title { font-size: 34px; margin-bottom: 20px; padding-bottom: 17px; }
	.abt3_title::after { width: 86px; }
	.abt3_lead { font-size: 22px; margin-bottom: 15px; line-height: 1.6; }
	.abt3_desc { font-size: 15px; line-height: 1.9; }
}

/* ===== 平板 ≤992 ===== */
@media (max-width: 992px) {
	.about_box_3 { padding-top: 42px; }
	.abt3_head { margin-bottom: 40px; }
	.abt3_en { font-size: 24px; }
	.abt3_cn { font-size: 21px; }
	.abt3_nav { margin-bottom: 24px; }
	.abt3_nav_item span { font-size: 16px; padding-bottom: 8px; }
	.abt3_txt { max-width: 400px; }
	.abt3_title { font-size: 28px; margin-bottom: 16px; padding-bottom: 14px; }
	.abt3_title::after { width: 72px; }
	.abt3_lead { font-size: 18px; margin-bottom: 12px; line-height: 1.6; }
	.abt3_desc { font-size: 13.5px; line-height: 1.85; }
}

/* ===== 手机 ≤768：图片裁切保证高度，文字仍压在图上 ===== */
@media (max-width: 768px) {
	.about_box_3 { padding-top: 34px; }
	.abt3_head { margin-bottom: 32px; }
	.abt3_en { font-size: 19px; letter-spacing: 0; }
	.abt3_cn { font-size: 18px; }

	/* 导航横向排布，字号缩小避免换行 */
	.abt3_nav { margin-bottom: 20px; }
	.abt3_nav_item span { font-size: 14px; padding-bottom: 7px; }

	/* 手机端图片按固定高度裁切，避免过矮放不下文字 */
	.abt3_bg { height: 400px; }
	.abt3_bg img {
		height: 100%;
		object-fit: cover;
		object-position: 72% center;   /* 偏右取景，左侧留给文字 */
	}

	/* 文字改为整幅居中 + 半透明遮罩，保证可读性 */
	.abt3_panel.active::before {
		content: "";
		position: absolute;
		left: 0;
		top: 0;
		right: 0;
		bottom: 0;
		background: linear-gradient(to right, rgba(20, 90, 140, .82) 0%, rgba(20, 90, 140, .55) 60%, rgba(20, 90, 140, .25) 100%);
		z-index: 1;
	}
	.abt3_txt_wrap {
		left: 0;
		right: 0;
		transform: translateY(-50%);
		padding: 0 20px;
	}
	.abt3_txt { max-width: none; }

	.abt3_title { font-size: 24px; margin-bottom: 14px; padding-bottom: 12px; }
	.abt3_title::after { width: 60px; }
	.abt3_lead { font-size: 16px; margin-bottom: 11px; line-height: 1.65; }
	.abt3_desc { font-size: 13px; line-height: 1.9; text-align: left; }
}

/* ===== 小屏手机 ≤480 ===== */
@media (max-width: 480px) {
	.about_box_3 { padding-top: 28px; }
	.abt3_head { margin-bottom: 26px; }
	.abt3_en { font-size: 16px; }
	.abt3_cn { font-size: 16px; }
	.abt3_nav_item span { font-size: 12.5px; padding-bottom: 6px; }

	.abt3_bg { height: 340px; }

	.abt3_txt_wrap { padding: 0 16px; }
	.abt3_title { font-size: 21px; margin-bottom: 12px; padding-bottom: 10px; }
	.abt3_title::after { width: 52px; }
	.abt3_lead { font-size: 15px; margin-bottom: 9px; line-height: 1.6; }
	.abt3_desc { font-size: 12.5px; line-height: 1.85; }
}

/* ================= 关于我们：企业荣誉 about_box_4（轮播 + 左右箭头） ================= */
.about_box_4 {
	position: relative;
	width: 100%;
	padding: 80px 0 90px;
	background: url(../images/bgh11.png) no-repeat center center;
	background-size: cover;
	border-radius: 12px;
	overflow: hidden;
}

/* ---------- 标题 ---------- */
.abt4_head {
	text-align: center;
	margin-bottom: 60px;
}
.abt4_en {
	font-size: 38px;
	font-weight: 400;
	color: #2d8ac0;
	letter-spacing: 1px;
	line-height: 1.2;
	margin: 0 0 8px;
	text-transform: uppercase;
}
.abt4_cn {
	font-size: 30px;
	font-weight: 400;
	color: #333;
	line-height: 1.3;
	margin: 0;
}

/* ---------- 轮播外壳：两侧留出箭头位置 ---------- */
.abt4_sw_wrap {
	position: relative;
	padding: 0 80px;
}
.abt4_sw {
	width: 100%;
	overflow: hidden;
}
/* Swiper 3 默认 slide 不等高，这里让每个 slide 拉满 */
.abt4_sw .swiper-wrapper {
	align-items: stretch;
}
.abt4_sw .swiper-slide {
	height: auto;
	text-align: center;
}

/* ---------- 单个荣誉卡片 ---------- */
.abt4_card {
	display: block;
	width: 100%;
}

/* 图片区：高度固定、宽度自适应，四张图共用同一条底线 */
.abt4_pic {
	display: flex;
	align-items: flex-end;      /* 底部对齐，形成统一基线 */
	justify-content: center;    /* 水平居中 */
	height: 330px;              /* 固定高度 */
	margin-bottom: 22px;
}
.abt4_pic img {
	display: block;
	height: 100%;               /* 高度撑满，宽度按比例 */
	width: auto;
	max-width: 100%;
	object-fit: contain;        /* 绝不裁切、绝不变形 */
}

/* 图片名称 */
.abt4_name {
	font-size: 18px;
	font-weight: 400;
	color: #2d8ac0;
	line-height: 1.6;
	margin: 0;
	padding: 0 6px;
}

/* ---------- 左右箭头：圆形描边，垂直居中于图片区 ---------- */
.abt4_arrow {
	position: absolute;
	top: 165px;                    /* .abt4_pic 高度(330px)的一半 = 图片区垂直中线 */
	transform: translateY(-50%);   /* 再回退自身一半高度 → 精确居中 */
	width: 50px;
	height: 50px;
	border: 1px solid #9fbdd2;
	border-radius: 50%;
	background: rgba(255, 255, 255, .6);
	cursor: pointer;
	z-index: 5;
	transition: background .3s, border-color .3s;
}
.abt4_prev { left: 0; }
.abt4_next { right: 0; }

/* 用 i 元素画 V 形箭头 */
.abt4_arrow i {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 10px;
	height: 10px;
	border-top: 2px solid #2d8ac0;
	border-right: 2px solid #2d8ac0;
	transition: border-color .3s;
}
.abt4_prev i {
	transform: translate(-50%, -50%) rotate(-135deg);
	margin-left: 1px;
}
.abt4_next i {
	transform: translate(-50%, -50%) rotate(45deg);
	margin-left: -1px;
}

.abt4_arrow:hover {
	background: #2d8ac0;
	border-color: #2d8ac0;
}
.abt4_arrow:hover i {
	border-top-color: #fff;
	border-right-color: #fff;
}

/* 到头禁用态（loop 模式下一般不会出现，保险处理） */
.abt4_arrow.swiper-button-disabled {
	opacity: .45;
	cursor: default;
}

/* ================= 响应式 ================= */
/* ===== 大屏 ≤1400 ===== */
@media (max-width: 1400px) {
	.about_box_4 { padding: 70px 0 80px; }
	.abt4_head { margin-bottom: 50px; }
	.abt4_en { font-size: 34px; }
	.abt4_cn { font-size: 27px; }

	.abt4_sw_wrap { padding: 0 70px; }
	.abt4_pic { height: 300px; margin-bottom: 20px; }
	.abt4_name { font-size: 17px; }

	.abt4_arrow { top: 150px; width: 46px; height: 46px; }
}

/* ===== 中屏 ≤1200 ===== */
@media (max-width: 1200px) {
	.about_box_4 { padding: 60px 0 70px; }
	.abt4_head { margin-bottom: 42px; }
	.abt4_en { font-size: 29px; }
	.abt4_cn { font-size: 24px; }

	.abt4_sw_wrap { padding: 0 60px; }
	.abt4_pic { height: 260px; margin-bottom: 18px; }
	.abt4_name { font-size: 16px; }

	.abt4_arrow { top: 130px; width: 42px; height: 42px; }
	.abt4_arrow i { width: 9px; height: 9px; }
}

/* ===== 平板 ≤992：一排三个 ===== */
@media (max-width: 992px) {
	.about_box_4 { padding: 50px 0 60px; }
	.abt4_head { margin-bottom: 36px; }
	.abt4_en { font-size: 24px; }
	.abt4_cn { font-size: 21px; }

	.abt4_sw_wrap { padding: 0 52px; }
	.abt4_pic { height: 230px; margin-bottom: 16px; }
	.abt4_name { font-size: 15px; }

	.abt4_arrow { top: 115px; width: 38px; height: 38px; }
	.abt4_arrow i { width: 8px; height: 8px; }
}

/* ===== 手机 ≤768：一排一个 ===== */
@media (max-width: 768px) {
	.about_box_4 {
		padding: 40px 0 46px;
		border-radius: 8px;
	}
	.abt4_head { margin-bottom: 28px; }
	.abt4_en { font-size: 19px; letter-spacing: 0; }
	.abt4_cn { font-size: 18px; }

	.abt4_sw_wrap { padding: 0 46px; }
	.abt4_pic { height: 260px; margin-bottom: 14px; }
	.abt4_name { font-size: 15px; }

	.abt4_arrow { top: 130px; width: 34px; height: 34px; }
	.abt4_arrow i { width: 7px; height: 7px; border-top-width: 1px; border-right-width: 1px; }
}

/* ===== 小屏手机 ≤480 ===== */
@media (max-width: 480px) {
	.about_box_4 { padding: 32px 0 38px; }
	.abt4_head { margin-bottom: 22px; }
	.abt4_en { font-size: 16px; }
	.abt4_cn { font-size: 16px; }

	.abt4_sw_wrap { padding: 0 38px; }
	.abt4_pic { height: 220px; margin-bottom: 12px; }
	.abt4_name { font-size: 14px; }

	.abt4_arrow { top: 110px; width: 30px; height: 30px; }
	.abt4_arrow i { width: 6px; height: 6px; }
}

/* ==========================================================
   about_box_5 合作伙伴（轮播 + 左右箭头，无限循环，卡片带外阴影）
   ========================================================== */
.about_box_5 {
	position: relative;
	width: 100%;
	padding: 80px 0 90px;
	background: #f7f7f7;
	border-radius: 12px;
	overflow: hidden;
}

/* ---------- 标题 ---------- */
.abt5_head {
	text-align: center;
	margin-bottom: 60px;
}
.abt5_en {
	font-size: 38px;
	font-weight: 400;
	color: #2d8ac0;
	letter-spacing: 1px;
	line-height: 1.2;
	margin: 0 0 8px;
	text-transform: uppercase;
}
.abt5_cn {
	font-size: 30px;
	font-weight: 400;
	color: #333;
	line-height: 1.3;
	margin: 0;
}

/* ---------- 轮播外壳：两侧留出箭头位置 ---------- */
.abt5_sw_wrap {
	position: relative;
	padding: 0 80px;
}
.abt5_sw {
	width: 100%;
	overflow: hidden;
}
.abt5_sw .swiper-wrapper {
	align-items: stretch;
}
.abt5_sw .swiper-slide {
	height: auto;
	text-align: center;
}

/* ---------- 卡片 ----------
   .abt5_card 的内边距是为了给外阴影留出显示空间，
   否则 .abt5_sw 的 overflow:hidden 会把阴影切掉 */
.abt5_card {
	display: block;
	width: 100%;
	padding: 12px 12px 18px;
}

/* 用 padding-bottom:100% 撑出正方形，兼容性优于 aspect-ratio */
.abt5_inner {
	position: relative;
	width: 100%;
	padding-bottom: 100%;          /* 正方形卡片 */
	background: #fff;
	border-radius: 12px;
	box-shadow: 0 3px 14px rgba(0, 0, 0, .09);
	transition: box-shadow .3s, transform .3s;
}
.abt5_card:hover .abt5_inner {
	transform: translateY(-4px);
	box-shadow: 0 8px 22px rgba(0, 0, 0, .14);
}

/* 内容区：整体在正方形里垂直居中，图片与文字紧贴成一组，
   间距由 .abt5_pic 的 margin-bottom 统一控制 */
.abt5_body {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 18px;
}

/* 图片区 */
.abt5_pic {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	margin-bottom: 18px;           /* 图片与文字的间距 */
}
/* 各品牌 logo 比例差异大：等比缩放，绝不裁切、绝不变形 */
.abt5_pic img {
	display: block;
	width: auto;
	height: auto;
	max-width: 78%;
	max-height: 120px;
	object-fit: contain;
}

/* 图片下方文字 */
.abt5_name {
	width: 100%;
	font-size: 18px;
	font-weight: 400;
	line-height: 1.6;
	color: #444444;
	margin: 0;
	padding: 0 6px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

/* ---------- 左右箭头 ----------
   .abt5_sw_wrap 的高度就等于卡片高度，
   所以这里用 top:50% + translateY(-50%) 即可永远垂直居中，无需逐档重算 */
.abt5_arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 50px;
	height: 50px;
	border: 1px solid #9fbdd2;
	border-radius: 50%;
	background: rgba(255, 255, 255, .6);
	cursor: pointer;
	z-index: 5;
	transition: background .3s, border-color .3s;
}
.abt5_prev { left: 0; }
.abt5_next { right: 0; }

/* 用 i 元素画 V 形箭头 */
.abt5_arrow i {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 10px;
	height: 10px;
	border-top: 2px solid #2d8ac0;
	border-right: 2px solid #2d8ac0;
	transition: border-color .3s;
}
.abt5_prev i {
	transform: translate(-50%, -50%) rotate(-135deg);
	margin-left: 1px;
}
.abt5_next i {
	transform: translate(-50%, -50%) rotate(45deg);
	margin-left: -1px;
}

.abt5_arrow:hover {
	background: #2d8ac0;
	border-color: #2d8ac0;
}
.abt5_arrow:hover i {
	border-top-color: #fff;
	border-right-color: #fff;
}

.abt5_arrow.swiper-button-disabled {
	opacity: .45;
	cursor: default;
}

/* ================= 响应式 ================= */
/* ===== 大屏 ≤1400 ===== */
@media (max-width: 1400px) {
	.about_box_5 { padding: 70px 0 80px; }
	.abt5_head { margin-bottom: 50px; }
	.abt5_en { font-size: 34px; }
	.abt5_cn { font-size: 27px; }

	.abt5_sw_wrap { padding: 0 70px; }
	.abt5_body { padding: 16px; }
	.abt5_pic { margin-bottom: 16px; }
	.abt5_pic img { max-height: 105px; }
	.abt5_name { font-size: 17px; }

	.abt5_arrow { width: 46px; height: 46px; }
}

/* ===== 中屏 ≤1200 ===== */
@media (max-width: 1200px) {
	.about_box_5 { padding: 60px 0 70px; }
	.abt5_head { margin-bottom: 42px; }
	.abt5_en { font-size: 29px; }
	.abt5_cn { font-size: 24px; }

	.abt5_sw_wrap { padding: 0 60px; }
	.abt5_body { padding: 14px; }
	.abt5_pic { margin-bottom: 14px; }
	.abt5_pic img { max-height: 90px; }
	.abt5_name { font-size: 16px; }

	.abt5_arrow { width: 42px; height: 42px; }
	.abt5_arrow i { width: 9px; height: 9px; }
}

/* ===== 平板 ≤992：一排三个 ===== */
@media (max-width: 992px) {
	.about_box_5 { padding: 50px 0 60px; }
	.abt5_head { margin-bottom: 36px; }
	.abt5_en { font-size: 24px; }
	.abt5_cn { font-size: 21px; }

	.abt5_sw_wrap { padding: 0 52px; }
	.abt5_card { padding: 10px 10px 16px; }
	.abt5_body { padding: 13px; }
	.abt5_pic { margin-bottom: 13px; }
	.abt5_pic img { max-height: 80px; }
	.abt5_name { font-size: 15px; }

	.abt5_arrow { width: 38px; height: 38px; }
	.abt5_arrow i { width: 8px; height: 8px; }
}

/* ===== 手机 ≤768：一排两个 ===== */
@media (max-width: 768px) {
	.about_box_5 {
		padding: 40px 0 46px;
		border-radius: 8px;
	}
	.abt5_head { margin-bottom: 28px; }
	.abt5_en { font-size: 19px; letter-spacing: 0; }
	.abt5_cn { font-size: 18px; }

	.abt5_sw_wrap { padding: 0 46px; }
	.abt5_inner { border-radius: 8px; }
	.abt5_body { padding: 12px; }
	.abt5_pic { margin-bottom: 12px; }
	.abt5_pic img { max-height: 72px; }
	.abt5_name { font-size: 15px; }

	.abt5_arrow { width: 34px; height: 34px; }
	.abt5_arrow i { width: 7px; height: 7px; border-top-width: 1px; border-right-width: 1px; }
}

/* ===== 小屏手机 ≤480：一排一个 ===== */
@media (max-width: 480px) {
	.about_box_5 { padding: 32px 0 38px; }
	.abt5_head { margin-bottom: 22px; }
	.abt5_en { font-size: 16px; }
	.abt5_cn { font-size: 16px; }

	.abt5_sw_wrap { padding: 0 38px; }
	.abt5_body { padding: 10px; }
	.abt5_pic { margin-bottom: 10px; }
	.abt5_pic img { max-height: 96px; }
	.abt5_name { font-size: 14px; }

	.abt5_arrow { width: 30px; height: 30px; }
	.abt5_arrow i { width: 6px; height: 6px; }
}

/* ===== SEO: H1 语义化样式锁定（避免浏览器默认样式干扰） ===== */
h1.sub_banner_cn { margin: 0 0 6px; font-weight: 700; line-height: 1.3; }
h1.page-h1 { font-size: 28px; font-weight: 500; color: #1a1a1a; line-height: 1.4; margin: 0 0 16px; }
@media (max-width: 768px) { h1.page-h1 { font-size: 22px; } }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

/* 系列页标题：原 h1 降级为 div，补回 h1 默认渲染，视觉零变化 */
.series-h1 { display: block; font-size: 2em; font-weight: 500; margin: 0.67em 0; }
