.yumin-quality-certifications {
	position: relative;
	min-height: 1355px;
	padding-top: 93px;
	overflow: hidden;
	color: #fff;
	background: #08b3ab;
}

.yumin-quality-certifications__copy {
	position: relative;
	z-index: 2;
}

.yumin-quality-certifications__intro {
	margin: 0;
	font-size: 24px;
	line-height: 2;
}

.yumin-quality-certifications__heading {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 32px;
	margin-top: 145px;
}

.yumin-quality-certifications__heading h2 {
	margin: 0;
	color: #fff;
	font-size: 48px;
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: 0;
}

.yumin-quality-carousel {
	position: relative;
	width: min(1650px, calc(100% - 64px));
	height: 820px;
	margin: 55px auto 0;
}

.yumin-quality-carousel__viewport {
	position: absolute;
	z-index: 2;
	inset: 0;
}

.yumin-quality-certificate {
	position: absolute;
	bottom: 44px;
	left: 50%;
	display: block;
	/*
	 * PSD 最终合成在 1920px 画布中使用 474px 宽的中心证书；
	 * 中等桌面必须随舞台同步缩小，避免把 1920px 的满尺寸直接带到 1644px 等视口。
	 * 410px 与下方窄桌面基准相接，保证断点前后不会出现尺寸跳变。
	 */
	width: clamp(410px, 25vw, 474px);
	min-width: 0;
	padding: 0;
	overflow: hidden;
	border: 0;
	border-radius: 0;
	color: #20242b;
	background: #fff;
	font: inherit;
	text-align: center;
	transform: translateX(-50%) scale(.72);
	transform-origin: bottom center;
	opacity: 0;
	pointer-events: none;
	cursor: pointer;
	transition: transform 340ms ease, opacity 340ms ease;
}

.yumin-quality-certificate__frame {
	display: grid;
	/* PSD 最终合成的中心证书图片框为 474 x 656，宽度变化时高度必须按同一比例变化。 */
	aspect-ratio: 474 / 656;
	padding: 16px;
	place-items: center;
	background: #fff;
}

.yumin-quality-certificate__frame img {
	display: block;
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}

.yumin-quality-certificate__title {
	display: block;
	min-height: 76px;
	padding: 24px 10px 12px;
	font-size: 19px;
	line-height: 1.25;
}

.yumin-quality-certificate.is-current,
.yumin-quality-certificate.is-previous,
.yumin-quality-certificate.is-next,
.yumin-quality-certificate.is-outer-previous,
.yumin-quality-certificate.is-outer-next {
	opacity: 1;
	pointer-events: auto;
}

.yumin-quality-certificate.is-current {
	z-index: 5;
	transform: translateX(-50%) scale(1);
}

.yumin-quality-certificate.is-previous {
	z-index: 4;
	/* 相邻卡提高至中心卡的 72%，进一步减轻中心卡两侧的收缩感。 */
	transform: translateX(-126%) scale(.72);
}

.yumin-quality-certificate.is-next {
	z-index: 4;
	/* 左右相邻卡使用相同缩放和相对中心的镜像位移，避免轮播后构图偏向一侧。 */
	transform: translateX(26%) scale(.72);
}

.yumin-quality-certificate.is-outer-previous {
	z-index: 3;
	/* 最外层提高至 56%，并向外补偿位移，使放大后的卡片仍与相邻卡精确衔接。 */
	transform: translateX(-190%) scale(.56);
}

.yumin-quality-certificate.is-outer-next {
	z-index: 3;
	/* 与左侧保持镜像，任意证书成为中心卡时构图不向一侧偏移。 */
	transform: translateX(90%) scale(.56);
}

.yumin-quality-carousel__control {
	position: absolute;
	z-index: 8;
	top: 170px;
	display: grid;
	width: 62px;
	height: 62px;
	padding: 0;
	place-items: center;
	border: 0;
	border-radius: 50%;
	color: #08a8a2;
	background: #fff;
	font-size: 30px;
	line-height: 1;
	cursor: pointer;
}

