/* =========================================================================
   Portfolio Slider — slider layout only (card look lives in the theme's
   .single-news / .sws-article-img-wrapper rules). Runs on the shared engine
   (js/sws-slider.js). 3 per view (desktop) → 2 (≤991) → 1 (≤767), matching the
   old Swiper breakpoints. Arrow look reproduces the previous .next-news 1:1.
   ========================================================================= */
.portfolio-slider .latest-news-wraper { position: relative; }

.portfolio-slider .swss__viewport {
	overflow-x: auto;
	overflow-y: hidden;
	scroll-snap-type: x proximity;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none; /* Firefox */
}
.portfolio-slider .swss__viewport::-webkit-scrollbar { display: none; } /* WebKit */

.portfolio-slider .swss__track {
	display: flex;
	flex-wrap: nowrap;
	gap: 30px; /* was Swiper spaceBetween: 30 */
}

/* 3 per view (desktop) */
.portfolio-slider .swss__slide {
	flex: 0 0 calc((100% - 60px) / 3);
	scroll-snap-align: start;
}

/* 2 per view (≤ 991px) */
@media (max-width: 991px) {
	.portfolio-slider .swss__slide { flex: 0 0 calc((100% - 30px) / 2); }
}

/* 1 per view (≤ 767px) */
@media (max-width: 767px) {
	.portfolio-slider .swss__slide { flex: 0 0 100%; }
}

/* Arrows — reproduce the old .next-news / .prev-news look */
.portfolio-slider .swss__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 27px;
	height: 44px;
	z-index: 10;
	padding: 0;
	border: 0;
	background: none;
	color: #605cb8;
	cursor: pointer;
	outline: 0 !important;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: color .2s ease;
}
.portfolio-slider .swss__arrow--next { right: -46px; }
.portfolio-slider .swss__arrow--prev { left: -46px; }
.portfolio-slider .swss__arrow img { display: block; width: 100%; height: auto; }

/* Narrower viewports have a small side gutter — keep arrows at the card edge (as
   before) so they don't get clipped (body is overflow-x: hidden). */
@media (max-width: 1299px) {
	.portfolio-slider .swss__arrow--next { right: -24px; }
	.portfolio-slider .swss__arrow--prev { left: -24px; }
}

@media (max-width: 500px) {
	.portfolio-slider .swss__arrow { display: none; }
}
