.page-cases {
	min-width: 19.2rem;
	width: 100%;
}

.page-cases .page-wrapper,
.page-cases .cases-list {
	width: 100%;
	max-width: none;
}

.hero {
	width: 100%;
	margin: auto;
	height: 6.5rem;
	min-height: 6.5rem;
	max-height: 6.5rem;
	position: relative;
}

.hero-bg {
	position: absolute;
	inset: 0;
	width: 100%;
	min-height: 100%;
	z-index: 0;
	background-color: #141418;
}

.hero-bg-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.hero-content {
	padding-top: 2.15rem;
	position: relative;
	z-index: 1;
}

.hero-title {
	font-weight: 300;
	font-size: 0.6rem;
	color: #FFFFFF;
	line-height: 0.9rem;
}

.cases-list {
	background: #FFFFFF;
	padding: 0.6rem 0 0.8rem;
}

.cases-layout {
	width: 100%;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	align-items: stretch;
	gap: 0;
}

.cases-layout--single {
	display: block;
}

.cases-stack {
	display: flex;
	flex-direction: column;
	width: 100%;
}

.cases-item1,
.cases-item2,
.cases-item3 {
	position: relative;
	overflow: hidden;
	cursor: pointer;
}

/* component-loader 会给许多卡片加 .ux-hover-lift（hover 时 translateY(-4px)）；PC 案例页仅用 cases.css 做图片放大，此处抵消残留类名 */
.page-cases .cases-item1.ux-hover-lift:hover,
.page-cases .cases-item2.ux-hover-lift:hover,
.page-cases .cases-item3.ux-hover-lift:hover {
	transform: none;
	box-shadow: none;
}

/* 完整展示图片 object-fit:contain（不裁切）；比例与格子不一致时留白由浅灰底填充 */
.cases-image-wrapper {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.cases-image-zoom {
	position: absolute;
	inset: 0;
	overflow: hidden;
	z-index: 0;
	background-color: #f5f5f5;
}

/*
  通栏卡：设计稿 1920 版心内容宽约 17.2rem(1720px)、通栏高 623px → 1720/623；
  2K 等宽屏下列宽随视口变宽，同比例放大（例：约 2293×831），与 1920 仅尺度不同。
  半列 item2：860×407；item3：860×814（两格 item2 总高与 item3 对齐）。
*/
.cases-item1 {
	width: 100%;
	height: auto;
	aspect-ratio: 1720 / 623;
	min-height: 0;
}

.cases-item2 {
	width: 100%;
	height: auto;
	aspect-ratio: 860 / 407;
	min-height: 0;
}

.cases-item2 + .cases-item2 {
	margin-top: 0;
}

.cases-item3 {
	width: 100%;
	height: auto;
	aspect-ratio: 860 / 814;
	min-height: 0;
}

.cases-img {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 0;
	object-fit: contain;
	object-position: center;
	transition: transform 400ms ease;
	will-change: transform;
}

/* 与首页 .case-image 一致：仅放大图片层（.page-cases 提高优先级，覆盖全局 .ux-img-zoom:hover img） */
.page-cases .cases-image-wrapper:hover .cases-img,
.page-cases .cases-item1:hover .cases-img,
.page-cases .cases-item2:hover .cases-img,
.page-cases .cases-item3:hover .cases-img {
	transform: scale(1.06);
}

@media (prefers-reduced-motion: reduce) {
	.page-cases .cases-item1 .cases-img,
	.page-cases .cases-item2 .cases-img,
	.page-cases .cases-item3 .cases-img {
		transition: none;
	}

	.page-cases .cases-image-wrapper:hover .cases-img,
	.page-cases .cases-item1:hover .cases-img,
	.page-cases .cases-item2:hover .cases-img,
	.page-cases .cases-item3:hover .cases-img {
		transform: none;
	}
}

.cases-logo {
	height: 0.45rem;
	position: absolute;
	left: 0.5rem;
	bottom: 0.72rem;
	z-index: 10;
}

.cases-text {
	font-weight: 400;
	font-size: 0.22rem;
	color: #FFFFFF;
	position: absolute;
	left: 0.5rem;
	bottom: 0.3rem;
	z-index: 10;
}

.scheme {
	width: 100%;
	height: 5rem;
	background: #FFFFFF;
	border-top: 0.01rem solid #D7D7D7;
	margin-top: 0.9rem;
	text-align: center;
}

.scheme .container {
	text-align: center;
}

.scheme-title {
	font-weight: 300;
	font-size: 0.66rem;
	color: #222222;
	margin-top: 1.19rem;
}

.scheme-desc {
	font-weight: 300;
	font-size: 0.24rem;
	color: #161616;
}

.scheme-btns {
	width: 2.42rem;
	height: 0.5rem;
	background: #FE0000;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 400;
	font-size: 0.16rem;
	color: #FFFFFF;
	margin: auto;
	margin-top: 0.38rem;
	cursor: pointer;
}

.scheme-btns img {
	width: 0.18rem;
	margin-left: 0.42rem;
}