/* Specific style pertaining to this block only, to be used whenever your block is displayed both front-end and back-end */

.three-card-cta {
	/* background-color: var(--color-200); */
	padding: 4rem 0;
}
.three-card-cta.access-plus-offset-overlay {
	background-color: #18355e;
	color: white;
	background: linear-gradient(45deg, hsl(215deg 59% 21%), hsl(215deg 44% 31%));
	background-size: cover;
	background-repeat: no-repeat;
	background-position-x: right;
	position: relative;
	overflow: hidden;
}
.access-plus-backdrop {
	position: absolute;
	z-index: 0;
	--overlap: 5rem;
	padding-top: var(--overlap);
	top: 20rem;
	left: calc(-1 * var(--overlap));
	right:  calc(-1 * var(--overlap));
	bottom: 0;
	opacity: 0.5;
	animation: 30s ease-in-out shift-vertical infinite alternate;
	transition: all 2s linear;
}

@keyframes shift-vertical {
	0% {
		transform: translateX(0rem) translateY(0rem) scale(1.0);
	}
	100% {
		transform: translateX(-10rem) translateY(-1rem) scale(1.04);
	}
}
.access-plus-backdrop svg {
	width: 100% !important;
	min-width: 1500px !important;
	margin: -2rem 0;
}

.three-card-cta-container {
	max-width: var(--responsive--alignwide-width);
	margin: 0 auto;
	position: relative;
	z-index: 1;
}
.three-card-cta .three-card-cta-container > * + * {
	margin-top: 4rem;
}

.three-card-cta .three-card-cta-heading,
.three-card-cta .three-card-cta-cards {
	width: 100%;
}

/* heading */
.three-card-cta .three-card-cta-heading {
	margin: 0 auto;
	display: flex;
	flex-direction: row;
}
.three-card-cta-heading a {
	color: inherit
}

.three-card-cta .three-card-cta-heading > * + * {
	margin-left: auto;
}
.three-card-cta .three-card-cta-heading-content:not(.single-container) {
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin-right: 1rem;
}
.three-card-cta .three-card-cta-heading-content:not(.single-container):last-of-type {
	margin-right: 0;
}

.three-card-cta.access-plus-offset-overlay .three-card-cta-heading {
	flex-direction: column;
	text-align: center;
	max-width: 80rem;
	padding: 0 4rem;
}
.three-card-cta.access-plus-offset-overlay .three-card-cta-heading-content {
	/* margin-right: unset; */
	margin-bottom: 2rem;
	max-width: 50rem;
	margin-left: auto;
	margin-right: auto;
}
.three-card-cta .three-card-cta-heading-content > * + *,
.three-card-cta.access-plus-offset-overlay .three-card-cta-heading-content > * + * {
	margin-top: 1rem;
}

.three-card-cta.access-plus-offset-overlay .three-card-cta-heading > * + *,
.three-card-cta.access-plus-offset-overlay .three-card-cta-heading-content:last-of-type{
	margin-left: auto;
	margin-right: auto;
	margin-top: 1rem;
}



/* cards */
.three-card-cta .three-card-cta-cards {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
}

.three-card-cta .three-card-cta-card {
	width: 30%;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}


.three-card-cta.access-plus-offset-overlay .three-card-cta-cards {
	flex-direction: column;
	align-items: flex-end;
	padding: 0 4rem;
	max-width: 80rem;
	margin: 4rem auto;
	--img-height: 330px;
}
.three-card-cta.access-plus-offset-overlay .three-card-cta-card {
	background-color: white;
	color: var(--global--color-primary-dark);
	padding: 5rem;
	width: calc(50% + 4rem);
	position: relative;
	box-shadow: var(--box-shadow-light);
	min-height: calc(var(--img-height) + 2rem);
}
.three-card-cta.access-plus-offset-overlay .three-card-cta-card + .three-card-cta-card {
	margin-top: 4rem;
}
.three-card-cta.access-plus-offset-overlay .three-card-cta-card .card-heading-overlay {
	position: absolute;
	right: calc(100% - 2.5rem);
	top: -1.5rem;
	width: calc(100% - 5rem);
	height: var(--img-height);
	box-shadow: var(--box-shadow-light);
}
.three-card-cta.access-plus-offset-overlay .card-heading-overlay .three-card-cta-heading {
	font-size: 4rem;
}


