/* 全局重置与弹性布局基础设置 */
* {
	padding: 0;
	margin: 0;
	border: 0;
	box-sizing: border-box;
	/* 关键：让 padding 和 border 不会撑大盒子 */
}

/* 
 * 设置根字体大小为16px，为rem单位提供基准。
 * 1rem = 16px
*/
html {
	font-size: 16px;
}

body {
	background-color: #fff;
	font-family: Arial, Helvetica, sans-serif;
	/* 统一设置默认字体 */
	/* max-width: 1600px; */
	/* 限制最大宽度，防止在超宽屏上无限拉伸 */
	margin: 0 auto;
	/* 在超宽屏上居中显示 */
}

/* 整体页眉容器 */
.site-header {
	background-color: #fff;
	border-bottom: 1px solid #e0e0e0;
	width: 100%;
	position: relative;
	z-index: 1000;
}

/* 内容居中并使用Flexbox布局 */
.header-container {
	display: flex;
	justify-content: space-between;
	align-items: center;
	max-width: 100vw;
	/* 宽度撑满 */
	margin: 0 auto;
	/* padding: 15px 40px; -> (15/1600)*100 = 0.9375vw, (40/1600)*100 = 2.5vw */
	padding: 0.9375vw 2.5vw;
}

/* 左侧Logo区域 */
.header-logo-area a {
	text-decoration: none;
}

.header-logo-area .main-logo {
	/* height: 45px; -> (45/1600)*100 = 2.8125vw */
	height: 2.8125vw;
	width: auto;
	display: block;
	min-height: 30px;
	/* 限制最小高度，防止在手机上过小 */
}

.header-logo-area .logo-tagline {
	/* font-size: 12px; -> clamp(min, preferred, max) */
	font-size: clamp(0.6rem, 0.75vw, 0.75rem);
	color: #0077c8;
	/* margin-top: 5px; -> (5/1600)*100 = 0.3125vw */
	margin-top: 0.3125vw;
}

/* 右侧区域容器 */
.header-right-area {
	display: flex;
	align-items: center;
}

/* 主导航菜单 */
.main-nav {
	display: flex;
	/* gap: 40px; -> (40/1600)*100 = 2.5vw */
	gap: 2.5vw;
}

.main-nav .nav-link {
	position: relative;
	text-decoration: none;
	color: #333;
	font-size: 16px;
	font-weight: 600;
	/* padding: 10px 0; -> (10/16)=0.625rem */
	padding: 0.625rem 0;
	/* 使用rem让padding与字体大小关联 */
	transition: color 0.2s;
}

.main-nav .nav-link:hover {
	color: #0077c8;
}

/* 导航项上方的蓝色线条 */
.main-nav .nav-link::before {
	content: '';
	position: absolute;
	/* top: -17px; -> (17/16)= -1.0625rem */
	top: -1.0625rem;
	left: 0;
	width: 100%;
	height: 3px;
	/* 保留px，边框不应缩放 */
	background-color: #0077c8;
	transform: scaleX(0);
	transition: transform 0.3s ease;
}

/* 仅在鼠标悬停时显示线条 */
.main-nav .nav-link:hover::before {
	transform: scaleX(1);
}

/* 搜索和语言功能按钮区域 */
.header-actions {
	display: flex;
	/* margin-left: 50px; -> (50/1600)*100 = 3.125vw */
	margin-left: 1.5vw;
}

.action-btn {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	/* padding: 20px 25px; -> (20/1600)*100=1.25vw, (25/1600)*100=1.5625vw */
	padding: 1.25vw 1vw;
	text-decoration: none;
	color: #333;
	background-color: #fff;
	transition: background-color 0.3s ease, color 0.3s ease;
}

.action-btn i {
	/* font-size: 18px; -> clamp(1rem, 1.125vw, 1.125rem) */
	/* font-size: clamp(1rem, 2vw, 2rem); */
	font-size: 15px;
	/* margin-bottom: 5px; -> (5/1600)*100 = 0.3125vw */
	margin-bottom: 0.3125vw;
	color: #0077c8;
}

.action-btn span {
	/* font-size: 12px; -> clamp(0.6rem, 0.75vw, 0.75rem) */
	/* font-size: clamp(0.6rem, 1.5vw, 1,5rem); */
	font-size: 11.9px;
	font-weight: 600;
}

.action-btn:hover {
	background-color: #0077c8;
	color: #fff;
}

.action-btn:hover i{
	color: white;
}

/* 隐藏的搜索框样式 */
.search-bar-container {
	background-color: #f8f9fa;
	/* padding: 15px 40px; -> (15/1600)*100 = 0.9375vw, (40/1600)*100 = 2.5vw */
	padding: 0.9375vw 2.5vw;
	border-bottom: 1px solid #e0e0e0;
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	text-align: center;
}

.search-bar-container input {
	/* width: 300px; -> (300/1600)*100 = 18.75vw */
	width: 18.75vw;
	min-width: 200px;
	/* padding: 8px 12px; -> 使用rem */
	padding: 0.5rem 0.75rem;
	border: 1px solid #ccc;
	border-radius: 4px;
	/* 保留px */
	/* margin-right: 10px; -> (10/1600)*100 = 0.625vw */
	margin-right: 0.625vw;
}

.search-bar-container button {
	/* padding: 8px 20px; -> 使用rem */
	padding: 0.5rem 1.25rem;
	border: none;
	background-color: #0077c8;
	color: white;
	border-radius: 4px;
	cursor: pointer;
}

/* --- 汉堡菜单 --- */
.hamburger-menu {
    display: none; /* 默认隐藏 */
    width: 40px;
    height: 40px;
    background: none;
    border: none;
    cursor: pointer;
    z-index: 1010; 
    padding: 0;
}

.hamburger-menu .bar {
    display: block;
    width: 25px;
    height: 3px;
    background-color: #333;
    margin: 5px auto;
    transition: all 0.3s ease-in-out;
}

#mobile-menu-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 998;
}

/* 下拉菜单中隐藏的about us */
#hidePerson {
	/* min-width: 1200px; -> 75vw */
	min-width: 75vw;
	width: 100%;
	margin: 0 auto;
	background-color: white;
}

#downPersonBack {
	background-color: #F7F7F7;
}

