/*
 * ETheme-Block — features（特性卡网格）
 */

.etb-features {
	box-sizing: border-box;
	width: 100%;
	padding-block: var(--eth-section-space-y, 3rem);
}

.etb-features__grid {
	display: grid;
	grid-template-columns: repeat(var(--etb-features-cols, 3), minmax(0, 1fr));
	gap: var(--eth-space-m, 1.5rem);
	max-width: var(--eth-container, 1350px);
	margin-inline: auto;
	padding-inline: var(--eth-section-space-x, 1.5rem);
}

.etb-features--cols-2 .etb-features__grid {
	--etb-features-cols: 2;
}

.etb-features--cols-3 .etb-features__grid {
	--etb-features-cols: 3;
}

.etb-features--cols-4 .etb-features__grid {
	--etb-features-cols: 4;
}

/* AutoGrid 模式：按卡片最小宽度自动适应列数 */
.etb-features--mode-auto .etb-features__grid {
	grid-template-columns: repeat(auto-fit, minmax(min(var(--etb-features-min, 280px), 100%), 1fr));
}

.etb-features__card {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: var(--eth-space-2xs, 0.6rem);
	padding: var(--eth-space-m, 1.5rem);
	background: var(--eth-bg-surface, #fff);
	border-radius: var(--eth-radius-m, 0.8rem);
	box-shadow: var(--eth-shadow-s, 0 2px 6px rgba(0, 0, 0, 0.08));
}

/* 单个卡片左右排列：图标在左，内容在右 */
.etb-features--item-horizontal .etb-features__card {
	flex-direction: row;
	align-items: flex-start;
	gap: var(--eth-space-s, 1rem);
}

.etb-features--item-horizontal .etb-features__icon {
	margin-bottom: 0;
	flex: 0 0 auto;
}

.etb-features--item-horizontal .etb-features__body {
	min-width: 0;
}

.etb-features__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	height: 2.75rem;
	margin-bottom: var(--eth-space-2xs, 0.6rem);
	font-size: 1.5rem;
	background: var(--eth-primary-10, #eef2ff);
	color: var(--eth-primary, #4f46e5);
	border-radius: var(--eth-radius-m, 0.8rem);
}

.etb-features__icon--img {
	width: auto;
	height: 2.75rem;
	padding: 0;
	object-fit: contain;
	background: transparent;
	border-radius: 0;
}

.etb-features .etb-features__card .etb-features__title {
	margin: 0;
	font-family: var(--eth-font-heading, inherit);
	font-size: calc(var(--eth-fs-h3, 1.35rem) * 0.85);
	font-weight: var(--eth-fw-semibold, 600);
	line-height: var(--eth-lh-heading, 1.25);
	color: var(--eth-text-title, #111);
}

.etb-features__description {
	margin: 0;
	font-size: var(--eth-fs-body, 1rem);
	line-height: var(--eth-lh-body, 1.6);
	color: var(--eth-text-muted, #555);
}

.etb-features__description > :first-child {
	margin-top: 0;
}

.etb-features__description > :last-child {
	margin-bottom: 0;
}

.etb-features__description p,
.etb-features__description ul,
.etb-features__description ol {
	margin-block: 0 0.65em;
}

.etb-features__description ul,
.etb-features__description ol {
	padding-inline-start: 1.25em;
}

.etb-features__description li + li {
	margin-top: 0.3em;
}

.etb-features__description a {
	color: var(--eth-primary, #4f46e5);
	text-decoration-thickness: 1px;
	text-underline-offset: 0.14em;
}

.etb-features__description > :is(.etb-button-block, .wp-block-button) {
	margin-top: var(--eth-space-s, 1rem);
}

/* 1.1：四种卡片风格均复用原有内容和响应式网格。 */
.etb-features--style-outline .etb-features__card {
	border: 1px solid var(--eth-border, rgba(0, 0, 0, 0.12));
	box-shadow: none;
}

.etb-features--style-minimal .etb-features__card {
	padding: var(--eth-space-s, 1rem) var(--eth-space-xs, 0.75rem);
	background: transparent;
	border-bottom: 1px solid var(--eth-border, rgba(0, 0, 0, 0.12));
	border-radius: 0;
	box-shadow: none;
	transition: background-color 0.25s ease, border-color 0.25s ease;
}

.etb-features--style-minimal .etb-features__card:first-child {
	border-top: 1px solid var(--eth-border, rgba(0, 0, 0, 0.12));
}

.etb-features--style-spotlight .etb-features__card {
	border: 1px solid var(--eth-primary-20, rgba(79, 70, 229, 0.2));
	box-shadow: none;
}

.etb-features--style-spotlight .etb-features__icon {
	background: var(--eth-primary, #4f46e5);
	color: var(--eth-light, #fff);
}

/* 顶部强调：两种同一结构的设计选项，便于保持卡片节奏。 */
.etb-features--style-accent-top .etb-features__card {
	border: 1px solid var(--eth-border, rgba(0, 0, 0, 0.12));
	border-top: 0.25rem solid var(--eth-primary, #4f46e5);
	box-shadow: var(--eth-shadow-xs, 0 1px 2px rgba(0, 0, 0, 0.06));
}

.etb-features--style-gradient-top .etb-features__card {
	overflow: hidden;
	border: 1px solid var(--eth-border, rgba(0, 0, 0, 0.12));
	box-shadow: var(--eth-shadow-xs, 0 1px 2px rgba(0, 0, 0, 0.06));
}

.etb-features--style-gradient-top .etb-features__card::before {
	content: "";
	position: absolute;
	inset: 0 0 auto;
	height: 0.25rem;
	border-radius: var(--eth-radius-m, 0.8rem) var(--eth-radius-m, 0.8rem) 0 0;
	background: linear-gradient(90deg, var(--eth-primary, #4f46e5), var(--eth-secondary, #0f766e));
}

.etb-features__empty,
.etb-stats__empty,
.etb-testimonials__empty,
.etb-logos__empty {
	padding: var(--eth-space-m, 1.5rem);
	text-align: center;
	color: var(--eth-text-muted, #555);
}

@media (max-width: 992px) {
	.etb-features--cols-4 .etb-features__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 767px) {
	.etb-features--cols-2 .etb-features__grid,
	.etb-features--cols-3 .etb-features__grid,
	.etb-features--cols-4 .etb-features__grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ============================================================
 * 动效（偏克制：8px + 0.25s）
 * ============================================================ */


.etb-features__card {
	transition: transform 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease, border-color 0.25s ease;
}

@media (hover: hover) {
	.etb-features:not(.etb-features--style-minimal) .etb-features__card:hover {
		transform: translateY(-4px);
		box-shadow: var(--eth-shadow-m, 0 4px 12px rgba(0, 0, 0, 0.08));
	}

	.etb-features:not(.etb-features--style-minimal) .etb-features__card:hover .etb-features__icon {
		transform: scale(1.08);
	}

	.etb-features--style-minimal .etb-features__card:hover {
		background: var(--eth-primary-10, #eef2ff);
		border-bottom-color: var(--eth-primary-20, rgba(79, 70, 229, 0.2));
		transform: none;
		box-shadow: none;
	}

	.etb-features--style-minimal .etb-features__card:hover .etb-features__icon {
		transform: translateX(0.2rem);
	}
}

.etb-features__icon {
	transition: transform 0.25s ease, background 0.25s ease;
}

.etb-features--style-minimal .etb-features__card:focus-within {
	background: var(--eth-primary-10, #eef2ff);
	border-bottom-color: var(--eth-primary-20, rgba(79, 70, 229, 0.2));
	box-shadow: none;
}

:where(html.etb-has-js) .etb-features.etb-reveal .etb-features__card {
	opacity: 0;
	transform: translateY(8px);
	transition: opacity 0.25s ease, transform 0.25s ease;
}

.etb-features.etb-reveal--visible .etb-features__card,
.etb-features.etb-no-anim .etb-features__card {
	opacity: 1;
	transform: none;
}

.etb-features.etb-reveal--visible .etb-features__card:nth-child(2) { transition-delay: 0.06s; }
.etb-features.etb-reveal--visible .etb-features__card:nth-child(3) { transition-delay: 0.12s; }
.etb-features.etb-reveal--visible .etb-features__card:nth-child(4) { transition-delay: 0.18s; }
.etb-features.etb-reveal--visible .etb-features__card:nth-child(n+5) { transition-delay: 0.24s; }

@media (prefers-reduced-motion: reduce) {
	.etb-features__card,
	.etb-features__icon {
		transition: none;
	}

	.etb-features.etb-reveal .etb-features__card {
		opacity: 1;
		transform: none;
	}
}