/* 首页各板块专属样式，只在 is_front_page() 加载（见 class-asset-manager.php）。 */

/* ===== 01 Hero：75vh 高背景图，内容垂直居中、左对齐 =====
   导航是透明悬浮在 Hero 上面的（不占自己的文档流高度），所以这里不用像别的固定头部
   那样拿 100vh 减去 --wjc-header-height。 */
.wjc-hero {
	min-height: 75vh;
	min-height: 75svh;
	display: flex;
	align-items: center;
	padding-block: var(--wjc-section-pad-y);
}

/* 用两层类名 .wjc-home .wjc-hero__bg，不能只写 .wjc-hero__bg——layout.css 里
   .wjc-home img { height: auto; } 是"1 个类 + 1 个元素"的优先级，比单层类名的
   .wjc-hero__bg 高，会把这里的 height:100% 盖掉。绝对定位的 <img> 一旦 height 变回
   auto，浏览器会按图片自身宽高比算高度而不是撑满 inset:0，直接摆烂溢出到下一个板块上面，
   跟"合作伙伴 Logo"那种紧挨着的板块看起来就像叠在同一张背景图上。 */
.wjc-home .wjc-hero__bg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: 0;
}

.wjc-hero__overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	background: rgb(62 62 62 / 43%);
}

.wjc-hero__inner {
	position: relative;
	z-index: 2;
}

.wjc-hero__content {
	max-width: 720px;
	text-align: left;
	color: #fff;
}

.wjc-hero__eyebrow {
	text-transform: uppercase;
	letter-spacing: 0.14em;
	font-size: 13px;
	font-weight: 700;
	color: var(--wjc-primary-light);
	margin: 0 0 16px;
}

.wjc-hero__title {
	color: #fff;
	font-size: clamp(32px, 5.5vw, 66px);
	line-height: 1.2;
	font-weight: 800;
	margin: 0 0 24px;
}

.wjc-hero__list {
	list-style: none;
	margin: 0 0 48px;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 14px 20px;
}

.wjc-hero__list-item {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: clamp(15px, 1.8vw, 20px);
	font-weight: 500;
}

.wjc-hero__list-icon {
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.14);
	color: var(--wjc-primary-light);
	font-size: 13px;
}

@media (max-width: 1024px) {
	.wjc-hero__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 600px) {
	.wjc-hero__list {
		grid-template-columns: 1fr;
	}
}

/* 手机端：强行铺满一屏高度会导致背景图被裁切/拉伸成跟内容高度对不上的样子。
   改成让背景图恢复正常文档流、按自身宽高比撑出高度（宽度 100vw，高度自适应），
   Hero 区块的高度直接跟着图片走；文字内容改成绝对定位叠在图片上面，不再参与撑高。
   背景图可以换一张专门为竖屏构图的图（见 bg_image_mobile 字段 + <picture>）。
   没有上传背景图时不套这段（图片本身不存在，没东西撑高度，退回普通内容流）。 */
@media (max-width: 782px) {
	/* 这里必须用 .wjc-home .wjc-hero / .wjc-home .wjc-hero--has-bg 两层类选择器，
	   跟 layout.css 里 .wjc-home .wjc-section 那条 padding-block 规则比优先级——
	   单层类名 .wjc-hero--has-bg 优先级不够，盖不掉它，导致手机端 padding-block:0
	   实际没生效，多出来的上下留白会被 .wjc-hero__overlay（inset:0）一起罩住，
	   看起来就像遮罩溢出了图片。 */
	.wjc-home .wjc-hero {
		min-height: auto;
		padding-block: clamp(64px, 18vw, 96px) clamp(48px, 12vw, 72px);
	}

	.wjc-home .wjc-hero--has-bg {
		display: block;
		padding-block: 0;
	}

	.wjc-hero--has-bg .wjc-hero__bg {
		position: static;
		width: 100%;
		height: auto;
		display: block;
	}

	.wjc-hero--has-bg .wjc-hero__overlay {
		position: absolute;
		inset: 0;
	}

	.wjc-hero--has-bg .wjc-hero__inner {
		position: absolute;
		inset: 0;
		display: flex;
		align-items: center;
		padding-block: clamp(32px, 10vw, 56px);
	}

	.wjc-hero__content {
		max-width: none;
	}

	.wjc-hero__title {
		margin-bottom: 18px;
	}

	.wjc-hero__list {
		margin-bottom: 28px;
	}

	.wjc-hero .wjc-btn {
		width: 100%;
	}
}

/* ===== 02 / 07 合作伙伴 Logo（横向滚动 + 静态网格） ===== */
.wjc-home .wjc-partners-marquee {
	padding-top: 40px;
	padding-bottom: 0;
	background: #ffffff;
}

.wjc-partners-grid {
	background: #f8f8f8;
}

.wjc-marquee {
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}

.wjc-marquee__track {
	display: flex;
	width: max-content;
	gap: 10px;
	animation: wjc-marquee-scroll 32s linear infinite;
}

.wjc-marquee:hover .wjc-marquee__track {
	animation-play-state: paused;
}

.wjc-marquee__item {
	flex: none;
	width: 200px;
	height: 110px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--wjc-border);
	box-sizing: border-box;
}