#hidePersonBackBack,
#hideGoodsBackBack,
#hideServiceBackBack,
#hideCooperationBackBack,
#hideAboutBackBack {
	background-image: url('img/maskpop.png');
	background-repeat: repeat;
	width: 100%;
	background-size: 100%;
	position: absolute;
	/* height: 3691px; -> 这是一个非常大的值，可能用于遮罩，保留为100vh可以撑满视口 */
	height: 100vh;
	display: none;
	z-index: 999;
	/* min-width: 1423px; -> 88.9vw */
	min-width: 88.9vw;
	position: absolute;
	/* top: 100px; -> (100/1600)*100 = 6.25vw */
	/* top: 6.25vw; */
}

#hidePersonBack,
#hideGoodsBack,
#hideServiceBack,
#hideCooperationBack,
#hideAboutBack {
	background-color: white;
}

/* --- 下拉菜单布局 (最终精确版本) --- */
.container {
	display: flex;
	align-items: flex-start;
	/* gap: 35px; -> 2.1875vw */
	gap: 2.1875vw;
	/* padding: 50px 60px; -> 3.125vw 3.75vw */
	padding: 3.125vw 10vw;
	/* height: 400px; -> 25vw */
	height: 25vw;
	min-height: 320px;
}

.left-section img {
	/* width: 320px; -> 20vw */
	width: 18vw;
	height: 10vw;
	display: block;
}

.middle-section,
.right-section {
	display: flex;
	flex-direction: column;
	/* width: 250px; -> 15.625vw */
	width: 15.625vw;
	flex-shrink: 0;
}

#menu1 .menu-link {
	position: relative;
	cursor: pointer;
	/* padding: 16px 0; -> 1rem 0 */
	padding: 1rem 0;
	color: grey;
	border-bottom: 2px solid transparent;
	display: flex;
	align-items: center;
	transition: all 0.2s ease-in-out;
	font-size: 0.8vw;
}

#menu1 .menu-link::after {
	font-weight: bold;
	visibility: hidden;
}

#menu1 .menu-link>span:first-child {
	position: absolute;
	left: 0;
	/* top: 16px; -> 1rem */
	top: 1rem;
	font-size: 0.8vw;
	/* font-size: 18px; */
}

#menu1 .menu-link .iconfont {
	margin-left: auto;
	margin-right: 0;
	visibility: hidden;
	opacity: 0;
	transition: all 0.2s ease-in-out;
	font-size: 0.8vw;
}

#menu1 .menu-link.hover {
	color: black;
	border-bottom-color: #0077c8;
}

#menu1 .menu-link.hover>span:first-child {
	font-weight: bold;
	font-size: 0.8vw;
	/* font-size: 18px; */
}

#menu1 .menu-link.hover .iconfont {
	visibility: visible;
	opacity: 1;
	font-size: 0.8vw;
	/* font-size: 18px; */
}

.right-section .nav-item {
	/* padding: 16px 0; -> 1rem 0 */
	padding: 1rem 0;
	cursor: pointer;
	color: #666;
	border-bottom: 1px solid #e0e0e0;
	font-size: 0.8vw;
	/* font-size: 15px; */
}

.right-section>div {
	display: none;
}

#hideProfile {
	display: block;
}

.vertical-line-1 {
	width: 1px;
	background-color: #e0e0e0;
	align-self: stretch;
}

/* 下拉菜单中隐藏的商用产品及方案 */
.product-dropdown-container {
	background-color: white;
	width: 30%;
	/* margin-left: 600px; -> 37.5vw */
	margin-left: 52vw;
	/* top: 10px; -> 0.625vw */
	top: 0.625vw;
	/* padding: 30px 30px; -> 1.875vw */
	padding: 1.875vw;
}

.product-link-list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	grid-template-columns: 1fr 1fr;
	/* column-gap: 20px; -> 1.25vw */
	column-gap: 1.25vw;
	/* row-gap: 20px; -> 1.25vw */
	row-gap: 1.25vw;
}

.product-link-list li a {
	text-decoration: none;
	/* font-size: 16px; -> clamp(0.8rem, 1vw, 1rem) */
	font-size: clamp(0.8rem, 1vw, 1rem);
	color: #555;
	transition: color 0.2s ease;
}

.product-link-list li a:hover {
	font-weight: bold;
	color: #0077c8;
}

/* 第一个轮播图 */
.banner2 img {
	width: 100%;
	height: 100%;
	transition: all 2s;
}

.banner2 {
	margin: 0 auto;
	width: 100%;
	position: relative;
	transition: all 2s;
}

.ImgList {
	list-style: none;
	/* height: 520px; -> 32.5vw */
	height: 32.5vw;
	/* min-height: 300px; */
	/* max-height: 520px; */
	width: 100%;
	transition: all 2s;
	position: relative;
}

.ImgList img {
	width: 100%;
	height: 100%;
	transition: all 2s;
	object-fit: cover;
}

.ImgList li {
	float: left;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	transition: all 2s;
}

.ImgListLi {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	transition: opacity 0.8s ease;
	display: block !important;
}

.ImgListLi:first-child {
	opacity: 1;
}

.imagecontent {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
	color: white;
	width: 80%;
	/* max-width: 1000px; -> 62.5vw */
	/* max-width: 62.5vw; */
}

.imagecontent h1 {
	/* font-size: 2.5em; -> 使用clamp */
	font-size: clamp(1.5rem, 3vw, 5.8rem);
	margin-bottom: 0.625vw;
	/* 10px / 1600 */
	transform: skewX(-10deg);
	line-height: 1.2;
}

.imagecontent p {
	/* font-size: 1.2em; -> 使用clamp */
	font-size: clamp(0.9rem, 1.5vw, 5.2rem);
	margin-bottom: 1.25vw;
	/* 20px / 1600 */
	font-weight: 300;
	line-height: 1.5;
}

.imagecontent .button {
	display: inline-block;
	/* padding: 10px 40px; -> 0.625rem 2.5rem */
	padding: 1rem 5rem;
	background-color: #0089D3;
	color: white;
	text-decoration: none;
	border: none;
	transform: skewX(-40deg);
	transform-origin: left bottom;
	cursor: pointer;
	transition: background-color 0.3s;
	position: relative;
	overflow: visible;
}

.button span {
	display: block;
	transform: skewX(40deg);
}

