@layer base {
	.embla {
		--slide-spacing: 1rem;
		--slide-size: 100%;
		--slide-height: 19rem;

		width: 100%;
		padding: 1.6rem 0;
	}

	.embla__viewport {
		overflow: hidden;
	}

	.embla__container {
		backface-visibility: hidden;
		display: flex;
		touch-action: pan-y;
		margin-left: calc(var(--slide-spacing) * -1);
	}

	.embla__slide {
		flex: 0 0 var(--slide-size);
		min-width: 0;
		padding-left: var(--slide-spacing);
		position: relative;
		padding: 0 15px;
	}

	@media screen and (width > 768px) {
		.embla {
			--slide-size: 33.33%;
		}
	}

	@media screen and (width > 1280px) {
		.embla {
			--slide-size: 20%;
		}
	}
}