// Google Fonts
@import url(https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;900&display=swap);
$new-primary: var(--main-bg-color);

@function headings($from: 1, $to: 6) {
	@if $from == $to {
		@return "h#{$from}";
	} @else {
		@return "h#{$from}," + headings($from + 1, $to);
	}
}

#area-page {
    max-width: 100%;
}

.kv-area-page-global {
	#{headings(2,6)} {
		margin-top: 10px;
		margin-bottom: 10px;
		font-weight: 400;
	}

	#{headings(5,6)} {
		font-weight: 500;
	}

	#{headings(1)} {
		margin-top: 20px;
		margin-bottom: 15px;
		font-size: 44px;
		line-height: 62px;
	}

	#{headings(2)} {
		font-size: 36px;
		line-height: 50px;
	}

	#{headings(3)} {
		font-size: 30px;
		line-height: 46px;
	}

	#{headings(4)} {
		font-size: 24px;
		line-height: 38px;
	}

	#{headings(5)} {
		font-size: 20px;
		line-height: 34px;
	}

	#{headings(6)} {
		font-size: 16px;
		line-height: 28px;
	}

	.kv-area-container {
		// max-width: 1480px;
		margin-right: auto;
		margin-left: auto;
	}

	.kv-area-row {
		&:before,
		&:after {
			content: " ";
			display: table;
			grid-column-start: 1;
			grid-row-start: 1;
			grid-column-end: 2;
			grid-row-end: 2;
		}
		&:after {
			clear: both;
		}
	}

	.kv-col {
		position: relative;
		float: left;
		width: 100%;
		min-height: 1px;
		padding-left: 0px;
		padding-right: 0px;
	}

	.kv-col-3,
	.kv-col-6 {
		@extend .kv-col;
	}

	.kv-col-3 {
		width: 25%;
	}

	.kv-col-6 {
		width: 50%;
	}

	.kv-area-section-heading {
		border-bottom: 2px none #c4c4c4;
		font-family: Roboto, sans-serif;
		color:  $new-primary;
		font-size: 25px;
		line-height: 22.65px;
		font-weight: 700;
		text-decoration: none;
		text-transform: uppercase;
	}

	.kv-area-section-line {
		width: 221px;
		margin-top: 13px;
		margin-bottom: 40px;
		border-bottom: 2px solid #c4c4c4;
	}
}


@media (min-width: map_get($grid-breakpoints, 'sm')) and (max-width: map_get($grid-breakpoints, 'lg') - 1) {
	.kv-area-page-global {
		.kv-container {
			max-width: 728px;
		}

		.kv-col {
			width: 100%;
			left: auto;
			right: auto;
			margin-top: 20px;
		}
	}
}

@media (min-width: 300px) and (max-width: map_get($grid-breakpoints, 'lg') - 1) {
	.kv-area-page-global {
		.kv-container {
			max-width: none;
		}

		.kv-col {
			width: 100%;
			left: auto;
			right: auto;
		}

		.kv-col-6 {
			width: 100%;
		}

		h1 {
			font-size: 65px;
		}

		.kv-col-3{
			margin-bottom: 10px;
		}
		.kv-area-section-heading {
			line-height: 28.65px;
		}
	}
}

@import 'elements/widgets/area-page-hero';
@import 'elements/widgets/area-page-hero-full';
@import 'elements/widgets/area-page-quicklinks';
@import 'elements/widgets/area-page-nearby-areas';
@import 'elements/widgets/area-page-highlights';
@import 'elements/widgets/area-page-area-listings';
@import 'elements/widgets/area-page-market';
@import 'elements/widgets/area-we-cover';