.imagecontent .button {
	position: relative;
	overflow: hidden;
	transition: color 0.4s ease-out;
}

.imagecontent .button::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #0056b3;
	transform: skewX(-40deg);
	transform-origin: left bottom;
	translate: -101% 0;
	z-index: 0;
	transition: translate 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.imagecontent .button span {
	font-size: clamp(0.9rem, 1.5vw, 1.8rem);
	position: relative;
	z-index: 1;
}

.imagecontent .button:hover::after {
	translate: 0 0;
}

.leftBtn,
.rightBtn {
	/* width: 40px; -> 2.5vw */
	width: 2.5vw;
	/* height: 80px; -> 5vw */
	height: 5vw;
	position: absolute;
	top: 50%;
	/* margin-top: -34.5px; -> -2.156vw (height/2) */
	margin-top: -2.5vw;
	border-radius: 3px;
	background-color: rgba(0, 0, 0, 0);
	/* font-size: 50px; -> 3.125vw */
	font-size: 3.125vw;
	line-height: 5vw;
	text-align: center;
	color: white;
	/* Changed from red to white for better visibility */
	cursor: pointer;
	display: none;
}

.leftBtn {
	left: 0;
}

.rightBtn {
	right: 0;
}


.leftBtn:hover,
.rightBtn:hover {
	background-color: rgba(0, 0, 0, 0.3);
}

.imglistU {
	height: auto;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: 1.25vw;
	/* 20px / 1600 */
	z-index: 20;
	display: flex;
	gap: 0.625vw;
	/* 10px / 1600 */
}

.imglistT:hover {
	background-color: #dfdcd9;
}

.imglistU a {
	float: left;
	/* height: 4px; */
	height: 0.25vw;
	/* width: 100px; -> 6.25vw */
	width: 6.25vw;
	opacity: 0.5;
	background-color: rgb(224, 225, 226);
}

.imglistu a:hover {
	background-color: black;
}

/* About us */
.aboutus {
	display: flex;
	justify-content: space-between;
	/* padding: 40px; -> 2.5vw */
	padding: 5vw 0 5vw 15vw;
	position: relative;
	font-family: Arial, sans-serif;
	background-color: #f4f4f4;
	/* gap: 5vw; */
}

.left-section-1 {
	/* margin-left, margin-top, margin-right are replaced by flexbox gap and padding */
	/* padding-left: 3vw; */
	/* 150px/1600 */
	padding-top: 2vw;
	padding-bottom: 9vw;
	/* 50px/1600 */
	/* font-size: 14px; -> clamp */
	font-size: clamp(0.8rem, 0.875vw, 0.875rem);
	width: 35%;
	color: #333;
	z-index: 1;
	position: relative;
}

.title h2 {
	/* font-size: 30px; -> clamp */
	font-size: clamp(1.5rem, 3.2vw, 3.2rem);
	/* font-size: 51px; */
	/* margin-bottom: 30px; -> 1.875vw */
	margin-bottom: 2.3vw;
}

.title p {
	font-size: clamp(0.5rem, 1vw, 1rem);
	/* font-size: 15px; */
	line-height: 1.8;
}

.right-section-1 {
	/* width: 50%; */
	position: relative;
	background-size: cover;
	background-position: center;
	/* height: 550px; -> 34.375vw */
	/* height: 34.375vw; */
	min-height: 300px;
	/* max-height: 550px; */
}

.right-section-1 img {
	height: 100%;
	width: 100%;
	object-fit: cover;
}

.stats-container {
	position: absolute;
	/* bottom: 110px; -> 6.875vw */
	bottom: 8vw;
	/* bottom: 110px; */
	/* height: 190px; -> 11.875vw */
	height: 278px;
	min-height: 140px;
	/* max-height: 190px; */
	width: 65%;
	/* left: 20px; margin-left: 170px; -> Replaced with simpler positioning */
	/* left: 11.875vw; */
	/* 190px / 1600 */
	background-color: white;
	box-shadow: 0 -4px 8px rgba(0, 0, 0, 0.1);
	display: flex;
	justify-content: space-between;
	align-items: center;
	z-index: 2;
}

.stat-item {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	flex: 1;
	text-align: center;
	height: 100%;
	transition: all 0.3s ease;
}

.stat-item:hover {
	background-color: #0089D3;
	color: white;
}

.stat-item:hover .stat-title,
.stat-item:hover .stat-value {
	color: white;
}

.stat-title {
	display: block;
	/* font-size: 15px; -> clamp */
	font-size: clamp(0.75rem, 1.25vw, 1.25rem);
	/* font-size: 20px; */
	font-weight: bold;
	/* margin-bottom: 5px; -> 0.3125vw */
	margin-bottom: 0.3125vw;
	font-family: Arial, sans-serif;
}

.stat-value {
	/* padding-top: 20px; -> 1.25vw */
	padding-top: 1.25vw;
	/* font-size: 45px; -> clamp */
	font-size: clamp(1.5rem, 4.5vw, 4.5rem);
	/* font-size: 72.89px; */
	font-style: italic;
	font-weight: bold;
	color: #0089D3;
}

.stat-value sup {
	/* padding-left: 2px; */
	padding-left: 0.125vw;
	font-style: normal;
	/* font-size: 20px; */
	/* font-size: 31.68px; */
	font-size: clamp(1rem, 2vw, 2rem);
}

.stat-unit {
	font-style: normal;
	/* font-size: 31.68px; */
	font-size: clamp(1rem, 2vw, 2rem);
}

.vertical-line {
	width: 1px;
	background-color: #ccc;
	/* height: 100px; -> 6.25vw */
	height: 6.25vw;
	align-self: center;
}

/* 3-1: features-strip */
.features-strip {
	display: flex;
	width: 100%;
	/* min-height: 450px; -> 28.125vw */
	/* min-height: 28.125vw; */
}

.feature-item {
	/* height: 690px; -> 43.125vw */
	height: 43.125vw;
	/* max-height: 690px; */
	flex: 1;
	position: relative;
	overflow: hidden;
	display: flex;
	justify-content: center;
	align-items: center;
	background-size: cover;
	background-position: center;
}

.feature-item::before,
.feature-item::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	transition: opacity 0.5s ease-in-out;
}

.feature-item::before {
	background-color: rgba(30, 30, 30, 0.5);
	z-index: 1;
}

