/* ability.css - 核心能力页面专属样式 */

/* ========== 基础变量与重置 ========== */
:root {
    --color-primary: #1a1a1a;
    --color-secondary: #0066cc;
    --color-accent: #3b68c5;
    --color-accent-light: #3388ee;
    --color-white: #ffffff;
    --color-light-gray: #f9fafc;
    --color-gray: #666666;
    --color-dark-gray: #333333;
    --border-radius: 8px;
    --border-radius-lg: 12px;
    --shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    --shadow-heavy: 0 8px 30px rgba(0, 0, 0, 0.12);
    --transition: all 0.3s ease;
}

/** {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Noto Sans SC', sans-serif;
    line-height: 1.6;
    color: var(--color-dark-gray);
    background: var(--color-white);
}

.container {
    max-width: 3000px;
    margin: 0 auto;
    padding: 0 0px;
}*/

/* 让 .header-with-banner 高度由内容撑开 */
.header-with-banner {
    position: relative;
    width: 100%;
    overflow: hidden;
    background-color: #000;
    /* 不设固定 height */
}

.banner-background {
    position: relative; /* 改为 relative，让 img 决定高度 */
    width: 100%;
    /* height 由 img 决定 */
}

.banner-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto; /* 保持原始比例 */
    opacity: 0;
    transform: scale(1.15);
    transform-origin: center;
    transition: opacity 1.5s cubic-bezier(0.4, 0, 0.2, 1);
    will-change: transform, opacity;
    display: block;
    z-index: 0;
}

/* 只有 active 的图片参与布局（撑开容器） */
.banner-image.active {
    position: relative; /* ← 关键！让它脱离 absolute，参与文档流 */
    z-index: 1;
    opacity: 1;
    animation: bannerZoomIn 5s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes bannerZoomIn {
    0%, 15% { transform: scale(1.15); }
    100%    { transform: scale(1); }
}

/* 覆盖层也要跟随图片高度 */
.banner-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.1) 100%);
    z-index: 1;
}



@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translateY(40px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 文字内容要放在图片上方 */
.banner-content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center; /* 真正的垂直+水平居中 */
    z-index: 2;
    padding: 0 20px;
    box-sizing: border-box;
}

.banner-content .container {
    text-align: center;
    max-width: 1200px;
    width: 100%;
}

.banner-content h1 {
    font-size: clamp(2.5rem, 8vw, 4rem); /* 响应式字体 */
    font-weight: 700;
    margin: 0;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
    color: white;
    opacity: 0;
    animation: fadeInUp 1s ease-out 0.7s forwards;
}

/* 防止水平滚动条 */
.ability-page {
    overflow: hidden;
}

/* ========== 核心能力选项卡 ========== */
.ability-tabs-section {
    background: var(--color-white);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    position: sticky;
    top: 0;
    z-index: 100;
    border-bottom: 1px solid #eee;
}

.ability-tabs {
    display: flex;
    justify-content: flex-start;
    padding: 0;
    flex-wrap: wrap;
    overflow-x: auto;
}

.tab-btn {
    position: relative;
    padding: 25px 35px;
    background: transparent;
    border: none;
    font-size: 1.2rem;
    font-weight: 500;
    color: #666;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 12px;
    white-space: nowrap;
    border-radius: 0;
    margin-right: 10px;
}

.tab-btn:hover {
    color: var(--color-accent);
}

.tab-btn.active {
    color: #3b68c5;
    font-weight: 600;
}

.tab-indicator {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 3px;
    background-color: var(--color-accent);
    transition: width 0.3s ease;
}

.tab-btn.active .tab-indicator {
    width: 100%;
    animation: indicatorExpandFromLeft 0.3s ease forwards;
}

@keyframes indicatorExpandFromLeft {
    0% {
        width: 0;
    }
    100% {
        width: 100%;
    }
}

.tab-btn:hover .tab-indicator {
    width: 100%;
    background-color: var(--color-accent);
}

.tab-btn.active .tab-indicator {
    animation: indicatorExpandFromLeft 0.3s ease forwards;
    width: 100%;
}

.tab-btn i {
    font-size: 1.3rem;
    transition: color 0.3s ease;
}

