.bnmcs {
	position: relative;
	min-width: 0;
}

.bnmcs__viewport {
	overflow-x: auto;
	overflow-y: hidden;
	scroll-snap-type: x proximity;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior-x: contain;
	margin-block: -16px -44px;
	padding-block: 16px 44px;
	margin-inline-start: calc(var(--bnmcs-pad, 20px) * -1);
	padding-inline-start: var(--bnmcs-pad, 20px);
	scroll-padding-inline-start: var(--bnmcs-pad, 20px);
	margin-inline-end: calc(var(--bnmcs-bleed, 20px) * -1);
	padding-inline-end: var(--bnmcs-bleed, 20px);
	scroll-padding-inline-end: var(--bnmcs-bleed, 20px);
}

.bnmcs__viewport::-webkit-scrollbar {
	display: none;
}

.bnmcs .bnmcs__track {
	display: flex;
	gap: var(--bnmcs-gap, 40px);
	width: max-content;
	margin: 0;
	padding: 0;
	list-style: none;
}

.bnmcs--stagger-yes .bnmcs__track {
	padding-block-end: var(--bnmcs-stagger, 40px);
}

.bnmcs__item {
	flex: 0 0 var(--bnmcs-card-w, 220px);
	width: var(--bnmcs-card-w, 220px);
	min-width: 0;
	scroll-snap-align: start;
}

.bnmcs--stagger-yes .bnmcs__item:nth-child(3n+2) {
	transform: translateY(var(--bnmcs-stagger, 40px));
}

.bnmcs--stagger-yes .bnmcs__item:nth-child(3n) {
	transform: translateY(calc(var(--bnmcs-stagger, 40px) * 0.25));
}

.bnmcs .bnmcs__card {
	display: flex;
	flex-direction: column;
	gap: var(--bnmcs-caption-gap, 14px);
	color: inherit;
	text-decoration: none;
}