.feature-item::after {
	background-color: #0077c8;
	opacity: 0;
	z-index: 2;
}

.feature-content {
	position: relative;
	z-index: 3;
	color: #ffffff;
	/* text-align: center; */
	/* padding: 20px; -> 1.25vw */
	/* padding: 1.25vw; */
	padding: 2.5vw 1.5vw 12vw 1.5vw;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: 80%;
	/* max-width: 280px; -> 17.5vw */
	max-width: 17.5vw;
}

.icon-container {
	/* font-size: 3rem; -> clamp */
	font-size: clamp(2rem, 5vw, 5rem);
	margin-left: 0;
	margin-right: auto;
}

.feature-title {
	/* font-size: 1.5rem; -> clamp */
	font-size: clamp(1rem, 1.58vw, 1.58rem);
	/* font-size: 25.02px; */
	font-weight: 600;
	/* margin: 15px 0; -> 0.9375vw 0 */
	/* margin: 0.9375vw 0; */
	margin-left: 0;
	margin-right: auto;
}

.plus-icon {
	/* margin-bottom: 500px; -> 31.25vw */
	/* margin-bottom: 31.25vw; */
	/* margin-top: 80px; -> 5vw */
	margin-top: 4vw;
	/* font-size: 2.5rem; -> clamp */
	font-size: clamp(0.8rem, 2.5vw, 2.5rem);
	margin-left: 0;
	margin-right: auto;
	font-weight: 200;
	line-height: 1;
	transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
}

.feature-description {
	/* font-size: 0.9rem; -> clamp */
	font-size: clamp(0.7rem, 0.95vw, 0.95em);
	/* font-size: 15px; */
	line-height: 1.6;
	margin: 0;
	opacity: 0;
	transform: translateY(1.25vw);
	/* 20px */
	transition: opacity 0.4s ease-in-out 0.1s, transform 0.4s ease-in-out 0.1s;
}

.feature-item:hover::after {
	opacity: 1;
}

.feature-item:hover .feature-title{
	transform: translateY(2vw);
}

.feature-item:hover .plus-icon {
	margin-top: 5vw;
	margin-bottom: 0;
	opacity: 1;
	transform: translateY(-1.25vw);
	/* -20px */
}

.feature-item:hover .feature-description {
	/* margin-bottom: 200px; -> 12.5vw */
	margin-bottom: 12.5vw;
	/* margin-top: 50px; -> 3.125vw */
	margin-top: 3.125vw;
	opacity: 1;
	transform: translateY(0);
}

/* YouBao's Type Of Weighing Scale */
.container-4 h2 {
	/* padding-top: 50px; padding-bottom: 50px; */
	padding: 3.125vw 0;
	text-align: center;
	font-weight: bold;
	/* font-size: 30px; -> clamp */
	font-size: clamp(1.5rem, 3.2vw, 3.2rem);
	/* font-size: 51px; */
}

.container-4 {
	background-color: #fff;
	width: 75%;
	/* padding: 20px; -> 1.25vw */
	padding: 5vw 1.25vw 8vw 1.25vw;
	margin: 0 auto;
}

.container-4 .row {
	display: flex;
	justify-content: space-between;
}

.container-4 .top-row .product-item {
	width: calc(50% - 0.625vw);
	/* 10px / 1600 */
	height: auto;
}

.container-4 .bottom-section {
	display: flex;
	justify-content: space-between;
}

.container-4 .column {
	display: flex;
	flex-direction: column;
	width: calc(33.333% - 0.625vw);
}

.container-4 .product-item {
	position: relative;
	/* margin-bottom: 10px; -> 0.625vw */
	margin-bottom: 0.625vw;
	overflow: hidden;
}

.container-4 .large img,
.small img {
	width: 100%;
	height: auto;
	object-fit: cover;
	display: block;
}

.container-4 .overlay {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	/* ensure it covers the whole item */
	color: white;
	text-align: center;
	/* padding: 30px; -> 1.875vw */
	padding: 3vw;
	transition: opacity 0.3s ease;
	background: rgba(0, 0, 0, 0.3);
	/* Add a slight overlay by default */
}

.product-item:hover .overlay {
	opacity: 1;
}

.container-4 h3 {
	margin: 0;
	/* font-size: 20px; -> clamp */
	/* font-size: clamp(1rem, 2vw, 2rem); */
	font-size: 27.33px;
	font-weight: bold;
}

.container-4 a.learn-more {
	display: inline-block;
	/* padding: 10px 15px; -> 0.625rem 0.9375rem */
	padding: 1rem 2rem;
	color: white;
	text-decoration: none;
	/* margin-top: 20px; -> 1.25vw */
	margin-top: 1.5vw;
	border: 1px solid white;
	/* font-size: 0.9em; -> clamp */
	font-size: clamp(0.7rem, 1vw, 1rem);
	/* font-size: 15px; */
	transition: all 0.3s ease;
	background-color: transparent;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.container-4 a.learn-more:hover {
	background-color: #0089D3;
	color: white;
	border: 1px solid #0089D3;
	transform: translateY(-2px);
}

/*
================================================================
    Certificate of Honor Section (CSS-Only Override)
================================================================
*/

/* 1. Main container setup */
.wrapper-22 {
    position: relative;
    background-color: #ffffff; /* White background for the area below the banner */
    padding-bottom: 8vw; /* Space after the certificates */
    height: auto; /* Override fixed height */
    overflow: hidden; /* Contains any child elements */
}

/* 2. Style the top banner container */
.wrapper-22 .top {
    position: relative; /* Establish a positioning context */
    z-index: 1; /* Keep the banner behind the certificates */
}

/* 3. Force the <img> tag to behave like a background */
.wrapper-22 .top .layer-41 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    /* height: 100%; */
    object-fit: cover; /* This makes the image cover the area without distortion */
    z-index: -1; /* Place it behind the text content */
}

/* 4. Style the text container on top of the banner image */
.wrapper-22 .row-2 {
    position: static; /* Override any absolute positioning */
    padding: 5rem 0; /* Creates the vertical size of the banner */
    background: none; /* Remove the original background URL */
}

/* 5. Use Flexbox to lay out the header text and button */
.wrapper-22 .row-2 .l-constrained-6 {
    width: 90%;
    max-width: 86.25rem; /* 1380px */
    margin: 0 auto;
    padding: 0; /* Reset padding */
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
}

