.block-carousel {
	.block-inner {
		transition: all var(--default-transition-params);
	}
	&__container {
		display: grid;
		grid-template-columns: repeat(12, minmax(0, 1fr));
		gap: var(--grid-column-gutter);
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
		overflow: hidden;
	}
	
	.embla {
		border-radius: 16px;
		width: 80%;
		margin: auto;
		overflow: hidden;

		&-wrapper {
			position: relative;
			grid-column: span 12;
			@include media-min($medium) {
				grid-column: 2 / span 10;
			}
		}
		&__pagination {
			margin-top: 32px;
			&-button {
				width: 16px;
				height: 16px;
				background-color: var(--carousel-nav-color);
				border-color: var(--carousel-nav-border-color);
				&.active {
					background-color: var(--carousel-nav-active-color);
					border-color: var(--carousel-nav-border-active-color);
				}
			}
		}
		&__nav-button {
			width: 3.2rem;
			height: 3.2rem;
			@include media-min($medium) {
				width: 4.8rem;
				height: 4.8rem;
			}
			position: absolute;
			top: 0;
			bottom: 0;
			margin: auto;
			&--prev {
				left: 0;
			}
			&--next {
				right: 0;
			}
		}

		&.is-video {
			--featured-card-gap: 20px;

			@include media-min($medium) {
				--featured-card-gap: 40px;
			}

			border-radius: unset;
			width: 100%;
			@include media-min($medium) {
				overflow: visible;
			}
			.embla__container {
				margin-left: calc(var(--featured-card-gap) * -1);
			}

			.embla__slide {
				padding-left: var(--featured-card-gap);
				flex: 0 0 80%;
				min-width: 0;
				max-width: 1063px;
			}
		}
	}
	&__section {
		padding: 3rem 4rem;
		box-shadow: 0px 1px 12px rgba(0, 0, 0, 0.08);
		height: 100%;
		border-radius: 16px;
		&-top {
			display: flex;
			justify-content: space-between;
			align-items: center;
			gap: var(--grid-column-gutter);
		}
		h3 {
			color: var(--color-white);
		}
		img {
			margin: 0;
		}

		&-content {
			p {
				color: var(--color-white);
			}
			color: var(--color-white);
			margin-top: 3.2rem;
		}
	}

	&__card-case-study {
		height: 100%;
		padding: 16px 20px;
		border: 1px solid #28333e;
		background: #06111a;
		display: flex;
		flex-direction: column;
		gap: 32px;
		max-width: 1063px;
		cursor: pointer;
		@include media-min($large) {
			flex-direction: row;
		}
		.video-container {
			max-width: 670px;
			@include media-min($large) {
				flex: 3;
			}
		}
		.block-columns__video-container {
			margin-bottom: 0;
		}
		.text-container {
			height: 100%;
			padding: 30px 0;
			display: flex;
			flex-direction: column;
			justify-content: space-between;
			@include media-min($medium) {
				flex: 1;
			}
		}
		.title {
			font-weight: 400;
			font-size: 22px;
			line-height: 30px;
			color: #fff;
		}
		.name,
		.position {
			font-weight: 400;
			font-size: 16px;
			line-height: 22px;
		}
		.name {
			color: #fff;
			margin-top: 32px;
		}
		.position {
			color: #a2adb9;
		}
		.button-link {
			align-self: flex-start;
			margin-top: 32px;
		}
		&:hover {
			.play-video-overlay__play-icon {
				transform: scale(1.2);
			}
			.button-link {
				&:after {
					color: var(--button-secondary-hover-arrow-color);
					background-color: var(--button-secondary-hover-bg-color);
					border-radius: 50%;
					transform: rotate(45deg);
				}
			}
		}
	}
}