.slider-wrapper {
	position: relative;
	max-width: 48rem;
	margin: 0 auto;
}
.slider {
	display: flex;
	aspect-ratio: 16/9;
	overflow-x: auto;
	scroll-behavior: smooth;
	border-radius: 0.5rem;
    margin-bottom: 4rem;
}
.slider::-webkit-scrollbar {
	display: none;
}
.slider img {
	flex: 1 0 100%;
	scroll-snap-align: start;
	object-fit: cover;
}
.slider-nav {
	display: flex;
    align-items: center;
	column-gap: 1rem;
	position: absolute;
	bottom: 1.25rem;
	left: 50%;
	transform: translateX(-50%);
	z-index: 1;
}
.slider-nav a {
	width: 0.5rem;
	height: 0.5rem;
	border-radius: 50%;
	background-color: #fff;
	opacity: 0.75;
	transition: opacity ease 250ms;
}
.slider-nav a.active {
    width: 0.7rem;
    height: 0.7rem;
    opacity: 1;
    background-color: #fff;
    transition: all 0.3s ease;
}
.slider-btn {
    position: absolute;
    align-items: center;
    top: 50%;
    transform: translateY(-50%);
    background:var(--neutral-1);
    color: var(--text-color);
    border: none;
    font-size: 1rem;
    padding: 1rem 1rem;
    cursor: pointer;
    border-radius: 50%;
    z-index: 10;
    transition: background 0.3s;
}
.slider-btn:hover {
    background: gray;
}
.slider-btn.prev {
    left: 1rem;
}
.slider-btn.next {
    right: 1rem;
}