.yumin-quality-carousel__control--previous {
	left: 0;
}

.yumin-quality-carousel__control--next {
	right: 0;
}

.yumin-quality-certificate:focus-visible,
.yumin-quality-carousel__control:focus-visible,
.yumin-quality-dialog__close:focus-visible {
	outline: 3px solid #073f3e;
	outline-offset: 4px;
}

.yumin-quality-dialog {
	max-width: min(90vw, 1100px);
	max-height: 90vh;
	padding: 0;
	border: 0;
	color: #20242b;
	background: transparent;
}

.yumin-quality-dialog::backdrop {
	background: rgb(0 0 0 / 72%);
}

.yumin-quality-dialog__surface {
	position: relative;
	display: grid;
	max-height: 90vh;
	gap: 12px;
	padding: 32px;
	background: #fff;
	text-align: center;
}

.yumin-quality-dialog__surface img {
	display: block;
	max-width: 100%;
	max-height: calc(90vh - 120px);
	margin-inline: auto;
	object-fit: contain;
}

.yumin-quality-dialog__surface p {
	margin: 0;
	font-size: 18px;
}

.yumin-quality-dialog__close {
	position: absolute;
	z-index: 2;
	top: 10px;
	right: 10px;
	display: grid;
	width: 36px;
	height: 36px;
	padding: 0;
	place-items: center;
	border: 0;
	border-radius: 50%;
	color: #fff;
	background: #153f3e;
	font-size: 26px;
	line-height: 1;
	cursor: pointer;
}

@media (max-width: 1200px) {
	.yumin-quality-certifications {
		min-height: 1270px;
	}

	.yumin-quality-certifications__intro {
		font-size: 20px;
	}

	.yumin-quality-certifications__heading {
		margin-top: 105px;
	}

	.yumin-quality-certificate {
		bottom: 36px;
	}

	.yumin-quality-certificate.is-previous {
		/* 窄桌面隐藏最外两张后，相邻卡沿用放大后的 72% 层级。 */
		transform: translateX(-125%) scale(.72);
	}

	.yumin-quality-certificate.is-next {
		transform: translateX(25%) scale(.72);
	}

	.yumin-quality-certificate.is-outer-previous,
	.yumin-quality-certificate.is-outer-next {
		opacity: 0;
		pointer-events: none;
	}
}

@media (max-width: 700px) {
	.yumin-quality-certifications {
		min-height: 0;
		padding-top: 52px;
	}

	.yumin-quality-certifications__copy {
		width: calc(100% - 40px);
	}

	.yumin-quality-certifications__intro {
		font-size: 17px;
		line-height: 1.75;
	}

	.yumin-quality-certifications__heading {
		margin-top: 68px;
	}

	.yumin-quality-certifications__heading h2 {
		font-size: 34px;
	}

	.yumin-quality-carousel {
		width: calc(100% - 32px);
		height: 640px;
		margin-top: 30px;
	}

	.yumin-quality-certificate {
		bottom: 28px;
		width: min(calc(100% - 28px), 360px);
	}

	.yumin-quality-certificate__frame {
		padding: 12px;
	}

	.yumin-quality-certificate__title {
		min-height: 58px;
		padding: 16px 8px 10px;
		font-size: 16px;
	}

	.yumin-quality-certificate.is-previous,
	.yumin-quality-certificate.is-next,
	.yumin-quality-certificate.is-outer-previous,
	.yumin-quality-certificate.is-outer-next {
		opacity: 0;
		pointer-events: none;
	}

	.yumin-quality-carousel__control {
		top: 245px;
		width: 48px;
		height: 48px;
		font-size: 24px;
	}

	.yumin-quality-dialog__surface {
		padding: 40px 18px 18px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.yumin-quality-certificate {
		transition: none;
	}
}