/* 6. Style the title */
.wrapper-22 .text-49 {
    color: #ffffff;
    /* font-size: clamp(1.75rem, 3.55vw, 3.5rem); */
	/* font-size: 51px; */
	font-size: clamp(1.5rem, 3.2vw, 3.2rem);
    font-weight: 600;
    width: auto; /* Override fixed width */
    height: auto; /* Override fixed height */
}

/* 7. Style the "Learn more" button */
.wrapper-22 .l-constrained-6 a.learn-more {
    display: inline-block;
    color: #ffffff;
    background-color: transparent;
    border: 2px solid #ffffff;
    padding: 1rem 2rem; /* 10px 24px */
    text-decoration: none;
    font-size: clamp(0.7rem, 1.2vw, 1.2rem);
	/* font-size: 19.22px; */
    font-weight: 500;
    white-space: nowrap;
    transition: all 0.3s ease;
    
    /* Reset any old positioning properties */
    position: static; 
    margin: 0;
    float: none;
}

.wrapper-22 .l-constrained-6 a.learn-more:hover {
    /* background-color: #ffffff; */
	background-color: #0089D3;
	color: white;
	border: 1px solid #0089D3;
	transform: translateY(-2px);
}


/* 8. The certificate gallery - this is the key part */
.wrapper-22 .image {
    /* Center the gallery */
    width: 70%;
    /* max-width: 60rem;  */
    margin-left: auto;
    margin-right: auto;
    
    /* Pull the gallery up to overlap the banner */
    /* margin-top: 6rem;  */
    
    /* Ensure it sits on top of the banner */
    position: relative;
    z-index: 10; 
    
    /* Create a responsive grid for the images */
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(12.5rem, 1fr)); /* min 200px width */
    gap: 1rem; /* Space between images */
    
    /* Reset old padding */
    padding: 0;
}

/* 9. Style the certificate images to look like framed items */
.wrapper-22 .image img {
    width: 100%; /* Make image responsive within the grid cell */
    height: auto;
    position: static; /* Override any absolute positioning from original CSS */
    margin: 0;
    
    /* Create the framed look */
    /* background-color: #fff; */
    padding: 0.5rem; /* This creates the white "mat" or frame */
    border-radius: 0.25rem;
}

/* --- 行业应用轮播图 (精确版本) 样式 --- */
.industry-applications-container {
	width: 100%;
	background-color: #f4f4f4;
	/* padding-top: 50px; padding-bottom: 50px; */
	padding: 4vw 0 8vw 0;
	box-sizing: border-box;
}

.ia-header h2 {
	/* font-size: 2.2rem; -> clamp */
	font-size: clamp(1.5rem, 3.2vw, 3.2rem);
	/* font-size: 51px; */
	color: #3C4043;
	text-align: center;
	font-weight: 600;
	/* margin: 0 0 30px 0; -> 1.875vw */
	margin: 0 0 1.875vw 0;
}

.ia-carousel {
	display: flex;
	align-items: stretch; /* 让子项高度相等 */
	position: relative;
	/* max-width: 1200px; -> 75vw */
	/* max-width: 75vw; */
	margin: 0 auto; /* 在大屏幕上居中 */
	/* height: 350px; -> 21.875vw */
	height: 35vw;
	min-height: 280px;
	/* max-height: 480px; */
}

/* 左侧蓝色导航区 */
.ia-carousel-nav {
	/* flex: 0 0 300px; -> 18.75vw */
	flex: 0 0 32vw; /* 固定宽度，不伸缩 */
	background-color: #0077c8;
	color: white;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	position: relative;
	user-select: none;
	z-index: 10;
}

/* 上下排列的箭头 */
.ia-nav-controls {
	display: flex;
	flex-direction: column;
	align-items: center;
	/* gap: 20px; -> 1.25vw */
	gap: 1.25vw; /* 箭头之间的间距 */
	/* margin-bottom: 40px; -> 2.5vw */
	margin-bottom: 2.5vw;
}

.ia-arrow {
	cursor: pointer;
	/* font-size: 2rem; -> clamp */
	font-size: clamp(1.5rem, 3.5vw, 3.5rem);
	line-height: 1;
	font-weight: 200; /* 更细的箭头 */
	transform: scaleX(0.7); /* 使箭头看起来更窄 */
	transition: opacity 0.2s;
}

.ia-arrow:hover {
    opacity: 0.7;
}

/* 页码样式 */
.ia-pagination {
    text-align: center;
    position: relative;
}

.ia-current-slide {
	/* font-size: 3.5rem; -> clamp */
	font-size: clamp(1.5rem, 3.2vw, 3.2rem);
	/* font-size: 51px; */
	font-weight: 700;
	line-height: 1;
}

.ia-total-slides {
	/* font-size: 1.2rem; -> clamp */
	font-size: clamp(0.9rem, 1.6vw, 1.6rem);
	/* font-size: 25.5px; */
	position: absolute;
	/* top: 0; */
	bottom: 1.2vw;
	/* margin-left: 8px; -> 0.5vw */
	margin-left: 0.5vw; /* 与大数字的间距 */
}

/* 页码下划线 */
.ia-pagination::after {
	content: '';
	display: block;
	/* width: 40px; -> 2.5vw */
	width: 2.5vw;
	height: 2px;
	background-color: white;
	/* margin: 15px auto 0; -> 0.9375vw */
	margin: 0.9375vw auto 0;
}

/* 右侧图片展示区 */
.ia-carousel-viewport {
	flex-grow: 1; /* 占据所有剩余空间 */
	overflow: hidden;
	/* 关键：通过负边距实现重叠效果 */
	/* margin-left: -50px; -> -3.125vw */
	margin-left: -3.125vw;
	z-index: 10;
	/* Lower than nav */
}

.ia-carousel-track {
	display: flex;
	height: 100%;
	width: 564vw;
	/* 关键：轨道需要向左移动，以补偿被导航区遮挡的部分 */
	/* padding-left: 140px; -> 8.75vw */
	padding-left: 8.75vw;
	box-sizing: content-box;
	transition: transform 0.5s ease-in-out;
	will-change: transform;
}