.wjc-marquee__item img {
	max-height: 60px;
	max-width: 70%;
	width: auto;
	height: auto;
	object-fit: contain;
	filter: grayscale(1);
	opacity: 0.6;
	transition: opacity 0.2s ease, filter 0.2s ease;
}

.wjc-marquee__item:hover img {
	filter: grayscale(0);
	opacity: 1;
}

@media (max-width: 600px) {
	.wjc-marquee__item {
		width: 120px;
		height: 70px;
	}

	.wjc-marquee__item img {
		max-height: 36px;
	}
}

@keyframes wjc-marquee-scroll {
	from { transform: translateX(0); }
	to { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
	.wjc-marquee__track {
		animation: none;
	}
	.wjc-marquee {
		overflow-x: auto;
	}
}

.wjc-partners-grid__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 16px;
}

.wjc-partners-grid__item {
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--wjc-surface);
	border: 1px solid var(--wjc-border);
	border-radius: 0;
	padding: 20px;
	min-height: 90px;
}

@media (max-width: 900px) {
	.wjc-partners-grid__list {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 480px) {
	.wjc-partners-grid__item {
		padding: 12px;
		min-height: 70px;
	}
}

.wjc-partners-grid__item img {
	max-height: 40px;
	width: auto;
	filter: grayscale(1);
	opacity: 0.65;
	transition: opacity 0.2s ease, filter 0.2s ease;
}

.wjc-partners-grid__item:hover img {
	filter: grayscale(0);
	opacity: 1;
}

/* ===== 03 产品特性卡片 ===== */
.wjc-feature-cards__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 24px;
}

.wjc-feature-card {
	display: flex;
	flex-direction: column;
	background: var(--wjc-surface);
	border: 1px solid var(--wjc-border);
	border-radius: 0;
	overflow: hidden;
	color: inherit;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.wjc-feature-card:hover {
	transform: translateY(-6px);
	box-shadow: var(--wjc-shadow);
}

.wjc-feature-card__media {
	display: block;
	aspect-ratio: 4 / 3;
	background: var(--wjc-surface-alt);
	overflow: hidden;
}

.wjc-feature-card__media img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.wjc-feature-card__title-bar {
	background: var(--wjc-primary);
	padding: 14px 20px;
	text-align: center;
}

.wjc-feature-card__title {
	font-size: 17px;
	font-weight: 700;
	color: #fff;
	margin: 0;
}

.wjc-feature-card__body {
	padding: 22px 22px 26px;
	display: flex;
	flex-direction: column;
	flex: 1;
}

.wjc-feature-card__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.wjc-feature-card__list li {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	font-size: 13.5px;
	color: var(--wjc-ink-soft);
	line-height: 1.5;
	padding: 10px 0;
	border-bottom: 1px dashed var(--wjc-border);
}

.wjc-feature-card__list li:first-child {
	padding-top: 0;
}

.wjc-feature-card__list li:last-child {
	border-bottom: none;
}

.wjc-feature-card__list-icon {
	color: var(--wjc-primary);
	margin-top: 2px;
	font-size: 13px;
}

.wjc-feature-card__footer {
	margin-top: auto;
	padding-top: 20px;
	text-align: center;
}

@media (max-width: 1024px) {
	.wjc-feature-cards__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 18px;
	}
}

@media (max-width: 560px) {
	.wjc-feature-cards__grid {
		grid-template-columns: 1fr;
		gap: 16px;
	}
}

/* ===== 04 绿色通栏（左文右图） ===== */
.wjc-cta-green {
	background: linear-gradient(135deg, var(--wjc-primary) 0%, var(--wjc-primary-dark) 100%);
	color: #fff;
}

.wjc-cta-green__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	align-items: center;
	gap: clamp(32px, 6vw, 72px);
}

.wjc-cta-green__eyebrow {
	text-transform: uppercase;
	letter-spacing: 0.14em;
	font-size: 13px;
	font-weight: 700;
	color: rgba(255, 255, 255, 0.85);
	margin: 0 0 14px;
}

.wjc-cta-green__title {
	color: #fff;
	font-size: clamp(26px, 3.6vw, 40px);
	font-weight: 800;
	line-height: 1.25;
	margin: 0 0 18px;
}

.wjc-cta-green__description {
	font-size: 16px;
	line-height: 1.75;
	opacity: 0.92;
	margin: 0;
	max-width: 520px;
}

.wjc-cta-green__media .wjc-slider,
.wjc-cta-green__media img {
	border-radius: var(--wjc-radius-lg);
}

@media (max-width: 782px) {
	.wjc-cta-green__inner {
		grid-template-columns: 1fr;
	}
	.wjc-cta-green__media {
		order: -1;
	}
}

/* 轮播组件（右侧多图轮播用，只有一张图时不加载 JS，纯静态展示） */
.wjc-slider {
	position: relative;
	overflow: hidden;
}

.wjc-slider__track {
	position: relative;
	aspect-ratio: 5 / 3;
}

.wjc-slider__slide {
	position: absolute;
	inset: 0;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.6s ease;
}

.wjc-slider__slide.is-active {
	opacity: 1;
	visibility: visible;
}

.wjc-slider[data-wjc-slider-static] .wjc-slider__slide {
	position: static;
	opacity: 1;
	visibility: visible;
}

