.bea-endless-carousel {
	--bea-endless-carousel-speed: 18s;
	--bea-endless-carousel-loop-count: 8;
	--bea-endless-carousel-gap: 24px;
	--bea-endless-carousel-max-image-height: 280px;
	--bea-endless-carousel-edge-size: 50px;
	--bea-endless-carousel-item-width-desktop: 260px;
	--bea-endless-carousel-item-width-tablet: 220px;
	--bea-endless-carousel-item-width-mobile: 170px;
	--bea-endless-carousel-item-height-full-desktop: 320px;
	--bea-endless-carousel-item-height-full-tablet: 260px;
	--bea-endless-carousel-item-height-full-mobile: 210px;
	--bea-endless-carousel-item-height-short-desktop: 256px;
	--bea-endless-carousel-item-height-short-tablet: 208px;
	--bea-endless-carousel-item-height-short-mobile: 168px;

	width: 100%;
	overflow: hidden;
	position: relative;
	margin: 1.5rem 0;
	pointer-events: none;
	touch-action: none;
	user-select: none;
}

.bea-endless-carousel.has-gradient-edges::before,
.bea-endless-carousel.has-gradient-edges::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	width: var(--bea-endless-carousel-edge-size);
	z-index: 2;
	pointer-events: none;
}

.bea-endless-carousel.has-gradient-edges::before {
	left: 0;
	background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
}

.bea-endless-carousel.has-gradient-edges::after {
	right: 0;
	background: linear-gradient(to left, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
}

.bea-endless-carousel * {
	pointer-events: none;
}

.bea-endless-carousel__viewport {
	overflow: hidden;
	width: 100%;
}

.bea-endless-carousel__track {
	display: flex;
	align-items: center;
	width: max-content;
	animation: bea-endless-carousel-scroll var(--bea-endless-carousel-speed) linear infinite;
	will-change: transform;
}

.bea-endless-carousel:hover .bea-endless-carousel__track,
.bea-endless-carousel:focus-within .bea-endless-carousel__track {
	animation-play-state: paused;
}

.bea-endless-carousel__group {
	display: flex;
	align-items: center;
	gap: var(--bea-endless-carousel-gap);
	flex: 0 0 auto;
	padding-inline-end: var(--bea-endless-carousel-gap);
}

.bea-endless-carousel__item {
	flex: 0 0 auto;
}

.bea-endless-carousel__item img {
	display: block;
	height: auto;
	max-height: var(--bea-endless-carousel-max-image-height);
	width: auto;
	max-width: none;
	object-fit: cover;
	-webkit-user-drag: none;
}

.bea-endless-carousel.is-staggered .bea-endless-carousel__track,
.bea-endless-carousel.is-staggered .bea-endless-carousel__group {
	align-items: flex-start;
}

.bea-endless-carousel.is-staggered.is-staggered-align-bottom .bea-endless-carousel__track,
.bea-endless-carousel.is-staggered.is-staggered-align-bottom .bea-endless-carousel__group {
	align-items: flex-end;
}

.bea-endless-carousel.is-staggered .bea-endless-carousel__item {
	width: var(--bea-endless-carousel-item-width-desktop);
}

.bea-endless-carousel.is-staggered .bea-endless-carousel__item img {
	width: 100%;
	height: var(--bea-endless-carousel-item-height-full-desktop);
	max-height: none;
	max-width: 100%;
	object-fit: cover;
}

.bea-endless-carousel.is-staggered .bea-endless-carousel__item.is-short img {
	height: var(--bea-endless-carousel-item-height-short-desktop);
}

@keyframes bea-endless-carousel-scroll {
	0% {
		transform: translate3d(0, 0, 0);
	}
	100% {
		transform: translate3d(calc(-100% / var(--bea-endless-carousel-loop-count)), 0, 0);
	}
}

@media (prefers-reduced-motion: reduce) {
	.bea-endless-carousel__track {
		animation: none;
		transform: none;
	}
}

.editor-styles-wrapper .bea-endless-carousel__track {
	animation: none;
	transform: none;
}

@media (max-width: 1024px) {
	.bea-endless-carousel.is-staggered .bea-endless-carousel__item {
		width: var(--bea-endless-carousel-item-width-tablet);
	}

	.bea-endless-carousel.is-staggered .bea-endless-carousel__item img {
		height: var(--bea-endless-carousel-item-height-full-tablet);
	}

	.bea-endless-carousel.is-staggered .bea-endless-carousel__item.is-short img {
		height: var(--bea-endless-carousel-item-height-short-tablet);
	}
}

@media (max-width: 640px) {
	.bea-endless-carousel.is-staggered .bea-endless-carousel__item {
		width: var(--bea-endless-carousel-item-width-mobile);
	}

	.bea-endless-carousel.is-staggered .bea-endless-carousel__item img {
		height: var(--bea-endless-carousel-item-height-full-mobile);
	}

	.bea-endless-carousel.is-staggered .bea-endless-carousel__item.is-short img {
		height: var(--bea-endless-carousel-item-height-short-mobile);
	}
}