/* .flex-layout.overview {
	padding-block: var(--pk-row-spacing);
} */

.flex-layout.overview .pk-grid-container {
	row-gap: max(1.5rem, calc(3 * var(--su)));
}

.flex-layout.overview .overview-grid {
	display: flex;
	gap: var(--pk-column-gap);
	aspect-ratio: 16 / 9;
}

.flex-layout.overview .overview-item.item-1 {
	flex: 0 0 calc((4 / 12) * 100% - var(--pk-column-gap));
	display: flex;
	align-items: start;
	flex-direction: column;
	justify-content: space-between;
	padding: max(2rem, calc(2.5 * var(--su)));
	background-color: var(--odnhn-lime);
}

.flex-layout.overview .overview-item.item-1 img {
	aspect-ratio: 1;
	height: auto;
	object-fit: contain;
}

.flex-layout.overview .overview-right {
	flex: 1;
	display: grid;
	grid-template-columns: repeat(8, 1fr);
	grid-template-rows: 1fr 1fr;
	gap: var(--pk-column-gap);
}

.flex-layout.overview .overview-item.item-2 { grid-column: span 3; }
.flex-layout.overview .overview-item.item-3 { grid-column: span 5; }
.flex-layout.overview .overview-item.item-4 { grid-column: span 5; }
.flex-layout.overview .overview-item.item-5 { grid-column: span 3; }

.flex-layout.overview .overview-item {
	position: relative;
	overflow: hidden;
	border-radius: var(--general-border-radius);
}

.flex-layout.overview .overview-item.gradient::before {
	content: ''; position: absolute; inset: 0; z-index: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) -7.94%, rgba(0, 0, 0, 0.55) 100%);
}

.flex-layout.overview .overview-item .overview-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
}

.flex-layout.overview .overview-item .content {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	padding: max(2rem, calc(2.5 * var(--su)));
	display: flex;
	flex-direction: column;
	gap: max(.5rem, calc(.5 * var(--su)));
	color: var(--odnhn-white-100);
	z-index: 1;
}

.flex-layout.overview .overview-item .title {
	margin: 0;
	font-size: max(2.5em, calc(4 * var(--su)));
	font-weight: 400;
	line-height: 1.2;
}

.flex-layout.overview .overview-item .text {
	margin: 0;
	font-size: var(--body-text-big);
	font-weight: 400;
	line-height: 1;
}

@media screen and (max-width: 992px) {

	.flex-layout.overview .overview-grid {
		flex-direction: column;
		aspect-ratio: unset;
	}

	.flex-layout.overview .overview-item.item-1 {
		flex: unset;
		aspect-ratio: 4 / 3;
	}

	.flex-layout.overview .overview-right {
		grid-template-columns: 6fr 6fr;
		grid-template-rows: auto;
	}

	.flex-layout.overview .overview-item.item-2,
	.flex-layout.overview .overview-item.item-3,
	.flex-layout.overview .overview-item.item-4,
	.flex-layout.overview .overview-item.item-5 {
		grid-column: span 1;
		aspect-ratio: 4 / 3;
	}
	
}

@media screen and (max-width: 767px) {

	.flex-layout.overview .overview-right {
		grid-template-columns: 1fr;
	}

	.flex-layout.overview .overview-item.item-3,
	.flex-layout.overview .overview-item.item-4 {
		grid-column: span 1;
		aspect-ratio: 1;
	}

	.flex-layout.overview .overview-item.item-2, .flex-layout.overview .overview-item.item-5 {
		display: none;
	}

	.flex-layout.overview .overview-item.item-1 {
		aspect-ratio: unset;
		gap: 2rem;
	}

	.flex-layout.overview .overview-item.item-1 .content {
		position: static;
		background: unset;
		padding: unset;
	}
}