.wjc-slider__slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.wjc-slider__dots {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 16px;
	z-index: 2;
	display: flex;
	justify-content: center;
	gap: 8px;
}

.wjc-slider__dot {
	width: 8px;
	height: 8px;
	padding: 0;
	border: none;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.5);
	cursor: pointer;
	transition: background-color 0.2s ease, transform 0.2s ease;
}

.wjc-slider__dot.is-active {
	background: #fff;
	transform: scale(1.2);
}

/* ===== 05 经典案例 9 宫格 ===== */
.wjc-cases-grid__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
}

.wjc-case-card {
	display: block;
	color: inherit;
	text-decoration: none;
}

.wjc-case-card__figure {
	position: relative;
	margin: 0;
	aspect-ratio: 500 / 260;
	border-radius: var(--wjc-radius);
	overflow: hidden;
	background: var(--wjc-surface-alt);
}

.wjc-case-card__figure img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
}

.wjc-case-card:hover .wjc-case-card__figure img {
	transform: scale(1.06);
}

.wjc-case-card__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(0deg, rgba(6, 10, 6, 0.8) 0%, rgba(6, 10, 6, 0.25) 55%, rgba(6, 10, 6, 0.15) 100%);
}

.wjc-case-card__caption {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 20px 16px;
	color: #fff;
	font-size: clamp(16px, 2vw, 20px);
	font-weight: 700;
	text-align: center;
}

@media (max-width: 900px) {
	.wjc-cases-grid__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 560px) {
	.wjc-cases-grid__grid {
		grid-template-columns: 1fr;
	}
}

/* ===== 06 数据统计条 ===== */
.wjc-stats-bar {
	background: var(--wjc-primary);
	color: #fff;
	padding-block: clamp(40px, 5vw, 64px);
}

.wjc-stats-bar__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	text-align: left;
}

.wjc-stat {
	padding-inline: 16px;
}

.wjc-stat__number {
	display: block;
	font-size: clamp(28px, 3.6vw, 44px);
	font-weight: 800;
	color: #fff;
	letter-spacing: 0.01em;
}

.wjc-stat__label {
	display: block;
	margin-top: 8px;
	font-size: 20px;
	color: #fff;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	opacity: 0.8;
}

@media (max-width: 700px) {
	.wjc-stats-bar__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 24px 16px;
	}

	.wjc-stat__number {
		font-size: 20px;
	}
}

/* ===== 08 国内服务网点地图 ===== */
.wjc-service-map__description {
	text-align: center;
	max-width: 640px;
	margin: -20px auto 0;
	color: var(--wjc-ink-soft);
}

.wjc-service-map__figure {
	max-width: 1140px;
	margin: 32px auto 0;
}

.wjc-cn-map {
	width: 100%;
	height: auto;
}

.wjc-cn-map__province {
	fill: #dbe2d6;
	stroke: #fff;
	stroke-width: 1;
	transition: fill 0.2s ease;
}

.wjc-cn-map__province.is-active {
	fill: var(--wjc-primary);
}

.wjc-cn-map__province:hover {
	fill: var(--wjc-primary-dark);
}

.wjc-cn-map__lake {
	fill: #cfe1ee;
	stroke: none;
}

.wjc-service-map__points {
	list-style: none;
	margin: 32px 0 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
}

.wjc-service-map__points li {
	display: flex;
	align-items: center;
	gap: 6px;
	background: var(--wjc-surface-alt);
	border: 1px solid var(--wjc-border);
	color: var(--wjc-ink-soft);
	font-size: 13.5px;
	padding: 7px 14px;
	border-radius: 999px;
}

.wjc-service-map__point-icon {
	color: var(--wjc-primary);
	font-size: 12px;
}

/* =========================================================
 * 「关于我们」页面专属板块（跟首页共用同一份样式表，见 class-asset-manager.php
 * 里 is_page_template('template-about.php') 那个加载条件）
 * ========================================================= */

/* ===== 顶部横幅（图片 + 居中叠加页面标题和面包屑，紧贴导航栏，不留上下留白） =====
 * 用 .wjc-home .wjc-page-banner 而不是单独一个类名——layout.css 里
 * .wjc-home .wjc-section 那条 padding-block 规则是两层类选择器，
 * 优先级比单层类名的 .wjc-page-banner 高，单层类名这里根本盖不掉它。 */
.wjc-home .wjc-page-banner {
	position: relative;
	padding-block: 0;
}

.wjc-page-banner__img {
	width: 100%;
	aspect-ratio: 1920 / 700;
	object-fit: cover;
}

.wjc-page-banner__overlay {
	position: absolute;
	inset: 0;
	background: rgba(6, 10, 6, 0.45);
}

.wjc-page-banner__content {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	gap: 14px;
	padding-inline: 20px;
}

.wjc-page-banner__title {
	color: #fff;
	font-size: clamp(24px, 3.6vw, 40px);
	font-weight: 700;
	margin: 0;
}

.wjc-page-banner .wjc-breadcrumb {
	justify-content: center;
	margin-bottom: 0;
	color: rgba(255, 255, 255, 0.85);
}

.wjc-page-banner .wjc-breadcrumb a {
	color: rgba(255, 255, 255, 0.85);
}

