body.clss-enrol-cta-ribbon .ribbon {
	background-color: var(--clss-enrol-ribbon-bg, #e21270) !important;
}

body.clss-enrol-cta-button #btn-join {
	align-items: center;
	background: var(--clss-enrol-button-bg, #0081a7) !important;
	border: none;
	border-radius: var(--clss-enrol-button-radius, 20px) !important;
	box-shadow: 0 0 0 0 color-mix(in srgb, var(--clss-enrol-button-bg, #0081a7) 70%, transparent);
	color: #ffffff !important;
	cursor: pointer;
	display: flex;
	font-size: var(--clss-enrol-button-font-size, 1.3em);
	font-weight: 800;
	justify-content: center;
	max-width: 100%;
	padding: 1.1em 2em;
	transition: transform 0.2s, box-shadow 0.2s;
	width: 100%;
}

body.clss-enrol-cta-pulse #btn-join {
	animation: clssEnrolPulse var(--clss-enrol-pulse-duration, 1.2s) infinite;
}

@keyframes clssEnrolPulse {
	0% {
		box-shadow: 0 0 0 0 color-mix(in srgb, var(--clss-enrol-button-bg, #0081a7) 70%, transparent);
		transform: scale(1);
	}

	70% {
		box-shadow: 0 0 0 var(--clss-enrol-pulse-spread, 15px) color-mix(in srgb, var(--clss-enrol-button-bg, #0081a7) 12%, transparent);
		transform: scale(var(--clss-enrol-pulse-scale, 1.07));
	}

	100% {
		box-shadow: 0 0 0 0 color-mix(in srgb, var(--clss-enrol-button-bg, #0081a7) 0%, transparent);
		transform: scale(1);
	}
}

@media (prefers-reduced-motion: reduce) {
	body.clss-enrol-cta-pulse #btn-join {
		animation: none;
	}
}