.page.contacts>section {
	margin-top: var(--s4);
	margin-bottom: var(--s4);
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	grid-template-rows: auto 2fr;
	grid-template-areas:
		"header header header map map"
		"address address address map map"
		"form form form . .";
	gap: var(--s4);
	
}

.page.contacts>section>.contacts-header {
	grid-area: header;
}

.page.contacts>section>.contacts-map {
	padding: 0;
	grid-area: map;
	position: sticky;
	top: calc(12 * var(--s));
}

.page.contacts>section>.contacts-address {
	grid-area: address;
}

.page.contacts>section>.contacts-form {
	grid-area: form;
}

.contacts .content-block.map-block {
	padding: 0;
}

.contacts .map {
	width: 100%;
	height: 400px;
	border-radius: var(--s2);
	overflow: hidden;
}

@media screen and (max-width: 810px) {
	.page.contacts>section {
		grid-template-columns: 1fr;
		grid-template-rows: auto 1fr auto;
		grid-template-areas:
			"header"
			"address"
			"map"
			"form";
	}
	.page.contacts>section>.contacts-map {
		position: inherit;
		top: inherit;
	}

}