.wjc-page-banner .wjc-breadcrumb a:hover {
	color: #fff;
}

.wjc-page-banner .wjc-breadcrumb__current {
	color: #fff;
	font-weight: 600;
}

@media (max-width: 782px) {
	.wjc-page-banner__img {
		aspect-ratio: 4 / 3;
	}
}

/* ===== 图文介绍（左右交替） ===== */
.wjc-about-intro__row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	align-items: center;
	gap: clamp(32px, 6vw, 72px);
}

.wjc-about-intro__row + .wjc-about-intro__row {
	margin-top: clamp(40px, 6vw, 80px);
}

.wjc-about-intro__row.is-reversed .wjc-about-intro__content {
	order: 2;
}

.wjc-about-intro__title {
	font-size: clamp(24px, 3vw, 34px);
	font-weight: 700;
	color: var(--wjc-primary);
	margin: 0 0 16px;
}

.wjc-about-intro__description {
	font-size: 15px;
	line-height: 1.85;
	color: var(--wjc-ink-soft);
	margin: 0;
}

.wjc-about-intro__media img {
	border-radius: var(--wjc-radius-lg);
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

@media (max-width: 782px) {
	.wjc-about-intro__row {
		grid-template-columns: 1fr;
	}
	.wjc-about-intro__row.is-reversed .wjc-about-intro__content {
		order: 0;
	}
	.wjc-about-intro__row.is-reversed .wjc-about-intro__media {
		order: -1;
	}
}

/* ===== 产品系列（一排卡片，文字叠加在图片底部；默认展开第一张，
   悬停哪张就展开哪张、并且保持展开直到悬停别的——这个"保持"状态纯 CSS
   做不到（:hover 一移开鼠标就没了），靠 home.js 里加/不摘 is-active 类实现，
   复用「经典案例」的 .wjc-case-card 图片+遮罩+标题组件，只是外层容器换成
   flex 行 + flex-grow 过渡来做展开动画。） ===== */
.wjc-product-series {
	background: var(--wjc-surface-alt);
}

.wjc-product-series__grid {
	display: flex;
	gap: 8px;
}

.wjc-product-series .wjc-case-card {
	flex: 1 1 0;
	min-width: 0;
	transition: flex-grow 0.5s ease;
}

.wjc-product-series .wjc-case-card.is-active {
	flex-grow: 2.6;
}

.wjc-product-series .wjc-case-card__figure {
	height: 420px;
	aspect-ratio: auto;
}

.wjc-product-series .wjc-case-card__caption {
	font-size: 15px;
}

@media (max-width: 900px) {
	.wjc-product-series__grid {
		flex-wrap: wrap;
	}
	.wjc-product-series .wjc-case-card,
	.wjc-product-series .wjc-case-card.is-active {
		flex: 1 1 calc(33.333% - 8px);
		flex-grow: 0;
	}
	.wjc-product-series .wjc-case-card__figure {
		height: 260px;
	}
}

@media (max-width: 560px) {
	.wjc-product-series .wjc-case-card,
	.wjc-product-series .wjc-case-card.is-active {
		flex: 1 1 calc(50% - 8px);
	}
	.wjc-product-series .wjc-case-card__figure {
		height: 200px;
	}
}

/* ===== 国内服务网点 - 网点卡片（「关于我们」比首页多一排详细卡片） ===== */
.wjc-service-point-cards {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	margin-top: 40px;
}

.wjc-service-point-card {
	background: var(--wjc-surface);
	border: 1px solid var(--wjc-border);
	border-radius: var(--wjc-radius);
	padding: 22px;
}

.wjc-service-point-card__icon {
	color: var(--wjc-primary);
	font-size: 18px;
	margin-bottom: 10px;
}

.wjc-service-point-card__city {
	font-size: 16px;
	font-weight: 700;
	color: var(--wjc-ink);
	margin: 0 0 8px;
}

.wjc-service-point-card__address {
	font-size: 13.5px;
	line-height: 1.7;
	color: var(--wjc-ink-soft);
	margin: 0;
}

.wjc-service-point-card__link {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin-top: 12px;
	color: var(--wjc-primary-dark);
	font-size: 13.5px;
	font-weight: 600;
	text-decoration: none;
}

.wjc-service-point-card__link:hover {
	text-decoration: underline;
}

@media (max-width: 900px) {
	.wjc-service-point-cards {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 560px) {
	.wjc-service-point-cards {
		grid-template-columns: 1fr;
	}
}

/* ===== 公司动态（自动拉取最新文章） ===== */
.wjc-company-news {
	background: #ffffff;
}

.wjc-company-news__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
}

.wjc-news-card {
	display: flex;
	flex-direction: column;
	background: var(--wjc-surface);
	border: 1px solid var(--wjc-border);
	border-radius: var(--wjc-radius);
	overflow: hidden;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.wjc-news-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--wjc-shadow);
}

.wjc-news-card__media {
	position: relative;
	display: block;
	aspect-ratio: 500 / 260;
	background: var(--wjc-surface-alt);
}

.wjc-news-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.wjc-news-card__media::after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 1;
	background: rgba(0, 0, 0, 0);
	transition: background-color 0.25s ease;
}

