/* CTAs */

.ctas {}

.mainstage + .ctas {
	padding-top: 0;
	margin-top: calc(var(--vertical-spacing) * -0.5);
}

.ctas ul {
	margin: -0.833rem;
}

.ctas li {
	padding: 0.833rem;
}

.ctas li a {
	overflow: hidden;
	color: rgb(var(--white));
	background-color: rgb(var(--magenta));
	box-shadow: 0 0.722em 0.889em rgba(var(--black), 0.1);
	padding: 2em 1em;
}

.ctas li a:before {
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background-color: rgb(var(--red));
	transition: transform 0.3s ease;
}

.ctas li a:hover:before, 
.ctas li a:focus:before {
	transform: scale(0);
}

.ctas li svg:first-child {
	font-size: 3em;
	margin-bottom: 0.778rem;
	transform-origin: 50% 0;
	transform: scale(1.35);
	transition: transform 0.3s ease;
}

.ctas li a:hover svg:first-child, 
.ctas li a:focus svg:first-child {
	transform: scale(1);
}

.ctas li strong {
	display: block;
	font-size: 1.444em;
	font-weight: 900;
	line-height: 1.231;
	transform: translateY(1.333rem);
	transition: transform 0.3s ease;
}

.ctas li a:hover strong, 
.ctas li a:focus strong {
	transform: translateY(0);
}

.ctas li svg:last-child {
	font-size: 1.222em;
	margin-top: 0.5em;
	transform: translateY(1.333rem);
	opacity: 0;
	transition: transform 0.3s ease, opacity 0.3s ease;
}

.ctas li a:hover svg:last-child, 
.ctas li a:focus svg:last-child {
	transform: translateY(0);
	opacity: 1;
}

/* CTAs */

/* Responsive [1440px] */

@media screen and (max-width: 1440px) {
}

/* End Responsive [1440px] */

/* Responsive [1200px] */

@media screen and (max-width: 1200px) {
}

/* End Responsive [1200px] */

/* Responsive [1000px] */

@media screen and (max-width: 1000px) {
	.mainstage + .ctas {
		margin-top: calc(var(--vertical-spacing) * -0.3);
	}
}

/* End Responsive [1000px] */

/* Responsive [800px] */

@media screen and (max-width: 800px) {
	.ctas li a {
		padding-left: 2em;
		padding-right: 2em;
	}
	
	.ctas li a[class*='-column'] {
		flex-direction: row;
	}
	
	.ctas li svg:first-child {
		transform: none;
		margin-right: 0.5em;
		margin-bottom: 0;
		font-size: 3.5em;
	}
	
	.ctas li strong {
		transform: none;
	}
	
	.ctas li svg:last-child {
		display: none;
		visibility: hidden;
	}
}

/* End Responsive [800px] */

/* Responsive [650px] */

@media screen and (max-width: 650px) {
}

/* End Responsive [650px] */

/* Responsive [550px] */

@media screen and (max-width: 550px) {
	.ctas ul {
		margin: -0.5rem;
	}
	
	.ctas li {
		padding: 0.5rem;
	}
	
	.ctas li a {
		padding: 1.5em;
	}
	
	.ctas li svg:first-child {
		font-size: 3em;
	}
	
	.ctas li strong {
		font-size: 1.222em;
	}
}

/* End Responsive [550px] */