.footer-cta {
	position: relative;
	width: 100%;
	height: calc(100vw * 185 / 320);
	margin-bottom: 2px;
}

.footer-cta .image {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.footer-cta picture:after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,50%) 50%);
	pointer-events: none;
}

.footer-cta .content {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	gap: 8px;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.footer-cta .icon {
	width: 54px;
	height: 54px;
	fill: var(--blue);
}

@media (hover: hover) {
	.footer-cta:hover .icon .cls-1 {
		fill: var(--red);
	}
}

.footer-cta .title {
	color: var(--white);
	font-family: var(--sofia);
	font-weight: 700;
	font-size: 32px;
	line-height: 1;
	text-align: center;
}

.footer-cta .subtitle {
	display: block;
	font-family: var(--sofia);
	font-weight: 600;
	font-size: 14px;
	line-height: 1.25;
}

@media (min-width: 40em) {
	.footer-cta {
		margin-bottom: 1px;
		height: calc(100vw * 150 / 300);
		width: 100%;
	}
}

@media (min-width: 64em) {
	.footer-cta {
		margin-left: 1px;
		margin-bottom: 0;
		height: 100%;
		width: 100%;
	}
}

@media (min-width: 90em) {
	.footer-cta {
		gap: 0;
		height: 300px;
	}

	.footer-cta .icon {
		width: 62px;
		height: 62px;
	}
}