.wjc-news-card:hover .wjc-news-card__media::after {
	background: rgba(0, 0, 0, 0.35);
}

.wjc-news-card__media-btn {
	position: absolute;
	z-index: 2;
	left: 16px;
	bottom: 16px;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--wjc-primary);
	color: #fff;
	font-size: 15px;
	opacity: 0;
	transform: translateY(8px);
	transition: opacity 0.25s ease, transform 0.25s ease;
}

.wjc-news-card:hover .wjc-news-card__media-btn {
	opacity: 1;
	transform: translateY(0);
}

.wjc-news-card__body {
	padding: 20px 22px 24px;
}

.wjc-news-card__date {
	display: block;
	font-size: 12.5px;
	color: var(--wjc-ink-soft);
	opacity: 0.8;
	margin-bottom: 8px;
}

.wjc-news-card__title {
	font-size: 17px;
	font-weight: 700;
	line-height: 1.4;
	margin: 0 0 10px;
}

.wjc-news-card__title a {
	color: var(--wjc-ink);
	text-decoration: none;
}

.wjc-news-card__title a:hover {
	color: var(--wjc-primary-dark);
}

.wjc-news-card__excerpt {
	font-size: 13.5px;
	line-height: 1.7;
	color: var(--wjc-ink-soft);
	margin: 0;
}

.wjc-company-news__footer {
	margin-top: 32px;
	text-align: center;
}

@media (max-width: 782px) {
	.wjc-company-news__grid {
		grid-template-columns: 1fr;
	}
}

/* =========================================================
 * 「下载中心」页面专属板块
 * ========================================================= */

/* ===== 软件推广（深色横幅） ===== */
.wjc-software-promo__card {
	position: relative;
	display: block;
	min-height: 380px;
	border-radius: var(--wjc-radius-lg);
	overflow: hidden;
	background: #0f1210;
	color: inherit;
	text-decoration: none;
}

/* 同 .wjc-hero__bg，两层类名盖掉 .wjc-home img 的 height:auto，理由见上面那条注释。 */
.wjc-home .wjc-software-promo__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.wjc-software-promo__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(6, 10, 8, 0.88) 0%, rgba(6, 10, 8, 0.6) 45%, rgba(6, 10, 8, 0.15) 100%);
}

.wjc-software-promo__content {
	position: relative;
	z-index: 2;
	max-width: 480px;
	padding: clamp(32px, 5vw, 56px);
}

.wjc-software-promo__title {
	color: #fff;
	font-size: clamp(22px, 3vw, 32px);
	font-weight: 800;
	line-height: 1.35;
	margin: 0 0 28px;
	padding-bottom: 18px;
	border-bottom: 2px solid var(--wjc-primary);
}

.wjc-software-promo__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.wjc-software-promo__list li {
	color: rgba(255, 255, 255, 0.85);
	font-size: 14px;
	line-height: 1.6;
}

@media (max-width: 600px) {
	.wjc-software-promo__card {
		min-height: 320px;
	}
}

/* ===== 产品模型（两列卡片：左图右文） ===== */
.wjc-product-models__list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
}

.wjc-model-row {
	display: flex;
	align-items: center;
	gap: 20px;
	padding: 20px;
	border: 1px solid var(--wjc-border);
	border-radius: var(--wjc-radius);
	background: var(--wjc-surface);
	transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.wjc-model-row:hover {
	box-shadow: var(--wjc-shadow);
	transform: translateY(-3px);
}

.wjc-model-row__media {
	flex: 0 0 140px;
	aspect-ratio: 4 / 3;
	background: #ffffff;
	border-radius: calc(var(--wjc-radius) - 4px);
	overflow: hidden;
}

.wjc-model-row__media img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	padding: 12px;
	box-sizing: border-box;
}

.wjc-model-row__body {
	flex: 1;
	min-width: 0;
}

.wjc-model-row__title {
	font-size: 16px;
	font-weight: 700;
	line-height: 1.4;
	color: var(--wjc-ink);
	margin: 0 0 14px;
}

.wjc-model-row__btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;
	color: var(--wjc-primary-dark);
	font-size: 13px;
	font-weight: 700;
	transition: gap 0.2s ease, color 0.2s ease;
}

.wjc-model-row__btn:hover {
	gap: 12px;
	color: var(--wjc-ink);
}

@media (max-width: 700px) {
	.wjc-product-models__list {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 480px) {
	.wjc-model-row {
		flex-direction: column;
		align-items: stretch;
		gap: 16px;
	}
	.wjc-model-row__media {
		flex-basis: auto;
	}
}

/* ===== 通用文字横条（浅灰/品牌绿背景，居中文字） ===== */
.wjc-text-band {
	padding-block: 40px;
	text-align: center;
}

.wjc-text-band--light {
	background: var(--wjc-surface-alt);
}

.wjc-text-band--primary {
	background: var(--wjc-primary);
}

.wjc-text-band__title {
	font-size: clamp(20px, 2.4vw, 26px);
	font-weight: 700;
	color: var(--wjc-ink);
	margin: 0 0 10px;
}

.wjc-text-band--primary .wjc-text-band__title {
	color: #fff;
}

.wjc-text-band__text {
	margin: 0;
	font-size: 15px;
	line-height: 1.7;
	color: var(--wjc-ink-soft);
	max-width: 720px;
	margin-inline: auto;
}

.wjc-text-band--primary .wjc-text-band__text {
	color: rgba(255, 255, 255, 0.92);
}

/* ===== 文档资料（网格，紧凑行） ===== */
.wjc-download-docs__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
	border-radius: var(--wjc-radius);
}

