/**
 * Featured cover image — rounding only on outer .bnb-featured-cover-image.
 * Uses clip-path + overflow:hidden so core group overflow:visible cannot square the image corners.
 * Desktop (≥782px): full container width, 874px height, image fills box with object-fit: cover.
 * Smaller viewports: full width, portrait aspect via inner frame.
 * Pattern: featured-cover-image
 */

.wp-site-blocks .bnb-featured-cover-image.is-layout-constrained,
.editor-styles-wrapper .bnb-featured-cover-image.is-layout-constrained {
	--bnb-featured-cover-radius: 2rem;

	padding-top: 0;
	padding-bottom: 0;
	margin-top: 0;
	margin-bottom: 0;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	align-self: stretch;
	min-height: 0;
	height: 100%;
	position: relative;
	border-radius: var(--bnb-featured-cover-radius);
	/* Core often sets overflow:visible on groups; force clip so radius masks the image. */
	overflow: hidden !important;
	isolation: isolate;
	clip-path: inset(0 round var(--bnb-featured-cover-radius));
	-webkit-clip-path: inset(0 round var(--bnb-featured-cover-radius));
}

.wp-site-blocks .wp-block-column .bnb-featured-cover-image,
.editor-styles-wrapper .wp-block-column .bnb-featured-cover-image {
	min-width: 0;
}

/* Inner figure: no radius; stay inside parent stacking/clipping. */
.wp-site-blocks .bnb-featured-cover-image .bnb-featured-cover-image__frame,
.editor-styles-wrapper .bnb-featured-cover-image .bnb-featured-cover-image__frame {
	display: grid;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	min-height: 0;
	flex: 1 1 auto;
	align-self: stretch;
	box-sizing: border-box;
	margin: 0 !important;
	overflow: hidden;
	border-radius: 0;
	aspect-ratio: 3 / 4;
}

.wp-site-blocks .bnb-featured-cover-image .bnb-featured-cover-image__frame > img,
.editor-styles-wrapper .bnb-featured-cover-image .bnb-featured-cover-image__frame > img {
	grid-area: 1 / 1;
	display: block;
	width: 100%;
	height: 100%;
	min-width: 0;
	min-height: 0;
	max-width: none;
	object-fit: cover;
	object-position: center;
	border-radius: 0 !important;
	/* Keep image paint inside the figure cell (avoids square corners over the mask). */
	position: relative;
	z-index: 0;
}

@media (min-width: 782px) {
	.wp-site-blocks .bnb-featured-cover-image.is-layout-constrained,
	.editor-styles-wrapper .bnb-featured-cover-image.is-layout-constrained {
		height: 874px !important;
		min-height: 874px !important;
		flex: 0 0 auto;
	}

	.wp-site-blocks .bnb-featured-cover-image .bnb-featured-cover-image__frame,
	.editor-styles-wrapper .bnb-featured-cover-image .bnb-featured-cover-image__frame {
		width: 100% !important;
		max-width: 100% !important;
		height: 100% !important;
		flex: 1 1 auto;
		min-height: 0;
		aspect-ratio: unset;
	}
}