.ipi-project-images {
	position: relative;
	width: 100%;
	clip-path: polygon(34px 0, 100% 0, 100% 100%, 0 100%, 0 25px);
}

.ipi-project-images__img {
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
}

.ipi-project-images__link {
	display: block;
	cursor: zoom-in;
}

.ipi-project-images .swiper {
	overflow: hidden;
}

.ipi-project-images .swiper-pagination {
	display: none;
}

.ipi-project-images button.ipi-project-images__nav {
	position: absolute;
	bottom: 33px;
	z-index: 2;
	display: block;
	width: 68px;
	height: 47px;
	min-width: 0;
	min-height: 0;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	background-color: transparent;
	background-image: none;
	box-shadow: none;
	color: inherit;
	font-size: 0;
	line-height: 0;
	appearance: none;
	-webkit-appearance: none;
	cursor: pointer;
}

.ipi-project-images__nav--prev {
	right: 100px;
}

.ipi-project-images__nav--next {
	right: 33px;
}

.ipi-project-images__nav svg {
	display: block;
	width: 100%;
	height: 100%;
	pointer-events: none;
}

.ipi-project-images__nav svg .b,
.ipi-project-images__nav svg .c {
	transition: fill 0.2s linear;
}

.ipi-project-images button.ipi-project-images__nav svg .b {
	fill: none;
}

.ipi-project-images button.ipi-project-images__nav svg .c {
	fill: #96c93e;
}

.ipi-project-images button.ipi-project-images__nav:hover svg .b,
.ipi-project-images button.ipi-project-images__nav:focus-visible svg .b {
	fill: #96c93e;
}

.ipi-project-images button.ipi-project-images__nav:hover svg .c,
.ipi-project-images button.ipi-project-images__nav:focus-visible svg .c {
	fill: #fff;
}

.ipi-project-images button.ipi-project-images__nav:focus {
	outline: none;
}

.ipi-project-images button.ipi-project-images__nav:focus-visible {
	outline: 2px solid #96c93e;
	outline-offset: 4px;
}

html.ipi-lightbox-open,
html.ipi-lightbox-open body {
	overflow: hidden;
	overscroll-behavior: none;
}

html.ipi-lightbox-open body {
	position: fixed;
	width: 100%;
	left: 0;
	right: 0;
}

/* Cover the WP admin bar and pin to the visible viewport. */
.dialog-widget.dialog-lightbox-widget.elementor-lightbox {
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: auto;
	height: auto;
	max-height: none;
	box-sizing: border-box;
	padding-bottom: env(safe-area-inset-bottom, 0px);
	z-index: 100001;
}

/* Lightbox arrow layout. e-lightbox.css loads on first open (after this file)
   and sets the same 3-class left/right:0 rules — extra classes keep ours on top. */
.dialog-widget.dialog-lightbox-widget.elementor-lightbox .swiper .elementor-swiper-button-prev,
.dialog-widget.dialog-lightbox-widget.elementor-lightbox .swiper .elementor-swiper-button-next {
	position: absolute;
	top: 50%;
	z-index: 20;
	width: auto;
	height: auto;
	padding: 8px;
	transform: translateY(-50%);
}

.dialog-widget.dialog-lightbox-widget.elementor-lightbox .swiper .elementor-swiper-button-prev {
	left: 24px;
	right: auto;
}

.dialog-widget.dialog-lightbox-widget.elementor-lightbox .swiper .elementor-swiper-button-next {
	right: 24px;
	left: auto;
}

@media (max-width: 767px) {
	.dialog-widget.dialog-lightbox-widget.elementor-lightbox .dialog-widget-content,
	.dialog-widget.dialog-lightbox-widget.elementor-lightbox .dialog-lightbox-message,
	.dialog-widget.dialog-lightbox-widget.elementor-lightbox .swiper {
		height: 100%;
		max-height: 100%;
		box-sizing: border-box;
	}

	.dialog-widget.dialog-lightbox-widget.elementor-lightbox .swiper-slide.elementor-lightbox-item {
		padding: 72px 16px 72px;
	}

	.dialog-widget.dialog-lightbox-widget.elementor-lightbox .swiper .elementor-swiper-button-prev,
	.dialog-widget.dialog-lightbox-widget.elementor-lightbox .swiper .elementor-swiper-button-next {
		top: auto;
		bottom: 16px;
		width: auto;
		height: auto;
		max-height: 48px;
		transform: none;
		justify-content: center;
	}

	.dialog-widget.dialog-lightbox-widget.elementor-lightbox .swiper .elementor-swiper-button-prev {
		left: calc(50% - 12px);
		right: auto;
		transform: translateX(-100%);
	}

	.dialog-widget.dialog-lightbox-widget.elementor-lightbox .swiper .elementor-swiper-button-next {
		left: calc(50% + 12px);
		right: auto;
	}
}

.dialog-lightbox-widget.elementor-lightbox .elementor-swiper-button svg {
	width: 1em;
	height: 1em;
	flex-shrink: 0;
	pointer-events: none;
}

.elementor-lightbox .elementor-swiper-button,
.elementor-lightbox .elementor-swiper-button svg,
.elementor-lightbox .dialog-lightbox-close-button,
.elementor-lightbox .dialog-lightbox-close-button svg,
.elementor-lightbox .elementor-slideshow__header > i,
.elementor-lightbox .elementor-slideshow__header > svg {
	cursor: pointer;
}