.ia-slide {
	flex: 0 0 7%; /* 每张幻灯片占据视口宽度的50% */
	width: 50%;
	height: 100%;
	box-sizing: border-box;
	/* padding-right: 10px; -> 0.625vw */
	/* padding-right: 0.625vw; */
	/* margin-top: 50px; -> 3.125vw */
	/* margin-top: 3.125vw; */
	padding: 3.6vw 3vw 0 0; 
}

.ia-slide img {
	width: 100%;
	height: auto;
	object-fit: cover; /* 保证图片不变形地填满容器 */
	display: block;
}


/* --- 合作伙伴无缝滚动轮播样式 --- */
.cooperative-partner-section {
	width: 100%;
	/* padding: 60px 0; -> 3.75vw 0 */
	padding: 7vw 0;
	background-color: #f4f4f4;
	overflow: hidden;
}

.partner-carousel-viewport {
	width: 100%;
	margin: 0 auto;
	position: relative;
}

.partner-carousel-viewport::before,
.partner-carousel-viewport::after {
	content: '';
	position: absolute;
	top: 0;
	/* width: 100px; -> 6.25vw */
	width: 6.25vw;
	height: 100%;
	z-index: 2;
}

.partner-carousel-viewport::before {
	left: 0;
	background: linear-gradient(to right, #fff, rgba(255, 255, 255, 0));
}

.partner-carousel-viewport::after {
	right: 0;
	background: linear-gradient(to left, #fff, rgba(255, 255, 255, 0));
}

.partner-carousel-track {
	display: flex;
	animation: scroll-animation 40s linear infinite;
}

.partner-logos {
	flex-shrink: 0;
	display: flex;
	align-items: center;
}

.partner-logos img {
	width: auto;
	display: block;
}

@keyframes scroll-animation {
	0% {
		transform: translateX(0%);
	}

	100% {
		transform: translateX(-50%);
	}
}

.partner-carousel-viewport:hover .partner-carousel-track {
	animation-play-state: paused;
}


/* --- 联系我们区域样式 --- */
.contact-section {
	/* padding: 50px 0; -> 3.125vw 0 */
	padding: 8vw 0;
	font-family: Arial, sans-serif;
}

.contact-container {
	/* max-width: 1200px; -> 75vw */
	width: 60%;
	/* max-width: 75vw; */
	margin: 0 auto;
	/* padding: 0 20px; -> 0 1.25vw */
	/* padding: 0 1.25vw; */
}

.contact-title {
	/* text-align: center;
	font-size: clamp(1.8rem, 2.25vw, 2.25rem);
	font-weight: 600;
	margin-bottom: 3.125vw; */

	/* font-size: 2.2rem; -> clamp */
	font-size: clamp(1.5rem, 3vw, 3rem);
	color: #3C4043;
	text-align: center;
	font-weight: 600;
	/* margin: 0 0 30px 0; -> 1.875vw */
	margin: 0 0 3.125vw 0;
}

.contact-content-wrapper {
	display: grid;
	grid-template-columns: 1fr 1fr;
	/* gap: 60px; -> 3.75vw */
	gap: 3.75vw;
	align-items: flex-start;
}

.contact-info-column {
	display: flex;
	flex-direction: column;
	/* gap: 30px; -> 1.875vw */
	gap: 1.875vw;
}

.info-grid {
	display: flex;
	justify-content: space-between;
	align-items: stretch;
}

.info-item,
.address-item {
	display: flex;
	align-items: flex-start;
	/* gap: 15px; -> 0.9375vw */
	gap: 0.9375vw;
}

.info-icon {
	flex-shrink: 0;
	/* width: 44px; height: 44px; -> 2.75vw */
	width: 2.75vw;
	height: 2.75vw;
	min-width: 36px;
	min-height: 36px;
	border-radius: 50%;
	border: 1px solid #555;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: clamp(1rem, 2vw, 2rem);
}

.info-text .info-label {
	display: block;
	/* font-size: clamp(0.9rem, 1.8vw, 1.8rem); */
	font-size: 14.3px;
	font-weight: 600;
	margin-bottom: 0.3125vw;
	/* 5px */
}

.info-text .info-data {
	/* font-size: clamp(0.8rem, 1.5vw, 1.5rem); */
	font-size: 15px;
	margin: 0;
	line-height: 1.6;
}

.vertical-divider {
	width: 1px;
	background-color: #444;
}

.map-container {
	width: 100%;
	/* height: 250px; -> 15.625vw */
	height: 9vw;
	/* min-height: 200px; */
	border-radius: 4px;
	overflow: hidden;
}

.map-container iframe {
	width: 100%;
	height: 100%;
	border-radius: 10px;
	border: 0;
}

.contact-section .info-icon i {
	font-size: clamp(0.5rem, 1vw, 1rem);
}

.contact-form-column form {
	display: flex;
	flex-direction: column;
	/* gap: 20px; -> 1.25vw */
	gap: 1.25vw;
}

.form-row {
	display: flex;
	gap: 1.25vw;
}

.form-group {
	position: relative;
	width: 100%;
}

.form-group input,
.form-group textarea {
	width: 100%;
	/* padding: 12px 15px; -> 0.75rem 0.9375rem */
	padding: 1rem 2rem;
	background-color: #F1F2F2;
	border: none;
	border-radius: 4px;
	/* font-size: clamp(0.8rem, 1.3vw, 1.3rem); */
	font-size: 14px;
	color: #333;
	font-family: Arial, Helvetica, sans-serif;
}

.submit-btn {
	width: 100%;
	padding: 1rem;
	background-color: #f4f4f4;
	color: black;
	border: none;
	border-radius: 4px;
	/* font-size: clamp(0.9rem, 1.6vw, 1.6rem); */
	font-size: 14px;
	font-weight: bold;
	cursor: pointer;
	transition: background-color 0.3s ease;
}

.submit-btn:hover {
	color: white;
	background-color: #0077c8;
}

/* 页脚 */
.site-footer {
	background-color: #212121;
	color: #a9a9a9;
	/* padding: 40px 0; -> 2.5vw 0 */
	padding: 2.5vw 0;
}

.footer-container {
	/* max-width: 1200px; -> 75vw */
	max-width: 75vw;
	margin: 0 auto;
	padding: 0 1.25vw;
}

.footer-top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	/* margin-bottom: 25px; -> 1.5625vw */
	margin-bottom: 1.5625vw;
}

.footer-logo img {
	/* max-height: 80px; -> 5vw */
	/* max-height: 5vw; */
	height: 5vw;
	min-height: 50px;
}

.social-icons {
	display: flex;
	/* gap: 12px; -> 0.75vw */
	gap: 0.75vw;
}

.social-icon {
	display: flex;
	justify-content: center;
	align-items: center;
	/* width: 40px; height: 40px; -> 2.5vw */
	width: 3vw;
	height: 3vw;
	min-width: 32px;
	min-height: 32px;
	border-radius: 50%;
	border: 1px solid #ffffff;
	color: #ffffff;
	text-decoration: none;
	transition: all 0.3s ease;
}

.social-icon i {
	font-size: clamp(0.8rem, 1.5vw, 1.5rem);
}

.social-icon:hover {
	color: white;
	background-color: #00A3E0;
	border-color: #00A3E0;
}

.footer-divider {
	border: 0;
	height: 1px;
	background-color: #424242;
	/* margin-bottom: 30px; -> 1.875vw */
	margin-bottom: 1.875vw;
}

.footer-main {
	display: grid;
	grid-template-columns: 2fr 1fr 1fr;
	/* gap: 40px; -> 2.5vw */
	gap: 2.5vw;
}

.footer-column h3 {
	color: #ffffff;
	font-size: clamp(0.8rem, 1.12vw, 1.12rem);
	/* font-size: 18px; */
	font-weight: 600;
	margin-top: 0;
	/* margin-bottom: 20px; -> 1.25vw */
	margin-bottom: 1.25vw;
}

.link-list,
.link-list-double {
	list-style: none;
	padding: 0;
	margin: 0;
	line-height: 2.2;
}

.link-list a,
.link-list-double a {
	color: #a9a9a9;
	text-decoration: none;
	transition: color 0.3s ease;
	/* font-size: clamp(0.75rem, 1.6vw, 1.6rem); */
	font-size: 14px;
}

.link-list a:hover,
.link-list-double a:hover {
	color: #ffffff;
}

.link-list-double {
	column-count: 2;
	/* column-gap: 20px; -> 1.25vw */
	column-gap: 1.25vw;
}

.gallery-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	/* gap: 8px; -> 0.5vw */
	gap: 0.5vw;
}

