div.contact-map {
	--cm-height: 583px;
	--cm-radius: 6px;
	--cm-accent: #960a19;
	--cm-text: #323439;

	position: relative;
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
}

div.contact-map *,
div.contact-map *::before,
div.contact-map *::after {
	box-sizing: border-box;
}

div.contact-map .contact-map__canvas {
	width: 100%;
	height: var(--cm-height);
	min-height: 280px;
	border-radius: var(--cm-radius);
	overflow: hidden;
	background: #e8eef2;
}

div.contact-map .contact-map-popup {
	max-width: 234px;
	padding: 8px;
	overflow: hidden;
	border-radius: 6px;
	background: #ffffff;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
	font-family: "TikTok Sans", sans-serif;
}

div.contact-map .contact-map-popup__image {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	object-position: center;
	background: #d9d4cf;
}

div.contact-map .contact-map-popup__title {
	margin: 0;
	padding: 14px 16px 16px;
	font-family: Emilio, Georgia, "Times New Roman", serif;
	font-size: 28px;
	font-weight: 300;
	font-style: normal;
	line-height: 1.2;
	text-align: center;
	text-transform: uppercase;
	color: var(--cm-text);
}

/* Tighten default Google InfoWindow chrome */
.contact-map .gm-style .gm-style-iw-c {
	padding: 0 !important;
	border-radius: 6px !important;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
}

.contact-map .gm-style .gm-style-iw-d {
	overflow: hidden !important;
	max-height: none !important;
}

.contact-map .gm-style .gm-style-iw-tc::after {
	background: #ffffff;
}

.contact-map .gm-style-iw-chr {
	display: none;
}

@media (max-width: 767px) {
	div.contact-map {
		--cm-height: 360px;
	}

	div.contact-map .contact-map-popup {
		max-width: 180px;
	}

	div.contact-map .contact-map-popup__title {
		padding: 12px 12px 14px;
		font-size: 28px;
	}
}