/* ==========================================================================
   Resurse index — editorial premium (Maria Vasii)
   ========================================================================== */

.mv-re-index {
	--mv-re-page: #090c0e;
	--mv-re-card: #12161a;
	--mv-re-card-alt: #161a1f;
	--mv-re-text: #f3efe8;
	--mv-re-text-muted: #c7c7c7;
	--mv-re-lead: #d2d2d2;
	--mv-re-border: rgba(255, 255, 255, 0.08);
	--mv-re-gold-border: rgba(212, 167, 92, 0.18);
	--mv-re-gold-border-hover: rgba(212, 167, 92, 0.55);
	--mv-re-gold: var(--mv-bronze-highlight, #d4b88a);
	--mv-re-shell: 1480px;
	background: var(--mv-re-page);
	padding-block: 0 clamp(5rem, 8vw, 6.25rem);
}

.mv-re-index__shell {
	width: min(100% - clamp(2.25rem, 5vw, 5rem), var(--mv-re-shell));
	max-width: var(--mv-re-shell);
	margin-inline: auto;
}

.mv-re-index .mv-breadcrumbs {
	margin-block-end: clamp(1rem, 2vw, 1.35rem);
}

/* --- Hero --- */

.mv-re-index-hero {
	position: relative;
	display: flex;
	align-items: center;
	min-height: clamp(25rem, 52vw, 30rem);
	margin-block-end: clamp(2.5rem, 4vw, 3rem);
	padding: clamp(3.75rem, 6vw, 4.5rem) clamp(1.5rem, 4vw, 2.5rem);
	overflow: hidden;
	border-radius: 0;
	isolation: isolate;
	background: var(--mv-re-card-alt);
}

.mv-re-index-hero__bg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 70% center;
	z-index: 0;
}

.mv-re-index-hero__scrim {
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(
		90deg,
		rgba(9, 12, 14, 0.97) 0%,
		rgba(9, 12, 14, 0.92) 38%,
		rgba(9, 12, 14, 0.55) 58%,
		rgba(9, 12, 14, 0.15) 78%,
		rgba(9, 12, 14, 0.08) 100%
	);
	pointer-events: none;
}

.mv-re-index-hero__copy {
	position: relative;
	z-index: 2;
	max-width: 650px;
}

.mv-re-index-hero__eyebrow {
	margin: 0 0 1rem;
	font-family: var(--mv-font-body);
	font-size: clamp(0.75rem, 1.2vw, 0.8125rem);
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--mv-re-gold);
}

.mv-re-index-hero__title {
	margin: 0 0 1.25rem;
	font-family: var(--mv-font-display);
	font-size: clamp(2.375rem, 5.5vw, 4rem);
	font-weight: 500;
	line-height: 1.05;
	color: var(--mv-re-text);
	text-wrap: balance;
}

.mv-re-index-hero__title-line {
	display: block;
}

.mv-re-index-hero__lead {
	margin: 0 0 1.35rem;
	max-width: 620px;
	font-family: var(--mv-font-body);
	font-size: clamp(1.125rem, 2vw, 1.375rem);
	line-height: 1.5;
	color: var(--mv-re-lead);
	text-wrap: pretty;
}

.mv-re-index-hero__rule {
	display: block;
	width: 45px;
	height: 2px;
	border-radius: 2px;
	background: linear-gradient(90deg, var(--mv-re-gold), rgba(var(--mv-bronze-rgb), 0.2));
}

/* --- Articles stack --- */

.mv-re-index__articles {
	display: flex;
	flex-direction: column;
	gap: clamp(1.5rem, 2.5vw, 1.75rem);
	margin-block-end: clamp(4rem, 6vw, 5rem);
}

/* --- Shared kicker --- */

.mv-re-index-kicker {
	margin: 0 0 0.85rem;
	font-family: var(--mv-font-body);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--mv-re-gold);
}

/* --- Outline button --- */

.mv-re-index-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.35rem;
	margin-block-start: auto;
	padding: 0.875rem 1.5rem;
	border: 1px solid var(--mv-re-gold);
	border-radius: 10px;
	background: transparent;
	font-family: var(--mv-font-body);
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--mv-re-gold);
	text-decoration: none;
	transition:
		background 250ms ease,
		color 250ms ease,
		border-color 250ms ease,
		transform 250ms ease;
}

a.mv-re-index-btn:hover,
a.mv-re-index-btn:focus-visible {
	background: var(--mv-re-gold);
	color: var(--mv-re-page);
	border-color: var(--mv-re-gold);
}