.bnmcs__media {
	display: block;
	height: var(--bnmcs-card-h, 300px);
	overflow: hidden;
	border: var(--bnmcs-border-w, 3px) solid var(--bnmcs-border-c, #ffffff);
	border-radius: var(--bnmcs-radius, 24px);
	background-color: var(--color-surface, #ffffff);
	box-shadow: 0 12px 40px -10px rgba(13, 13, 38, 0.14);
	transition: box-shadow var(--motion-base, 250ms);
}

.bnmcs a.bnmcs__card:hover .bnmcs__media {
	box-shadow: 0 18px 48px -10px rgba(13, 13, 38, 0.22);
}

.bnmcs .bnmcs__img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	object-position: var(--bnmcs-img-pos, top center);
	border-radius: 0;
}

.bnmcs__caption {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
	min-width: 0;
}

.bnmcs--caption-row .bnmcs__caption {
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}

.bnmcs .bnmcs__title {
	margin: 0;
	max-width: 100%;
	overflow-wrap: anywhere;
	font-family: var(--font-heading, inherit);
	font-weight: 700;
	font-size: var(--text-card-title, 1.25rem);
	line-height: 0.92;
	color: var(--color-foreground, #22222a);
}

.bnmcs__tag {
	display: inline-block;
	max-width: 100%;
	overflow: hidden;
	padding: 8px 16px;
	border-radius: var(--radius-full, 999px);
	background-color: var(--color-accent, #fff0f1);
	color: var(--color-foreground, #22222a);
	font-family: var(--font-label, inherit);
	font-weight: 500;
	font-size: var(--text-label-sm, 0.8125rem);
	line-height: 1.3;
	letter-spacing: 0.02em;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.bnmcs__nav {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end;
	gap: 16px;
	margin-block-start: var(--bnmcs-nav-gap, 56px);
}

.bnmcs__arrows {
	display: flex;
	gap: var(--bnmcs-arrow-gap, 10px);
}

.bnmcs__dots {
	display: none;
	align-items: center;
	gap: 6px;
}

.bnmcs__arrows[hidden],
.bnmcs__dots[hidden] {
	display: none !important;
}

.bnmcs:not(.is-enhanced) .bnmcs__arrows,
.bnmcs:not(.is-enhanced) .bnmcs__dots {
	visibility: hidden;
}

.bnmcs .bnmcs__arrow,
.bnmcs .bnmcs__arrow:hover,
.bnmcs .bnmcs__arrow:focus {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: var(--bnmcs-arrow, 48px);
	height: var(--bnmcs-arrow, 48px);
	padding: 0;
	border: 0;
	border-radius: 50%;
	cursor: pointer;
	transition: background-color var(--motion-fast, 150ms), color var(--motion-fast, 150ms), opacity var(--motion-fast, 150ms);
}

.bnmcs .bnmcs__arrow svg {
	width: 20px;
	height: 20px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2.25;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.bnmcs .bnmcs__arrow--prev svg {
	transform: scaleX(-1);
}

.bnmcs[dir="rtl"] .bnmcs__arrow--next svg {
	transform: scaleX(-1);
}

.bnmcs[dir="rtl"] .bnmcs__arrow--prev svg {
	transform: none;
}

.bnmcs .bnmcs__arrow.bnmcs__arrow--next,
.bnmcs .bnmcs__arrow.bnmcs__arrow--next:focus {
	background-color: var(--bnmcs-next-bg, var(--color-foreground, #22222a));
	color: var(--bnmcs-next-color, #ffffff);
}

.bnmcs .bnmcs__arrow.bnmcs__arrow--next:hover {
	background-color: var(--bnmcs-next-bg-hover, var(--color-primary, #da2576));
	color: var(--bnmcs-next-color, #ffffff);
}

.bnmcs .bnmcs__arrow.bnmcs__arrow--prev,
.bnmcs .bnmcs__arrow.bnmcs__arrow--prev:focus {
	border: 1px solid var(--glass-stroke, rgba(255, 255, 255, 0.55));
	background-color: var(--bnmcs-prev-bg, var(--glass-fill-scrolled, rgba(255, 255, 255, 0.65)));
	color: var(--bnmcs-prev-color, var(--color-foreground, #22222a));
	box-shadow: 0 6px 18px -4px rgba(13, 20, 46, 0.14);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}

.bnmcs .bnmcs__arrow.bnmcs__arrow--prev:hover {
	border: 1px solid var(--glass-stroke, rgba(255, 255, 255, 0.55));
	background-color: var(--bnmcs-prev-bg-hover, var(--color-surface, #ffffff));
	color: var(--bnmcs-prev-color, var(--color-foreground, #22222a));
}

.bnmcs .bnmcs__arrow[aria-disabled="true"],
.bnmcs .bnmcs__arrow[aria-disabled="true"]:hover {
	opacity: 0.4;
	cursor: default;
}

.bnmcs .bnmcs__arrow.bnmcs__arrow--next[aria-disabled="true"]:hover {
	background-color: var(--bnmcs-next-bg, var(--color-foreground, #22222a));
}

.bnmcs__dot {
	display: block;
	width: var(--bnmcs-dot, 6px);
	height: var(--bnmcs-dot, 6px);
	border-radius: var(--radius-full, 999px);
	background-color: var(--bnmcs-dot-color, var(--color-border, #e3e3e8));
	transition: width var(--motion-base, 250ms), background-color var(--motion-base, 250ms);
}

.bnmcs__dot.is-active {
	width: calc(var(--bnmcs-dot, 6px) * 3.67);
	background-color: var(--bnmcs-dot-active, var(--color-foreground, #22222a));
}

.bnmcs .bnmcs__more,
.bnmcs .bnmcs__more:focus {
	display: inline-flex;
	align-items: center;
	padding: 8px 16px;
	border: 1px solid var(--color-border, #e3e3e8);
	border-radius: var(--radius-full, 999px);
	background-color: var(--color-surface, #ffffff);
	color: var(--color-foreground, #22222a);
	font-family: var(--font-body, inherit);
	font-weight: 700;
	font-size: var(--text-button-sm, 0.9375rem);
	line-height: 1.2;
	text-decoration: none;
	white-space: nowrap;
	transition: border-color var(--motion-fast, 150ms);
}

.bnmcs .bnmcs__more:hover {
	border-color: var(--color-foreground, #22222a);
	color: var(--color-foreground, #22222a);
}

.bnmcs__placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	padding: 12px;
	background-color: var(--color-muted, #e3e3e8);
	color: var(--color-muted-foreground, #55555e);
	font-size: 13px;
	text-align: center;
}