.tab-btn.active i {
    color: var(--color-accent);
}

.tab-btn:hover i {
    color: var(--color-accent);
}

/* ========== 核心能力区域 ========== */
.ability-content-section {
    display: none;
    padding-top: 80px;
    padding-bottom: 0px;
    padding-left: 0;
    padding-right: 0;
    animation: fadeIn 0.5s ease;
}

.ability-content-section.active {
    display: block;
}

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

.section-title {
    font-size: 2.8rem;
    color: var(--color-primary);
    margin-bottom: 15px;
    text-align: center;
    align-items: center;
    position: relative;
}

.section-subtitle {
    font-size: 1.2rem;
    color: var(--color-gray);
    text-align: center;
	align-items: center;
    margin-top: 15px;
    line-height: 1.7;
}

.ability-title {
	text-align: center;
	margin-bottom:10px;
}
/* ========== 图文左右布局 ========== */
.intro-image {
    flex: 1;
    /*border-radius: var(--border-radius-lg);*/
    overflow: hidden;
    box-shadow: var(--shadow-heavy);
}

.intro-image img {
    width: 100%;
    height: auto;
    display: block;
    /*ransition: transform 0.5s ease;*/
}

.intro-image:hover img {
  /*  transform: scale(1.03);*/
}

.ability-stats-section {
    position: relative;
    padding: 0px 0; /* 增加内边距，使区域更大 */
    overflow: hidden;
	margin-bottom:0px;
}

/* 移除所有白色覆盖 */
.ability-stats-section .container {
    position: relative;
    z-index: 3;
    background: transparent;
    max-width: 1600px; /* 调整容器最大宽度 */
}

/* ========== Footer紧贴上方内容 ========== */
#footer-container {
    position: relative;
    z-index: 10;
    margin-top: 0;
}

/* 智能制造部分图片网格样式 */
.image-grid-container {
    margin: 40px 0;
    width: 100%;
}

.image-grid {
    display: grid;
    /* 左右各60px边距 + 三张图片平均分配 + 两个10px间隙 */
    grid-template-columns: 40px 1fr 10px 1fr 10px 1fr 40px;
    grid-template-rows: auto;
    align-items: center;
}

.long-image-item {
  width: 100%;
  height: auto;
  overflow: hidden;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  transition: transform 0.3s ease;
}

.long-image-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

.long-image-item img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 8px;
  transition: transform 0.5s ease;
}

.long-image-item:hover img {
    transform: scale(1.05);
}

/* 将图片放置在网格的第2、4、6列 */
.image-item:nth-child(1) {
    grid-column: 2 / span 1;
}

.image-item:nth-child(2) {
    grid-column: 4 / span 1;
}

.image-item:nth-child(3) {
    grid-column: 6 / span 1;
}