.mv-re-index-featured__link:hover .mv-re-index-btn,
.mv-re-index-card__link:hover .mv-re-index-btn {
	background: var(--mv-re-gold);
	color: var(--mv-re-page);
	border-color: var(--mv-re-gold);
}

.mv-re-index-btn:focus-visible {
	outline: none;
	box-shadow: var(--mv-focus);
}

.mv-re-index-btn--solid {
	margin-block-start: 1.5rem;
}

/* --- Featured --- */

.mv-re-index-featured {
	border-radius: 22px;
	background: linear-gradient(145deg, #111519 0%, #15191d 100%);
	border: 1px solid var(--mv-re-gold-border);
	overflow: hidden;
	transition:
		transform 280ms ease,
		border-color 280ms ease,
		box-shadow 280ms ease;
}

.mv-re-index-featured:hover {
	transform: translateY(-4px);
	border-color: var(--mv-re-gold-border-hover);
	box-shadow: 0 18px 48px rgba(0, 0, 0, 0.35);
}

.mv-re-index-featured__link {
	display: grid;
	gap: 2rem;
	padding: clamp(1.125rem, 2vw, 1.25rem);
	text-decoration: none;
	color: var(--mv-re-text);
}

@media (min-width: 901px) {
	.mv-re-index-featured__link {
		grid-template-columns: 55fr 45fr;
		align-items: stretch;
	}
}

.mv-re-index-featured__media {
	border-radius: 14px;
	overflow: hidden;
	min-height: clamp(220px, 38vw, 340px);
	background: var(--mv-re-card);
}

.mv-re-index-featured__media .mv-re-index-media {
	height: 100%;
	min-height: inherit;
}

.mv-re-index-featured__media .mv-re-index-media picture {
	display: block;
	height: 100%;
}

.mv-re-index-featured__media .mv-re-index-media__img,
.mv-re-index-featured__media .mv-re-index-media__img--featured {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center center;
	transition: transform 500ms ease;
}

.mv-re-index-featured:hover .mv-re-index-media__img {
	transform: scale(1.015);
}

.mv-re-index-featured__body {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: clamp(1.5rem, 3vw, 2rem);
}

.mv-re-index-featured__title {
	margin: 0 0 1.15rem;
	max-width: 500px;
	font-family: var(--mv-font-display);
	font-size: clamp(2rem, 3.5vw, 3rem);
	font-weight: 500;
	line-height: 1.05;
	text-wrap: balance;
}

.mv-re-index-featured__excerpt {
	margin: 0 0 1.75rem;
	font-family: var(--mv-font-body);
	font-size: 1.125rem;
	line-height: 1.55;
	color: var(--mv-re-text-muted);
	text-wrap: pretty;
}

/* --- Secondary grid --- */

.mv-re-index-secondary {
	display: grid;
	gap: 24px;
}

@media (min-width: 821px) {
	.mv-re-index-secondary {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		align-items: stretch;
	}
}

.mv-re-index-card {
	height: 100%;
	border-radius: 20px;
	background: var(--mv-re-card);
	border: 1px solid var(--mv-re-border);
	overflow: hidden;
	transition:
		transform 280ms ease,
		border-color 280ms ease,
		box-shadow 280ms ease;
}

.mv-re-index-card:hover {
	transform: translateY(-4px);
	border-color: var(--mv-re-gold-border-hover);
	box-shadow: 0 14px 40px rgba(0, 0, 0, 0.28);
}

.mv-re-index-card__link {
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	color: var(--mv-re-text);
}

.mv-re-index-card__link:focus-visible {
	outline: none;
	box-shadow: inset 0 0 0 2px var(--mv-re-gold);
	border-radius: 20px;
}

.mv-re-index-featured__link:focus-visible {
	outline: none;
	box-shadow: inset 0 0 0 2px var(--mv-re-gold);
	border-radius: 22px;
}

.mv-re-index-media--card {
	aspect-ratio: 16 / 9;
	overflow: hidden;
	flex-shrink: 0;
	background: var(--mv-re-card-alt);
}

.mv-re-index-media--card picture,
.mv-re-index-media--card .mv-re-index-media__img,
.mv-re-index-media--card .mv-re-index-media__img--card {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	transition: transform 500ms ease;
}

.mv-re-index-card:hover .mv-re-index-media__img {
	transform: scale(1.015);
}

.mv-re-index-card__body {
	display: flex;
	flex-direction: column;
	flex: 1;
	padding: clamp(1.75rem, 3vw, 2rem);
}

.mv-re-index-card__title {
	margin: 0 0 0.85rem;
	font-family: var(--mv-font-display);
	font-size: clamp(1.75rem, 2.8vw, 2.375rem);
	font-weight: 500;
	line-height: 1.15;
	text-wrap: balance;
}

.mv-re-index-card__excerpt {
	margin: 0 0 1.5rem;
	flex: 1;
	font-family: var(--mv-font-body);
	font-size: clamp(1.0625rem, 1.5vw, 1.125rem);
	line-height: 1.55;
	color: var(--mv-re-text-muted);
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
	overflow: hidden;
	text-wrap: pretty;
}

.mv-re-index-media--placeholder {
	min-height: 12rem;
	background: linear-gradient(135deg, var(--mv-re-card-alt), rgba(var(--mv-bronze-rgb), 0.12));
}

.mv-re-index-empty {
	color: var(--mv-re-text-muted);
}

/* --- Bottom CTA band --- */

.mv-re-index-band {
	position: relative;
	display: flex;
	align-items: center;
	min-height: clamp(16.25rem, 38vw, 20rem);
	padding: clamp(2rem, 5vw, 3rem);
	overflow: hidden;
	border-radius: clamp(0px, 1.5vw, 20px);
	background: var(--mv-re-card);
	border: 1px solid var(--mv-re-border);
	isolation: isolate;
}

.mv-re-index-band__media {
	position: absolute;
	inset: 0;
	z-index: 0;
}

.mv-re-index-band__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: right center;
}

