/*
 * ETheme-Block — image-grid-card（图片网格内部子项）
 *
 * 新内容由 image-grid 父模块统一控制样式与构图。本文件继续保留 3.0.x
 * 已保存独立图片卡的外观，作为兼容路径，不再作为公开组件入口。
 *
 * 样式变体走两条路径，共用同一份规则：
 *   1. 独立使用 → 区块样式 is-style-eth-*
 *   2. 在 image-grid 父块内 → 父块样式属性输出的 .etb-image-grid--style-*
 * 因此父块内外的观感完全一致，且无需维护两份样式。
 *
 * 注意：editorial 样式的「展开列」交互由父块的脚本驱动（.is-active 由脚本添加），
 * 独立使用时呈现为静态的竖排标题形态；numbered-overlay 的「无图编号块」
 * 依赖卡片自身的 type 设定，在任意栅格中均可生效。
 */

.etb-image-grid__card,
.etb-image-grid__card *,
.etb-image-grid__card,
.etb-image-grid__card *::before,
.etb-image-grid__card,
.etb-image-grid__card *::after {
	box-sizing: border-box;
}
.etb-image-grid__card-description>:first-child {
	margin-top: 0;
}
.etb-image-grid__card-description>:last-child {
	margin-bottom: 0;
}
.etb-image-grid__card {
	/* 元件自带变量：半径 / 缓动 / 强调色 / 深色底原先只定义在父块根元素 .etb-image-grid 上，
	   脱离父块时 var() 取不到值会让整条声明失效（transition 回落 none、圆角归零），
	   表现为悬停生硬跳变。此处按父块同名值就地补齐，父块内外观感保持一致。 */
	--etb-image-grid-radius: var(--eth-radius-l,0.75rem);
	--etb-image-grid-primary: var(--eth-primary,#4f46e5);
	--etb-image-grid-dark: var(--eth-dark,#111820);
	--etb-image-grid-ease: cubic-bezier(0.22,1,0.36,1);
	--etb-image-grid-card-height: clamp(18rem, 28vw, 25rem);
	position: relative;
	width: 100%;
	min-width: 0;
	min-height: var(--etb-image-grid-card-height);
	margin: 0;
	overflow: hidden;
	background: var(--eth-bg-muted, #dfe3e8);
	isolation: isolate;
}
.etb-image-grid__image,
.etb-image-grid__card>.components-placeholder {
	position: absolute;
	inset: 0;
	z-index: var(--etb-z-behind);
	width: 100%;
	height: 100%;
	margin: 0;
	object-fit: cover;
	transition: transform 680ms var(--etb-image-grid-ease),opacity 560ms ease,filter 560ms ease;
}
.etb-image-grid__overlay {
	position: absolute;
	inset: 0;
	z-index: var(--etb-z-under);
	pointer-events: none;
	transition: opacity 420ms ease,background-color 420ms ease;
}
.etb-image-grid__content {
	position: relative;
	z-index: var(--etb-z-raised);
	min-width: 0;
}
.etb-image-grid__card .etb-image-grid__title {
	margin: 0;
	color: inherit;
	font-family: var(--eth-font-heading,inherit);
	font-size: calc(var(--eth-fs-h3,1.35rem) * 0.7);
	font-weight: var(--eth-fw-semibold,600);
	line-height: 1.25;
}
.etb-image-grid__title a {
	display: inline-flex;
	align-items: center;
	gap: 0.55rem;
	color: inherit;
	text-decoration: none;
}
.etb-image-grid__title a::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: var(--etb-z-overlay);
}
.etb-image-grid__link-icon {
	display: inline-grid;
	place-items: center;
	width: 1.45em;
	height: 1.45em;
	border: 1px solid currentColor;
	border-radius: 50%;
	font-size: 0.7em;
	line-height: 1;
	transition: transform 300ms var(--etb-image-grid-ease);
}
.etb-image-grid__card-description {
	font-size: 0.96rem;
	line-height: 1.6;
}
.etb-image-grid__card-description a {
	position: relative;
	z-index: var(--etb-z-popover);
	color: inherit;
}
.etb-image-grid__card-description :is(ul,
ol) {
	margin-block: 0.75rem 0;
	padding-inline-start: 1.25rem;
}
.etb-image-grid__card-description .wp-block-button {
	position: relative;
	z-index: var(--etb-z-popover);
}
.etb-image-grid__card:focus-visible {
	outline: 3px solid var(--eth-primary-50,#6f8cff);
	outline: 3px solid color-mix(in srgb,var(--etb-image-grid-primary) 72%,white);
	outline-offset: 3px;
}
.etb-image-grid__card:where(.is-style-eth-caption),
.etb-image-grid--style-caption .etb-image-grid__card {
	min-height: clamp(18rem,28vw,25rem);
	border-radius: var(--etb-image-grid-radius);
	color: var(--eth-light,#fff);
}
.etb-image-grid__card:where(.is-style-eth-caption) .etb-image-grid__overlay,
.etb-image-grid--style-caption .etb-image-grid__overlay {
	background: linear-gradient(to top,var(--etb-overlay-dark),var(--etb-overlay-dark-subtle) 68%,transparent 100%);
	transition: none;
}
.etb-image-grid__card:where(.is-style-eth-caption) .etb-image-grid__overlay::after,
.etb-image-grid--style-caption .etb-image-grid__overlay::after {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--etb-overlay-dark-soft);
	opacity: 0;
	transition: opacity 680ms var(--etb-image-grid-ease);
}
.etb-image-grid__card:where(.is-style-eth-caption) .etb-image-grid__content,
.etb-image-grid--style-caption .etb-image-grid__content {
	position: absolute;
	inset: auto 0 0;
	max-height: 4.8rem;
	padding: 1.15rem 1.35rem;
	overflow: hidden;
	transition: max-height 680ms var(--etb-image-grid-ease);
}
.etb-image-grid__card:where(.is-style-eth-caption) .etb-image-grid__card-description,
.etb-image-grid--style-caption .etb-image-grid__card-description {
	margin-top: 0;
	opacity: 0;
	transform: translateY(0.45rem);
	transition: margin 640ms var(--etb-image-grid-ease),opacity 420ms ease 100ms,transform 640ms var(--etb-image-grid-ease) 60ms;
}
.etb-image-grid__card:where(.is-style-eth-caption):is(:hover,:focus-within) .etb-image-grid__content,
.etb-image-grid--style-caption .etb-image-grid__card:is(:hover,:focus-within) .etb-image-grid__content {
	max-height: calc(100% - 0.6rem);
}
.etb-image-grid__card:where(.is-style-eth-caption):is(:hover,:focus-within) .etb-image-grid__overlay::after,
.etb-image-grid--style-caption .etb-image-grid__card:is(:hover,:focus-within) .etb-image-grid__overlay::after {
	opacity: 1;
}
.etb-image-grid__card:where(.is-style-eth-caption):is(:hover,:focus-within) .etb-image-grid__card-description,
.etb-image-grid--style-caption .etb-image-grid__card:is(:hover,:focus-within) .etb-image-grid__card-description {
	margin-top: 0.65rem;
	opacity: 1;
	transform: none;
}
.etb-image-grid__card:where(.is-style-eth-caption):is(:hover,:focus-within) .etb-image-grid__image,
.etb-image-grid--style-caption .etb-image-grid__card:is(:hover,:focus-within) .etb-image-grid__image {
	transform: scale(1.02);
}
.etb-image-grid__card:where(.is-style-eth-caption):is(:hover,:focus-within) .etb-image-grid__link-icon,
.etb-image-grid--style-caption .etb-image-grid__card:is(:hover,:focus-within) .etb-image-grid__link-icon {
	transform: translate(0.08rem,-0.08rem);
}
.etb-image-grid__card:where(.is-style-eth-centered-overlay),
.etb-image-grid--style-centered-overlay .etb-image-grid__card {
	min-height: clamp(20rem,31vw,28rem);
	border-radius: var(--etb-image-grid-radius);
	color: var(--eth-light,#fff);
	box-shadow: var(--eth-shadow-m,0 1rem 2.4rem rgba(15,23,42,0.12));
	transition: transform 600ms var(--etb-image-grid-ease),box-shadow 600ms var(--etb-image-grid-ease);
}
.etb-image-grid__card:where(.is-style-eth-centered-overlay) .etb-image-grid__overlay,
.etb-image-grid--style-centered-overlay .etb-image-grid__overlay {
	background: var(--etb-overlay-dark);
}
.etb-image-grid__card:where(.is-style-eth-centered-overlay) .etb-image-grid__content,
.etb-image-grid--style-centered-overlay .etb-image-grid__content {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	height: 100%;
	padding: clamp(1.35rem,3vw,2.25rem);
	text-align: center;
}
.etb-image-grid__card:where(.is-style-eth-centered-overlay) .etb-image-grid__card-description,
.etb-image-grid--style-centered-overlay .etb-image-grid__card-description {
	max-width: 32ch;
	margin-top: 0.75rem;
	color: var(--etb-overlay-light-muted);
}
.etb-image-grid__card:where(.is-style-eth-centered-overlay):is(:hover,:focus-within),
.etb-image-grid--style-centered-overlay .etb-image-grid__card:is(:hover,:focus-within) {
	transform: translateY(-0.5rem);
	box-shadow: var(--eth-shadow-m,0 1rem 2.4rem rgba(15,23,42,0.12));
}
.etb-image-grid__card:where(.is-style-eth-centered-overlay):is(:hover,:focus-within) .etb-image-grid__image,
.etb-image-grid--style-centered-overlay .etb-image-grid__card:is(:hover,:focus-within) .etb-image-grid__image {
	transform: scale(1.04);
}
.etb-image-grid__card:where(.is-style-eth-centered-overlay):is(:hover,:focus-within) .etb-image-grid__overlay,
.etb-image-grid--style-centered-overlay .etb-image-grid__card:is(:hover,:focus-within) .etb-image-grid__overlay {
	background: var(--etb-overlay-dark-medium);
}
.etb-image-grid__card:where(.is-style-eth-numbered-overlay),
.etb-image-grid--style-numbered-overlay .etb-image-grid__card {
	min-height: clamp(17rem,25vw,23rem);
	border-radius: 0;
	color: var(--eth-light,#fff);
	counter-increment: etb-kilo;
}
.etb-image-grid__card:where(.is-style-eth-numbered-overlay) .etb-image-grid__overlay,
.etb-image-grid--style-numbered-overlay .etb-image-grid__overlay {
	background: linear-gradient(to top,var(--etb-overlay-dark),var(--etb-overlay-dark-subtle) 68%);
}
.etb-image-grid__card:where(.is-style-eth-numbered-overlay) .etb-image-grid__content,
.etb-image-grid--style-numbered-overlay .etb-image-grid__content {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	height: 100%;
	padding: clamp(1.25rem,2.4vw,2rem);
}
.etb-image-grid__card:where(.is-style-eth-numbered-overlay) .etb-image-grid__number,
.etb-image-grid--style-numbered-overlay .etb-image-grid__number {
	display: none;
}
.etb-image-grid__card:where(.is-style-eth-numbered-overlay) .etb-image-grid__eyebrow,
.etb-image-grid--style-numbered-overlay .etb-image-grid__eyebrow {
	margin-bottom: 0.55rem;
	color: var(--etb-overlay-light-border);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.11em;
	text-transform: uppercase;
}
.etb-image-grid__card:where(.is-style-eth-numbered-overlay) .etb-image-grid__card-description,
.etb-image-grid--style-numbered-overlay .etb-image-grid__card-description {
	margin-top: 0.6rem;
	color: var(--etb-overlay-light-muted);
}
.etb-image-grid__card:where(.is-style-eth-numbered-overlay):not(.etb-image-grid__card--type-highlight):is(:hover,:focus-within) .etb-image-grid__image,
.etb-image-grid--style-numbered-overlay .etb-image-grid__card:not(.etb-image-grid__card--type-highlight):is(:hover,:focus-within) .etb-image-grid__image {
	transform: scale(1.06);
}
.etb-image-grid__card:where(.is-style-eth-numbered-overlay):not(.etb-image-grid__card--type-highlight):is(:hover,:focus-within) .etb-image-grid__overlay,
.etb-image-grid--style-numbered-overlay .etb-image-grid__card:not(.etb-image-grid__card--type-highlight):is(:hover,:focus-within) .etb-image-grid__overlay {
	background: var(--eth-primary-50,rgba(25,44,91,0.78));
	background: color-mix(in srgb,var(--etb-image-grid-primary) 66%,rgba(6,9,14,0.72));
}
.etb-image-grid__card:where(.is-style-eth-numbered-overlay).etb-image-grid__card--type-highlight,
.etb-image-grid__card:where(.is-style-eth-numbered-overlay).etb-image-grid__card--type-auto:nth-child(even),
.etb-image-grid--style-numbered-overlay .etb-image-grid__card--type-highlight,
.etb-image-grid--style-numbered-overlay .etb-image-grid__card--type-auto:nth-child(even) {
	background: var(--etb-image-grid-dark);
}
.etb-image-grid__card:where(.is-style-eth-numbered-overlay).etb-image-grid__card--type-highlight .etb-image-grid__image,
.etb-image-grid__card:where(.is-style-eth-numbered-overlay).etb-image-grid__card--type-auto:nth-child(even) .etb-image-grid__image,
.etb-image-grid--style-numbered-overlay .etb-image-grid__card--type-highlight .etb-image-grid__image,
.etb-image-grid--style-numbered-overlay .etb-image-grid__card--type-auto:nth-child(even) .etb-image-grid__image {
	display: none;
}
.etb-image-grid__card:where(.is-style-eth-numbered-overlay).etb-image-grid__card--type-highlight .etb-image-grid__overlay,
.etb-image-grid__card:where(.is-style-eth-numbered-overlay).etb-image-grid__card--type-auto:nth-child(even) .etb-image-grid__overlay,
.etb-image-grid--style-numbered-overlay .etb-image-grid__card--type-highlight .etb-image-grid__overlay,
.etb-image-grid--style-numbered-overlay .etb-image-grid__card--type-auto:nth-child(even) .etb-image-grid__overlay {
	background: radial-gradient(circle at 80% 15%,rgba(49,87,213,0.5),transparent 48%),var(--etb-image-grid-dark);
	background: radial-gradient(circle at 80% 15%,color-mix(in srgb,var(--etb-image-grid-primary) 52%,transparent),transparent 48%),var(--etb-image-grid-dark);
}
.etb-image-grid__card:where(.is-style-eth-numbered-overlay).etb-image-grid__card--type-highlight .etb-image-grid__content,
.etb-image-grid__card:where(.is-style-eth-numbered-overlay).etb-image-grid__card--type-auto:nth-child(even) .etb-image-grid__content,
.etb-image-grid--style-numbered-overlay .etb-image-grid__card--type-highlight .etb-image-grid__content,
.etb-image-grid--style-numbered-overlay .etb-image-grid__card--type-auto:nth-child(even) .etb-image-grid__content {
	align-items: center;
	justify-content: center;
	text-align: center;
}
.etb-image-grid__card:where(.is-style-eth-numbered-overlay).etb-image-grid__card--type-highlight .etb-image-grid__number,
.etb-image-grid__card:where(.is-style-eth-numbered-overlay).etb-image-grid__card--type-auto:nth-child(even) .etb-image-grid__number,
.etb-image-grid--style-numbered-overlay .etb-image-grid__card--type-highlight .etb-image-grid__number,
.etb-image-grid--style-numbered-overlay .etb-image-grid__card--type-auto:nth-child(even) .etb-image-grid__number {
	display: block;
	margin-bottom: 0.55rem;
	font-size: clamp(3rem,7vw,6.5rem);
	font-weight: 800;
	line-height: 0.95;
	letter-spacing: -0.05em;
	transition: transform 480ms var(--etb-image-grid-ease),color 360ms ease;
}
.etb-image-grid__card:where(.is-style-eth-numbered-overlay).etb-image-grid__card--type-auto:nth-child(even) .etb-image-grid__number:empty::before,
.etb-image-grid--style-numbered-overlay .etb-image-grid__card--type-auto:nth-child(even) .etb-image-grid__number:empty::before {
	content: counter(etb-kilo,decimal-leading-zero);
}
.etb-image-grid__card:where(.is-style-eth-numbered-overlay).etb-image-grid__card--type-highlight .etb-image-grid__number--auto:empty::before,
.etb-image-grid--style-numbered-overlay .etb-image-grid__card--type-highlight .etb-image-grid__number--auto:empty::before {
	content: "101";
}
.etb-image-grid__card:where(.is-style-eth-numbered-overlay).etb-image-grid__card--type-highlight:is(:hover,:focus-within) .etb-image-grid__number,
.etb-image-grid__card:where(.is-style-eth-numbered-overlay).etb-image-grid__card--type-auto:nth-child(even):is(:hover,:focus-within) .etb-image-grid__number,
.etb-image-grid--style-numbered-overlay .etb-image-grid__card--type-highlight:is(:hover,:focus-within) .etb-image-grid__number,
.etb-image-grid--style-numbered-overlay .etb-image-grid__card--type-auto:nth-child(even):is(:hover,:focus-within) .etb-image-grid__number {
	transform: translateY(-0.35rem) scale(1.035);
	color: #9aafff;
	color: color-mix(in srgb,var(--etb-image-grid-primary) 55%,white);
}
.etb-image-grid--style-editorial .etb-image-grid__card {
	min-height: clamp(23rem,36vw,32rem);
	border-radius: calc(var(--etb-image-grid-radius) * 0.8);
	color: var(--eth-light,#fff);
	cursor: pointer;
}
.etb-image-grid--style-editorial .etb-image-grid__overlay {
	background: linear-gradient(to top,var(--etb-overlay-dark),var(--etb-overlay-dark-subtle) 72%);
}
.etb-image-grid--style-editorial .etb-image-grid__content {
	position: absolute;
	inset: auto 0 0;
	padding: clamp(1.2rem,2.5vw,2rem);
}
.etb-image-grid--style-editorial .etb-image-grid__card-description {
	max-height: 0;
	margin-top: 0;
	overflow: hidden;
	opacity: 0;
	transform: translateY(1rem);
	visibility: hidden;
	transition: max-height 460ms var(--etb-image-grid-ease),margin 360ms ease,opacity 300ms ease,transform 460ms var(--etb-image-grid-ease);
}
.etb-image-grid--style-editorial .etb-image-grid__card:not(.is-active):not(:hover):not(:focus-within) .etb-image-grid__title {
	max-height: 12rem;
	font-size: 1.05rem;
	writing-mode: vertical-rl;
	transform: rotate(180deg);
}
.etb-image-grid--style-editorial .etb-image-grid__card:is(.is-active,:hover,:focus-within) .etb-image-grid__card-description {
	max-height: 18rem;
	margin-top: 0.7rem;
	opacity: 1;
	transform: none;
	visibility: visible;
}
.etb-image-grid--style-editorial .etb-image-grid__card:is(.is-active,:hover,:focus-within) .etb-image-grid__image {
	transform: scale(1.045);
}
.etb-image-grid--style-editorial .etb-image-grid__card:is(.is-active,:hover,:focus-within) .etb-image-grid__overlay {
	background: linear-gradient(to top,var(--etb-overlay-dark),var(--etb-overlay-dark-subtle) 64%);
}
.etb-image-grid__card:where(.is-style-eth-meta-overlay),
.etb-image-grid--style-meta-overlay .etb-image-grid__card {
	min-height: clamp(21rem,30vw,27rem);
	border: 1px solid var(--etb-overlay-light);
	border-radius: calc(var(--etb-image-grid-radius) * 0.65);
	background: var(--etb-image-grid-dark);
	color: var(--eth-light,#fff);
}
.etb-image-grid__card:where(.is-style-eth-meta-overlay) .etb-image-grid__image,
.etb-image-grid--style-meta-overlay .etb-image-grid__image {
	opacity: 0.55;
	filter: saturate(0.9) contrast(1);
}
.etb-image-grid__card:where(.is-style-eth-meta-overlay) .etb-image-grid__overlay,
.etb-image-grid--style-meta-overlay .etb-image-grid__overlay {
	background: linear-gradient(145deg,rgba(10,15,22,0.04),rgba(10,15,22,0.3));
}
.etb-image-grid__card:where(.is-style-eth-meta-overlay) .etb-image-grid__content,
.etb-image-grid--style-meta-overlay .etb-image-grid__content {
	display: grid;
	grid-template-rows: auto 1fr auto;
	height: 100%;
	padding: clamp(1.25rem,2.5vw,2rem);
}
.etb-image-grid__card:where(.is-style-eth-meta-overlay) .etb-image-grid__eyebrow,
.etb-image-grid--style-meta-overlay .etb-image-grid__eyebrow {
	grid-row: 1;
	justify-self: start;
	padding: 0.4rem 0.7rem;
	border: 1px solid var(--etb-overlay-light);
	border-radius: 999px;
	background: var(--etb-overlay-dark-medium);
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}
.etb-image-grid__card:where(.is-style-eth-meta-overlay) .etb-image-grid__title,
.etb-image-grid--style-meta-overlay .etb-image-grid__title {
	grid-row: 2;
	align-self: end;
}
.etb-image-grid__card:where(.is-style-eth-meta-overlay) .etb-image-grid__card-description,
.etb-image-grid--style-meta-overlay .etb-image-grid__card-description {
	grid-row: 3;
	margin-top: 0.65rem;
	color: var(--etb-overlay-light-border);
}
.etb-image-grid__card:where(.is-style-eth-meta-overlay):is(:hover,:focus-within) .etb-image-grid__image,
.etb-image-grid--style-meta-overlay .etb-image-grid__card:is(:hover,:focus-within) .etb-image-grid__image {
	opacity: 0.85;
	transform: scale(1.05);
	filter: saturate(1) contrast(1);
}
.etb-image-grid__card:where(.is-style-eth-meta-overlay):is(:hover,:focus-within) .etb-image-grid__overlay,
.etb-image-grid--style-meta-overlay .etb-image-grid__card:is(:hover,:focus-within) .etb-image-grid__overlay {
	opacity: 0.5;
}
.etb-image-grid__card:where(.is-style-eth-meta-overlay):is(:hover,:focus-within) .etb-image-grid__link-icon,
.etb-image-grid--style-meta-overlay .etb-image-grid__card:is(:hover,:focus-within) .etb-image-grid__link-icon {
	transform: translate(0.12rem,-0.12rem);
}
.etb-image-grid__card:where(.is-style-eth-centered-lift),
.etb-image-grid--style-centered-lift .etb-image-grid__card {
	min-height: clamp(19rem,30vw,26rem);
	border-radius: var(--etb-image-grid-radius);
	color: var(--eth-light,#fff);
	transition: transform 500ms var(--etb-image-grid-ease),box-shadow 500ms var(--etb-image-grid-ease);
}
.etb-image-grid__card:where(.is-style-eth-centered-lift) .etb-image-grid__overlay,
.etb-image-grid--style-centered-lift .etb-image-grid__overlay {
	background: linear-gradient(to top,var(--etb-overlay-dark),var(--etb-overlay-dark-subtle) 58%,transparent 100%);
}
.etb-image-grid__card:where(.is-style-eth-centered-lift) .etb-image-grid__overlay::after,
.etb-image-grid--style-centered-lift .etb-image-grid__overlay::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to top,var(--etb-overlay-dark-medium),transparent 72%);
	opacity: 0;
	transition: opacity 400ms ease;
}
.etb-image-grid__card:where(.is-style-eth-centered-lift) .etb-image-grid__content,
.etb-image-grid--style-centered-lift .etb-image-grid__content {
	position: absolute;
	inset: auto 0 0;
	display: flex;
	flex-direction: column-reverse;
	align-items: center;
	justify-content: flex-start;
	max-height: calc(100% - 0.75rem);
	padding: clamp(1.5rem,3vw,2.25rem) clamp(1.25rem,3vw,2rem) clamp(1.15rem,2.4vw,1.6rem);
	text-align: center;
	overflow: hidden;
}
.etb-image-grid__card:where(.is-style-eth-centered-lift) .etb-image-grid__card-description,
.etb-image-grid--style-centered-lift .etb-image-grid__card-description {
	max-width: 34ch;
	margin-bottom: 0.8rem;
	color: var(--etb-overlay-light-muted);
	opacity: 0;
	transform: translateY(1.875rem);
	transition: transform 400ms ease,opacity 400ms ease;
}
.etb-image-grid__card:where(.is-style-eth-centered-lift):is(:hover,:focus-within),
.etb-image-grid--style-centered-lift .etb-image-grid__card:is(:hover,:focus-within) {
	box-shadow: var(--eth-shadow-m,0 1rem 2.4rem rgba(15,23,42,0.12));
}
.etb-image-grid__card:where(.is-style-eth-centered-lift):is(:hover,:focus-within) .etb-image-grid__overlay::after,
.etb-image-grid--style-centered-lift .etb-image-grid__card:is(:hover,:focus-within) .etb-image-grid__overlay::after {
	opacity: 1;
}
.etb-image-grid__card:where(.is-style-eth-centered-lift):is(:hover,:focus-within) .etb-image-grid__content,
.etb-image-grid--style-centered-lift .etb-image-grid__card:is(:hover,:focus-within) .etb-image-grid__content {
	max-height: calc(100% - 0.5rem);
}
.etb-image-grid__card:where(.is-style-eth-centered-lift):is(:hover,:focus-within) .etb-image-grid__card-description,
.etb-image-grid--style-centered-lift .etb-image-grid__card:is(:hover,:focus-within) .etb-image-grid__card-description {
	opacity: 1;
	transform: translateY(0);
}
.etb-image-grid__card:where(.is-style-eth-bottom-reveal),
.etb-image-grid--style-bottom-reveal .etb-image-grid__card {
	min-height: clamp(19rem,30vw,26rem);
	border-radius: var(--etb-image-grid-radius);
	color: var(--eth-text-title);
	background: var(--eth-bg-surface);
	transition: box-shadow 600ms var(--etb-image-grid-ease);
}
.etb-image-grid__card:where(.is-style-eth-bottom-reveal) .etb-image-grid__content,
.etb-image-grid--style-bottom-reveal .etb-image-grid__content {
	position: absolute;
	inset: auto 0 0;
	z-index: var(--etb-z-overlay);
	display: flex;
	flex-direction: column;
	align-items: center;
	max-height: 5.2rem;
	padding: clamp(1rem,2.2vw,1.5rem) clamp(1.25rem,3vw,2rem);
	text-align: center;
	overflow: hidden;
	background: var(--eth-bg-surface);
	transition: max-height 640ms cubic-bezier(0.4,0,0.2,1),box-shadow 600ms var(--etb-image-grid-ease);
	interpolate-size: allow-keywords;
}
.etb-image-grid__card:where(.is-style-eth-bottom-reveal) .etb-image-grid__title,
.etb-image-grid--style-bottom-reveal .etb-image-grid__title {
	color: var(--eth-text-title);
}
.etb-image-grid__card:where(.is-style-eth-bottom-reveal) .etb-image-grid__card-description,
.etb-image-grid--style-bottom-reveal .etb-image-grid__card-description {
	max-width: 44ch;
	margin-top: 0.65rem;
	color: var(--eth-text-muted);
	opacity: 0;
	transform: translateY(0.75rem);
	transition: opacity 480ms ease,transform 560ms cubic-bezier(0.4,0,0.2,1);
}
.etb-image-grid__card:where(.is-style-eth-bottom-reveal) .etb-image-grid__card-description :is(p,ul,ol),
.etb-image-grid--style-bottom-reveal .etb-image-grid__card-description :is(p,ul,ol) {
	text-align: center;
}
.etb-image-grid__card:where(.is-style-eth-bottom-reveal) .etb-image-grid__card-description>:first-child,
.etb-image-grid--style-bottom-reveal .etb-image-grid__card-description>:first-child {
	margin-top: 0;
}
.etb-image-grid__card:where(.is-style-eth-bottom-reveal) .etb-image-grid__card-description>:last-child,
.etb-image-grid--style-bottom-reveal .etb-image-grid__card-description>:last-child {
	margin-bottom: 0;
}
.etb-image-grid__card:where(.is-style-eth-bottom-reveal):is(:hover,:focus-within),
.etb-image-grid--style-bottom-reveal .etb-image-grid__card:is(:hover,:focus-within) {
	box-shadow: var(--eth-shadow-m,0 1rem 2.4rem rgba(15,23,42,0.12));
}
@supports (interpolate-size: allow-keywords) {
.etb-image-grid__card:where(.is-style-eth-bottom-reveal):is(:hover,:focus-within) .etb-image-grid__content,
.etb-image-grid--style-bottom-reveal .etb-image-grid__card:is(:hover,:focus-within) .etb-image-grid__content {
	max-height: max-content;
}
}
@supports not (interpolate-size: allow-keywords) {
.etb-image-grid__card:where(.is-style-eth-bottom-reveal):is(:hover,:focus-within) .etb-image-grid__content,
.etb-image-grid--style-bottom-reveal .etb-image-grid__card:is(:hover,:focus-within) .etb-image-grid__content {
	max-height: calc(100% - 0.75rem);
}
}
.etb-image-grid__card:where(.is-style-eth-bottom-reveal):is(:hover,:focus-within) .etb-image-grid__card-description,
.etb-image-grid--style-bottom-reveal .etb-image-grid__card:is(:hover,:focus-within) .etb-image-grid__card-description {
	opacity: 1;
	transform: translateY(0);
}
.etb-image-grid__card:nth-child(2) {
	--etb-reveal-delay: 70ms;
}
.etb-image-grid__card:nth-child(3) {
	--etb-reveal-delay: 140ms;
}
.etb-image-grid__card:nth-child(4) {
	--etb-reveal-delay: 210ms;
}
.etb-image-grid__card:nth-child(5) {
	--etb-reveal-delay: 280ms;
}
.etb-image-grid__card:nth-child(n+6) {
	--etb-reveal-delay: 350ms;
}
@media (max-width: 768px) {
.etb-image-grid--style-editorial .etb-image-grid__card {
	min-height: 22rem;
	cursor: default;
}
.etb-image-grid--style-editorial .etb-image-grid__card .etb-image-grid__title {
	writing-mode: initial !important;
	transform: none !important;
}
.etb-image-grid--style-editorial .etb-image-grid__card-description {
	max-height: none;
	margin-top: 0.7rem;
	opacity: 1;
	transform: none;
	visibility: visible;
}
}
@media (hover: none) {
.etb-image-grid__card:where(.is-style-eth-centered-lift) .etb-image-grid__content,
.etb-image-grid--style-centered-lift .etb-image-grid__content {
	max-height: calc(100% - 0.5rem);
}
.etb-image-grid__card:where(.is-style-eth-bottom-reveal) .etb-image-grid__content,
.etb-image-grid--style-bottom-reveal .etb-image-grid__content {
	max-height: max-content;
}
.etb-image-grid__card:where(.is-style-eth-bottom-reveal) .etb-image-grid__card-description,
.etb-image-grid--style-bottom-reveal .etb-image-grid__card-description {
	opacity: 1;
	transform: translateY(0);
}
.etb-image-grid__card:where(.is-style-eth-centered-lift) .etb-image-grid__card-description,
.etb-image-grid--style-centered-lift .etb-image-grid__card-description {
	opacity: 1;
	transform: translateY(0);
}
.etb-image-grid__card:where(.is-style-eth-caption) .etb-image-grid__content,
.etb-image-grid--style-caption .etb-image-grid__content {
	max-height: calc(100% - 0.6rem);
}
.etb-image-grid__card:where(.is-style-eth-caption) .etb-image-grid__card-description,
.etb-image-grid--style-caption .etb-image-grid__card-description {
	margin-top: 0.65rem;
	opacity: 1;
	transform: none;
}
.etb-image-grid--style-editorial .etb-image-grid__card .etb-image-grid__title {
	writing-mode: initial;
	transform: none;
}
.etb-image-grid--style-editorial .etb-image-grid__card-description {
	max-height: none;
	margin-top: 0.7rem;
	opacity: 1;
	transform: none;
	visibility: visible;
}
}
@media (prefers-reduced-motion: reduce) {
.etb-image-grid__card,
.etb-image-grid__card *,
.etb-image-grid__card,
.etb-image-grid__card *::before,
.etb-image-grid__card,
.etb-image-grid__card *::after {
	scroll-behavior: auto !important;
	transition-duration: 0.01ms !important;
	transition-delay: 0ms !important;
	animation-duration: 0.01ms !important;
	animation-iteration-count: 1 !important;
}
}

/*
 * 独立使用时统一卡片最小高度。
 *
 * 各变体自己的 min-height（17rem ~ 21rem）是为「图片网格」父块准备的 ——
 * 那里整组卡片同款，高度差异不会暴露。但独立放进栅格后，同一行/同一格
 * 可能混用不同变体：高度不一致会让行内卡片顶部参差（第二张卡随第一张卡
 * 的高度逐列偏移，看起来像阶梯）。
 *
 * 这里只在独立使用路径上统一为一个值；父块路径的选择器特异性更高（0,2,0），
 * 仍保留各变体原本的高度，因此图片网格的观感不变。
 * 需要微调时改 --etb-image-grid-card-height 即可。
 */
.etb-image-grid__card:where(.is-style-eth-caption),
.etb-image-grid__card:where(.is-style-eth-centered-overlay),
.etb-image-grid__card:where(.is-style-eth-centered-lift),
.etb-image-grid__card:where(.is-style-eth-bottom-reveal),
.etb-image-grid__card:where(.is-style-eth-numbered-overlay),
.etb-image-grid__card:where(.is-style-eth-meta-overlay) {
	min-height: var(--etb-image-grid-card-height);
}