/* ============================================================
   NAVAN-MACHINE 主样式
   设计基准: 桌面端优先(Desktop First),移动端在 @media (max-width:767px) 里覆盖
   ============================================================ */

:root {
	/* ---- 品牌色板 ---- */
	--color-primary: #1B34AA;
	--color-primary-dark: #142A8A;
	--color-secondary: #E8EDF9;
	--color-accent: #F5A623;
	--color-highlight-2: #5B8DEF; /* 第二高亮色,目前用在着陆页底部CTA的标题高亮上,和--color-accent的橙色区分开,和深蓝渐变背景对比度更好;如果想换别的颜色,改这一个变量就行 */
	--color-dark: #0A0A1A;
	--color-text: #3D4452;
	--color-text-light: #6B7280; /* 在Text基础上做的浅一级辅助色,用于说明性文字 */
	--color-bg-light: #FAFAFC;
	--color-border: #E2E6EA;
	--color-white: #ffffff;

	/* ---- 排版 ---- */
	--font-en: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
	--font-cn: 'Noto Sans SC', "PingFang SC", "Microsoft YaHei", sans-serif;
	--font-base: var(--font-en), var(--font-cn);

	/* ---- 布局与间距(8px基准) ---- */
	--container-width: 1240px;
	--space-xs: 8px;
	--space-sm: 16px;
	--space-md: 24px;
	--space-lg: 40px;
	--space-xl: 80px;

	/* ---- 圆角 ---- */
	--radius-btn: 6px;   /* 按钮/卡片 */
	--radius-lg: 12px;   /* 大图轮播类组件 */
	--radius-pill: 20px; /* 标签/徽标(胶囊型) */

	--transition: 0.25s ease;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }

/* 无障碍: "跳转到内容"链接,默认视觉隐藏,键盘Tab聚焦时才显示出来,方便屏幕阅读器/键盘用户跳过导航直达正文 */
.skip-link {
	position: absolute; left: -9999px; top: 0;
	background: var(--color-primary); color: #fff;
	padding: 12px 20px; z-index: 999;
	font-weight: 600; border-radius: 0 0 var(--radius-btn) 0;
}
.skip-link:focus { left: 0; }

