.demo {
	text-align: center;
	background-color: #ffffff;
}

.demo .demo__header {
	margin: 0 auto 46px;
}

.demo .demo__header h2 {
	color: #032169;
}

.demo .demo__header .section__subtitle {
	margin: 24px auto 10px;
	max-width: none;
}

.demo .demo__buttons {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
	flex-wrap: wrap;
	margin-top: 24px;
}

.demo .custom-btn--secondary {
	background-color: transparent;
	color: #032169;
	border: 1px solid #032169;
}

.demo .custom-btn--secondary:hover {
	background-color: #032169;
	color: #ffffff;
}

.demo .demo__media {
	position: relative;
	margin: 0 auto;
	border-radius: 44px;
	max-height: 509px;
	overflow: hidden;
	aspect-ratio: 1294 / 509;
}

.demo .demo__media .video-poster {
	position: relative;
	width: 100%;
	height: 100%;
	cursor: pointer;
	display: block;
}

.demo .demo__media .video-poster img {
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
}

.demo .demo__media .video-poster .play-button {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	cursor: pointer;
	transition: transform 0.3s ease;
	width: 130px;
	height: 130px;
}

.demo .demo__media .video-poster:hover .play-button {
	transform: translate(-50%, -50%) scale(1.08);
}

.demo .demo__media .single-video-iframe {
	width: 100%;
	height: 100%;
	display: none;
}

.demo .demo__media.is-playing .video-poster {
	display: none;
}

.demo .demo__media.is-playing .single-video-iframe {
	display: block;
}

.demo .demo__media .single-video-iframe iframe,
.demo .demo__media .single-video-iframe video {
	width: 100%;
	height: 100%;
	display: block;
	border: 0;
	object-fit: cover;
	background: #000;
}

@media (max-width: 991px) {
	.demo .demo__media .video-poster .play-button {
		width: 80px;
		height: 80px;
	}
	.demo .demo__media {
		aspect-ratio: 16 / 9;
		max-height: none;
	}
}

@media (max-width: 640px) {
	.demo .demo__media .video-poster .play-button {
		width: 50px;
		height: 50px;
	}
	.demo .demo__media {
		border-radius: 22px;
	}
	.demo .demo__header {
		margin: 0 auto 30px;
	}
}