.image-item {
    width: 100%;
    height: auto;
    overflow: hidden;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.image-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

.image-item img {
    width: 100%;
    height: 577px; /* 固定高度，可根据需要调整 */
    object-fit: cover;
    display: block;
    border-radius: 8px; /* 添加这一行 */
    transition: transform 0.5s ease;
}

.image-item:hover img {
    transform: scale(1.05);
}

.section-header {
    text-align: center;
    margin-bottom: 60px;
}

/* ========== 创新设计专属样式 ========== */
.ability-content-wrapper {
    max-width: 1600px;
    margin: 80px auto; /* 上下80px，左右自动 → 居中 */
    padding: 0 40px;   /* 可选：增加内边距提升移动端可读性 */
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 160px;
    text-align: left;
    position: relative;
    z-index: 3;
    background: transparent;
}

.ability-text {
    display: flex;
    flex-direction: column;
    gap: 30px;
    margin:10px;
    flex: 1;
}

.ability-list {
    list-style-type: disc; /* 使用实心圆点 */
    padding-left: 24px;    /* 给出足够的缩进空间 */
    margin: 0;
    line-height: 1.8;
    font-size: 1.6rem;
    color: var(--color-primary);
}

.ability-list li {
    margin-bottom: 12px;
    text-align: left;
    /* 可选：防止超长文本换行错位 */
    word-break: break-word;
}
.ability-subtitle {
    font-size: 2.8rem;
    color: var(--color-primary);
    margin-bottom: 20px;
    position: relative;
    padding-bottom: 10px;
}

.ability-description {
	font-size: 1.6rem;
    line-height: 1.8;
    color: var(--color-primary);
    margin-bottom: 0px;
}

.ability-image {
    flex: 1;
    border-radius: var(--border-radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow-heavy);
}

.ability-image img {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.5s ease;
}

.ability-image:hover img {
    transform: scale(1.03);
}
/* ========== 创新设计专属样式 ========== */



/* 时间轴样式 */
/* 主容器：相对定位，容纳背景和内容 */
.timeline-hero {
  position: relative;
  width: 100%;
  max-width: 2000px;
  overflow: hidden;
  align-items: center;     
  justify-content: center;  
  margin: auto auto; /* 上下80px，左右自动 → 居中 */
  padding: 0 auto;   /* 可选：增加内边距提升移动端可读性 */
}

/* 背景图：铺满整个 hero 区域 */
.timeline-background img {
  width: 100%;
  height: auto;
  display: block;
  /* 如果希望高度固定（可选） */
  /* min-height: 600px; object-fit: cover; */
}

/* 覆盖层：让文字浮在图片上 */
.timeline-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;     

	justify-content: center;   /* 水平居中 */
	padding-left: 200px;
	padding-right: 200px;
	padding-top: 40px;
	box-sizing: border-box;
	color: #fff; /* 白色文字更清晰 */
	text-align: center;
}

/* 内容容器：整体居中，但允许内部元素自定义对齐 */
.timeline-container {
	width: 100%;
	height: 100%;
	align-items: center;
	justify-content: center;   /* 水平居中 */
}

/* 标题：左对齐 */
.timeline-container h2 {
	font-size: 2.8rem;
	margin-top: 20px;
	text-align: center;
	color: #000;
	text-align: left;        /* ← 关键：左对齐 */
}
/* 时间轴容器 */
.timeline {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
    justify-content: space-between;
	align-items: center;     
	padding: 0 200px;
	justify-content: center;   /* 水平居中 */

	box-sizing: border-box;
	color: #fff; /* 白色文字更清晰 */
	text-align: center;
	gap: 30px;
}

/* 时间点 */
.timeline-item {
	flex: 1;
	min-width: 220px;
	align-items: center;
	position: relative;
	z-index: 2;
	text-align: center;
	justify-content: center;
}

.year {
	font-size: 2.4rem;
	font-weight: bold;
    margin-bottom: 12px;
	color: #000;
}

.content {
	font-size: 1.5rem;
	line-height: 1.6;
	color: #000;
	white-space: normal;
	word-break: break-word;
}

/* 一高一低交错 */
.timeline-item.odd {
	transform: translateY(-20px);
}
.timeline-item.even {
	transform: translateY(20px);
}
/* 时间轴样式 */


/* ========== 全球化品质专属样式 ========== */
.ability-global-wrapper {
    max-width: 1600px;
    margin: 10px auto; /* 上下80px，左右自动 → 居中 */
    padding: 0 20px;   /* 可选：增加内边距提升移动端可读性 */
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 30px;
    text-align: left;
    position: relative;
    z-index: 3;
    background: transparent;
}
.ability-global-text {
    display: flex;
    flex-direction: column;
    gap: 30px;
    margin:10px 10px 10px 10px;
    flex: 1;
}

/* 左侧标题区域：窄一些 */
.ability-global-title {
    flex: 0 0 40%; /* 占25%宽度，不伸缩 */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: left;
    text-align: left;
}

/* 右侧内容区域：宽一些 */
.ability-global-content {
    flex: 1; /* 占剩余空间 */
    display: flex;
    flex-direction: column;
    gap: 30px;
    margin: 0; /* 去掉原来的 margin，避免干扰布局 */
}

/* 标题样式保持不变 */
.ability-global-subtitle {
    font-size: 2.8rem;
    color: var(--color-primary);
    margin: 0;
}

.ability-global-description {
    font-size: 1.6rem;
    line-height: 1.8;
    color: var(--color-primary);
    margin-bottom: 0;
    text-align: justify;
}

