.city-hero{
	padding-bottom: 3rem;
}
.city-hero-wrap{
	position: relative;
}
.city-hero-btns{
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 1.25rem;
}
.city-hero-btns .btn{
	min-width: 11rem;
}
.city-hero-icon{
	position: absolute;
	width: 100%;
	height: auto;
	top: 80%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: -1;
}
.city-features{
	padding: 3rem 0;
	background-color: var(--c-extraLightBlue);
}
.city-features-grid{
	display: grid;
	gap: 2.5rem;
}
.city-features-list{
	display: grid;
	gap: 2rem;
}
.city-feature-head{
	display: flex;
	justify-content: flex-start;
	align-items: center;
	gap: .75rem;
}
.city-feature-icon{
	width: 1.5rem;
	min-width: 1.5rem;
	height: 1.5rem;
}
.city-feature-title{
	font-family: var(--font-generalsans);
	font-size: 1.5rem;
	font-weight: 500;
}
.city-feature-text{
	font-size: .875rem;
	line-height: 1.2;
	margin-top: .25rem;
	margin-left: 2.25rem;
}
.city-areas{
	position: relative;
	padding: 6rem 0;
}
.city-areas,
.city-areas .title-1{
	color: var(--c-white);
}
.city-areas-list{
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	gap: 1.5rem;
}
.city-area{
	display: flex;
	align-items: center;
	gap: .5rem;
}
.city-area-icon{
	width: 1.5rem;
	height: 1.5rem;
	min-width: 1.5rem;
}
.city-area-name{
	font-family: var(--font-generalsans);
	font-size: 1.5rem;
	font-weight: 500
}
.city-area-subtext{
	display: block;
	line-height: 1.2;
}
.city-areas-bg{
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
}
.city-areas-bg::after{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(31, 51, 98, 0.7);
	z-index: 0;
}
.city-areas-bg img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}
.city-benefits{
	padding: 3rem 0;
	background-color: var(--c-blue);
}
.city-benefits,
.city-benefits .title-1{
	color: var(--c-white);
}
.city-benefits-grid{
	display: grid;
	gap: 2.5rem;
}
.city-benefits-list{
	display: grid;
	gap: 2rem;
}
.city-benefit{
	display: flex;
	align-items: center;
	gap: .5rem;
}
.city-benefit-icon{
	width: 1.5rem;
	min-width: 1.5rem;
	height: 1.5rem;
}
.city-benefit-title{
	font-family: var(--font-generalsans);
	font-size: 1.5rem;
	font-weight: 500;
}
.city-testimonial{
	padding: 3rem 0;
}
.city-testimonial blockquote{
	display: block;
	margin-right: 0;
	margin-left: 0;
	padding: 0;
}
.city-testimonial cite{
	display: block;
	font-style: normal;
}
.city-call{
	padding: 3rem 0;
	background-color: var(--c-extraLightBlue);
}
.city-call-btns{
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 1.25rem;
}
.city-call-btns .btn{
	min-width: 11rem;
}
.city-map{
	padding: 3rem 0;
	background-color: var(--c-blue);
}
.city-map,
.city-map .title-1{
	color: var(--c-white);
}
.city-map-grid{
	display: grid;
	gap: 2.5rem;
}
.city-map-text{
	font-size: 1.25rem;
}
.city-map-code{
	width: 100%;
	aspect-ratio: 1;
	border-radius: .25rem;
	overflow: hidden;
}
.city-map-code iframe{
	width: 100%;
	height: 100%;
	border: none;
}
.city-text{
	padding: 3rem 0;
	background-color: var(--c-extraLightBlue);
}

/*Media*/
@media (min-width: 576px){

}
@media (min-width: 768px){
	.city-areas-list{
		flex-direction: row;
		align-items: center;
		max-width: 64rem;
	}
}
@media (min-width: 1024px){
	.city-hero{
		padding-bottom: 6rem;
	}
	.city-hero-text{
		font-size: 1.75rem;
		max-width: 60rem;
		margin-left: auto;
		margin-right: auto;
	}
	.city-hero-icon{
		max-width: 44rem;
		top: 120%;
	}
	.city-features{
		padding: 6rem 0;
	}
	.city-features-grid{
		grid-template-columns: repeat(2, 1fr);
		gap: 4rem;
	}
	.city-features-sticky{
		position: sticky;
		top: 6rem;
	}
	.city-benefits{
		padding: 6rem 0;
	}
	.city-benefits-grid{
		grid-template-columns: repeat(2, 1fr);
		gap: 4rem;
	}
	.city-benefits-sticky{
		position: sticky;
		top: 6rem;
	}
	.city-testimonial{
		padding: 6rem 0;
	}
	.city-call{
		padding: 6rem 0;
	}
	.city-map{
		padding: 6rem 0;
	}
	.city-map-grid{
		grid-template-columns: repeat(2, 1fr);
		gap: 4rem;
	}
	.city-map-info{
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}
	.city-map-text{
		font-size: 1.75rem;
	}
	.city-map-code{
		aspect-ratio: 1.3;
	}
	.city-text{
		padding: 6rem 0;
	}
}
@media (min-width: 1200px){
	
}
@media (min-width: 1400px){

}