.wjc-doc-row {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 16px 20px;
	border: 1px solid var(--wjc-border);
	border-radius: var(--wjc-radius);
	background: var(--wjc-surface);
}

.wjc-doc-row__media {
	flex: 0 0 56px;
	width: 56px;
	height: 56px;
	background: var(--wjc-surface-alt);
	overflow: hidden;
}

.wjc-doc-row__media img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	padding: 6px;
	box-sizing: border-box;
}

.wjc-doc-row__title {
	flex: 1;
	min-width: 0;
	font-size: 15px;
	font-weight: 600;
	color: var(--wjc-ink);
	margin: 0;
}

.wjc-doc-row__btn {
	flex: 0 0 auto;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--wjc-primary);
	color: #fff;
	border: none;
	cursor: pointer;
	font-size: 13px;
	transition: background-color 0.2s ease;
}

.wjc-doc-row__btn:hover {
	background: var(--wjc-primary-dark);
}

@media (max-width: 600px) {
	.wjc-download-docs__grid {
		grid-template-columns: 1fr;
	}
}

/* =========================================================
 * 「方案」页面专属板块
 * ========================================================= */

/* ===== 产品优势（左右各一列，中间图片） ===== */
.wjc-product-advantages__grid {
	display: grid;
	grid-template-columns: 1fr minmax(320px, 560px) 1fr;
	align-items: center;
	gap: clamp(24px, 4vw, 56px);
}

.wjc-product-advantages__col {
	display: flex;
	flex-direction: column;
	gap: 100px;
}

.wjc-product-advantages__col--right {
	text-align: right;
}

.wjc-advantage-item__title {
	font-size: 19px;
	font-weight: 700;
	color: var(--wjc-primary-dark);
	margin: 0 0 8px;
}

.wjc-advantage-item__description {
	font-size: 13.5px;
	line-height: 1.7;
	color: var(--wjc-ink-soft);
	margin: 0;
}

.wjc-product-advantages__media img {
	width: 100%;
	height: auto;
}

@media (max-width: 900px) {
	.wjc-product-advantages__grid {
		grid-template-columns: 1fr;
	}
	.wjc-product-advantages__media {
		order: -1;
	}
	.wjc-product-advantages__col,
	.wjc-product-advantages__col--right {
		text-align: left;
		flex-direction: row;
		flex-wrap: wrap;
		gap: 24px;
	}
	.wjc-advantage-item {
		flex: 1 1 240px;
	}
}

/* ===== 图标导航条（深色横条） ===== */
.wjc-icon-nav-bar {
	background: var(--wjc-dark-bg);
	padding-block: 20px;
}

.wjc-icon-nav-bar__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
}

.wjc-icon-nav-bar__item {
	flex: 1 1 auto;
	background: #0000003d;
	padding: 22px;
}

.wjc-icon-nav-bar__link {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	color: rgba(255, 255, 255, 0.85);
	text-decoration: none;
	font-size: 14.5px;
	white-space: nowrap;
	transition: color 0.2s ease;
}

.wjc-icon-nav-bar__link:hover {
	color: var(--wjc-primary-light);
}

.wjc-icon-nav-bar__icon {
	font-size: 20px;
	color: var(--wjc-primary);
}

/* ===== 项目案例（2 列，复用经典案例的 .wjc-case-card 组件） ===== */
.wjc-project-cases__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
}

@media (max-width: 600px) {
	.wjc-project-cases__grid {
		grid-template-columns: 1fr;
	}
}

/* ===== 定制服务卡片（图片 + 底部纯文字标题，不叠加遮罩） ===== */
.wjc-service-cards {
	background: var(--wjc-surface-alt);
}

.wjc-service-cards__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
}

.wjc-service-card {
	display: block;
	background: var(--wjc-surface);
	border: 1px solid var(--wjc-border);
	border-radius: var(--wjc-radius);
	color: inherit;
	text-decoration: none;
	overflow: hidden;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.wjc-service-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--wjc-shadow);
}

.wjc-service-card__media {
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: var(--wjc-surface-alt);
}

.wjc-service-card__media img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.wjc-service-card__caption {
	padding: 16px;
	text-align: center;
	font-size: 15px;
	font-weight: 700;
	color: var(--wjc-ink);
}

@media (max-width: 560px) {
	.wjc-service-cards__grid {
		grid-template-columns: 1fr;
	}
}

/* =========================================================
 * 「所有产品」页面专属板块
 * ========================================================= */

/* ===== 系统展示（大图 + 小图列表，逐行交替左右位置和背景色） ===== */
.wjc-system-row--white {
	background: var(--wjc-surface);
}

.wjc-system-row--gray {
	background: var(--wjc-surface-alt);
}

/* 反过来：右边小图列表统一固定尺寸、按自己内容的真实高度显示；左边"标题+大图"
   这一列的高度要去适配列表的总高度——用 home.js 量出列表实际渲染的高度，写成
   media-col 的内联 height，标题占自己需要的高度，剩下空间全部分给大图（大图用
   object-fit:cover 撑满，不会变形）。 */
