/* ============================================================
   usp-cards — 真值: dist/css/blocks/usp-cards/usp-cards.css (逐规则对照, 仅格式化+注释)
   全出血: block_inner 无 u-container, width:100% → 三卡贯通视口
   ============================================================ */

/* 区块底色: 本页 section 无 --block-color-background → 透明, 露出 body #f7f7f5 */
.c-usp-cards {
	background-color: transparent !important;
	background-color: var(--block-color-background, transparent) !important;
}

.c-usp-cards .block_inner {
	width: 100%;
}

/* 卡阵列: 移动端单列, gap 0 (卡与卡无缝拼接) */
.c-usp-cards .cards {
	display: grid;
	grid-template-columns: 1fr;
	grid-gap: 0;
	gap: 0;
}

/* 桌面列型由 :has() 按卡数自动选择 (真值全量备档, 本页 3 卡 → repeat(3,1fr)):
   1 卡 → 1fr
   2 卡 → repeat(2,1fr)
   3 卡 → repeat(3,1fr)                  ← 本页
   4 卡 → repeat(2,1fr) + rows repeat(2,1fr)        (2×2)
   5 卡 → repeat(3,1fr) + rows repeat(2,1fr), 且第4/5张显式落在第2行前两列
   6 卡 → repeat(3,1fr) + rows repeat(2,1fr)
   ≥7 卡 → repeat(3,1fr) + grid-auto-rows 1fr */
@media (min-width: 1025px) {
	.c-usp-cards .cards {
		grid-template-columns: 1fr;
		max-width: 100%;
	}

	.c-usp-cards .cards:has(.cards_item:nth-child(1):last-child) {
		grid-template-columns: 1fr;
	}

	.c-usp-cards .cards:has(.cards_item:nth-child(2):last-child) {
		grid-template-columns: repeat(2, 1fr);
	}

	.c-usp-cards .cards:has(.cards_item:nth-child(3):last-child) {
		grid-template-columns: repeat(3, 1fr);
	}

	.c-usp-cards .cards:has(.cards_item:nth-child(4):last-child) {
		grid-template-columns: repeat(2, 1fr);
		grid-template-rows: repeat(2, 1fr);
	}

	.c-usp-cards .cards:has(.cards_item:nth-child(5):last-child) {
		grid-template-columns: repeat(3, 1fr);
		grid-template-rows: repeat(2, 1fr);
	}

	.c-usp-cards .cards:has(.cards_item:nth-child(6):last-child) {
		grid-template-columns: repeat(3, 1fr);
		grid-template-rows: repeat(2, 1fr);
	}

	.c-usp-cards .cards:has(.cards_item:nth-child(7)) {
		grid-template-columns: repeat(3, 1fr);
		grid-auto-rows: 1fr;
	}

	.c-usp-cards .cards:has(.cards_item:nth-child(5):last-child) .cards_item:nth-child(4) {
		grid-column: 1 / 2;
		grid-row: 2;
	}

	.c-usp-cards .cards:has(.cards_item:nth-child(5):last-child) .cards_item:nth-child(5) {
		grid-column: 2 / 3;
		grid-row: 2;
	}
}

/* 单卡: 内容沉底, 图标弹性占位;
   底色: 内联 --color-background 优先 (mint #cef79e / ink #222f30 / #e7e8e1), 默认 --color--4 #eee;
   文字色: 默认白 (light 卡), .-text-brightness--dark → ink rgb(34,47,48) */
.c-usp-cards .cards_item {
	--card-color-background: var(--color-background, var(--color--4));
	--card-color-text: 255, 255, 255;
	--card-icon-size: 68px;
	align-items: stretch;
	background: var(--card-color-background);
	color: #fff;
	color: rgba(var(--card-color-text, var(--color--7-rgb)), 1);
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	gap: 40px;
	min-height: 280px;
	overflow: hidden;
	padding: 24px;
	position: relative;
}

.c-usp-cards .cards_item.-text-brightness--dark {
	--card-color-text: var(--color--7-rgb);
}

/* 桌面: 初始 clip-path 收拢到左缘 (0 宽), 由 usp-cards.js 展开为全卡;
   移动端无此初始态 → 内容静态可见, JS 也直接 return */
@media (min-width: 1025px) {
	.c-usp-cards .cards_item {
		--card-icon-size: 114px;
		clip-path: polygon(0 0, 0% 0, 0% 100%, 0% 100%);
		min-height: 420px;
		padding: 40px;
	}
}

/* 右上角 mono 序号 01./02./03. */
.c-usp-cards .card_index {
	font-family: var(--family--2);
	font-size: max(.75rem, min(calc(.75rem + .002 * (100vw - 27.5rem)), .875rem));
	letter-spacing: -.02em;
	line-height: 1em;
	top: 24px;
	right: 24px;
	position: absolute;
	text-transform: uppercase;
}

@media (min-width: 1025px) {
	.c-usp-cards .card_index {
		right: 40px;
		top: 40px;
	}
}

/* 桌面入场初始态: opacity 0 + y:20, 由 usp-cards.js 内容时间线揭开 (移动端不隐藏) */
@media (min-width: 1025px) {
	.c-usp-cards .card_index,
	.c-usp-cards .card_icon,
	.c-usp-cards .card_label,
	.c-usp-cards .card_heading,
	.c-usp-cards .card_text {
		opacity: 0;
		transform: translateY(20px);
	}
}

/* 图标: flex:1 弹性占位把 content 推到底, 尺寸 68px(移动)/114px(桌面) */
.c-usp-cards .card_icon {
	align-items: stretch;
	flex: 1 0 var(--card-icon-size);
	display: flex;
	height: var(--card-icon-size);
	justify-content: flex-start;
	position: relative;
	width: var(--card-icon-size);
}

.c-usp-cards .card_icon img {
	display: inline-flex;
	height: var(--card-icon-size);
	width: var(--card-icon-size);
}

.c-usp-cards .card_content {
	align-items: stretch;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

/* card_label: mono 小标签槽位, 本页未输出 (HTML 留空) */
.c-usp-cards .card_label {
	font-family: var(--family--2);
	font-size: max(.75rem, min(calc(.75rem + .002 * (100vw - 27.5rem)), .875rem));
	letter-spacing: 0;
	line-height: 1em;
	opacity: .7;
	text-transform: uppercase;
}

/* 卡标题: 26→28px clamp */
.c-usp-cards .card_heading {
	font-size: max(1.625rem, min(calc(1.625rem + .002 * (100vw - 27.5rem)), 1.75rem));
	letter-spacing: -.02em;
	line-height: 1.1em;
	text-wrap: pretty;
}

/* 卡说明: 16→19px clamp, 70% 不透明度 */
.c-usp-cards .card_text {
	font-size: max(1rem, min(calc(1rem + .003 * (100vw - 27.5rem)), 1.1875rem));
	letter-spacing: -.02em;
	line-height: 1.3em;
	opacity: .7;
	text-wrap: pretty;
}

/* 编辑器预览态: 取消 clip-path 与初始隐藏 */
.c-usp-cards.is-preview .cards_item {
	clip-path: none !important;
}

.c-usp-cards.is-preview .cards_item .card_index,
.c-usp-cards.is-preview .cards_item .card_icon,
.c-usp-cards.is-preview .cards_item .card_label,
.c-usp-cards.is-preview .cards_item .card_heading,
.c-usp-cards.is-preview .cards_item .card_text {
	opacity: 1;
	transform: translateY(0);
}
