/* ==========================================================================
   Banner Autonomia e Renda
   ========================================================================== */

.banner {
	max-width: var(--container-max-width);
	margin: 0 auto;
	padding: 0 1.25rem 2.25rem;
}

.banner__inner {
	position: relative;
}

.banner__frame {
	width: 100%;
	aspect-ratio: 1 / 1;
	border-radius: var(--radius-image);
	overflow: hidden;
}

.banner__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.banner__cta {
	margin-top: 1.25rem;
}

@media (min-width: 64rem) {

	.banner {
		padding: 0 1.75rem 3rem;
	}

	.banner__frame {
		aspect-ratio: 759 / 313;
	}

	.banner__cta {
		position: absolute;
		left: 13.5%;
		bottom: 14%;
		margin-top: 0;
	}
}