/* 编号内容区 */
.quality-global-items {
    margin-top: 50px; /* 原10px → 改为0，避免整体下移 */
}

.quality-global-item {
    margin-bottom: 35px;
}

.item-global-title {
    font-size: 1.3rem;
    font-weight: 600;
    color: #000;
    margin-bottom: 10px;
    position: relative;
    padding-left: 45px; /* 增加一点左间距，避免遮挡 */
    line-height: 1.3;
}

/* 自动编号 */
.item-global-title::before {
    content: "0";
    position: absolute;
    left: 0;
    top: 0;
    font-size: 1.3rem;
    font-weight: 700;
    color: #000;
    width: 1.5em;
    text-align: right;
}

/* 为每个编号设置具体内容 */
.quality-global-item:nth-child(1) .item-global-title::before { content: "01."; }
.quality-global-item:nth-child(2) .item-global-title::before { content: "02."; }
.quality-global-item:nth-child(3) .item-global-title::before { content: "03."; }
.item-global-content {
    font-size: 1.3rem;
    line-height: 1.8;
    color: #333;
    text-align: justify;
}
/* ========== 全球化品质专属样式 ========== */

/* ========== 移动端专属样式 ========== */
@media (max-width: 1236px) {/* ========== 150% ========== ipad air 820*1180 ========== */
    /* ability.css - 核心能力页面专属样式 */
    
    /* ========== 移动端：创新设计 ========== */
    /* 缩小主标题与内容之间的距离 */
	.section-title {
		margin-bottom: 10px; /* 原为 20px */
	}

	.ability-content-wrapper {
		margin-top: 10px; /* 原为 80px，大幅缩小 */
		margin-bottom: 40px; /* 可选：也适当减小下边距 */
        flex-direction: column; /* 将图文左右布局改为上下堆叠 */
        gap: 40px; /* 可适当减小或保留 */
        text-align: left; /* 可选：让文字居中更美观 */
	}

	.ability-subtitle {
        text-align: left !important;
        margin-left: 0; /* 防止意外缩进 */
        margin-bottom: 0px;
	}
	
	.ability-text {
		order: -1;           /* ← 关键：让文字（含标题）排第一 */
		width: 100%;
		flex: none;
        align-items: flex-start; /* ← 关键：改为左对齐 */
        text-align: left;        /* ← 显式声明文本左对齐 */
        margin: 0; /* 清除可能的 margin 干扰 */
	}

	.ability-image {
		order: 0;            /* 图片排第二 */
		width: 100%;
		flex: none;
	}
  	
    .ability-description,
    .ability-list {
        text-align: justify; /* 或 left，根据设计需求 */
    }

	/* 时间轴 - 移动端优化 */
	/* 如果需要一点间距，可以用 timeline 容器加 margin-top，而不是 h2 */
	.timeline {
		margin-top: 40px; /* 可选：标题和时间轴之间留点空隙 */
		flex-direction: row;
		justify-content: space-between;
		gap: 15px;
		align-items: center;
		padding: 0 10px;
	}
	
	.timeline-hero {
		 margin-top: 0 !important; /* 确保无外边距 */
		 padding-top: 0;
	}

	.timeline-overlay {
		padding: 30px 20px 20px; /* 上内边距减到最小，甚至可设为 0 */
		justify-content: flex-start; /* ← 关键：不要居中，而是从顶部开始 */

	}

	.timeline-container {
		width: 100%;
		max-width: none;
		text-align: left;
		margin-top: 0;
	}

	.timeline-container h2 {
		font-size: 1.8rem;
		margin: 0;           /* 清除所有 margin */
		padding: 0;          /* ← 关键：padding-top 和 padding-bottom 都归零 */
		text-align: left;
		color: #000;
	}

	.timeline-item {
		min-width: 120px;
		flex: 1 1 calc(50% - 10px);
	}

	.year {
		font-size: 1.4rem;
		font-weight: bold;
		margin-bottom: 8px;
		color: #000;
	}

	.content {
		font-size: 0.9rem;
		line-height: 1.4;
		color: #000;
		white-space: normal;
	}
	/* 时间轴 - 移动端优化 */
    /* ========== 移动端：智能制造 ========== */
    /* 👇 新增：给长条图也加左右间距 */
  	.long-image-wrapper {
    	padding: 0 30px; /* ← 间距由 wrapper 控制 */
  	}

  	.long-image-item {
    	padding: 0; /* ← 清除 padding */
    	margin: 0;
    	/* 不需要再设 border-radius 或 shadow，已在全局定义 */
  	} 
    
	/* 智能制造图片网格 - 移动端竖排 */
	.image-grid {
		grid-template-columns: 1fr;
		gap: 20px;
		padding: 0 20px; /* 👈 关键：给整个网格加左右内边距 */
		box-sizing: border-box;
	}

	.image-item {
		grid-column: 1 / -1 !important;
		height: auto;
		width: 100%; /* 保持宽度100%，但受父级 padding 限制 */
		overflow: hidden;
		border-radius: 8px;
		box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
		/* 移除 margin，避免干扰 */
	}

	.image-item img {
		width: 100%;
		height: auto;
		display: block;
		object-fit: cover;
		border-radius: 8px;
	}


	.long-image-item img {
		width: 100%;
		height: auto;
		display: block;
		border-radius: 8px;
		box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
		transition: transform 0.3s ease;
	}

	/* 👇 关键：清除 nth-child 的列定位 */
	.image-item:nth-child(1),
	.image-item:nth-child(2),
	.image-item:nth-child(3) {
		grid-column: 1 / -1 !important;
	}
	.section-subtitle {
		padding: 0  20px;
	}
    /* ========== 移动端：全球化品质 ========== */
    .ability-global-wrapper {
    	padding: 0 40px;   /* 可选：增加内边距提升移动端可读性 */
        flex-direction: column;
        gap: 0px;
    }

	/* 缩小“质量管理特点”与下方内容的距离 */
	.quality-global-items {
    	margin-top: 0px; /* 或 10px / 0，根据设计需求 */
	}

    .ability-global-title,
    .ability-global-content {
        flex: none;
        width: 100%;
        text-align: left;
    } 
  
  	.ability-global-subtitle br {
    	display: none;
  	}

}
@media (max-width: 927px) {/* ========== 200% ========== */
    /* ========== 移动端：创新设计 ========== */
	
    /* ========== 移动端：智能制造 ========== */
	
    /* ========== 移动端：全球化品质 ========== */
	
	
}

