/**
 * NewsMaker — unified thumbnail utilities for news cards and blocks.
 *
 * Usage:
 *   <span class="eb-thumb eb-thumb--16-9">…img or .eb-thumb-fallback…</span>
 *   <span class="eb-thumb eb-thumb--4-3">…</span>
 */

.eb-thumb {
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: inherit;
	background: var(--eb-card-bg, var(--eb-secondary, #0e2944));
	isolation: isolate;
}

.eb-thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center center;
}

.eb-thumb--16-9 {
	aspect-ratio: 16 / 9;
}

.eb-thumb--4-3 {
	aspect-ratio: 4 / 3;
}

/* Natural aspect — editorial featured / in-article (no forced crop). */
.eb-thumb--natural {
	aspect-ratio: auto;
	block-size: auto;
	height: auto;
	display: flex;
	justify-content: center;
	align-items: center;
}

.eb-thumb--natural img {
	inline-size: auto;
	max-inline-size: 100%;
	block-size: auto;
	width: auto;
	max-width: 100%;
	height: auto;
	object-fit: contain;
	object-position: center center;
}

.eb-thumb-fallback {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 100%;
	background:
		radial-gradient(circle at 32% 22%, color-mix(in srgb, var(--eb-accent, #f6b938) 14%, transparent), transparent 58%),
		linear-gradient(
			145deg,
			color-mix(in srgb, var(--eb-card-bg, var(--eb-secondary)) 88%, var(--eb-primary, #071a2f)) 0%,
			var(--eb-section-bg, var(--eb-body-bg, #0b2038)) 100%
		);
}

/* Subtle hover zoom — opt-in via parent card/link */
.eb-thumb--hover-zoom img {
	transform: scale(1);
	transition: transform 0.38s cubic-bezier(0.22, 1, 0.36, 1);
}

:is(a, article, .eb-ng01__card, .eb-archive-card, .eb-single-related-card, .eb-inline-related-card):hover .eb-thumb--hover-zoom img,
:is(a, article, .eb-ng01__card, .eb-archive-card, .eb-single-related-card, .eb-inline-related-card):focus-visible .eb-thumb--hover-zoom img {
	transform: scale(1.04);
}

/* Hero shortcode slide media */
.eb-hero-slide__media .eb-thumb {
	border-radius: 18px;
}

@media (max-width: 959px) {
	.eb-hero-slide__media .eb-thumb {
		border-radius: 14px;
	}
}

/* Sidebar list thumbs — fixed width, fluid height from 4:3 */
.eb-thumb--sidebar {
	inline-size: clamp(72px, 18vw, 88px);
	flex: none;
	border-radius: 8px;
}

/* Post navigation compact thumb (dimensions set on .eb-post-nav__thumb-wrap) */
.eb-thumb--nav {
	inline-size: 100%;
	block-size: 100%;
	flex: none;
	border-radius: inherit;
}