/* Kept out of main.css: that file is compiled and its SCSS sources are gone. */

/* A separate family name, so pages already using Montserrat keep their current look. */
@font-face {
	font-family: MontserratBold;
	src: url(./fonts/Montserrat-Bold.ttf) format("truetype");
	font-weight: 400;
	font-style: normal;
}

.market-report-callout {
	display: flex;
	align-items: center;
	box-sizing: border-box;
	width: calc(100% - 32px);
	max-width: 900px;
	margin: 0 auto 48px;
	padding: 32px;
	background: #eef6fa;
	border: 1px solid #c4e1ee;
}

.market-report-callout__icon {
	flex: 0 0 64px;
	width: 64px;
	height: 64px;
	margin-right: 28px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #23272b;
}

.market-report-callout__icon svg {
	display: block;
	width: 32px;
	height: 32px;
	fill: none;
	stroke: #9fd3ea;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.market-report-callout__label {
	margin: 0 0 6px;
	font-family: MontserratBold, Montserrat, sans-serif;
	font-size: 1.15rem;
	line-height: 1.5;
	letter-spacing: .18rem;
	color: #1d5e7a;
}

.market-report-callout__headline {
	margin: 0 0 8px;
	font-family: MontserratBold, Montserrat, sans-serif;
	font-size: 2rem;
	line-height: 1.3;
	color: #23272b;
}

.market-report-callout__body {
	margin: 0;
	font-family: Merriweather, serif;
	font-size: 1.44rem;
	line-height: 2.24rem;
	color: #333;
}

.market-report-callout__body strong {
	font-family: MontserratBold, Montserrat, sans-serif;
	font-weight: 400;
	color: #1d5e7a;
}

@media (max-width: 767px) {
	.market-report-callout {
		display: block;
		margin-bottom: 40px;
		padding: 24px;
	}

	.market-report-callout__icon {
		margin: 0 0 16px;
	}
}

/* The longer Contact label pushes the nav under the logo below about 1400px; the mobile menu takes over at 1072px. */
@media (min-width: 1073px) and (max-width: 1439px) {
	header nav.nav-header .main-menu .menu-list li.menu-item {
		padding: 0 .75vw;
	}

	header nav.nav-header .main-menu .menu-list li.menu-item:last-child {
		padding: 0 0 0 .75vw;
	}

	header nav.nav-header .main-menu .menu-list li.menu-item a {
		font-size: .96vw;
	}
}

/* An input's placeholder can't wrap, so shrink it to keep the ALTOS instruction readable on phones. */
@media (max-width: 414px) {
	.contact.page input[name=subject]::placeholder {
		font-size: 3.05vw;
	}
}