.scroll-wrap {
	width: 100%;
	text-align: center;
	padding: 60px 0 40px;
	overflow: hidden;
}

.scroll-title {
	font-size: 32px;
	font-weight: 600;
	margin-bottom: 40px;
	color: #757575;
}

.scroll-slider {
	position: relative;
	width: 100%;
	overflow: hidden;
	-webkit-mask-image: linear-gradient(to right, transparent 0, #000 60px, #000 calc(100% - 60px), transparent 100%);
	mask-image: linear-gradient(to right, transparent 0, #000 60px, #000 calc(100% - 60px), transparent 100%);
}

.scroll-track {
	display: flex;
	align-items: center;
	width: max-content;
	animation-name: resScrollLeft;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}

.scroll-track:hover {
	animation-play-state: paused;
}

.scroll-item {
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 15px 30px rgba(0, 0, 0, .15);
	flex-shrink: 0;
	cursor: pointer;
	transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.scroll-item video {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	pointer-events: none;
}

.scroll-item:hover {
	transform: scale(1.08);
	z-index: 10;
	box-shadow: 0 25px 50px rgba(0, 0, 0, .3);
}

@keyframes resScrollLeft {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-50%);
	}
}

.scroll-btn {
	display: inline-block;
	margin-top: 40px;
	padding: 12px 30px;
	background: #f5891f;
	color: #fff;
	font-weight: 600;
	border-radius: 30px;
	text-decoration: none;
	transition: background 0.3s ease;
}

.scroll-btn:hover {
	background: #d9760f;
	color: #fff;
}