.three-card-cta .three-card-cta-card > * + * {
	margin-top: 1rem;
}
.three-card-cta.access-plus-offset-overlay .card-heading-overlay + * {
	margin-top: 0;
}
.three-card-cta.access-plus-offset-overlay .three-card-cta-card > .button {
	margin-top: 1.5rem;
}

.card-heading-overlay {
	width: 100%;
	height: 250px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	background-size: cover;
}
.card-heading-overlay > .three-card-cta-heading {
	color: white;
	/* font-size: 3.25rem; */
	/* font-size: 4vw; */
	font-size: clamp(3vw, 4vw, 3.25rem);
	width: auto;
	text-align: center;
	text-shadow: 0 0 0.25em hsla(0, 0%, 0%, 0.25),
	0 0 1.5em hsla(0, 0%, 0%, 0.50),
	0 0 3em hsla(0, 0%, 0%, 0.50);
}
@media only screen and (min-width: 95em){
    .card-heading-overlay > .three-card-cta-heading {
        font-size: 3.25rem;
    }
}
.overlay .has-text-align-center.single-container {
	max-width: 50rem;
	margin: auto;
}

@media only screen and (max-width: 64em) {  /* 1024px - menu breakpoint */
	.three-card-cta:not(.access-plus-offset-overlay) .three-card-cta-cards {
		flex-direction: column;
	}
	.three-card-cta:not(.access-plus-offset-overlay) .three-card-cta-card {
		width: 100%;
		max-width: 22rem;
    margin: 2rem auto;
	}
	.three-card-cta:not(.access-plus-offset-overlay) .card-heading-overlay > .three-card-cta-heading {
		font-size: 3.25rem
	}

	.three-card-cta.access-plus-offset-overlay .card-heading-overlay .three-card-cta-heading {
		font-size: 7vw;
	}
	.three-card-cta.access-plus-offset-overlay .three-card-cta-heading,
	.three-card-cta.access-plus-offset-overlay .three-card-cta-cards {
		padding: 0 2rem;
	}
	.three-card-cta.access-plus-offset-overlay .three-card-cta-card + .three-card-cta-card {
		margin-top: 4rem;
	}
	.three-card-cta.access-plus-offset-overlay .three-card-cta-card .card-heading-overlay {
		height: 30vw;
	}

}

@media only screen and (max-width: 50em) {  /* 800px */
	.three-card-cta.access-plus-offset-overlay .three-card-cta-cards {
		padding: 0;
	}
	.three-card-cta.access-plus-offset-overlay .three-card-cta-card {
		padding: 2.5rem 3rem;
	}
	.three-card-cta.access-plus-offset-overlay .three-card-cta-card .card-heading-overlay {
		right: calc(100% - 1rem);
		width: calc(100% - 7rem);
	}
}

@media only screen and (max-width: 40em) {  /* 640px */
	.three-card-cta.access-plus-offset-overlay .three-card-cta-card .card-heading-overlay {
		right: calc(100% - 1rem);
		width: calc(100% - 7rem);
	}
	.three-card-cta.access-plus-offset-overlay .three-card-cta-card {
		width: calc(50% + 4rem);
	}
}

@media only screen and (max-width: 35em) {  /* 560px */
	.three-card-cta.access-plus-offset-overlay .three-card-cta-card {
		width: 100%;
		--img-height: 250px;
		padding: var(--img-height) 1.5rem 1.5rem;
	}
	.three-card-cta.access-plus-offset-overlay .three-card-cta-card .card-heading-overlay {
    width: 100%;
    height: var(--img-height);
		right: 0;
    left: 0;
    top: 0;
	}
	.three-card-cta.access-plus-offset-overlay .card-heading-overlay + * {
		margin-top: 1rem;
	}
	.three-card-cta.access-plus-offset-overlay .card-heading-overlay .three-card-cta-heading {
		font-size: 14vw;
	}

	.three-card-cta:not(.access-plus-offset-overlay) .has-text-align-center.single-container p {
		text-align: left;
		margin-top: 1rem;
	}
	.three-card-cta:not(.access-plus-offset-overlay) .three-card-cta-card {
		max-width: 100%;
	}
	.three-card-cta:not(.access-plus-offset-overlay) .three-card-cta-container > * + * {
		margin-top: 1rem;
	}
	.three-card-cta:not(.access-plus-offset-overlay) .three-card-cta-card {
		margin: 1rem auto;
	}
	.three-card-cta:not(.access-plus-offset-overlay) .card-heading-overlay > .three-card-cta-heading {
		font-size: 10vw;
	}
}