.mv-re-index-band__scrim {
	position: absolute;
	inset: 0;
	background: linear-gradient(
		90deg,
		rgba(9, 12, 14, 0.96) 0%,
		rgba(9, 12, 14, 0.88) 42%,
		rgba(9, 12, 14, 0.45) 70%,
		rgba(9, 12, 14, 0.25) 100%
	);
}

.mv-re-index-band__content {
	position: relative;
	z-index: 1;
	max-width: 36rem;
}

.mv-re-index-band__title {
	margin: 0 0 1rem;
	font-family: var(--mv-font-display);
	font-size: clamp(2rem, 4vw, 2.75rem);
	font-weight: 500;
	line-height: 1.08;
	color: var(--mv-re-text);
}

.mv-re-index-band__text {
	margin: 0;
	font-family: var(--mv-font-body);
	font-size: 1.0625rem;
	line-height: 1.55;
	color: var(--mv-re-text-muted);
	text-wrap: pretty;
}

/* --- Tablet --- */

@media (max-width: 900px) and (min-width: 768px) {
	.mv-re-index__shell {
		width: min(100% - 3rem, var(--mv-re-shell));
	}
}

/* --- Mobile --- */

@media (max-width: 767px) {
	.mv-re-index__shell {
		width: min(100% - 2.5rem, var(--mv-re-shell));
	}

	.mv-re-index-hero {
		min-height: 25rem;
		padding: 2rem 1.5rem;
		align-items: flex-end;
	}

	.mv-re-index-hero__scrim {
		background: linear-gradient(
			180deg,
			rgba(9, 12, 14, 0.55) 0%,
			rgba(9, 12, 14, 0.88) 45%,
			rgba(9, 12, 14, 0.94) 100%
		);
	}

	.mv-re-index-hero__bg {
		object-position: 70% 35%;
	}

	.mv-re-index-featured__link {
		grid-template-columns: 1fr;
	}

	.mv-re-index-featured__media {
		order: 1;
		min-height: auto;
		aspect-ratio: 16 / 10;
	}

	.mv-re-index-featured__body {
		order: 2;
		padding: 1.25rem 0.5rem 0.25rem;
	}

	.mv-re-index-media--card {
		aspect-ratio: 16 / 10;
	}

	.mv-re-index-btn {
		width: 100%;
		min-height: 3rem;
	}

	.mv-re-index-featured .mv-re-index-btn {
		width: auto;
		min-width: 12rem;
	}

	.mv-re-index-band {
		padding: 2rem 1.25rem;
		min-height: 18rem;
	}

	.mv-re-index-band__img {
		object-position: 75% center;
	}
}

@media (prefers-reduced-motion: reduce) {
	.mv-re-index-featured,
	.mv-re-index-card,
	.mv-re-index-btn,
	.mv-re-index-media__img {
		transition: none !important;
	}

	.mv-re-index-featured:hover,
	.mv-re-index-card:hover {
		transform: none;
	}

	.mv-re-index-featured:hover .mv-re-index-media__img,
	.mv-re-index-card:hover .mv-re-index-media__img {
		transform: none;
	}
}