@media (max-width: 649px) {/* ========== 280% ========== */
    /* ========== 移动端：创新设计 ========== */
	/* 时间轴 - 移动端优化 */
	/* 如果需要一点间距，可以用 timeline 容器加 margin-top，而不是 h2 */
	.timeline {
		margin-top: 10px; /* 可选：标题和时间轴之间留点空隙 */
		flex-direction: row;
		justify-content: space-between;
		gap: 10px;
		align-items: center;
		padding: 0 10px;
	}
	
	.timeline-hero {
		 margin-top: 0 !important; /* 确保无外边距 */
		 padding-top: 0;
	}

	.timeline-overlay {
		padding: 10px 20px 20px; /* 上内边距减到最小，甚至可设为 0 */
		justify-content: flex-start; /* ← 关键：不要居中，而是从顶部开始 */

	}

	.timeline-container h2 {
		font-size: 1.0rem;
		margin: 0;           /* 清除所有 margin */
		padding: 0;          /* ← 关键：padding-top 和 padding-bottom 都归零 */
		text-align: left;
		color: #000;
	}

	.timeline-item {
		min-width: 60px;
		flex: 1 1 calc(50% - 10px);
	}

	.year {
		font-size: 0.9rem;
		font-weight: bold;
		margin-bottom: 1px;
		color: #000;
	}

	.content {
		font-size: 0.4rem;
		line-height: 1.4;
		color: #000;
		white-space: normal;
	}
	/* 时间轴 - 移动端优化 */
	.ability-subtitle {
		font-size: 1.4rem;
	}
	.ability-description {
		font-size: 1.2rem;
	}
	.ability-list {
		font-size: 1.2rem;
	}
	/* 英文时缩小间距 */
	body.lang-en .banner-content h1 {
		font-size: clamp(1.5rem, 3vw, 2rem); /* 响应式字体 */
		font-weight: 700;
	}
    /* ========== 移动端：智能制造 ========== */


    /* ========== 移动端：全球化品质 ========== */
	.ability-global-subtitle {
		font-size: 1.4rem;
		
	}
	.ability-global-description {
		font-size: 1.2rem;
	}
	
	body.lang-en .ability-global-subtitle br {
    	 display: block !important;
  	}
}

