.flex-layout.inspiratie {
	--inspiratie-radius: max(1.25rem, calc(1.25 * var(--su)));
	--inspiratie-thumb-radius: max(0.75rem, calc(0.937 * var(--su)));
	background-color: var(--gijs-groen);
	border-radius: var(--inspiratie-radius);
	padding-block: max(3.125rem, calc(7.5 * var(--su)));
}

.flex-content:has(+ .flex-content .flex-layout.wie_is_gijs-layout):has(~ .flex-content .flex-layout.contact) .flex-layout.inspiratie {
	padding-block-end: max(8rem, calc(10 * var(--su)));
}

.flex-layout.inspiratie .pk-grid-container {
	align-items: stretch;
}

.flex-layout.inspiratie .inspiratie-content {
	display: flex;
	flex-direction: column;
}

.flex-layout.inspiratie .inspiratie-thumb {
	height: max(14rem, calc(20 * var(--su)));
	border-radius: var(--inspiratie-thumb-radius);
	overflow: hidden;
	margin-block-end: max(2rem, calc(2.5 * var(--su)));
}

.flex-layout.inspiratie .inspiratie-thumb .swiper,
.flex-layout.inspiratie .inspiratie-thumb .swiper-wrapper,
.flex-layout.inspiratie .inspiratie-thumb .swiper-slide {
	height: 100%;
}

.flex-layout.inspiratie .inspiratie-thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.flex-layout.inspiratie .inspiratie-tekst {
	color: var(--gijs-geel);
	margin-block-end: max(2rem, calc(2.5 * var(--su)));
}

.flex-layout.inspiratie .inspiratie-tekst h1,
.flex-layout.inspiratie .inspiratie-tekst h2,
.flex-layout.inspiratie .inspiratie-tekst h3 {
	color: var(--gijs-geel);
	margin-bottom: max(0.75rem, calc(1 * var(--su)));
}

.flex-layout.inspiratie .inspiratie-tekst > *:last-child {
	margin-bottom: 0;
}

.flex-layout.inspiratie .inspiratie-controls {
	margin-block-start: auto;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: max(0.75rem, calc(1 * var(--su)));
}

.flex-layout.inspiratie .inspiratie-controls button {
	display: flex;
	flex-shrink: 0;
	padding: 0;
	border: 0;
	background: transparent;
	cursor: pointer;
	outline: none;
}

.flex-layout.inspiratie .inspiratie-controls button.swiper-button-disabled {
	opacity: 0.35;
	cursor: default;
}

.flex-layout.inspiratie .inspiratie-controls button rect {
	transition: fill-opacity 0.3s ease-in-out;
}

.flex-layout.inspiratie .inspiratie-controls button:not(.swiper-button-disabled):hover rect,
.flex-layout.inspiratie .inspiratie-controls button:not(.swiper-button-disabled):focus-visible rect {
	fill-opacity: 0.25;
}

.flex-layout.inspiratie .inspiratie-pagination {
	position: static;
	width: auto;
	text-align: left;
	color: var(--gijs-geel);
	font-size: var(--desktop-body-md);
}

.flex-layout.inspiratie .inspiratie-main {
	position: relative;
	height: max(28rem, calc(40.3125 * var(--su)));
	border-radius: var(--inspiratie-thumb-radius);
	overflow: hidden;
}

.flex-layout.inspiratie .inspiratie-main .swiper,
.flex-layout.inspiratie .inspiratie-main .swiper-wrapper,
.flex-layout.inspiratie .inspiratie-main .swiper-slide {
	height: 100%;
}

.flex-layout.inspiratie .inspiratie-main img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@media screen and (min-width: 993px) {
	.flex-layout.inspiratie .inspiratie-tekst p {
		width: 70%;
	}
}

@media screen and (max-width: 992px) {
	.flex-layout.inspiratie {
		padding-block-start: max(4rem, calc(9 * var(--su)));
		padding-block-end: max(2.5rem, calc(6 * var(--su)));
	}

	.flex-layout.inspiratie .inspiratie-controls {
		justify-content: flex-start;
	}

	.flex-content:has(+ .flex-content .flex-layout.wie_is_gijs-layout):has(~ .flex-content .flex-layout.contact) .flex-layout.inspiratie {
		padding-block-end: max(6rem, calc(8 * var(--su)));
	}
}

@media screen and (max-width: 767px) {
	.flex-layout.inspiratie .pk-grid-container {
		row-gap: max(1.5rem, calc(2 * var(--su)));
	}

	.flex-layout.inspiratie .inspiratie-content {
		display: contents;
	}

	.flex-layout.inspiratie .inspiratie-main,
	.flex-layout.inspiratie .inspiratie-thumb,
	.flex-layout.inspiratie .inspiratie-tekst,
	.flex-layout.inspiratie .inspiratie-controls {
		grid-column: 1 / -1;
	}

	.flex-layout.inspiratie .inspiratie-main {
		order: 1;
		height: max(15rem, calc(15.0625 * var(--su)));
	}

	.flex-layout.inspiratie .inspiratie-thumb {
		order: 2;
		width: 60%;
		height: max(9.9rem, calc(9.9375 * var(--su)));
		margin-block-end: 0;
	}

	.flex-layout.inspiratie .inspiratie-tekst {
		order: 3;
		margin-block-end: 0;
	}

	.flex-layout.inspiratie .inspiratie-controls {
		order: 4;
		margin-block-start: 0;
	}
}
