/* Bankera Multimedia — 1 lead + 4 side stories. Title hover from bankera-core-news. */
.bankera-mm {
	--bankera-mm-lead-height: 32.5rem;
	--bankera-mm-lead-ratio: 16 / 9;
	--bankera-mm-overlay: var(--bankera-heading, #17274d);
	--bankera-mm-overlay-strength: 0.78;
	--bankera-mm-side-thumb: 12.75rem;
	--bankera-mm-side-ratio: 16 / 9;
	--bankera-news-title-color: var(--bankera-heading, CanvasText);
	--bankera-news-title-hover: var(--bankera-primary, LinkText);
	--bankera-title-line: var(--bankera-gold, currentColor);
	--bankera-mm-tab-icon: var(--bankera-heading, #17274d);
	--bankera-mm-tab-icon-hover: var(--bankera-gold, #b88713);
	--bankera-mm-tab-icon-active: #fff;
	--bankera-mm-media-icon: #17274d;
	--bankera-mm-media-icon-bg: rgb(255 255 255 / 92%);
	--bankera-mm-media-icon-border: rgb(255 255 255 / 92%);
	display: flex;
	flex-direction: column;
	gap: var(--bankera-space-4, 1rem);
	inline-size: 100%;
	max-inline-size: 100%;
	min-inline-size: 0;
	padding: var(--bankera-space-5, 1.5rem) 0;
	overflow-x: clip;
	background: var(--bankera-bg, Canvas);
	color: var(--bankera-text, CanvasText);
	font-family: var(--bankera-font-primary, var(--bankera-font-body, inherit));
}
.bankera-mm__header {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	min-inline-size: 0;
}
.bankera-mm__header--tabs-only {
	justify-content: flex-end;
}
.bankera-mm__heading {
	flex: 1 1 14rem;
	min-inline-size: 0;
	max-inline-size: 100%;
}
.bankera-mm__heading .bankera-section-heading {
	inline-size: 100%;
}
.bankera-mm__tabs {
	display: flex;
	flex-wrap: nowrap;
	flex: 0 1 auto;
	align-items: center;
	justify-content: flex-start;
	gap: 0.7rem;
	max-inline-size: 100%;
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scrollbar-width: none;
	padding-block: 0.125rem;
}
.bankera-mm__tabs::-webkit-scrollbar {
	inline-size: 0;
	block-size: 0;
}
.bankera-mm__tab {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.45rem;
	min-block-size: 2.75rem;
	padding-block: 0.5rem;
	padding-inline: 1rem;
	border: 1px solid var(--bankera-border, currentColor);
	border-radius: 0.55rem;
	background: var(--bankera-surface, Canvas);
	color: var(--bankera-heading, CanvasText);
	font: inherit;
	font-size: var(--bankera-text-sm, 0.875rem);
	font-weight: var(--bankera-weight-bold, 700);
	white-space: nowrap;
	cursor: pointer;
	transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}
.bankera-mm__tab-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	inline-size: 1.25rem;
	block-size: 1.25rem;
	color: var(--bankera-mm-tab-icon, var(--bankera-heading, #17274d));
	opacity: 1;
	transition: color 0.2s ease;
}
.bankera-mm__tab-icon svg,
.bankera-mm__tab-icon i,
.bankera-mm__tab-icon img {
	inline-size: 100%;
	block-size: 100%;
	object-fit: contain;
	color: inherit;
}
.bankera-mm__tab-icon .e-font-icon-svg,
.bankera-mm__tab-icon svg:not([fill="none"]) {
	fill: currentColor;
}
.bankera-mm__tab[aria-selected="true"] {
	background: var(--bankera-heading, #17274d);
	border-color: var(--bankera-heading, #17274d);
	color: var(--bankera-on-primary, #fff);
}
.bankera-mm__tab[aria-selected="true"] .bankera-mm__tab-icon {
	color: var(--bankera-mm-tab-icon-active, #fff);
	opacity: 1;
}
@media (hover: hover) {
	.bankera-mm__tab:hover {
		border-color: var(--bankera-gold, currentColor);
		color: var(--bankera-heading, CanvasText);
	}
	.bankera-mm__tab:not([aria-selected="true"]):hover .bankera-mm__tab-icon {
		color: var(--bankera-mm-tab-icon-hover, var(--bankera-gold, #b88713));
	}
	.bankera-mm__tab[aria-selected="true"]:hover {
		color: var(--bankera-on-primary, #fff);
		border-color: var(--bankera-gold, currentColor);
	}
	.bankera-mm__tab[aria-selected="true"]:hover .bankera-mm__tab-icon {
		color: var(--bankera-mm-tab-icon-active, #fff);
		opacity: 1;
	}
}
.bankera-mm__tab:focus-visible,
.bankera-mm__all:focus-visible,
.bankera-mm .bankera-core-title a:focus-visible,
.bankera-mm .bankera-core-category:focus-visible {
	outline: var(--bankera-focus-width, 3px) solid var(--bankera-focus, Highlight);
	outline-offset: var(--bankera-focus-offset, 3px);
}
.bankera-mm__actions {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	min-inline-size: 0;
	padding-block-start: 0.2rem;
}
.bankera-mm__all {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	color: var(--bankera-heading, CanvasText);
	font-size: var(--bankera-text-sm, 0.875rem);
	font-weight: var(--bankera-weight-bold, 700);
	text-decoration: none;
	white-space: nowrap;
}
.bankera-mm__all:hover {
	color: var(--bankera-gold, currentColor);
}
.bankera-mm__all-icon {
	display: inline-block;
	inline-size: 0.45rem;
	block-size: 0.45rem;
	border-block-end: 2px solid var(--bankera-gold, currentColor);
	border-inline-start: 2px solid var(--bankera-gold, currentColor);
	transform: rotate(45deg);
}
:dir(ltr) .bankera-mm__all-icon {
	transform: rotate(-135deg);
}
.bankera-mm__panel {
	min-inline-size: 0;
	max-inline-size: 100%;
}
.bankera-mm__panel[hidden] {
	display: none;
}
.bankera-mm__layout,
.bankera-mm__stage,
.bankera-mm__side {
	display: grid;
	gap: var(--bankera-space-4, 1rem);
	min-inline-size: 0;
	max-inline-size: 100%;
}
.bankera-mm__item {
	min-inline-size: 0;
	background: transparent;
	border: 0;
	border-radius: var(--bankera-radius-lg, 0.75rem);
	overflow: hidden;
	box-shadow: none;
}
.bankera-mm__media {
	position: relative;
	display: grid;
	min-inline-size: 0;
	overflow: hidden;
	background: var(--bankera-surface-alt, Canvas);
}
.bankera-mm__media img,
.bankera-mm__media-icon,
.bankera-mm__meta {
	grid-area: 1 / 1;
}
.bankera-mm__media img {
	display: block;
	inline-size: 100%;
	max-inline-size: 100%;
	block-size: 100%;
	object-fit: cover;
}
.bankera-mm__media-icon {
	place-self: center;
	z-index: 1;
	display: grid;
	place-items: center;
	inline-size: 2.25rem;
	block-size: 2.25rem;
	border-radius: 50%;
	border: 1px solid var(--bankera-mm-media-icon-border, rgb(255 255 255 / 92%));
	background: var(--bankera-mm-media-icon-bg, rgb(255 255 255 / 92%));
	box-shadow: 0 0 0 1px rgb(0 0 0 / 12%);
	color: var(--bankera-mm-media-icon, #17274d);
	pointer-events: none;
}
.bankera-mm__media-icon svg,
.bankera-mm__media-icon i,
.bankera-mm__media-icon img {
	inline-size: 0.95rem;
	block-size: 0.95rem;
	color: inherit;
}
.bankera-mm__media-icon .e-font-icon-svg,
.bankera-mm__media-icon svg:not([fill="none"]) {
	fill: currentColor;
}
.bankera-mm__meta {
	place-self: start;
	z-index: 1;
	margin: 0.5rem;
	padding: 0.12rem 0.45rem;
	border-radius: 0.3rem;
	background: color-mix(in srgb, var(--bankera-heading, #17274d) 72%, transparent);
	color: #fff;
	font-size: var(--bankera-text-xs, 0.8125rem);
	font-variant-numeric: tabular-nums;
}
.bankera-mm__item--lead {
	--bankera-news-title-color: #fff;
	--bankera-news-title-hover: #fff;
	--bankera-title-line: var(--bankera-gold, currentColor);
	position: relative;
	display: grid;
	grid-template: 1fr / minmax(0, 1fr);
	min-block-size: 16rem;
	aspect-ratio: var(--bankera-mm-lead-ratio, 16 / 9);
	max-block-size: var(--bankera-mm-lead-height, 32.5rem);
	max-inline-size: 100%;
	border-radius: 1rem;
}
.bankera-mm__item--lead > * {
	grid-area: 1 / 1;
}
.bankera-mm__item--lead .bankera-mm__media,
.bankera-mm__item--lead .bankera-mm__media img {
	min-block-size: 16rem;
	block-size: 100%;
	aspect-ratio: auto;
}
.bankera-mm__item--lead .bankera-mm__media::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	background: linear-gradient(
		to top,
		color-mix(in srgb, var(--bankera-mm-overlay, #17274d) calc(var(--bankera-mm-overlay-strength, 0.78) * 100%), transparent) 8%,
		color-mix(in srgb, var(--bankera-mm-overlay, #17274d) 22%, transparent) 46%,
		transparent 78%
	);
}
.bankera-mm__item--lead .bankera-mm__media-icon {
	inline-size: 4.375rem;
	block-size: 4.375rem;
	z-index: 2;
	border-width: 1.5px;
	background: var(--bankera-mm-media-icon-bg, rgb(255 255 255 / 92%));
	color: var(--bankera-mm-media-icon, #17274d);
	border-color: var(--bankera-mm-media-icon-border, rgb(255 255 255 / 95%));
}
.bankera-mm__item--lead .bankera-mm__media-icon svg,
.bankera-mm__item--lead .bankera-mm__media-icon i,
.bankera-mm__item--lead .bankera-mm__media-icon img {
	inline-size: 1.6rem;
	block-size: 1.6rem;
}
.bankera-mm__item--lead .bankera-mm__meta {
	place-self: end start;
	margin: 0.85rem;
}
.bankera-mm__item--lead .bankera-mm__body {
	align-self: end;
	z-index: 2;
	display: flex;
	flex-direction: column;
	gap: var(--bankera-space-2, 0.5rem);
	padding: var(--bankera-space-5, 1.5rem);
	color: #fff;
}
.bankera-mm__item--lead .bankera-core-excerpt,
.bankera-mm__item--lead .bankera-core-title a {
	color: #fff;
}
.bankera-mm__item--lead .bankera-core-category {
	color: var(--bankera-gold, #b88713);
}
.bankera-mm__item--lead .bankera-core-title {
	font-size: var(--bankera-text-2xl, 1.875rem);
	-webkit-line-clamp: var(--bankera-title-lines, 3);
	line-clamp: var(--bankera-title-lines, 3);
}
.bankera-mm__item--lead .bankera-core-excerpt {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	max-inline-size: 42rem;
	color: rgb(255 255 255 / 88%);
}
.bankera-mm__item--side {
	display: grid;
	grid-template-columns: minmax(7.5rem, var(--bankera-mm-side-thumb, 12.75rem)) minmax(0, 1fr);
	align-items: stretch;
	gap: 0.85rem;
	padding-block-end: 0.85rem;
	border-block-end: 1px solid color-mix(in srgb, var(--bankera-border, currentColor) 70%, transparent);
	border-radius: 0;
	background: transparent;
	overflow: visible;
}
.bankera-mm__item--side:last-child {
	border-block-end: 0;
	padding-block-end: 0;
}
.bankera-mm__item--side .bankera-mm__media {
	border-radius: 0.7rem;
	overflow: hidden;
	min-block-size: 6.875rem;
	max-block-size: 7.75rem;
}
.bankera-mm__item--side .bankera-mm__media img {
	aspect-ratio: var(--bankera-mm-side-ratio, 16 / 9);
	min-block-size: 6.875rem;
	max-block-size: 7.75rem;
}
.bankera-mm__item--side .bankera-mm__media-icon {
	inline-size: 2.25rem;
	block-size: 2.25rem;
	color: var(--bankera-mm-media-icon, #17274d);
	background: var(--bankera-mm-media-icon-bg, rgb(255 255 255 / 90%));
	border-color: var(--bankera-mm-media-icon-border, rgb(255 255 255 / 90%));
}
.bankera-mm__item--side .bankera-mm__body {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 0.28rem;
	padding: 0;
	min-inline-size: 0;
}
.bankera-mm__item--side .bankera-core-category {
	color: var(--bankera-gold, #b88713);
}
.bankera-mm__item--side .bankera-core-title {
	font-size: var(--bankera-text-md, 1rem);
	font-weight: var(--bankera-weight-bold, 700);
	-webkit-line-clamp: var(--bankera-title-lines, 2);
	line-clamp: var(--bankera-title-lines, 2);
}
.bankera-mm__item--side .bankera-core-excerpt {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	font-size: var(--bankera-text-xs, 0.8125rem);
	color: var(--bankera-text-muted, CanvasText);
}

@media (min-width: 48rem) {
	.bankera-mm__tabs {
		flex: 0 0 auto;
	}
}
@media (max-width: 47.99rem) {
	.bankera-mm__header,
	.bankera-mm__header--tabs-only {
		flex-direction: column;
		align-items: stretch;
		justify-content: flex-start;
	}
	.bankera-mm__heading {
		flex-basis: auto;
		inline-size: 100%;
	}
	.bankera-mm__tabs {
		flex: 1 1 auto;
		inline-size: 100%;
		max-inline-size: 100%;
	}
	.bankera-mm__actions {
		justify-content: flex-start;
	}
	.bankera-mm__item--lead {
		max-block-size: none;
		aspect-ratio: 16 / 10;
	}
	.bankera-mm__item--lead .bankera-core-title {
		-webkit-line-clamp: var(--bankera-title-lines, 2);
		line-clamp: var(--bankera-title-lines, 2);
		font-size: var(--bankera-text-xl, 1.375rem);
	}
	.bankera-mm__item--lead .bankera-mm__media-icon {
		inline-size: 3.5rem;
		block-size: 3.5rem;
	}
	.bankera-mm__item--side {
		grid-template-columns: minmax(6.5rem, 38%) minmax(0, 1fr);
	}
}
@media (max-width: 24.99rem) {
	.bankera-mm__item--side {
		grid-template-columns: minmax(0, 1fr);
	}
	.bankera-mm__item--side .bankera-mm__media,
	.bankera-mm__item--side .bankera-mm__media img {
		max-block-size: 10rem;
	}
}
@media (min-width: 48rem) and (max-width: 79.99rem) {
	.bankera-mm__side {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		align-items: start;
		gap: var(--bankera-space-4, 1rem);
	}
	.bankera-mm__item--side {
		border-block-end: 0;
		padding-block-end: 0;
	}
}
@media (min-width: 64rem) {
	.bankera-mm__item--lead {
		min-block-size: 20rem;
	}
}
@media (min-width: 80rem) {
	.bankera-mm {
		--bankera-mm-lead-height: 31.25rem;
		--bankera-mm-side-thumb: 12rem;
	}
	.bankera-mm__stage {
		grid-template-columns: minmax(0, 1.78fr) minmax(0, 1fr);
		align-items: stretch;
		gap: var(--bankera-space-5, 1.5rem);
	}
	.bankera-mm__item--lead {
		block-size: var(--bankera-mm-lead-height, 31.25rem);
		max-block-size: var(--bankera-mm-lead-height, 31.25rem);
		aspect-ratio: auto;
	}
	.bankera-mm__side {
		grid-template-columns: minmax(0, 1fr);
		gap: 0;
		align-content: stretch;
	}
	.bankera-mm__item--side {
		padding-block-end: 0.85rem;
		border-block-end: 1px solid color-mix(in srgb, var(--bankera-border, currentColor) 70%, transparent);
	}
	.bankera-mm__item--side:last-child {
		border-block-end: 0;
		padding-block-end: 0;
	}
}
@media (min-width: 90rem) {
	.bankera-mm {
		--bankera-mm-lead-height: 33.75rem;
		--bankera-mm-side-thumb: 13.125rem;
	}
}

[data-bankera-theme="dark"] .bankera-mm {
	--bankera-mm-tab-icon: var(--bankera-heading, #f4f7ff);
	--bankera-mm-tab-icon-hover: var(--bankera-gold, #e9be59);
	--bankera-mm-tab-icon-active: #111c32;
	background: var(--bankera-bg, Canvas);
	color: var(--bankera-text, CanvasText);
}
[data-bankera-theme="dark"] .bankera-mm__all {
	color: var(--bankera-heading, CanvasText);
}
[data-bankera-theme="dark"] .bankera-mm__tab {
	background: var(--bankera-surface, Canvas);
	border-color: var(--bankera-border, currentColor);
	color: var(--bankera-heading, CanvasText);
}
[data-bankera-theme="dark"] .bankera-mm__tab-icon {
	color: var(--bankera-mm-tab-icon, var(--bankera-heading, #f4f7ff));
}
[data-bankera-theme="dark"] .bankera-mm__tab[aria-selected="true"] {
	background: var(--bankera-gold, #e9be59);
	border-color: var(--bankera-gold, #e9be59);
	color: #111c32;
}
[data-bankera-theme="dark"] .bankera-mm__tab[aria-selected="true"] .bankera-mm__tab-icon {
	color: var(--bankera-mm-tab-icon-active, #111c32);
	opacity: 1;
}
@media (hover: hover) {
	[data-bankera-theme="dark"] .bankera-mm__tab:not([aria-selected="true"]):hover .bankera-mm__tab-icon {
		color: var(--bankera-mm-tab-icon-hover, var(--bankera-gold, #e9be59));
	}
	[data-bankera-theme="dark"] .bankera-mm__tab[aria-selected="true"]:hover .bankera-mm__tab-icon {
		color: var(--bankera-mm-tab-icon-active, #111c32);
	}
}
[data-bankera-theme="dark"] .bankera-mm__item--lead .bankera-mm__media::after {
	background: linear-gradient(
		to top,
		color-mix(in srgb, var(--bankera-mm-overlay, #0e1728) calc(var(--bankera-mm-overlay-strength, 0.78) * 100%), transparent) 10%,
		color-mix(in srgb, var(--bankera-heading, #0e1728) 28%, transparent) 48%,
		transparent 80%
	);
}
[data-bankera-theme="dark"] .bankera-mm__item--side {
	border-block-end-color: color-mix(in srgb, var(--bankera-border, currentColor) 80%, transparent);
	background: transparent;
}
[data-bankera-theme="dark"] .bankera-mm__item--side .bankera-core-title {
	--bankera-news-title-color: var(--bankera-heading, CanvasText);
}
[data-bankera-theme="dark"] .bankera-mm__item--side .bankera-core-category {
	color: var(--bankera-gold, #e9be59);
}
[data-bankera-theme="dark"] .bankera-mm__item--side .bankera-core-excerpt {
	color: var(--bankera-text-muted, CanvasText);
}
[data-bankera-theme="dark"] .bankera-mm__media-icon,
[data-bankera-theme="dark"] .bankera-mm__item--lead .bankera-mm__media-icon,
[data-bankera-theme="dark"] .bankera-mm__item--side .bankera-mm__media-icon {
	background: var(--bankera-mm-media-icon-bg, rgb(255 255 255 / 92%));
	border-color: var(--bankera-mm-media-icon-border, rgb(255 255 255 / 92%));
	color: var(--bankera-mm-media-icon, #17274d);
}
[data-bankera-theme="dark"] .bankera-mm__all-icon {
	border-color: var(--bankera-gold, currentColor);
}

@media (prefers-reduced-motion: reduce) {
	.bankera-mm .bankera-core-title__text,
	.bankera-mm__tab,
	.bankera-mm__tab-icon {
		transition: none;
	}
}
