.swiper.overflow {
	overflow: visible;
}

.swiper-slide {
	transition:.3s;
}

.swiper-pagination-bullets {
	/* --swiper-pagination-bullet-width: 2.5rem; */
	/* --swiper-pagination-bullet-height: 2.5rem; */
	--swiper-pagination-bullet-size: var(--ui);
	--swiper-pagination-bullet-inactive-color: var(--text-1);
	--swiper-pagination-bullet-inactive-opacity: 1;
	--swiper-pagination-bullet-horizontal-gap: 0;
}


.swiper-pagination {
	position: relative;
	margin-top: 1rem;
}

.swiper-pagination-bullet {
	--inset-y: calc(var(--ui) * .5 - var(--border-1) * .5);
	--inset-x: .5rem;
	--border-color: var(--text-3);
	--bg-color: var(--back-2);
	background: none;
	position: relative;
	transition-duration: .2s;
	border-radius: var(--radius);
}

.swiper-pagination-bullet::before {
	content: "";
	display: block;
	position: absolute;
	top: var(--inset-y);
	bottom: var(--inset-y);
	left: var(--inset-x);
	right: var(--inset-x);
	border: var(--border-1) solid var(--border-color);
	border-radius: 5rem;
	background: var(--bg-color);
	transition: inherit;
}

.swiper-pagination-bullet:hover {
	--border-color: var(--blue);
	background: var(--back-2);
}

.swiper-pagination-bullet-active {
	--inset-y: .9rem;
	--inset-x: var(--inset-y);
}

.swiper.overflow {
	margin-left: 0;
}

/* Big sliders */

.swiper.overflow.panels {
	height: clamp(10rem, -10vh + 120vw, 80vh);
	width: unset;
	max-width: calc(100% - 1rem);
}

@media (min-width: 40rem) {
	.swiper.overflow.panels {
		/* height: unset; */
		width: 100%;
		max-width: clamp(30rem, 40rem + 30vw, calc(100% - 2rem));
	}
}

.swiper.overflow.panels img {
	height: 100%;
	display: block;
	width: 100%;
	overflow: hidden;
	border-radius: var(--radius);
	object-fit: cover;
}

/* Small icon-based sliders */

.swiper.overflow.cards {
	max-width: clamp(16rem, 7rem + 20vw, 20rem);
}

.cards .card {
	border-color: var(--back-3);
	box-shadow: none;
}

.card figure {
	font-size: clamp(4rem, 3rem + 4vw, 7rem);
	text-align: center;
	color: var(--sky);
	margin-block: calc(.75rem + .75em);
}