.wjc-system-row__layout {
	display: flex;
	align-items: flex-start;
	gap: clamp(24px, 4vw, 56px);
}

.wjc-system-row__media-col,
.wjc-system-row__list {
	min-width: 0;
}

.wjc-system-row__media-col {
	flex: 3.2;
	display: flex;
	flex-direction: column;
}

.wjc-system-row__list {
	flex: 1;
}

.wjc-system-row--img-right .wjc-system-row__media-col {
	order: 2;
}

.wjc-system-row__title {
	font-size: clamp(20px, 2.4vw, 28px);
	font-weight: 700;
	color: var(--wjc-ink);
	text-align: center;
	margin: 0 0 50px;
}

.wjc-system-row__media {
	flex: 1;
	min-height: 0;
}

.wjc-system-row__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.wjc-system-row__list {
	display: flex;
	flex-direction: column;
	gap: 30px;
}

/* 取消卡片背景，纯图片 + 文字 */
.wjc-system-row__item {
	display: flex;
	flex-direction: column;
}

/* 小图统一固定尺寸，图片要完整显示（不裁切/不变形），所以用 object-fit:contain。
   对齐方向跟着大图在哪一边走：大图在左（小图列表在右）就靠右对齐，大图在右
   （小图列表在左）就靠左对齐——不是简单地居中在整栏宽度里。 */
.wjc-system-row__item-media {
	width: 100%;
	height: auto;
	display: flex;
	align-items: center;
	justify-content: center;
}

.wjc-system-row--img-left .wjc-system-row__item-media {
	justify-content: flex-end;
}

.wjc-system-row--img-right .wjc-system-row__item-media {
	justify-content: flex-start;
}

.wjc-system-row__item-media img {
	width: 140px;
	height: auto;
	object-fit: contain;
}

/* 文字宽度跟图片宽度一致，居中对齐的是图片本身的宽度，不是整栏；
   靠左还是靠右也跟图片保持一致，这样文字始终在图片正下方。 */
.wjc-system-row__item-label {
	display: block;
	width: 140px;
	margin-top: 10px;
	text-align: center;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--wjc-ink-soft);
}

.wjc-system-row--img-left .wjc-system-row__item-label {
	margin-left: auto;
	margin-right: 0;
}

.wjc-system-row--img-right .wjc-system-row__item-label {
	margin-left: 0;
	margin-right: auto;
}

@media (max-width: 782px) {
	.wjc-system-row__layout {
		flex-direction: column;
	}
	.wjc-system-row--img-right .wjc-system-row__media-col {
		order: 0;
	}
	/* 手机端两栏改成上下堆叠，不再需要 JS 量出来的等高，用 !important 盖掉行内 style，
	   大图这时候改用固定比例自己撑高度（flex:1 在这里没有父级高度可依赖）。 */
	.wjc-system-row__media-col {
		height: auto !important;
	}
	.wjc-system-row__media {
		flex: none;
		aspect-ratio: 16 / 9;
	}
	.wjc-system-row__list {
		flex-direction: row;
		flex-wrap: wrap;
	}
	.wjc-system-row__item {
		flex: 1 1 calc(50% - 8px);
	}
}

/* ===== 产品优势（绿色标题条 + 图文网格） ===== */
.wjc-product-features__title-bar {
	background: var(--wjc-primary);
	padding-block: 24px;
	text-align: center;
}

.wjc-product-features__title {
	color: #fff;
	font-size: clamp(20px, 2.4vw, 26px);
	font-weight: 700;
	margin: 0;
}

.wjc-product-features__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 32px 48px;
	padding-block: clamp(32px, 5vw, 56px);
}

.wjc-feature-item {
	display: flex;
	align-items: center;
	gap: 20px;
}

.wjc-feature-item__media {
	flex: 0 0 96px;
	width: 96px;
	height: 96px;
	background: var(--wjc-surface-alt);
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

.wjc-feature-item__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.wjc-feature-item__title {
	font-size: 16px;
	font-weight: 700;
	color: var(--wjc-ink);
	margin: 0 0 6px;
}

.wjc-feature-item__description {
	font-size: 13px;
	line-height: 1.7;
	color: var(--wjc-ink-soft);
	margin: 0;
}

@media (max-width: 600px) {
	.wjc-product-features__grid {
		grid-template-columns: 1fr;
	}
}

/* =========================================================
 * 「联系我们」页面专属板块
 * ========================================================= */

/* ===== 成为客户（左文右图） ===== */
.wjc-become-customer__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	align-items: center;
	gap: clamp(28px, 4vw, 56px);
}

.wjc-become-customer__title {
	font-size: clamp(22px, 2.8vw, 30px);
	font-weight: 800;
	color: var(--wjc-ink);
	margin: 0 0 16px;
}

.wjc-become-customer__description {
	font-size: 15px;
	line-height: 1.8;
	color: var(--wjc-ink-soft);
	margin: 0 0 28px;
}

.wjc-become-customer__sub-title {
	font-size: 16px;
	font-weight: 700;
	color: var(--wjc-ink);
	margin: 0 0 14px;
}