@media (max-width: 525px) {/* ========== 350% ========== */
    /* ========== 移动端：创新设计 ========== */
	
    /* ========== 移动端：智能制造 ========== */
	
    /* ========== 移动端：全球化品质 ========== */
	
	
}

@media (max-width: 428px) {/* ========== 450% ========== iphone 12/13 pro max 428*926 ========== */
    /* ========== 移动端：创新设计 ========== */
	/* 时间轴 - 移动端优化 */
	/* 如果需要一点间距，可以用 timeline 容器加 margin-top，而不是 h2 */
	.timeline {
		margin-top: 10px; /* 可选：标题和时间轴之间留点空隙 */
		flex-direction: row;
		justify-content: space-between;
		gap: 10px;
		align-items: center;
		padding: 0 10px;
	}
	
	.timeline-hero {
		 margin-top: 0 !important; /* 确保无外边距 */
		 padding-top: 0;
	}

	.timeline-overlay {
		padding: 10px 20px 20px; /* 上内边距减到最小，甚至可设为 0 */
		justify-content: flex-start; /* ← 关键：不要居中，而是从顶部开始 */

	}

	.timeline-container h2 {
		font-size: 1.0rem;
		margin: 0;           /* 清除所有 margin */
		padding: 0;          /* ← 关键：padding-top 和 padding-bottom 都归零 */
		text-align: left;
		color: #000;
	}

	.timeline-item {
		min-width: 60px;
		flex: 1 1 calc(50% - 10px);
	}

	.year {
		font-size: 0.9rem;
		font-weight: bold;
		margin-bottom: 1px;
		color: #000;
	}

	.content {
		font-size: 0.4rem;
		line-height: 1.4;
		color: #000;
		white-space: normal;
	}
	/* 时间轴 - 移动端优化 */
	.ability-subtitle {
		font-size: 1.4rem;
	}
	.ability-description {
		font-size: 1.2rem;
	}
	.ability-list {
		font-size: 1.2rem;
	}
	/* 英文时缩小间距 */
	body.lang-en .banner-content h1 {
		font-size: clamp(1.5rem, 3vw, 2rem); /* 响应式字体 */
		font-weight: 700;
	}
    /* ========== 移动端：智能制造 ========== */
	.section-subtitle {
		padding: 0  20px;
	}

    /* ========== 移动端：全球化品质 ========== */
	.ability-global-subtitle {
		font-size: 1.4rem;
		
	}
	.ability-global-description {
		font-size: 1.2rem;
	}
	
	body.lang-en .ability-global-subtitle br {
    	 display: block !important;
  	}

}
@media (max-width: 414px) {
    /* ========== 移动端：创新设计 ========== */
	
    /* ========== 移动端：智能制造 ========== */
	
    /* ========== 移动端：全球化品质 ========== */
	
	
}

@media (max-width: 412px) {
    /* ========== 移动端：创新设计 ========== */
	
    /* ========== 移动端：智能制造 ========== */
	
    /* ========== 移动端：全球化品质 ========== */
	
	
}

@media (max-width: 390px) {
    /* ========== 移动端：创新设计 ========== */
	
    /* ========== 移动端：智能制造 ========== */
	
    /* ========== 移动端：全球化品质 ========== */
	
	
}

@media (max-width: 384px) {
    /* ========== 移动端：创新设计 ========== */
	
    /* ========== 移动端：智能制造 ========== */
	
    /* ========== 移动端：全球化品质 ========== */
	
	
}

@media (max-width: 360px) {
    /* ========== 移动端：创新设计 ========== */
	
    /* ========== 移动端：智能制造 ========== */
	
    /* ========== 移动端：全球化品质 ========== */
	
	/* 一高一低交错 */
	.timeline-item.odd {
		transform: translateY(-10px);
	}
	.timeline-item.even {
		transform: translateY(10px);
	}


}