body {
	margin: 0;
	font-family: var(--font-base);
	color: var(--color-text);
	font-size: 16px;
	line-height: 1.7; /* Body行高 */
	background: var(--color-bg-light);
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
ul { margin: 0; padding: 0; list-style: none; }

/* ---- 标题层级(字号层级表: 桌面端数值,移动端在底部媒体查询里覆盖) ---- */
h1, h2, h3, h4 { margin: 0 0 0.5em; font-weight: 700; color: var(--color-dark); }
.highlight { color: var(--color-primary); } /* {{}}高亮语法的默认颜色,特定场景(如Hero)可以用更具体的选择器覆盖成别的颜色 */
h1 { font-size: 36px; line-height: 1.2; }
h2 { font-size: 30px; line-height: 1.3; }
h3 { font-size: 22px; line-height: 1.4; }
h4 { font-size: 18px; line-height: 1.5; }
small, .text-small { font-size: 14px; line-height: 1.5; }

.container {
	max-width: var(--container-width);
	margin: 0 auto;
	padding: 0 var(--space-sm);
}

/* ---- CTA按钮规范 ---- */
.btn {
	display: inline-block;
	border-radius: var(--radius-btn);
	font-weight: 600;
	font-size: 16px;
	transition: background var(--transition), color var(--transition), transform var(--transition), box-shadow var(--transition), border-color var(--transition);
	cursor: pointer;
	border: 1px solid transparent;
}
.btn--primary {
	background: var(--color-primary); color: #fff;
	padding: 14px 36px;
}
.btn--primary:hover {
	background: var(--color-primary-dark);
	transform: translateY(-2px);
	box-shadow: 0 8px 20px rgba(27,52,170,0.25);
}
.btn--accent {
	background: var(--color-accent); color: var(--color-dark);
	padding: 14px 36px;
}
.btn--accent:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 20px rgba(245,166,35,0.3);
}
.btn--outline {
	background: transparent; border-color: var(--color-primary); color: var(--color-primary);
	padding: 12px 34px;
}
.btn--outline:hover { background: var(--color-primary); color: #fff; }

.section { padding: var(--space-xl) 0; }
.section__heading { text-align: center; max-width: 700px; margin: 0 auto var(--space-lg); }
.section__heading h2 { font-size: 30px; }
.section__heading p { color: var(--color-text-light); }
.section__heading--light h2,
.section__heading--light p { color: #fff; }
.section__heading--split { display: flex; justify-content: space-between; align-items: flex-start; text-align: left; max-width: none; }
.section__tag { color: var(--color-primary); font-weight: 600; text-transform: uppercase; font-size: 13px; }

/* ---------- Top bar(顶部信息条: 只在电脑端/平板端显示,手机端隐藏见底部媒体查询) ---------- */
.top-bar { background: var(--color-dark); color: #cfd3dc; font-size: 13px; }
.top-bar__inner { display: flex; justify-content: space-between; align-items: center; height: 38px; }
.top-bar__slogan { display: flex; align-items: center; gap: var(--space-xs); }
.top-bar__contact { display: flex; align-items: center; gap: var(--space-md); }
.top-bar__contact a { display: inline-flex; align-items: center; gap: 6px; color: #cfd3dc; }
.top-bar__contact a:hover { color: #fff; }
.top-bar__search-toggle {
	background: none; border: none; color: #cfd3dc; cursor: pointer;
	display: flex; align-items: center; justify-content: center;
	padding: 4px; margin: 0; appearance: none; -webkit-appearance: none;
	width: auto; height: auto; line-height: 1;
}
.top-bar__search-toggle:hover { color: #fff; }
.top-bar i { font-size: 13px; }

/* ---------- Header / Nav (吸顶: 滚动时导航固定在顶部, top-bar随页面滚走) ---------- */
.site-header {
	background: #fff;
	box-shadow: 0 1px 6px rgba(0,0,0,0.06);
	position: sticky;
	top: 0;
	z-index: 200;
	transition: box-shadow 0.2s ease;
}
.site-header.is-scrolled { box-shadow: 0 4px 16px rgba(0,0,0,0.1); }
.site-header__inner { display: flex; align-items: center; justify-content: space-between; height: 78px; gap: var(--space-md); }

/* Logo: 图标(自定义Logo图片,如果有的话) + 站点标题文字,两者并排一起显示,不是二选一 */
.site-header__logo { display: flex; align-items: center; flex-shrink: 0; }
.site-header__logo-link { display: flex; align-items: center; gap: 10px; }
.site-header__logo-img { max-height: 44px; width: auto; display: block; }
.site-header__logo-text {
	font-weight: 800; font-size: 20px; color: var(--color-dark);
	white-space: nowrap;
}
.site-header__logo-text--accent { color: var(--color-primary); }

.primary-menu { display: flex; gap: var(--space-lg); height: 100%; }
.primary-menu > li { position: relative; } /* 普通下拉菜单相对自己定位,展开后正好在一级菜单项正下方 */
.primary-menu > li.mega-menu { position: static; } /* 仅Product这一项例外: static让它的全宽面板改为相对.site-header(带position:sticky,天然占满整个视口宽度)定位,而不是相对这个较窄的li */
.menu-link.menu-depth-0 {
	display: flex; align-items: center; gap: 4px;
	height: 78px; font-weight: 600; font-size: 16px; color: var(--color-text);
	border-bottom: 2px solid transparent;
	white-space: nowrap;
}
.primary-menu > li:hover > .menu-link,
.primary-menu > li.current-menu-item > .menu-link {
	color: var(--color-primary);
	border-bottom-color: var(--color-primary);
}
.menu-caret { width: 8px; height: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); margin-top: -4px; }
.site-header__mobile-toggle { display: none; } /* 默认(电脑/平板)隐藏,手机端断点里改为flex显示 */

/* ---------- 下拉菜单(普通,非mega menu的项,如Solution/Service/About/Resources)
   position:absolute + top:100%,相对自己的父级<li>定位,正好紧贴在一级菜单项正下方
   跟Product的Mega Menu做了明显区分: 白底+顶部主色细线+小圆点项目符号,不是浅蓝色满宽面板 ---------- */
.sub-menu-panel {
	display: none;
	position: absolute;
	top: 100%; left: 0;
	background: #fff;
	border-top: 3px solid var(--color-primary);
	box-shadow: 0 14px 28px rgba(10,10,26,0.14);
	min-width: 240px;
	padding: 10px 0;
	border-radius: 0 0 var(--radius-btn) var(--radius-btn);
}
.sub-menu-panel .sub-menu-depth-1 { display: block; }
.sub-menu-panel .sub-menu-depth-1 > li { margin: 0; }
.sub-menu-panel .menu-link.menu-depth-1 {
	display: flex; align-items: center; gap: 8px;
	padding: 9px 22px; font-weight: 600; color: var(--color-text);
	font-size: 16px; line-height: 1.4;
}
.sub-menu-panel .menu-link.menu-depth-1::before {
	content: ''; width: 4px; height: 4px; border-radius: 50%; background: var(--color-border); flex-shrink: 0;
	transition: background var(--transition);
}
.sub-menu-panel .menu-link.menu-depth-1:hover { background: var(--color-secondary); color: var(--color-primary); }
.sub-menu-panel .menu-link.menu-depth-1:hover::before { background: var(--color-primary); }

/* ---------- Mega Menu(仅Product菜单项,加了 mega-menu 这个CSS Class的项)
   position:absolute + top:100%,相对.site-header(全宽、position:sticky)定位,
   天然贴合在导航条正下方,不管顶部信息条是否还在视口内都不会错位/遮挡导航 ---------- */
.menu-item-has-children.mega-menu .sub-menu-panel {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	min-width: 0;
	border-top: none;
	background: var(--color-secondary);
	box-shadow: 0 10px 30px rgba(0,0,0,0.12);
	padding: var(--space-xl) 0;
	border-radius: 0;
}
.menu-item-has-children.mega-menu .sub-menu-panel .sub-menu-depth-1 {
	max-width: var(--container-width);
	margin: 0 auto;
	padding: 0 var(--space-sm);
	columns: 3;
	column-gap: 60px;
}
.menu-item-has-children:hover > .sub-menu-panel { display: block; }

/* 系列分组(depth 1): 图标在上,标题在下,整组不允许被多列布局从中间截断 */
.mega-menu-group {
	break-inside: avoid;
	margin-bottom: var(--space-lg);
}
.mega-menu-group > .menu-link.menu-depth-1 {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--space-xs);
	margin-bottom: 14px;
}
.mega-menu-group > .menu-link.menu-depth-1::before { display: none; } /* 排除普通下拉菜单的小圆点符号,mega menu用图标代替 */
.mega-menu-group > .menu-link.menu-depth-1:hover .menu-link__text { color: var(--color-primary-dark); text-decoration: underline; }
.mega-menu-group .menu-item-icon { height: 80px; width: auto; object-fit: contain; }
.mega-menu-group > .menu-link.menu-depth-1 .menu-link__text {
	font-size: 18px; font-weight: 700; color: var(--color-primary);
}

/* 具体产品(depth 2): 纯文字列表,可点击 */
.sub-menu-depth-2 { margin-left: 0; }
.sub-menu-depth-2 .menu-link.menu-depth-2 {
	display: block; padding: 6px 0; font-size: 15px; color: var(--color-text-light); pointer-events: auto;
}
.sub-menu-depth-2 .menu-link.menu-depth-2:hover { color: var(--color-primary); }

/* ---------- Hero (静态背景大图 + iconbox + H1 + 描述 + 双按钮 + 右侧产线图) ---------- */
.hero { position: relative; overflow: hidden; display: flex; align-items: center; }
.hero__bg { position: absolute; inset: 0; z-index: 0; }
.hero__bg img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero__inner {
	position: relative; z-index: 1;
	display: flex; align-items: center; justify-content: space-between; gap: var(--space-lg);
	padding: 100px var(--space-sm); /* 明确的上下100px,不再用--space-xl(80px)变量 */
}
.hero__content { flex: 1; min-width: 0; }
.hero__iconbox {
	display: inline-flex; align-items: center; gap: var(--space-xs);
	background: var(--color-primary); color: rgba(255,255,255,0.9);
	padding: 6px 16px; border-radius: var(--radius-pill); font-weight: 600; font-size: 14px;
	margin-bottom: var(--space-sm);
}
.hero__iconbox i { font-size: 14px; color: var(--color-accent); }

/* H1: 桌面端固定单行显示,字号用clamp随视口宽度自动缩放,避免在较窄的桌面窗口下溢出换行 */
.hero__title {
	font-size: clamp(30px, 3vw, 48px);
	line-height: 1.2;
}
.hero__title .highlight { color: var(--color-accent); } /* 去掉了错误的 display:block,这是之前导致强制换行的bug */
.hero__desc { color: var(--color-text-light); max-width: 480px; margin-bottom: var(--space-md); }
.hero__actions { display: flex; gap: var(--space-sm); flex-wrap: wrap; }
.hero__side-image { flex: 1; max-width: 620px; }
.hero__side-image img { width: 100%; height: auto; }

/* 手机端: 背景图会通过 <picture> 的 source 自动切换为竖版素材,
   这里再把内容区改成纵向堆叠、右侧产线图收窄,避免和文字重叠;
   H1在手机端允许正常换行(屏幕太窄,单行不现实) */
@media (max-width: 767px) {
	.hero__inner { flex-direction: column; text-align: center; padding: 100px var(--space-sm); }
	.hero__content { max-width: 100%; }
	.hero__title { font-size: 32px; white-space: normal; }
	.hero__actions { justify-content: center; }
	.hero__side-image { max-width: 320px; }
}


/* ---------- Card grid (热销机械 / 解决方案 共用) ---------- */
.card-grid { display: grid; gap: var(--space-md); }
.card-grid--3col { grid-template-columns: repeat(3, 1fr); }
.card-grid--4col { grid-template-columns: repeat(4, 1fr); }
.card-grid--solutions { grid-template-columns: repeat(3, 1fr); }
.navan-card { display: block; position: relative; border-radius: var(--radius-btn); overflow: hidden; background: #fff; border: 1px solid var(--color-border); }
.navan-card__image { position: relative; }
.navan-card__image img { width: 100%; aspect-ratio: 4/3; object-fit: cover; }
.navan-card--navan-card .navan-card__image img { aspect-ratio: 1/1; } /* 产品卡片(1:1),对应"产品卡片缩略图"规范 */
.navan-card--navan-solution .navan-card__image img { aspect-ratio: 3/2; } /* 解决方案卡片(3:2) */
.navan-card--navan-thumb-85 .navan-card__image img { aspect-ratio: 8/5; } /* 热销机械卡片(8:5) */
.navan-card__title { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 16px; font-weight: 600; transition: background var(--transition), color var(--transition); }
.navan-card__bar { color: var(--color-accent); margin-right: 4px; }

/* light样式(热销机械): 悬停时标题条变成主色高亮,右侧箭头图标滑入显示 */
.navan-card__arrow { display: inline-flex; opacity: 0; transform: translateX(-6px); transition: opacity var(--transition), transform var(--transition); }
.navan-card--light:hover .navan-card__title { background: var(--color-primary); color: #fff; }
.navan-card--light:hover .navan-card__bar { color: var(--color-accent); }
.navan-card--light:hover .navan-card__arrow { opacity: 1; transform: translateX(0); }

/* dark / dark-large样式(解决方案): 图片底部叠一层"透明→主色"渐变,标题置底,悬停时图片放大 */
.navan-card--dark .navan-card__image,
.navan-card--dark-large .navan-card__image { position: relative; overflow: hidden; }
.navan-card--dark .navan-card__image img,
.navan-card--dark-large .navan-card__image img { transition: transform 0.4s ease; }
.navan-card--dark:hover .navan-card__image img,
.navan-card--dark-large:hover .navan-card__image img { transform: scale(1.08); }
.navan-card--dark .navan-card__image::after,
.navan-card--dark-large .navan-card__image::after {
	content: '';
	position: absolute; inset: 0;
	background: linear-gradient(to bottom, rgba(27,52,170,0) 40%, rgba(27,52,170,0.92) 100%);
}
.navan-card--dark .navan-card__title,
.navan-card--dark-large .navan-card__title {
	position: absolute; bottom: 0; top: auto; left: 0; right: 0; z-index: 1;
	background: none;
	padding: var(--space-md);
	display: block;
}
.navan-card--dark .navan-card__label,
.navan-card--dark-large .navan-card__label {
	color: #fff; font-size: 18px; font-weight: 700; line-height: 1.4;
	text-shadow: 0 2px 8px rgba(0,0,0,0.35); /* 标题换行较长、超出渐变范围时依然保持可读 */
}
.navan-card--dark .navan-card__arrow,
.navan-card--dark-large .navan-card__arrow { display: none; } /* 解决方案卡片不需要箭头交互 */
.navan-card--dark, .navan-card--dark-large { border: none; }
.navan-card--dark-large { grid-row: span 2; grid-column: span 1; }

/* ---------- About ---------- */
.about { background: var(--color-white); } /* 屏幕全宽白色背景,section本身就是最外层块级元素,天然占满整个视口宽度 */
.about__stats { display: flex; justify-content: space-around; text-align: center; margin-bottom: var(--space-lg); }
.about__stat-number { display: block; font-size: 32px; font-weight: 700; color: var(--color-primary); }
/* 全屏宽度横线(用负margin打破.container的限宽,常见的"full-bleed"技巧) */
.about__divider {
	border: none; border-top: 1px solid var(--color-border);
	margin: 0 calc(50% - 50vw) var(--space-lg);
	width: 100vw;
}
.about__grid { display: flex; gap: var(--space-lg); align-items: flex-start; }
.about__content, .about__media { flex: 1; }
.about__main-image { border-radius: var(--radius-lg); margin-bottom: var(--space-sm); }
.about__video-trigger {
	position: relative; display: block; width: 100%; padding: 0; border: none; background: none; cursor: pointer;
}
.about__video-trigger .about__main-image { margin-bottom: var(--space-sm); }
.about__play-icon {
	position: absolute; top: calc(50% - 12px); left: 50%; transform: translate(-50%, -50%);
	width: 76px; height: 76px; border-radius: 50%;
	background: rgba(255,255,255,0.92); color: var(--color-primary);
	display: flex; align-items: center; justify-content: center;
	font-size: 26px; transition: transform var(--transition), background var(--transition);
}
.about__video-trigger:hover .about__play-icon { transform: translate(-50%, -50%) scale(1.08); background: #fff; }
.about__gallery { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-xs); }
.about__gallery-item { display: block; padding: 0; border: none; background: none; cursor: pointer; overflow: hidden; border-radius: var(--radius-btn); }
.about__gallery-item img { border-radius: var(--radius-btn); transition: transform var(--transition); aspect-ratio: 8/5; object-fit: cover; width: 100%; }
.about__gallery-item:hover img { transform: scale(1.06); }

/* ---------- 通用灯箱弹窗(视频 + 图片全屏查看共用) ---------- */
.navan-lightbox {
	display: none;
	position: fixed; inset: 0; z-index: 500;
	background: rgba(10,10,26,0.92);
	align-items: center; justify-content: center;
}
.navan-lightbox.is-open { display: flex; }
.navan-lightbox__content {
	max-width: 90vw; max-height: 85vh;
	display: flex; align-items: center; justify-content: center;
}
.navan-lightbox__content img { max-width: 90vw; max-height: 85vh; width: auto; height: auto; border-radius: var(--radius-btn); }
.navan-lightbox.is-video .navan-lightbox__content { width: min(90vw, 1100px); aspect-ratio: 16/9; max-height: 85vh; }
.navan-lightbox.is-video .navan-lightbox__content iframe { width: 100%; height: 100%; border-radius: var(--radius-btn); }
.navan-lightbox__close,
.navan-lightbox__prev,
.navan-lightbox__next {
	position: fixed;
	background: rgba(255,255,255,0.12); color: #fff; border: none; border-radius: 50%;
	display: flex; align-items: center; justify-content: center; cursor: pointer;
	transition: background var(--transition);
}
.navan-lightbox__close:hover,
.navan-lightbox__prev:hover,
.navan-lightbox__next:hover { background: rgba(255,255,255,0.25); }
.navan-lightbox__close { top: 24px; right: 24px; width: 44px; height: 44px; font-size: 26px; line-height: 1; }
.navan-lightbox__prev,
.navan-lightbox__next { top: 50%; transform: translateY(-50%); width: 52px; height: 52px; font-size: 30px; }
.navan-lightbox__prev { left: 24px; }
.navan-lightbox__next { right: 24px; }

@media (max-width: 767px) {
	.navan-lightbox__prev, .navan-lightbox__next { width: 40px; height: 40px; font-size: 22px; }
	.navan-lightbox__close { width: 36px; height: 36px; font-size: 20px; top: 14px; right: 14px; }
}

/* ---------- Why Choose (背景图 + 半透明主色蒙层,而非纯色) ---------- */
.why-choose {
	background-color: var(--color-primary); /* 没设置背景图时的兜底色 */
	background-size: cover;
	background-position: center;
	position: relative;
}
.why-choose::before {
	content: '';
	position: absolute; inset: 0;
	background: rgba(27, 52, 170, 0.85);
}
.why-choose .container { position: relative; z-index: 1; }
.why-choose__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-lg); text-align: center; }
.why-choose__icon {
	display: inline-flex; width: 60px; height: 60px; border-radius: 50%;
	background: #fff; align-items: center; justify-content: center; margin-bottom: var(--space-sm);
}
.why-choose__icon i { font-size: 24px; color: var(--color-primary); }
.why-choose__item h3, .why-choose__item p { color: #fff; }
.why-choose__more { color: #fff; text-decoration: underline; }

/* ---------- Customer Satisfaction ---------- */
.customer-satisfaction__heading { text-align: left; max-width: none; }
.customer-satisfaction__heading-row { display: flex; justify-content: space-between; align-items: center; gap: var(--space-md); }
.customer-satisfaction__heading-row h2 { margin-bottom: 0; }
.customer-satisfaction__heading h3,
.customer-satisfaction__heading p { max-width: none; width: 100%; } /* 副标题和描述占满container全宽,不受右侧View More挤压 */
.customer-satisfaction__gallery { display: grid; grid-template-columns: repeat(6, 1fr); gap: var(--space-xs); margin: var(--space-md) 0 var(--space-lg); }
.customer-satisfaction__gallery-item { display: block; padding: 0; border: none; background: none; cursor: pointer; overflow: hidden; border-radius: var(--radius-btn); }
.customer-satisfaction__gallery-item img { border-radius: var(--radius-btn); aspect-ratio: 8/5; object-fit: cover; width: 100%; transition: transform var(--transition); }
.customer-satisfaction__gallery-item:hover img { transform: scale(1.06); }
.customer-satisfaction__brands { display: grid; grid-template-columns: repeat(9, 1fr); gap: var(--space-sm); align-items: center; }
.customer-satisfaction__brands img { filter: grayscale(100%); opacity: 0.7; transition: filter var(--transition), opacity var(--transition); }
.customer-satisfaction__brands img:hover { filter: grayscale(0%); opacity: 1; }

/* ---------- Latest News ---------- */
.latest-news { background: var(--color-white); } /* 屏幕全宽白色背景 */
.latest-news__exhibition h3,
.latest-news__articles h3 { color: var(--color-primary); }
.latest-news__grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-lg); }
.exhibition-card__image { width: 100%; height: auto; display: block; border-radius: var(--radius-btn); } /* 原图原比例,不裁切不拉伸 */
.article-row { display: flex; gap: var(--space-sm); padding: var(--space-sm) 0; border-bottom: 1px solid var(--color-border); }
.article-row img { width: 80px; height: 60px; object-fit: cover; border-radius: var(--radius-btn); }
.article-row__title { display: block; font-weight: 600; }
.article-row__date { display: block; color: var(--color-text-light); font-size: 13px; }

/* ---------- Footer ---------- */
.site-footer { background: #12184A; color: #c3c8e0; padding-top: var(--space-xl); font-size: 14px; } /* 页脚正文统一14px,标题(h4)单独设了22px不受影响 */
.site-footer__grid { display: grid; grid-template-columns: 1.5fr 1.5fr 1fr 1.5fr; gap: var(--space-lg); padding-bottom: var(--space-lg); }
.site-footer h4 { color: #fff; font-size: 22px; margin-bottom: var(--space-md); }

/* Logo: 图标 + 站点标题(白色),逻辑跟header一致 */
.site-footer__logo { display: flex; align-items: center; gap: 12px; margin-bottom: var(--space-md); }
.site-footer__logo-img { max-height: 48px; width: auto; display: block; }
.site-footer__logo-text { font-weight: 800; font-size: 22px; color: #fff; white-space: nowrap; }
.site-footer__desc { margin-bottom: var(--space-md); line-height: 1.7; }

/* 社媒图标: 圆形彩色徽标,按class名自动匹配对应品牌色(需要现代浏览器支持:has(),否则统一显示中性灰底) */
.site-footer__social { display: flex; gap: var(--space-sm); }
.social-icon {
	display: flex; align-items: center; justify-content: center;
	width: 40px; height: 40px; border-radius: 50%;
	background: #4a5178; color: #fff; font-size: 16px;
	transition: transform var(--transition), background var(--transition);
}
.social-icon:hover { transform: translateY(-2px); }
.social-icon:has(.fa-facebook) { background: #1877F2; }
.social-icon:has(.fa-youtube)  { background: #FF0000; }
.social-icon:has(.fa-tiktok)   { background: #010101; }
.social-icon:has(.fa-vk)       { background: #0077FF; }
.social-icon:has(.fa-whatsapp) { background: #25D366; }
.social-icon:has(.fa-linkedin) { background: #0A66C2; }
.social-icon:has(.fa-instagram){ background: #E4405F; }
.social-icon:has(.fa-x-twitter){ background: #000000; }

/* Product Link / Fast Link: 列表前面加图标前缀(用Font Awesome的图标字体,不需要额外HTML) */
.footer-menu li { margin-bottom: var(--space-sm); }
.footer-menu a { color: #c3c8e0; display: flex; align-items: center; gap: 10px; }
.footer-menu a:hover { color: #fff; }
.footer-menu--dot a::before {
	font-family: "Font Awesome 6 Free"; font-weight: 900; content: "\f192"; /* fa-circle-dot */
	font-size: 13px; color: #7C86C4; flex-shrink: 0;
}
.footer-menu--arrow a::before {
	font-family: "Font Awesome 6 Free"; font-weight: 900; content: "\f0da"; /* fa-caret-right */
	font-size: 14px; color: #7C86C4; flex-shrink: 0;
}

.site-footer__bottom { background: var(--color-dark); border-top: none; padding: var(--space-sm) 0; font-size: 13px; }
.site-footer__bottom-inner { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: var(--space-sm); }
.site-footer__bottom-links { display: flex; gap: var(--space-sm); }
.site-footer__bottom-links a { text-decoration: underline; }
.site-footer__bottom-links a:hover { color: #fff; }
.site-footer__icp { display: inline-flex; align-items: center; gap: 6px; color: inherit; }
.site-footer__icp:hover { color: #fff; }
.site-footer__icp-icon { width: 18px; height: 18px; object-fit: contain; }

.footer-contact-item { display: flex; align-items: flex-start; gap: var(--space-xs); margin: 0 0 var(--space-sm); }
.footer-contact-item i { margin-top: 3px; color: #b7c0e8; width: 16px; text-align: center; }
.footer-contact-item a { color: #c3c8e0; }
.footer-contact-item a:hover { color: #fff; }
.footer-contact-item__label { font-weight: 600; color: #fff; }

/* ---------- FAQ 手风琴 ---------- */
.faq-accordion { max-width: 800px; margin: 0 auto; padding: var(--space-lg) var(--space-sm) var(--space-xl); }
.faq-item { border-bottom: 1px solid var(--color-border); }
.faq-item__question {
	width: 100%; display: flex; justify-content: space-between; align-items: center;
	background: none; border: none; text-align: left; padding: var(--space-md) 0;
	font-size: 17px; font-weight: 600; cursor: pointer; color: var(--color-text);
}
.faq-item__caret { transition: transform 0.25s ease; color: var(--color-primary); }
.faq-item.is-open .faq-item__caret { transform: rotate(180deg); }
.faq-item__answer { max-height: 0; overflow: hidden; transition: max-height 0.3s ease; }
.faq-item__answer-inner { padding-bottom: var(--space-md); color: var(--color-text-light); }

/* ---------- 平板/中等屏幕响应式 ---------- */
@media (max-width: 991px) {
	.card-grid--3col, .card-grid--4col, .card-grid--solutions, .why-choose__grid,
	.latest-news__grid, .site-footer__grid { grid-template-columns: repeat(2, 1fr); }
	.about__grid { flex-direction: column; }
}

/* ---------- 导航汉堡菜单断点(≤1024px,覆盖iPad横竖屏+手机端,和手机端保持一致的交互) ---------- */
@media (max-width: 1024px) {
	.site-header__inner { height: 64px; }
	.site-header__lang { order: 2; }
	.site-header__mobile-toggle {
		order: 3;
		display: flex; align-items: center; justify-content: center;
		width: 40px; height: 40px; margin-left: var(--space-xs);
		background: none; border: none; font-size: 20px; color: var(--color-text); cursor: pointer;
	}
	.lang-switcher__caret { display: none; } /* 简化,不显示下拉小箭头,节省空间 */

	/* 主导航默认收起,点击汉堡按钮后加 is-open 才展开 */
	.site-header__nav {
		display: none;
		position: fixed;
		top: 64px; left: 0; right: 0; bottom: 0;
		width: 100%;
		background: #fff;
		overflow-y: auto;
		z-index: 190;
		border-top: 1px solid var(--color-border);
	}
	.site-header__nav.is-open { display: block; }

	.primary-menu { flex-direction: column; height: auto; gap: 0; }
	.primary-menu > li { border-bottom: 1px solid var(--color-border); }

	/* 一级菜单: 加粗,横向占满,右侧带展开箭头 */
	.menu-link.menu-depth-0 {
		height: auto; padding: var(--space-sm) var(--space-sm);
		font-weight: 700; border-bottom: none;
		justify-content: space-between;
	}
	.menu-caret { margin-top: 0; }

	/* 子菜单面板: 取消fixed定位/多列布局,变成手风琴式纵向展开 */
	.sub-menu-panel,
	.menu-item-has-children.mega-menu .sub-menu-panel {
		display: none;
		position: static;
		width: 100%;
		min-width: 0;
		box-shadow: none;
		padding: 0;
		background: var(--color-bg-light);
		border-radius: 0;
		border-top: none;
	}
	.primary-menu > li.is-mobile-open > .sub-menu-panel { display: block; }

	/* 二级菜单: 缩进 */
	.sub-menu-panel .sub-menu-depth-1,
	.menu-item-has-children.mega-menu .sub-menu-panel .sub-menu-depth-1 {
		columns: 1; max-width: none; padding: 0;
	}
	.sub-menu-panel .menu-link.menu-depth-1 {
		padding: 12px var(--space-sm) 12px 36px;
		font-weight: 600;
	}
	.sub-menu-panel .menu-link.menu-depth-1::before { display: none; } /* 手风琴模式不需要小圆点 */
	.mega-menu-group { margin-bottom: 0; break-inside: auto; }
	.mega-menu-group > .menu-link.menu-depth-1 {
		flex-direction: row; align-items: center; gap: var(--space-xs);
		padding: 12px var(--space-sm) 12px 36px; margin-bottom: 0;
	}
	.mega-menu-group .menu-item-icon { width: 24px; height: 24px; }

	/* 三级菜单(具体产品): 进一步缩进 */
	.sub-menu-depth-2 .menu-link.menu-depth-2 {
		padding: 10px var(--space-sm) 10px 56px;
	}
}

/* ---------- 平板端(768px-1024px): 字号比桌面端小一档,H1>H2>H3>H4层级依然保持 ---------- */
@media (min-width: 768px) and (max-width: 1024px) {
	h1 { font-size: 34px; line-height: 1.2; }
	h2 { font-size: 27px; line-height: 1.3; }
	h3 { font-size: 21px; line-height: 1.4; }
	h4 { font-size: 17px; line-height: 1.5; }
	.section__heading h2 { font-size: 27px; }
}

/* Customer Satisfaction小图/Logo墙: 平板+手机统一按这个断点处理(不区分两档,同一份规则覆盖两端) */
@media (max-width: 1024px) {
	.customer-satisfaction__gallery { grid-template-columns: repeat(3, 1fr); }
	.customer-satisfaction__brands { grid-template-columns: repeat(6, 1fr); }
}

/* ---------- 手机端(≤767px): 顶部信息条隐藏、面包屑隐藏、字号整体缩小 ---------- */
@media (max-width: 767px) {
	/* 字号层级: 移动端 */
	h1 { font-size: 32px; line-height: 1.2; }
	h2 { font-size: 26px; line-height: 1.3; }
	h3 { font-size: 20px; line-height: 1.4; }
	h4 { font-size: 16px; line-height: 1.5; }
	.section__heading h2 { font-size: 26px; } /* class选择器优先级比普通h2高,必须单独覆盖,不然会保留桌面端的30px */
	small, .text-small { font-size: 13px; }
	.section { padding: var(--space-lg) 0; }

	/* 顶部信息条只在电脑端/平板端显示,手机端完全隐藏 */
	.top-bar { display: none; }

	/* 面包屑导航手机端不展示,节省空间 */
	.navan-breadcrumb { display: none; }
}
/* ============================================================
   产品详情页
   ============================================================ */

.navan-breadcrumb { padding: var(--space-md) 0; font-size: 14px; color: var(--color-text-light); }
.navan-breadcrumb ul { display: flex; gap: 8px; flex-wrap: wrap; }
.navan-breadcrumb li:not(:last-child)::after { content: '/'; margin-left: 8px; color: var(--color-border); }
.navan-breadcrumb a { color: var(--color-text-light); }
.navan-breadcrumb a:hover { color: var(--color-primary); }

.product-top { display: flex; gap: var(--space-xl); align-items: flex-start; padding-bottom: var(--space-xl); }

/* ---- 相册: 大图 + 左右箭头 + 播放按钮 + 缩略图条 ---- */
.product-gallery { flex: 1; max-width: 560px; }
.product-gallery__main {
	position: relative; border-radius: var(--radius-lg); overflow: hidden;
	background: var(--color-bg-light); border: 1px solid var(--color-border);
}
.product-gallery__main.no-image { background: var(--color-dark); aspect-ratio: 4/3; }
.product-gallery__main-img { width: 100%; aspect-ratio: 4/3; object-fit: contain; background: #fff; }
.product-gallery__arrow {
	position: absolute; top: 50%; transform: translateY(-50%);
	width: 40px; height: 40px; border-radius: 50%; border: none;
	background: rgba(255,255,255,0.9); color: var(--color-text);
	font-size: 22px; cursor: pointer; display: flex; align-items: center; justify-content: center;
	transition: background var(--transition);
}
.product-gallery__arrow:hover { background: #fff; }
.product-gallery__arrow--prev { left: var(--space-sm); }
.product-gallery__arrow--next { right: var(--space-sm); }
.product-gallery__play {
	display: none; /* 默认隐藏,只有当前选中的是视频位时才显示(见 .has-video) */
	position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
	width: 72px; height: 72px; border-radius: 50%; border: none;
	background: rgba(255,255,255,0.92); color: var(--color-primary);
	font-size: 26px; cursor: pointer; align-items: center; justify-content: center;
}
.product-gallery__main.has-video .product-gallery__play { display: flex; }
.product-gallery__thumbs { display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--space-xs); margin-top: var(--space-sm); }
.product-gallery__thumb {
	position: relative; padding: 0; border: 2px solid var(--color-border); border-radius: var(--radius-btn);
	overflow: hidden; cursor: pointer; background: #fff; aspect-ratio: 1/1;
	display: flex; align-items: center; justify-content: center;
}
.product-gallery__thumb img { width: 100%; aspect-ratio: 1/1; object-fit: cover; }
.product-gallery__thumb.is-active { border-color: var(--color-primary); }
.product-gallery__thumb--no-image { background: var(--color-dark); }
.product-gallery__thumb--no-image .product-gallery__thumb-play { position: static; background: none; font-size: 20px; }
.product-gallery__thumb-play {
	position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
	background: rgba(10,10,26,0.35); color: #fff; font-size: 16px;
}

/* ---- 右侧信息栏 ---- */
.product-info { flex: 1; min-width: 0; padding-top: var(--space-xs); }
.product-info h1 { margin-bottom: var(--space-sm); }
.product-info__desc { color: var(--color-text-light); margin-bottom: var(--space-md); padding-bottom: var(--space-md); border-bottom: 1px solid var(--color-border); }
.product-info__sku p { margin: 0 0 10px; }
.product-info__tags { display: flex; flex-wrap: wrap; gap: 10px; margin: var(--space-md) 0; }
.product-tag {
	display: inline-flex; align-items: center; gap: 6px;
	background: var(--color-secondary); color: var(--color-primary);
	padding: 6px 14px; border-radius: var(--radius-pill); font-size: 14px; font-weight: 500;
}
.product-info__cta { margin-top: var(--space-sm); width: 100%; justify-content: center; display: flex; align-items: center; gap: 10px; }
.product-info__cta-note { color: var(--color-text-light); font-size: 13px; margin-top: 10px; text-align: center; }

/* ---- 卖点条带 ---- */
.product-sellpoints-band { background: var(--color-bg-light); padding: var(--space-lg) 0; }
.single-product { background: var(--color-white); } /* 产品详情页整体白底,只有sellpoints和bottling-line两个模块例外保留浅灰 */
.single-product .product-bottling-line { background: var(--color-bg-light); }
.product-sellpoints { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-lg); text-align: center; }
.product-sellpoints__icon {
	display: inline-flex; width: 56px; height: 56px; border-radius: 50%;
	background: var(--color-primary); color: #fff; align-items: center; justify-content: center;
	font-size: 22px; margin-bottom: var(--space-sm);
}
.product-sellpoints__title { font-size: 18px; font-weight: 700; color: var(--color-dark); margin: 0 0 6px; }
.product-sellpoints__item p { color: var(--color-text-light); font-size: 14px; }

/* ---- 技术参数表 ---- */
.product-specs h2 .highlight { color: var(--color-primary); }
.product-specs__grid { display: grid; grid-template-columns: 7fr 3fr; gap: var(--space-xl); align-items: flex-start; margin-top: var(--space-lg); }
.product-specs__table { width: 100%; border-collapse: collapse; }
.product-specs__table th, .product-specs__table td { padding: 14px 20px; text-align: left; border-bottom: 1px solid var(--color-border); }
.product-specs__table th { background: var(--color-secondary); color: var(--color-primary); font-weight: 700; }
.product-specs__table tr:nth-child(even) td { background: var(--color-bg-light); }
.product-specs__brochure { text-align: center; }
.product-specs__brochure img {
	max-width: 100%;
	border-radius: 2px 8px 8px 2px; /* 左侧近乎直角、右侧圆角,模拟书脊到书页的过渡 */
	margin-bottom: var(--space-sm);
	box-shadow: -4px 0 0 rgba(0,0,0,0.06), 0 18px 40px rgba(10,10,26,0.22); /* 左侧细阴影模拟书脊厚度,整体投影让画册"立"起来 */
}
.product-specs__download { display: inline-flex; align-items: center; gap: 8px; }

/* ---- 细节展示 ---- */
.product-detail-display h2 .highlight,
.product-case h2 .highlight,
.product-faq h2 .highlight,
.product-bottling-line h2 .highlight { color: var(--color-primary); }
.product-detail-display__grid,
.product-case__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-lg); margin-top: var(--space-lg); }
.product-detail-display__item img { width: 100%; aspect-ratio: 8/5; object-fit: cover; border-radius: var(--radius-btn); margin-bottom: var(--space-sm); }
.product-case__image img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: var(--radius-btn); margin-bottom: var(--space-sm); }
.product-detail-display__item h3,
.product-case__item h3 { margin-bottom: 6px; }
.product-detail-display__item p,
.product-case__item p { color: var(--color-text-light); font-size: 14px; }
.product-case__image { position: relative; }
.product-case__play {
	position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
	width: 56px; height: 56px; border-radius: 50%; border: none;
	background: rgba(255,255,255,0.92); color: var(--color-primary);
	font-size: 20px; cursor: pointer; display: flex; align-items: center; justify-content: center;
}

/* ---- FAQ(产品页内嵌版本,取消最大宽度限制,撑满容器) ---- */
.faq-accordion--inline { max-width: none; margin: var(--space-lg) 0 0; padding: 0; }

/* ---- 生产流程设备展示 ---- */
.product-bottling-line__desc { color: var(--color-text-light); margin-bottom: var(--space-lg); max-width: 700px; }
.product-bottling-line__diagram { display: block; width: 100%; margin-bottom: var(--space-lg); border-radius: var(--radius-btn); }
.product-bottling-line__diagram img { width: 100%; height: auto; }
.product-bottling-line__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-md); }
.product-bottling-line__item { display: block; text-align: center; }
.product-bottling-line__item img { width: 100%; aspect-ratio: 8/5; object-fit: cover; border-radius: var(--radius-btn); margin-bottom: 8px; }
.product-bottling-line__item span { font-size: 14px; font-weight: 600; color: var(--color-text); }

.product-bottom-cta { text-align: center; padding: var(--space-lg) 0 var(--space-xl); background: var(--color-bg-light); }
.product-bottom-cta .btn { display: inline-flex; align-items: center; gap: 10px; }

/* ---- 询价弹窗 ---- */
.navan-modal { display: none; position: fixed; inset: 0; z-index: 500; align-items: center; justify-content: center; }
.navan-modal.is-open { display: flex; }
.navan-modal__overlay { position: absolute; inset: 0; background: rgba(10,10,26,0.6); }
.navan-modal__panel {
	position: relative; background: #fff; border-radius: var(--radius-lg);
	max-width: 560px; width: 92%; max-height: 88vh; overflow-y: auto;
	padding: var(--space-lg); z-index: 1;
}
.navan-modal__close {
	position: absolute; top: var(--space-sm); right: var(--space-sm);
	width: 36px; height: 36px; border-radius: 50%; border: none;
	background: var(--color-bg-light); color: var(--color-text); font-size: 20px; cursor: pointer;
}
.navan-modal__title { margin-bottom: var(--space-md); }

/* ---- 响应式 ---- */
@media (max-width: 991px) {
	.product-top { flex-direction: column; }
	.product-gallery { max-width: 100%; }
	.product-sellpoints,
	.product-detail-display__grid,
	.product-case__grid,
	.product-bottling-line__grid { grid-template-columns: repeat(2, 1fr); }
	.product-specs__grid { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
	.product-sellpoints,
	.product-detail-display__grid,
	.product-case__grid,
	.product-bottling-line__grid { grid-template-columns: 1fr; }
	.product-gallery__thumbs { grid-template-columns: repeat(5, 1fr); }
}

/* ============================================================
   解决方案详情页 (single-solution.php)
   ============================================================ */

/* ---- 顶部Banner: 背景图 + 瓶子图 + 标题 + 描述 ---- */
.solution-banner { position: relative; overflow: hidden; padding: var(--space-xl) 0 var(--space-lg); }
.solution-banner__bg { position: absolute; inset: 0; z-index: 0; }
.solution-banner__bg img { width: 100%; height: 100%; object-fit: cover; }
.solution-banner__inner { position: relative; z-index: 1; display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-lg); min-height: 260px; } /* align-items:flex-end 让标题描述和瓶子图底对齐 */
.solution-banner__bottle { flex: 1; max-width: 480px; }
.solution-banner__bottle img { width: 100%; height: auto; display: block; }
.solution-banner__text { flex: 1; max-width: 420px; }
.solution-banner__text h1 { font-size: 40px; margin-bottom: 8px; }
.solution-banner__bar { color: var(--color-accent); margin-right: 6px; }
.solution-banner__text p { color: var(--color-text-light); }

/* ---- 标题描述 + CTA问询框 ---- */
.solution-intro__grid { display: flex; gap: var(--space-xl); align-items: flex-start; }
.solution-intro__content { flex: 2; }
.solution-intro__content p { color: var(--color-text-light); }
.solution-intro__cta-box {
	flex: 1; max-width: 320px; background: var(--color-primary); color: #fff;
	padding: var(--space-lg) var(--space-md); border-radius: var(--radius-btn); text-align: center;
}
.solution-intro__cta-box h3 { color: #fff; font-size: 22px; position: relative; padding-bottom: var(--space-sm); margin-bottom: var(--space-md); }
.solution-intro__cta-box h3::after {
	content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);
	width: 50px; height: 2px; background: rgba(255,255,255,0.5);
}
.solution-intro__cta-btn { background: transparent; border-color: #fff; color: #fff; width: 100%; }
.solution-intro__cta-btn:hover { background: #fff; color: var(--color-primary); }

/* ---- 3个产品类别卡片(手动填写的中继器) ---- */
.solution-categories__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-md); }
.solution-categories__card { border: 1px solid var(--color-border); border-radius: var(--radius-btn); overflow: hidden; }
.solution-categories__image img { width: 100%; aspect-ratio: 8/5; object-fit: cover; }
.solution-categories__body { padding: var(--space-md); background: var(--color-bg-light); }
.solution-categories__body h3 { font-size: 18px; margin-bottom: 10px; }
.solution-categories__body h3 a:hover { color: var(--color-primary); }
.solution-categories__specs p { margin: 0 0 4px; font-size: 14px; }
.solution-categories__more { display: inline-block; margin-top: 8px; color: var(--color-primary); font-weight: 600; }

/* ---- 3个视频展示 ---- */
.solution-videos__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-md); }
.solution-videos__item { position: relative; display: block; padding: 0; border: none; cursor: pointer; border-radius: var(--radius-btn); overflow: hidden; background: #fff; text-align: left; }
.solution-videos__thumb { position: relative; display: block; }
.solution-videos__item img { width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.solution-videos__title { display: block; padding: 10px 14px; font-size: 14px; font-weight: 600; color: var(--color-text); line-height: 1.4; }
.solution-videos__play {
	position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
	width: 60px; height: 60px; border-radius: 50%;
	background: rgba(255,255,255,0.9); color: var(--color-primary);
	display: flex; align-items: center; justify-content: center; font-size: 22px;
}

/* ---- One partner区块 ---- */
.solution-partner { background: var(--color-bg-light); }
.solution-partner__desc { color: var(--color-text-light); } /* 去掉max-width限制,撑满整个container */

.single-solution { background: var(--color-white); } /* 解决方案页整体白底,只有partner和flow-chart两个模块例外保留浅灰 */
.single-solution .solution-flow { background: var(--color-bg-light); }

/* 标题字号规则: "Mineral Water Pure Water"(intro的H2)保持标准36px,页面其他H2统一比它小一些 */
.single-solution h2 { font-size: 30px; }
.single-solution .solution-intro__content h2 { font-size: 36px; }

/* ---- Flow Chart ---- */
.solution-flow h2 .highlight { color: var(--color-primary); }
.solution-flow__desc { color: var(--color-text-light); max-width: 700px; margin-bottom: var(--space-lg); }
.solution-flow__diagram { display: block; width: 100%; }
.solution-flow__diagram img { width: 100%; height: auto; }

/* ---- 纳凡的服务 ---- */
.solution-service__desc { color: var(--color-text-light); max-width: 900px; }
.solution-service__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-lg); margin-top: var(--space-lg); text-align: center; }
.solution-service__icon {
	display: inline-flex; width: 56px; height: 56px; border-radius: 50%;
	background: var(--color-primary); color: #fff; align-items: center; justify-content: center;
	font-size: 22px; margin-bottom: var(--space-sm);
}
.solution-service__item h3 { margin-bottom: 6px; }
.solution-service__item p { color: var(--color-text-light); font-size: 14px; }

/* ---- 底部CTA条带 ---- */
.solution-cta-band {
	position: relative; background-color: var(--color-dark); background-size: cover; background-position: center;
	padding: var(--space-xl) 0;
}
.solution-cta-band::before { content: ''; position: absolute; inset: 0; background: rgba(10,10,26,0.7); }
.solution-cta-band__inner { position: relative; z-index: 1; text-align: center; max-width: 700px; }
.solution-cta-band__inner h2 { color: #fff; }
.solution-cta-band__inner p { color: #d5d8e6; margin-bottom: var(--space-md); }

/* ---- 响应式 ---- */
@media (max-width: 991px) {
	.solution-banner__inner { flex-direction: column; text-align: center; } /* column(不是column-reverse): 跟随DOM顺序,标题描述在上,瓶子图在下 */
	.solution-intro__grid { flex-direction: column; }
	.solution-intro__cta-box { max-width: 100%; }
	.solution-categories__grid,
	.solution-videos__grid,
	.solution-service__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px) {
	.solution-categories__grid,
	.solution-videos__grid,
	.solution-service__grid { grid-template-columns: 1fr; }
	.solution-intro__cta-box { max-width: 100%; width: 100%; } /* 手机端蓝色CTA问询框改全宽 */
}

/* ============================================================
   公司介绍页 (page-about.php)
   ============================================================ */

/* ---- Hero: 背景图 + 深色渐变 + 角标 + 大标题 + 描述 + 数字统计 ---- */
.about-hero { position: relative; overflow: hidden; }
.about-hero__bg { position: absolute; inset: 0; z-index: 0; }
.about-hero__bg img { width: 100%; height: 100%; object-fit: cover; }
.about-hero__overlay {
	position: absolute; inset: 0; z-index: 0;
	background: linear-gradient(90deg, #0b0b1f 0%, rgba(11,11,31,0) 100%);
}
.about-hero__inner { position: relative; z-index: 1; padding-top: 100px; padding-bottom: 100px; } /* 不额外设左右padding/max-width,直接沿用.container本身的1240px限宽和左右间距,保证跟下面模块左对齐 */
.about-hero__iconbox {
	display: inline-flex; align-items: center; gap: var(--space-xs);
	background: rgba(255,255,255,0.12); color: #fff;
	padding: 6px 16px; border-radius: var(--radius-pill); font-weight: 600; font-size: 14px;
	margin-bottom: var(--space-sm);
}
.about-hero__iconbox i { color: var(--color-accent); }
.about-hero__title { color: #fff; font-size: 42px; line-height: 1.25; max-width: 620px; }
.about-hero__title .highlight { color: var(--color-accent); }
.about-hero__desc { color: #d5d8e6; max-width: 520px; margin-bottom: var(--space-lg); }
.about-hero__stats { display: flex; gap: var(--space-xl); padding-top: var(--space-md); border-top: 1px solid rgba(255,255,255,0.15); }
.about-hero__stat-number { display: block; font-size: 28px; font-weight: 700; color: var(--color-accent); }
.about-hero__stat-label { display: block; font-size: 13px; color: #d5d8e6; margin-top: 4px; }

/* ---- We Are NAVAN: 左侧正文 + 右侧导航框 ---- */
.about-intro { background: var(--color-white); }
.about-intro__grid { display: flex; gap: var(--space-xl); align-items: flex-start; margin-bottom: var(--space-lg); }
.about-intro__content { flex: 2; }
.about-intro__text p { color: var(--color-text-light); margin-bottom: 1em; }
.about-intro__navbox {
	flex: 1; max-width: 300px; background: var(--color-primary); color: #fff;
	padding: var(--space-lg) var(--space-md);
	border-radius: 0; /* 去圆角 */
	margin-top: calc(-1 * var(--space-xl)); /* 抵消.section的上padding,让这个蓝色框顶部正好贴住上面Hero模块的底边,间距为0 */
	box-shadow: 0 20px 40px rgba(10,10,26,0.18);
}
.about-intro__navbox h3 { color: #fff; font-size: 22px; position: relative; padding-bottom: var(--space-sm); margin-bottom: var(--space-md); }
.about-intro__navbox h3::after { content: ''; position: absolute; bottom: 0; left: 0; width: 50px; height: 2px; background: rgba(255,255,255,0.5); }
.about-intro__navbox ul li { border-bottom: 1px solid rgba(255,255,255,0.15); }
.about-intro__navbox ul li:last-child { border-bottom: none; }
.about-intro__navbox a { display: flex; align-items: center; gap: 8px; padding: 12px 0; color: #fff; font-weight: 500; }
.about-intro__navbox a:hover { color: var(--color-accent); }

/* ---- 公司实景相册(8:5,点击全屏) ---- */
.about-intro__gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-md); }
.about-intro__gallery-item { display: block; padding: 0; border: none; background: none; cursor: pointer; overflow: hidden; border-radius: var(--radius-btn); }
.about-intro__gallery-item img { width: 100%; aspect-ratio: 8/5; object-fit: cover; border-radius: var(--radius-btn); transition: transform var(--transition); }
.about-intro__gallery-item:hover img { transform: scale(1.06); }

/* ---- Our Core Values ---- */
.about-concept { background: var(--color-bg-light); } /* section本身是最外层块级元素,天然占满整个视口宽度 */
.about-concept .section__heading { margin-bottom: 50px; } /* 副标题和下面图标卡片网格之间固定50px */
.about-concept__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 56px var(--space-md); } /* 行间距56px(避免图标圆圈和上一行卡片重叠),列间距保持24px */
.about-concept__card { position: relative; background: var(--color-primary); border-radius: var(--radius-btn); padding: 56px var(--space-md) var(--space-md); text-align: center; }
.about-concept__icon {
	position: absolute; top: 0; left: 50%; transform: translate(-50%, -50%);
	width: 64px; height: 64px; border-radius: 50%;
	background: #fff; border: 1px solid var(--color-border);
	display: flex; align-items: center; justify-content: center;
	font-size: 24px; color: var(--color-primary);
}
.about-concept__card h3 { color: #fff; margin-bottom: 8px; }
.about-concept__card p { color: #d5d8e6; font-size: 16px; } /* 和正文字号一致 */

/* ---- Quality & Certifications: 横向滑动 + 左右箭头 + 点击全屏 ---- */
.about-certs { background: var(--color-white); }
.about-certs__wrap { position: relative; }
.about-certs__track {
	display: flex; gap: var(--space-md); overflow-x: auto; scroll-behavior: smooth;
	padding-bottom: var(--space-xs); scrollbar-width: none; /* Firefox隐藏滚动条,视觉更干净,箭头按钮已经能滑动 */
}
.about-certs__track::-webkit-scrollbar { display: none; }
.about-certs__item {
	flex: 0 0 320px; padding: 0; border: none; border-radius: 0;
	overflow: hidden; cursor: pointer; background: #fff;
}
.about-certs__item img { width: 100%; height: auto; display: block; }
.about-certs__arrow {
	position: absolute; top: 50%; transform: translateY(-50%);
	width: 44px; height: 44px; border-radius: 50%; border: none;
	background: rgba(10,10,26,0.55); color: #fff;
	font-size: 22px; cursor: pointer; display: flex; align-items: center; justify-content: center;
	z-index: 2;
}
.about-certs__arrow--prev { left: -10px; }
.about-certs__arrow--next { right: -10px; }

/* ---- 底部CTA条带 ---- */
.about-cta-band { background: var(--color-primary); padding: var(--space-xl) 0; }
.about-cta-band__inner { text-align: center; max-width: 700px; }
.about-cta-band__inner h2 { color: #fff; }
.about-cta-band__inner p { color: #d5d8e6; margin-bottom: var(--space-md); }

/* ---- 响应式 ---- */
@media (max-width: 991px) {
	.about-intro__grid { flex-direction: column; }
	.about-intro__navbox { margin-top: var(--space-lg); } /* 桌面端的负margin(贴住Hero底边)在这里会盖住上面的文字,堆叠布局下改回正常间距 */
	.about-intro__navbox { display: none; } /* 蓝色About Us导航框手机端整体隐藏 */
	.about-concept__grid { grid-template-columns: repeat(2, 1fr); }
	.about-hero__title { font-size: 34px; }
	.about-hero__stats { flex-wrap: wrap; gap: var(--space-md) var(--space-lg); }
}
@media (max-width: 767px) {
	.about-hero__inner { padding: 60px var(--space-sm) var(--space-lg); }
	.about-hero__title { font-size: 28px; }
	.about-intro__gallery { grid-template-columns: repeat(2, 1fr); }
	.about-intro__navbox { display: none; } /* 蓝色About Us导航框手机端整体隐藏 */
	.about-concept__grid { grid-template-columns: 1fr; }
	.about-certs__item { flex-basis: 260px; }
}
/* ============================================================
   产品汇总页 / 产品分类归档页 (archive-product.php / taxonomy-product_cat.php)
   ============================================================ */

/* ---- Hero: 深色渐变 + 面包屑(白色适配) + 标题 + 描述 ---- */
.archive-hero { position: relative; overflow: hidden; }
.archive-hero__bg { position: absolute; inset: 0; z-index: 0; }
.archive-hero__bg img { width: 100%; height: 100%; object-fit: cover; }
.archive-hero__overlay {
	position: absolute; inset: 0; z-index: 0;
	background: linear-gradient(90deg, #0b0b1f 0%, rgba(11,11,31,0.35) 55%, rgba(11,11,31,0.15) 100%);
}
.archive-hero__inner { position: relative; z-index: 1; padding-top: 100px; padding-bottom: 100px; max-width: 640px; } /* 不用margin:auto居中,块级元素默认贴在父级(.container)左边,天然和下面模块左对齐 */
.archive-hero__title { max-width: none; } /* 已经被外层640px容器限制住了,标题自身不需要再单独限宽 */
.archive-hero__inner .navan-breadcrumb { padding: 0 0 var(--space-md); color: rgba(255,255,255,0.7); }
.archive-hero__inner .navan-breadcrumb a { color: rgba(255,255,255,0.7); }
.archive-hero__inner .navan-breadcrumb a:hover { color: #fff; }
.archive-hero__inner .navan-breadcrumb li:not(:last-child)::after { color: rgba(255,255,255,0.3); }
.archive-hero__title { color: #fff; font-size: 40px; }
.archive-hero__title .highlight { color: var(--color-accent); }
.archive-hero__desc { color: #d5d8e6; }

/* ---- 分类筛选胶囊 ---- */
.archive-categories { background: var(--color-white); border-bottom: 1px solid var(--color-border); padding: var(--space-md) 0; }
.archive-categories__inner { display: flex; align-items: center; gap: var(--space-md); flex-wrap: wrap; }
.archive-categories__label { font-weight: 700; color: var(--color-dark); font-size: 18px; flex-shrink: 0; }
.archive-categories__pills { display: flex; flex-wrap: wrap; gap: 10px; }
.archive-categories__pill {
	display: inline-block; padding: 8px 20px; border-radius: var(--radius-pill);
	background: var(--color-secondary); color: var(--color-primary); font-weight: 600; font-size: 14px;
	transition: background var(--transition), color var(--transition);
}
.archive-categories__pill:hover { background: var(--color-primary); color: #fff; }
.archive-categories__pill.is-active { background: var(--color-primary); color: #fff; }

/* ---- 产品卡片网格 ---- */
.archive-grid { background: var(--color-white); }
.archive-grid__cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-lg); }
.archive-card { border: 1px solid var(--color-border); border-radius: var(--radius-btn); overflow: hidden; background: #fff; }
.archive-card__image { display: block; background: var(--color-white); } /* 纯白背景,不是浅灰 */
.archive-card__image img { width: 100%; aspect-ratio: 1/1; object-fit: contain; } /* object-fit:contain保证图片完整展示不裁切;你的图本身就是1:1,刚好能撑满整个方形不留白边 */
.archive-card__body { padding: var(--space-md); background: var(--color-bg-light); }
.archive-card__body h3 { font-size: 18px; margin: var(--space-xs) 0 var(--space-sm); }
.archive-card__body h3 a:hover { color: var(--color-primary); }
.archive-card__sku { display: flex; flex-wrap: wrap; gap: 4px var(--space-md); margin-bottom: var(--space-sm); }
.archive-card__sku p { margin: 0; font-size: 13px; flex: 0 0 auto; }
.archive-card__btn { width: 100%; text-align: center; }

/* ---- 分页 ---- */
.pagination,
.navigation.pagination { margin-top: var(--space-xl); }
.pagination .nav-links { display: flex; justify-content: center; align-items: center; gap: 8px; flex-wrap: wrap; }
.pagination .page-numbers {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 42px; height: 42px; padding: 0 14px;
	border: 1px solid var(--color-border); border-radius: var(--radius-btn);
	color: var(--color-text); font-weight: 600; font-size: 14px;
}
.pagination .page-numbers:hover { border-color: var(--color-primary); color: var(--color-primary); }
.pagination .page-numbers.current { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }
.pagination .page-numbers.dots { border: none; }

/* ---- Buying Guide(表格内容来自全局设置的富文本字段,这里只管排版容器和表格基础样式) ---- */
.archive-buying-guide { background: var(--color-bg-light); } /* 全屏宽浅灰,section本身是最外层块级元素,天然占满整个视口宽度 */
.archive-buying-guide__table-wrap { overflow-x: auto; } /* 表格列多,窄屏下允许左右滚动,不强行挤压变形 */
.archive-buying-guide__table-wrap table { width: 100%; border-collapse: collapse; min-width: 900px; font-size: 13px; }
.archive-buying-guide__table-wrap th,
.archive-buying-guide__table-wrap td { border: 1px solid var(--color-border); padding: 10px 12px; text-align: center; vertical-align: middle; }
.archive-buying-guide__table-wrap thead th { background: var(--color-primary); color: #fff; }
.archive-buying-guide__table-wrap tbody tr:nth-child(even) { background: var(--color-bg-light); }

/* ---- 响应式 ---- */
@media (max-width: 991px) {
	.archive-grid__cards { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px) {
	.archive-grid__cards { grid-template-columns: 1fr; }
	.archive-categories__inner { flex-direction: column; align-items: flex-start; }
	.archive-hero__title { font-size: 28px; }
}

/* ============================================================
   Service Center 页面模板 (page-service.php) —— Service Center及其4个子页面共用
   ============================================================ */

/* ---- 正文(页面自带内容) + 右侧蓝色导航框 ---- */
.service-body { background: var(--color-white); } /* 全屏宽白色,section本身是最外层块级元素 */
.service-body__grid { display: flex; gap: var(--space-xl); align-items: flex-start; margin-bottom: var(--space-lg); }
.service-body__content { flex: 2; }
/* the_content()里用户自己写的标题/段落/列表,给个统一的排版基础样式 */
.service-body__content h2 { margin-top: 0; }
.service-body__content h2,
.service-body__content h3,
.service-body__content h4 { color: var(--color-dark); }
.service-body__content p { color: var(--color-text-light); margin-bottom: 1em; }
.service-body__content ul,
.service-body__content ol { margin: 0 0 1.2em; padding-left: 1.4em; color: var(--color-text-light); list-style: disc; } /* 全局reset把ul的list-style去掉了,这里要显式恢复 */
.service-body__content li { margin-bottom: 6px; }
.service-body__content li::marker { color: var(--color-primary); } /* 圆点颜色 */
.service-body__content strong { color: var(--color-dark); }

.service-navbox {
	flex: 1; max-width: 300px; background: var(--color-primary); color: #fff;
	padding: var(--space-lg) var(--space-md);
	border-radius: 0;
	margin-top: calc(-1 * var(--space-xl)); /* 抵消.section的上padding,贴住Hero底边,间距为0 */
	box-shadow: 0 20px 40px rgba(10,10,26,0.18);
}
.service-navbox h3 { color: #fff; font-size: 22px; position: relative; padding-bottom: var(--space-sm); margin-bottom: var(--space-md); }
.service-navbox h3::after { content: ''; position: absolute; bottom: 0; left: 0; width: 50px; height: 2px; background: rgba(255,255,255,0.5); }
.service-navbox ul { list-style: none; padding-left: 0; } /* 覆盖上面.service-body__content的disc,这个框自己不需要圆点,用图标代替 */
.service-navbox ul li { border-bottom: 1px solid rgba(255,255,255,0.15); margin-bottom: 0; }
.service-navbox ul li:last-child { border-bottom: none; }
.service-navbox a { display: flex; align-items: center; gap: 8px; padding: 12px 0; color: #fff; font-weight: 500; }
.service-navbox a:hover { color: var(--color-accent); }

/* 蓝色导航框只在电脑端(>1024px)展示,平板和手机端都不显示 */
@media (max-width: 1024px) {
	.service-navbox { display: none; }
}

/* ---- 图片相册(复用About页Certificate的横向滑动组件,这里只补外边距) ---- */
.service-body__gallery { margin-bottom: var(--space-lg); }

/* ---- 结尾说明文字: 独立区块,浅灰底,屏幕全宽 ---- */
.service-note-band { background: var(--color-bg-light); padding: var(--space-lg) 0; }
.service-body__note p { color: var(--color-text-light); margin-bottom: 6px; }

/* ---- 响应式 ---- */
@media (max-width: 991px) {
	.service-body__grid { flex-direction: column; }
}

/* ============================================================
   博客汇总页 (archive.php) / 文章详情页 (single.php)
   ============================================================ */

/* ---- "Blog"标题 + 分类筛选胶囊 ---- */
.blog-categories { background: var(--color-white); border-bottom: 1px solid var(--color-border); padding: var(--space-lg) 0; }
.blog-categories__inner { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: var(--space-md); }
.blog-categories__inner h2 { margin: 0; }
.blog-categories__pills { display: flex; flex-wrap: wrap; gap: 10px; }
.blog-categories__pill {
	display: inline-block; padding: 8px 20px; border-radius: var(--radius-pill);
	border: 1px solid var(--color-primary); color: var(--color-primary); font-weight: 600; font-size: 14px;
	transition: background var(--transition), color var(--transition);
}
.blog-categories__pill:hover,
.blog-categories__pill.is-active { background: var(--color-primary); color: #fff; }

/* ---- 文章卡片(汇总页网格 + "You Might Also Like"共用) ---- */
.blog-grid { background: var(--color-white); }
.blog-grid__cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-lg); }
.blog-card { border: 1px solid var(--color-border); border-radius: var(--radius-btn); overflow: hidden; background: #fff; }
.blog-card__image { display: block; }
.blog-card__image img { width: 100%; aspect-ratio: 16/10; object-fit: cover; }
.blog-card__body { padding: var(--space-md); }
.blog-card__date { display: flex; align-items: center; gap: 6px; color: var(--color-text-light); font-size: 13px; margin-bottom: 8px; }
.blog-card__body h3 { font-size: 18px; margin: 0 0 8px; }
.blog-card__body h3 a:hover { color: var(--color-primary); }
.blog-card__body p { color: var(--color-text-light); font-size: 14px; margin-bottom: var(--space-sm); }
.blog-card__more { color: var(--color-primary); font-weight: 600; }

/* ---- 文章详情页: 正文 + 右侧Resources导航框 ---- */
.blog-single__grid { display: flex; gap: var(--space-xl); align-items: flex-start; padding: var(--space-lg) 0 var(--space-xl); }
.blog-single__content { flex: 2; }
.blog-single__content h1 { margin: var(--space-sm) 0 8px; }
.blog-single__date { display: flex; align-items: center; gap: 6px; color: var(--color-text-light); font-size: 14px; margin-bottom: var(--space-lg); }

/* the_content()排版基础样式: 段落/引用块/标题/列表/图片 */
.blog-single__body p { color: var(--color-text-light); margin-bottom: 1.2em; }
.blog-single__body h2,
.blog-single__body h3 { margin-top: 1.5em; }
.blog-single__body blockquote {
	margin: var(--space-lg) 0; padding: var(--space-md) var(--space-lg);
	background: var(--color-secondary); border-left: 4px solid var(--color-primary);
	font-style: italic; color: var(--color-text);
}
.blog-single__body blockquote p:last-child { margin-bottom: 0; }
.blog-single__body ul,
.blog-single__body ol { margin: 0 0 1.2em; padding-left: 1.4em; color: var(--color-text-light); list-style: disc; }
.blog-single__body li { margin-bottom: 6px; }
.blog-single__body li::marker { color: var(--color-primary); }
.blog-single__body strong { color: var(--color-dark); }
.blog-single__body img { border-radius: var(--radius-btn); margin: var(--space-sm) 0; }
.blog-single__body figure { margin: var(--space-lg) 0; }
.blog-single__body figcaption { text-align: center; color: var(--color-text-light); font-size: 13px; margin-top: 8px; }

.blog-single__tags { margin-top: var(--space-lg); padding-top: var(--space-md); border-top: 1px solid var(--color-border); display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }

/* 右侧Resources导航框: 跟服务页/公司介绍页蓝色框视觉一致,但没有"贴住Hero"和"平板隐藏"这些专属行为 */
.blog-single__sidebar {
	flex: 1; max-width: 300px; background: var(--color-primary); color: #fff;
	padding: var(--space-lg) var(--space-md);
	border-radius: 0;
	box-shadow: 0 20px 40px rgba(10,10,26,0.18);
}
.blog-single__sidebar h3 { color: #fff; font-size: 22px; position: relative; padding-bottom: var(--space-sm); margin-bottom: var(--space-md); }
.blog-single__sidebar h3::after { content: ''; position: absolute; bottom: 0; left: 0; width: 50px; height: 2px; background: rgba(255,255,255,0.5); }
.blog-single__sidebar ul li { border-bottom: 1px solid rgba(255,255,255,0.15); }
.blog-single__sidebar ul li:last-child { border-bottom: none; }
.blog-single__sidebar a { display: flex; align-items: center; gap: 8px; padding: 12px 0; color: #fff; font-weight: 500; }
.blog-single__sidebar a:hover { color: var(--color-accent); }

.blog-related { background: var(--color-bg-light); }
.blog-related h2 .highlight { color: var(--color-primary); }

/* ---- 响应式 ---- */
@media (max-width: 991px) {
	.blog-grid__cards { grid-template-columns: repeat(2, 1fr); }
	.blog-single__grid { flex-direction: column; }
	.blog-single__sidebar { max-width: 100%; }
}
@media (max-width: 767px) {
	.blog-grid__cards { grid-template-columns: 1fr; }
	.blog-categories__inner { flex-direction: column; align-items: flex-start; }
}

/* ============================================================
   404页面 / 搜索页
   ============================================================ */
.error-404-page { padding: 100px 0; text-align: center; }
.error-404-page__inner { max-width: 560px; margin: 0 auto; }
.error-404-page__code { display: block; font-size: 96px; font-weight: 800; color: var(--color-primary); line-height: 1; margin-bottom: var(--space-sm); }
.error-404-page p { color: var(--color-text-light); margin-bottom: var(--space-lg); }

.error-404-page__search,
.search-page__form {
	display: flex; gap: 10px; margin-bottom: var(--space-lg);
}
.error-404-page__search input,
.search-page__form input {
	flex: 1; padding: 12px 18px; border: 1px solid var(--color-border); border-radius: var(--radius-btn); font-size: 15px;
}
.error-404-page__search button,
.search-page__form button {
	background: var(--color-primary); color: #fff; border: none; border-radius: var(--radius-btn);
	padding: 0 20px; cursor: pointer; display: flex; align-items: center; gap: 8px; font-weight: 600;
	transition: background var(--transition);
}
.error-404-page__search button:hover,
.search-page__form button:hover { background: var(--color-primary-dark); }

.search-page__intro { max-width: 600px; margin: 0 auto; padding: 100px 0; text-align: center; }
.search-page__intro p { color: var(--color-text-light); margin-bottom: var(--space-lg); }

.archive-hero__inner .search-page__form { max-width: 480px; margin-top: var(--space-md); margin-bottom: 0; }
.archive-hero__inner .search-page__form input { background: rgba(255,255,255,0.95); }

.search-page__count { color: var(--color-text-light); margin-bottom: var(--space-md); }

/* ============================================================
   联系我们页面 (page-contact.php)
   ============================================================ */

/* ---- Let's Talk: 左侧联系方式 + 右侧表单 ---- */
.contact-talk { background: var(--color-white); } /* 屏幕全宽白色,section本身是最外层块级元素 */
.contact-talk__grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: var(--space-xl); align-items: start; margin-bottom: var(--space-xl); }
.contact-talk__desc { color: var(--color-text-light); margin-bottom: var(--space-md); }
.contact-talk__hq h4 { margin-bottom: 4px; }
.contact-talk__hq p { color: var(--color-text-light); margin-bottom: var(--space-md); }

.contact-cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-sm); }
.contact-card {
	display: flex; gap: var(--space-sm); align-items: flex-start;
	background: var(--color-bg-light); border: 1px solid var(--color-border); border-radius: var(--radius-btn); padding: var(--space-md);
}
.contact-card__icon {
	flex-shrink: 0; width: 44px; height: 44px; border-radius: 50%;
	background: var(--color-primary); color: #fff;
	display: flex; align-items: center; justify-content: center; font-size: 18px;
}
.contact-card__body h3 { font-size: 15px; margin-bottom: 4px; }
.contact-card__body p { color: var(--color-text-light); font-size: 14px; margin: 0; }

/* 邮箱/电话链接: 悬停变主色蓝 */
.contact-link { color: var(--color-text-light); transition: color var(--transition); }
.contact-link:hover { color: var(--color-primary); }

.contact-talk__form { background: var(--color-bg-light); border: 1px solid var(--color-border); border-radius: var(--radius-btn); padding: var(--space-lg); }
.contact-talk__form h3 { margin-bottom: 6px; }
.contact-talk__form > p { color: var(--color-text-light); margin-bottom: var(--space-md); }

/* ---- Google地图 ---- */
.contact-map { border-radius: var(--radius-btn); overflow: hidden; margin-bottom: var(--space-xl); }
.contact-map iframe { display: block; width: 100%; }

/* ---- 海外代表卡片 ---- */
.contact-reps { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-md); margin-bottom: var(--space-xl); }
.contact-reps__card { background: var(--color-bg-light); border: 1px solid var(--color-border); border-radius: var(--radius-btn); padding: var(--space-md) var(--space-lg); }
.contact-reps__card h4 { margin-bottom: 4px; }
.contact-reps__name { color: var(--color-text-light); margin-bottom: var(--space-sm); }
.contact-reps__card p { margin: 0 0 6px; font-size: 14px; color: var(--color-text-light); }
.contact-reps__card i { color: var(--color-primary); width: 16px; }

/* ---- 部门联系信息网格 ---- */
.contact-service-grid {
	background: var(--color-bg-light);
	display: grid; grid-template-columns: repeat(3, 1fr);
	border: 1px solid var(--color-border); border-radius: var(--radius-btn); overflow: hidden;
	margin-bottom: var(--space-xl);
}
.contact-service-grid__item {
	padding: var(--space-lg);
	border-right: 1px solid var(--color-border);
	border-bottom: 1px solid var(--color-border);
}
.contact-service-grid__item:nth-child(3n) { border-right: none; }
.contact-service-grid__item:nth-last-child(-n+3) { border-bottom: none; }
.contact-service-grid__item h4 { margin-bottom: 8px; }
.contact-service-grid__item p { color: var(--color-text-light); font-size: 14px; margin-bottom: 6px; }
.contact-service-grid__line { color: var(--color-text-light); font-size: 14px; }
.contact-service-grid__line i { color: var(--color-primary); width: 16px; }

/* ---- 响应式 ---- */
@media (max-width: 991px) {
	.contact-talk__grid { grid-template-columns: 1fr; }
	.contact-reps { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
	.contact-cards { grid-template-columns: 1fr; }
	.contact-service-grid { grid-template-columns: 1fr; }
	.contact-service-grid__item { border-right: none !important; }
	.contact-service-grid__item:not(:last-child) { border-bottom: 1px solid var(--color-border) !important; }
}

/* ============================================================
   着陆页 (page-landing.php)
   ============================================================ */

/* ---- Hero ---- */
.lp-hero { position: relative; overflow: hidden; padding: 100px 0; display: flex; align-items: center; }
.lp-hero__bg { position: absolute; inset: 0; z-index: 0; }
.lp-hero__bg img { width: 100%; height: 100%; object-fit: cover; }
.lp-hero__overlay { position: absolute; inset: 0; z-index: 0; background: rgba(10,10,26,0.55); }
.lp-hero__inner { position: relative; z-index: 1; max-width: 720px; margin: 0 auto; text-align: center; }
.lp-hero__title { color: #fff; font-size: 42px; margin-bottom: 8px; }
.lp-hero__title .highlight { color: var(--color-accent); }
.lp-hero__subtitle { color: #fff; font-size: 18px; font-weight: 600; margin-bottom: var(--space-md); }
.lp-hero__desc { color: #d5d8e6; max-width: 560px; margin: 0 auto var(--space-lg); }

/* ---- Core Product Advantages ---- */
.lp-advantages { background: var(--color-white); }
.lp-advantages__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-md); }
.lp-advantages__card { background: var(--color-bg-light); border-radius: var(--radius-btn); padding: var(--space-lg) var(--space-md); text-align: center; box-shadow: 0 10px 24px rgba(10,10,26,0.08); }
.lp-advantages__icon {
	display: inline-flex; width: 56px; height: 56px; border-radius: 50%;
	background: var(--color-primary); color: #fff; align-items: center; justify-content: center;
	font-size: 22px; margin-bottom: var(--space-sm);
}
.lp-advantages__card h3 { font-size: 16px; margin-bottom: 8px; }
.lp-advantages__card p { color: var(--color-text-light); font-size: 14px; }

/* ---- Complete Configuration: 编号列表 + 产线图 ---- */
.lp-config { background: var(--color-bg-light); }
.lp-config__grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-xl); align-items: center; margin-top: var(--space-lg); }
.lp-config__steps-title { margin-bottom: var(--space-md); }
.lp-config__step { display: flex; gap: var(--space-sm); margin-bottom: var(--space-md); }
.lp-config__step-num {
	flex-shrink: 0; width: 32px; height: 32px; border-radius: 50%;
	background: var(--color-primary); color: #fff; font-weight: 700; font-size: 14px;
	display: flex; align-items: center; justify-content: center;
}
.lp-config__step h4 { font-size: 16px; margin-bottom: 4px; }
.lp-config__step p { color: var(--color-text-light); font-size: 14px; margin: 0; }
.lp-config__image img { width: 100%; height: auto; }

/* ---- Mainstream Models ---- */
.lp-models { background: var(--color-white); }
.lp-models__videos { margin-top: var(--space-lg); }
.lp-models__image { background: var(--color-bg-light); } /* 覆盖复用的solution-categories__image默认样式,只在着陆页这里改成1:1原图+浅灰底 */
.lp-models__image img { aspect-ratio: 1/1; object-fit: contain; width: 100%; }

/* ---- What You Gain(深色条带,背景图+主色蒙层,保证文字可读) ---- */
.lp-gain { position: relative; background-color: var(--color-primary); background-size: cover; background-position: center; padding: var(--space-xl) 0; }
.lp-gain::before { content: ''; position: absolute; inset: 0; background: rgba(27,52,170,0.85); }
.lp-gain .container { position: relative; z-index: 1; }
.lp-gain__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-lg); text-align: center; }
.lp-gain__icon {
	display: inline-flex; width: 56px; height: 56px; border-radius: 50%;
	background: rgba(255,255,255,0.15); color: #fff; align-items: center; justify-content: center;
	font-size: 22px; margin-bottom: var(--space-sm);
}
.lp-gain__item h3 { color: #fff; font-size: 16px; margin-bottom: 6px; }
.lp-gain__item p { color: #d5d8e6; font-size: 14px; }

/* ---- 数字统计 ---- */
.lp-stats { background: var(--color-white); padding: var(--space-lg) 0; }

/* ---- About(带勾选清单) ---- */
.lp-about { background: var(--color-white); }
.lp-about__grid { display: flex; gap: var(--space-xl); align-items: flex-start; }
.lp-about__content { flex: 1; }
.lp-about__desc { color: var(--color-text-light); margin-bottom: var(--space-md); }
.lp-about__checks { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-sm) var(--space-md); }
.lp-about__check {
	display: flex; align-items: flex-start; gap: 8px; font-size: 14px; color: var(--color-text);
	background: var(--color-bg-light); border-radius: var(--radius-btn); padding: var(--space-sm) var(--space-md);
	box-shadow: 0 8px 20px rgba(10,10,26,0.06);
}
.lp-about__check i { color: var(--color-primary); margin-top: 2px; flex-shrink: 0; }
.lp-about__media { flex: 1; }
.lp-about__main-image { width: 100%; border-radius: var(--radius-lg); margin-bottom: var(--space-sm); display: block; }
.lp-about__video-trigger { position: relative; display: block; width: 100%; padding: 0; border: none; background: none; cursor: pointer; }
.lp-about__gallery { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-xs); }
.lp-about__gallery button { padding: 0; border: none; background: none; cursor: pointer; overflow: hidden; border-radius: var(--radius-btn); }
.lp-about__gallery img { width: 100%; aspect-ratio: 8/5; object-fit: cover; border-radius: var(--radius-btn); transition: transform var(--transition); }
.lp-about__gallery button:hover img { transform: scale(1.06); }

/* ---- 证书 ---- */
.lp-certs { background: var(--color-white); }

/* ---- 底部CTA + 表单(屏幕全宽的纵向渐变背景) ---- */
.lp-cta {
	background: linear-gradient(180deg, #1B34AA 0%, #0F1E63 100%);
	padding: var(--space-xl) 0;
}
.lp-cta__grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: var(--space-xl); align-items: center; } /* center: 让左侧文案整体纵向居中于右侧表单卡片 */
.lp-cta__content { display: flex; flex-direction: column; justify-content: center; }
.lp-cta__content h2 { color: #fff; }
.lp-cta__title { font-size: 40px; } /* 单独调大,不影响全站h2默认字号 */
.lp-cta__content .highlight { color: var(--color-highlight-2); } /* 用新增的第二高亮色,和其他区块的橙色高亮区分开 */
.lp-cta__content > p { color: #d5d8e6; margin-bottom: var(--space-md); }
.lp-cta__checklist-label { color: #fff; font-weight: 600; margin-bottom: var(--space-sm); }
.lp-cta__checklist { display: flex; flex-direction: column; gap: 10px; }
.lp-cta__check { display: flex; align-items: center; gap: 8px; color: #d5d8e6; font-size: 14px; }
.lp-cta__check i { color: var(--color-accent); }
.lp-cta__form { background: #fff; border-radius: var(--radius-btn); padding: var(--space-lg); }
.lp-cta__form h3 { margin-bottom: var(--space-md); }

/* ---- 响应式 ---- */
@media (max-width: 991px) {
	.lp-advantages__grid,
	.lp-gain__grid { grid-template-columns: repeat(2, 1fr); }
	.lp-config__grid,
	.lp-about__grid,
	.lp-cta__grid { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
	.lp-advantages__grid,
	.lp-gain__grid,
	.lp-about__checks { grid-template-columns: 1fr; }
	.lp-hero__title { font-size: 28px; }
}

/* ============================================================
   全站统一: Icon Box / Image Box 组件的标题字号和描述字号
   ============================================================
   标题统一用H3,字号统一18px;描述统一用整站默认正文字号16px。
   放在文件最后,靠CSS的"后面规则覆盖前面同优先级规则"来统一之前各个模块
   分别设置的不同字号,不用逐个模块回头改。

   例外: 产品详情页的"卖点"区块(product-sellpoints)因为紧跟在H1后面、
   中间没有H2,用H3会导致标题层级跳级(无障碍审计会扣分),所以那里用的是
   <p class="product-sellpoints__title">而不是真正的标题标签,但字号视觉上
   保持一致(同样是18px),不在这条规则的选择器列表里。
*/
.why-choose__item h3,
.about-concept__card h3,
.lp-advantages__card h3,
.lp-gain__item h3,
.solution-service__item h3,
.contact-card__body h3 {
	font-size: 18px;
}
.why-choose__item p,
.about-concept__card p,
.lp-advantages__card p,
.lp-gain__item p,
.solution-service__item p,
.contact-card__body p {
	font-size: 16px;
}
