.dthps-masked-image {
	position: relative;
	width: 100%;
	--dthps-overlay-enabled: 0;
	--dthps-overlay-start: rgba(18, 120, 63, 0.95);
	--dthps-overlay-end: rgba(18, 120, 63, 0);
	--dthps-overlay-start-pos: 0%;
	--dthps-overlay-end-pos: 100%;
	--dthps-overlay-opacity: 0.65;
}

.dthps-masked-image__shape {
	position: relative;
	width: 100%;
	overflow: hidden;
	-webkit-mask-image: url('../svg/dthps_mask.svg');
	mask-image: url('../svg/dthps_mask.svg');
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
}

.dthps-masked-image__shape img {
	display: block;
	width: 100%;
	height: auto;
	object-fit: cover;
}

.dthps-masked-image__shape::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, var(--dthps-overlay-start) var(--dthps-overlay-start-pos), var(--dthps-overlay-end) var(--dthps-overlay-end-pos));
	opacity: calc(var(--dthps-overlay-opacity) * var(--dthps-overlay-enabled));
	pointer-events: none;
}