.gallery-grid img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 4px;
	transition: opacity 0.3s ease;
}

.gallery-grid a:hover img {
	opacity: 0.8;
}

.main-nav .nav-link:active {
	color: #0077c8;
}
.action-btn:active {
	background-color: #0077c8;
	color: #fff;
}
#menu1 .menu-link.active {
	color: black;
	border-bottom-color: #007bff;
}
#menu1 .menu-link.active>span:first-child {
	font-weight: bold;
	font-size: 0.8vw;
}

#menu1 .menu-link.active .iconfont {
	visibility: visible;
	opacity: 1;
	font-size: 0.8vw;
}
.stat-item:active {
	background-color: #0089D3;
	color: white;
}

.stat-item:active .stat-title,
.stat-item:active .stat-value {
	color: white;
}
.container-4 a.learn-more:active {
	background-color: #0089D3;
	color: white;
	border: 1px solid #0089D3;
	transform: translateY(-2px);
}
.wrapper-22 .l-constrained-6 a.learn-more:active {
    /* background-color: #ffffff; */
	background-color: #0089D3;
	color: white;
	border: 1px solid #0089D3;
	transform: translateY(-2px);
}
.submit-btn:active {
	color: white;
	background-color: #0077c8;
}
.social-icon:active {
	color: white;
	background-color: #00A3E0;
	border-color: #00A3E0;
}
.link-list a:active,
.link-list-double a:active {
	color: #ffffff;
}