.wjc-become-customer__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.wjc-become-customer__list li {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 14px;
	color: var(--wjc-ink-soft);
}

.wjc-become-customer__list-icon {
	color: var(--wjc-primary);
	font-size: 13px;
}

.wjc-become-customer__media img {
	width: 100%;
	height: auto;
}

@media (max-width: 782px) {
	.wjc-become-customer__inner {
		grid-template-columns: 1fr;
	}
	.wjc-become-customer__media {
		order: -1;
	}
}

/* ===== 询价表单（左浅灰信息栏 + 右绿色表单） ===== */
/* .wjc-section 基础规则（.wjc-home .wjc-section，两层类选择器）优先级比单层类名高，
   这里必须同样写两层类名才盖得掉，否则下面这条形同虚设。 */
.wjc-home .wjc-contact-form {
	padding-bottom: 0;
	/* 背景整屏铺满，灰绿各占一半——分隔线正好在视口正中间，跟下面 .ct-container 里
	   两栏网格的分隔线天然对齐（.ct-container 本身也是居中的，它的中点就是视口中点）。
	   颜色不再放在 __info / __panel 这两个（现在收窄进 .ct-container 的）栏位上了，
	   不然背景只会各铺半个容器宽，两边会露出白边，不是真正的通栏。 */
	background: linear-gradient(to right, var(--wjc-surface-alt) 50%, var(--wjc-primary) 50%);
}

.wjc-contact-form__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.wjc-contact-form__info {
	display: flex;
	align-items: center;
}

.wjc-contact-form__info-inner {
	width: 100%;
	max-width: 520px;
	margin-inline: auto;
	padding: clamp(40px, 6vw, 72px) clamp(20px, 4vw, 40px);
}

.wjc-contact-form__left-title {
	font-size: clamp(22px, 2.6vw, 28px);
	font-weight: 800;
	color: var(--wjc-ink);
	line-height: 1.35;
	margin: 0 0 20px;
}

.wjc-contact-form__left-list {
	list-style: none;
	margin: 0 0 28px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.wjc-contact-form__left-list li {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 14px;
	color: var(--wjc-ink-soft);
}

.wjc-contact-form__left-list-icon {
	color: var(--wjc-primary);
	font-size: 13px;
}

.wjc-contact-form__meta {
	margin-top: 22px;
}

.wjc-contact-form__meta h4 {
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--wjc-ink);
	margin: 0 0 6px;
}

.wjc-contact-form__meta p {
	margin: 0;
	font-size: 14px;
	color: var(--wjc-ink-soft);
}

.wjc-contact-form__meta a {
	color: var(--wjc-ink-soft);
	text-decoration: none;
}

.wjc-contact-form__meta a:hover {
	color: var(--wjc-primary-dark);
}

.wjc-contact-form__panel {
	display: flex;
	align-items: center;
}

.wjc-contact-form__panel-inner {
	width: 100%;
	max-width: 520px;
	margin-inline: auto;
	padding: clamp(40px, 6vw, 72px) clamp(20px, 4vw, 40px);
}

.wjc-contact-form__form-title {
	color: #fff;
	font-size: clamp(22px, 2.6vw, 28px);
	font-weight: 800;
	margin: 0 0 28px;
}

.wjc-contact-form__row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 16px;
}

.wjc-contact-form__field {
	margin-bottom: 18px;
}

.wjc-contact-form__field label {
	display: block;
	font-size: 13px;
	font-weight: 600;
	color: #fff;
	margin-bottom: 6px;
}

.wjc-contact-form__required {
	color: #1a1a1a;
}

.wjc-contact-form__field input,
.wjc-contact-form__field textarea {
	width: 100%;
	padding: 12px 14px;
	border: none;
	border-radius: 6px;
	font-size: 14px;
	font-family: inherit;
	box-sizing: border-box;
	background: #fff;
	color: var(--wjc-ink);
}

.wjc-contact-form__field textarea {
	resize: vertical;
}

.wjc-contact-form__field input:focus,
.wjc-contact-form__field textarea:focus {
	outline: 2px solid rgba(255, 255, 255, 0.8);
	outline-offset: 1px;
}

.wjc-contact-form__submit {
	width: 100%;
	margin-top: 4px;
}

.wjc-contact-form__message {
	margin: 14px 0 0;
	font-size: 13.5px;
	min-height: 18px;
}

.wjc-contact-form__message.is-error {
	color: #7a1f1f;
	font-weight: 600;
}

.wjc-contact-form__message.is-success {
	color: #16401a;
	font-weight: 600;
}

@media (max-width: 782px) {
	/* 手机端两栏堆叠成上下，整屏左右各半的背景没意义了（灰绿分隔线会横穿内容中间），
	   改回背景各自跟着自己那块内容走，颜色收回到 __info / __panel 身上。 */
	.wjc-home .wjc-contact-form {
		background: none;
	}
	.wjc-contact-form__info {
		background: var(--wjc-surface-alt);
	}
	.wjc-contact-form__panel {
		background: var(--wjc-primary);
	}
	.wjc-contact-form__grid {
		grid-template-columns: 1fr;
	}
	.wjc-contact-form__row {
		grid-template-columns: 1fr;
	}
}