/**
 * HRD Video Card widget — structure.
 * The modal styles come from video-button.css. Values come from the widget's Elementor controls.
 */

.hrd-video-card {
	position: relative;
	width: 100%;
	overflow: hidden;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

.hrd-video-card__overlay {
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: linear-gradient(var(--hrd-card-overlay-top, transparent), var(--hrd-card-overlay-bottom, transparent));
}

/* Centred play button — scoped to beat the kit's global <button> styles. */
.elementor-widget-hrd-video-card .hrd-video-card .hrd-video-card__play {
	position: absolute;
	inset: 0;
	margin: auto;
	display: grid;
	place-items: center;
	padding: 0;
	border: 0;
	border-radius: 50%;
	box-shadow: none;
	cursor: pointer;
	transition: transform 0.18s var(--hrd-ease-standard);
}

.elementor-widget-hrd-video-card .hrd-video-card .hrd-video-card__play:focus-visible {
	outline: 2px solid var(--e-global-color-hrdwhite);
	outline-offset: 3px;
}

.hrd-video-card__play svg {
	display: block;
}

.hrd-video-card__caption {
	position: absolute;
	pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
	.elementor-widget-hrd-video-card .hrd-video-card .hrd-video-card__play {
		transition: none;
	}
}