/* ============================= */
/* 移动端响应式样式 (关键部分) */
/* ============================= */
@media (max-width: 1024px) {
    .header-container {
        padding: 15px; /* 移动端使用固定边距 */
    }

	.header-container {
        padding: 15px; /* 移动端使用固定边距 */
    }

    .hamburger-menu {
        display: block; /* 在移动端显示 */
    }

    /* 汉堡菜单激活时的 "X" 动画 */
    body.menu-open .hamburger-menu .bar:nth-child(1) {
        transform: translateY(8px) rotate(45deg);
    }
    body.menu-open .hamburger-menu .bar:nth-child(2) {
        opacity: 0;
    }
    body.menu-open .hamburger-menu .bar:nth-child(3) {
        transform: translateY(-8px) rotate(-45deg);
    }

    /* 移动端导航面板 */
    .header-right-area {
        position: fixed;
        top: 0;
        right: 0;
        width: 280px;
        height: 100%;
        background-color: #ffffff;
        flex-direction: column;
        align-items: flex-start;
        padding: 80px 30px 30px 30px;
        transform: translateX(100%);
        transition: transform 0.4s ease;
        z-index: 999;
        overflow-y: auto;
    }

    body.menu-open .header-right-area {
        transform: translateX(0); /* 滑入屏幕 */
        box-shadow: -5px 0 15px rgba(0,0,0,0.1);
    }
    
    body.menu-open #mobile-menu-overlay {
        display: block; /* 显示遮罩 */
    }

    /* --- 滑出式导航面板 --- */
    .mobile-nav-panel { display: flex; position: fixed; top: 0; right: 0; width: 280px; height: 100vh; background-color: #ffffff; flex-direction: column; align-items: flex-start; gap: 0; padding: 6rem 1.5rem 2rem 1.5rem; transform: translateX(100%); transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1); z-index: 999; overflow-y: auto; }
    body.menu-open .mobile-nav-panel { transform: translateX(0); box-shadow: -5px 0 15px rgba(0,0,0,0.1); }
    .mobile-nav-panel .main-nav { display: flex; flex-direction: column; width: 100%; gap: 0; border-bottom: 1px solid #e0e0e0; margin-bottom: 1rem; }
    .mobile-nav-panel .main-nav .nav-link { display: block; padding: 1rem 0; border-bottom: 1px solid #f0f0f0; font-size: 1.1rem; }
    .mobile-nav-panel .main-nav .nav-link:last-child { border-bottom: none; }
    .mobile-nav-panel .header-actions { display: flex; flex-direction: column; align-items: flex-start; width: 100%; gap: 0; }
    .mobile-nav-panel .action-btn { display: flex; width: 100%; padding: 1rem 0; border-bottom: 1px solid #f0f0f0; gap: 0.5rem; }
    .mobile-nav-panel .action-btn:last-child { border-bottom: none; }

    /* 移动端导航链接 */
    .main-nav {
        flex-direction: column;
        width: 100%;
        gap: 0;
    }
    .main-nav .nav-link {
        padding: 15px 0;
        border-bottom: 1px solid #f0f0f0;
        font-size: 1rem;
    }
    .main-nav .nav-link::before {
        display: none; /* 隐藏桌面端的悬停下划线 */
    }

    

    /* 移动端的搜索和语言按钮 */
    .header-actions {
        flex-direction: column;
        margin-left: 0;
        margin-top: 20px;
        width: 100%;
        gap: 10px;
    }
    .action-btn {
        flex-direction: row;
        justify-content: flex-start;
        padding: 15px 0;
        gap: 15px;
        border-bottom: 1px solid #f0f0f0;
    }
	.action-btn:hover {
        background-color: #fff;
        color: #0077c8;
    }
    .action-btn:active {
        background-color: #fff;
        color: #0077c8;
    }
    .action-btn i {
        margin-bottom: 0;
    }
	.action-btn span {
		font-size: 1rem;
		font-weight: 600;
	}

    /* 隐藏桌面端的下拉菜单 */
    #hidePersonBackBack,
    #hideGoodsBackBack {
        display: none !important;
    }

    /* 调整轮播图高度 */
    .banner2, .ImgList {
        /* height: 60vh; */
        min-height: 350px;
    }
    .imagecontent h1 {
        font-size: clamp(1.8rem, 2.5vw, 2.5rem);
        margin-bottom: 3vw;
    }
    .imagecontent p {
        /* font-size: clamp(1rem, 4vw, 1.2rem); */
        font-size: 1rem;
        margin-bottom: 3vw;
    }
    .imagecontent .button {
        padding: 0.5rem 2rem;
    }


    /* “关于我们”区域垂直堆叠 */
    /* --- START: “关于我们”区域响应式修复 --- */
    .aboutus {
        flex-direction: column;
        padding: 2.5rem 1.5rem; /* 调整移动端内边距 */
        gap: 2rem; /* 调整子元素间距 */
        height: 900px;
    }
    .left-section-1, .right-section-1 {
        width: 100%; /* 子元素占满全部宽度 */
        padding: 0;
        flex: none; /* 取消flex-grow/shrink */
    }
    .right-section-1 {
        height: 250px; /* 为图片设置一个合适的高度 */
		bottom: 120px;
    }
    .stats-container {
        position: relative; /* 改为相对定位，自然流排列 */
        left: auto;
        bottom: 28vw;
        width: 100%;
        flex-direction: column;
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);
    }
    .stat-item {
        width: 100%;
        padding: 1.25rem;
        border-bottom: 1px solid #f0f0f0;
        background-color: white;
    }
    .stat-item:last-child {
        border-bottom: none;
    }
    .vertical-line {
        display: none; /* 隐藏桌面端的垂直分割线 */
    }
	.title h2{
		/* font-size: 3rem; */
		margin-bottom: 3vw;
	}
	.right-section-1 img{
		margin-top: 10vw;
	}

    /* --- END: “关于我们”区域响应式修复 --- */

    /* “五列特性”区域垂直堆叠 */
    .features-strip {
        flex-direction: column;
    }
    .feature-item {
        height: auto;
        min-height: 250px;
    }
    .feature-content {
        max-width: 80%;
    }
    .feature-item .feature-description {
        /* 在移动端默认显示描述 */
        opacity: 1;
        transform: translateY(0);
        margin-top: 1rem;
    }
    .feature-item .plus-icon { display: none; }
    

    /* “产品类型”区域垂直堆叠 */
    .container-4 { width: 90%; padding: 20px 0; }
    .container-4 .row, .container-4 .bottom-section { flex-direction: column; }
    .container-4 .top-row .product-item, .container-4 .column { width: 100%; }
    .container-4 .large img, .small img {width: 100%;height: 30vw;object-fit: cover;display: block;}
    .container-4 .overlay {padding: 10vw;}
	.container-4 h3 {font-size: 3vw;}
	.container-4 a.learn-more {padding: 0.5rem 1rem; margin-top: 2vw; ; font-size: 1rem;}

    /* “行业应用”区域调整 */
    .industry-applications-container { padding: 40px 0; }
    .ia-carousel { flex-direction: column; height: auto; max-width: 90%; }
    .ia-carousel-nav { flex-direction: row; justify-content: space-around; padding: 15px; flex-basis: auto; }
    .ia-carousel-viewport { margin-left: 0; }
    .ia-carousel-track { padding-left: 0; }
    .ia-slide { width: 100%; padding: 10px 0 0 0; flex-direction: column; flex: 0 0 8%;} /* 单个幻灯片占满宽度 */
    .ia-nav-controls { flex-direction: row; margin-bottom: 0; }

    /* “荣誉证书”区域 */
    .wrapper-22 .top .layer-41 {height: 100%;}
    .wrapper-22 .row-2 {padding: 1rem 0;}
    .wrapper-22 .row-2 .l-constrained-6 { flex-direction: column; text-align: center; gap: 20px; }
    .wrapper-22 .image { grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));}
    .wrapper-22 .l-constrained-6 a.learn-more {font-size: 0.8rem; border-width: 1px;}
    /* .wrapper-22 .image img {} */
	/* .wrapper-22 .image img {margin-left: 10px; margin-right: 10px;} */

    .partner-logos img {width: 60%;}

    /* “联系我们”区域 */
    .contact-content-wrapper { grid-template-columns: 1fr; }
    .info-grid {flex-direction: column; gap: 0.5rem;}
    .contact-info-column {gap: 1rem;}
	.map-container {height: 40vw;}
	.form-row {flex-direction: column;}

    /* “页脚”区域垂直堆叠 */
    .footer-main { grid-template-columns: 1fr 1fr 1fr; }
    .footer-top { flex-direction: column; gap: 20px; text-align: center; }
    .link-list-double { column-count: 1; }
    .social-icons {gap: 2vw;}
    .social-icon {width: 9vw;height: 9vw;}
}
