.post_slider-layout .pk-col:has(.swiper-buttons) {
	display: flex; align-items: center; justify-content: flex-end;
}
.post_slider-layout .swiper-buttons {
	display: flex; align-items: center; gap: .2rem;
}
.post_slider-layout .swiper-buttons .post-button {
	line-height: 0; padding: 1rem; 
	background-color: transparent;
	border: unset;
	cursor: pointer;
}

.post_slider-layout .pk-grid-container.center{
	align-items: unset;
}
.post_slider-layout.flex-layout{
	padding-right: 0;
}


.post_slider-layout .content-col{
	display: flex; flex-direction: column; gap: 1rem;
	position: relative; 
	padding-block: max(2rem, calc(0.5 * var(--su)));
}
.post_slider-layout .content-col .pk-heading{
	position: relative;
}
.post_slider-layout .content-col .subtitle{
	margin-bottom: 4rem;
}
.post_slider-layout .content-col .pk-heading::after{
	content: ''; display: inline-block; 
	position: absolute; z-index: 5;
	right: 0; bottom: 0; transform: translate(15%, 90%);
	mask: url('/wp-content/uploads/2026/05/p-oranje.svg') no-repeat center/contain;
	-webkit-mask: url('/wp-content/uploads/2026/05/p-oranje.svg') no-repeat center/contain;
	 background-color: var(--primary-color);
	height: max(10rem, calc(20 * var(--su))); width: max(10rem, calc(20 * var(--su)));
	pointer-events: none;
}
.post_slider-layout .content-col .pk-button-group{
	margin-top: auto;
}

.post_slider-layout .post-slider {
	border-radius: 6px 0 0 6px; overflow: hidden;
	padding-right: var(--pk-site-gutter);
}

.post_slider-layout .post-slider .swiper-slide:last-child{
	margin-right: var(--pk-site-gutter) !important;
}


.post_slider-layout .swiper-container .post-wrapper{
	overflow: hidden;
}


.post_slider-layout .swiper-navigation{
	display: flex; flex-direction: row; align-items: center;
	gap: 1rem; margin-top: 2rem;
}

.post_slider-layout .swiper-progress {
	position: relative; height: 1px; 
	background-color: rgba(255, 255, 255, 0.4);
	flex-shrink: 0; flex-grow: 1;
}
.post_slider-layout .swiper-progress-bar {
	position: absolute; left: 0; top: 0; z-index: 2;
	height: 1px; background-color: var(--pk-heading-color);
	width: 5%;
}

@media screen and (max-width: 768px) {
	.post_slider-layout .pk-col:has(.swiper-buttons) {
		justify-content: space-between;
	}
}

.post-slider{
	/* display: none; */
	max-height: 900px; overflow: hidden;
}

@media screen and (max-width: 992px) {
	.post_slider-layout.flex-layout {
		padding-inline: var(--pk-site-gutter, 16px);
		overflow: hidden;
	}

	.post_slider-layout .pk-row-content {
		display: grid;
		grid-template-columns: repeat(5, minmax(0, 1fr));
		row-gap: 22px;
		width: 100%;
	}

	.post_slider-layout .content-col,
	.post_slider-layout .pk-col:has(.post-slider),
	.post_slider-layout .swiper-navigation {
		grid-column: 1 / -1 !important;
		margin-left: 0 !important;
		width: 100%;
		min-width: 0;
	}

	.post_slider-layout .content-col {
		padding-block: 0;
		gap: 10px;
	}

	.post_slider-layout .content-col .subtitle {
		margin-bottom: 0;
	}

	.post_slider-layout .content-col .pk-heading {
		font-size: clamp(34px, 10vw, 58px);
		line-height: .9;
		max-width: min(100%, 420px);
	}

	.post_slider-layout .content-col .pk-heading::after {
		right: -10px;
		bottom: -18px;
		height: clamp(120px, 38vw, 180px);
		transform: translate(18%, 42%);
	}

	.post_slider-layout .content-col .pk-button-group {
		margin-top: 0;
	}

	.post_slider-layout .post-slider {
		border-radius: 6px;
		padding-right: 0;
		max-height: none;
		width: 100%;
		overflow: visible;
	}

	.post_slider-layout .post-slider .swiper-container,
	.post_slider-layout .post-slider .swiper-wrapper,
	.post_slider-layout .post-slider .swiper-slide {
		min-width: 0;
	}

	.post_slider-layout .post-slider .swiper-slide:last-child {
		margin-right: 0 !important;
	}

	.post_slider-layout .swiper-container .post-wrapper {
		overflow: hidden;
	}

	.post_slider-layout .swiper-navigation {
		margin-top: 0;
	}
}

@media screen and (max-width: 767px) {
	.post_slider-layout.flex-layout {
		padding-block: 56px;
	}

	.post_slider-layout .pk-row-content {
		row-gap: 18px;
	}

	.post_slider-layout .content-col .pk-heading::after {
		height: clamp(110px, 48vw, 170px);
		right: 0;
		bottom: -10px;
		transform: translate(18%, 46%);
	}
}
