/* Marquis x HeatSavers co-branding layer, loaded after main.css. */

/* Brand type, as on marquisfireplaces.net: Proxima Nova for UI and spaced caps, Merriweather
   italic for script titles and body copy. Montserrat stands in until an Adobe Fonts kit is set. */
body,
button, input, select, textarea,
h1, h2, .nav, .nav__link, .btn, .header-cta, .spaced-title, .hero-slide__title, .hero-slide__model {
	font-family: proxima-nova, Montserrat, Helvetica, Arial, sans-serif;
}
p, .script-title, .hero-slide__text, .welcome__text, h3.script-title {
	font-family: merriweather, Merriweather, Georgia, serif;
}

/* Header logo lockup: HeatSavers | Marquis on the dark brand block. */
.site-header__brand--duo {
	display: flex;
	align-items: center;
	gap: 14px;
	width: auto;
	padding-inline: 20px;
}
.site-header__brand--duo img { display: block; width: auto; }
.site-header__marquis { height: 32px; }
.site-header__hs { height: 36px; }
.site-header__divider {
	width: 1px;
	height: 32px;
	background: rgba(255, 255, 255, .35);
}

/* Header estimate button. */
.header-cta {
	display: none;
	align-self: center;
	margin-inline: 8px;
	padding: 10px 16px;
	background: #9e1b32;
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
	transition: background-color .2s;
}
.header-cta:hover, .header-cta:focus-visible { background: #7d1527; color: #fff; }
@media (min-width: 1280px) { .header-cta { display: inline-block; } }

@media (max-width: 600px) {
	.site-header__brand--duo { gap: 9px; padding-inline: 12px; }
	.site-header__marquis { height: 22px; }
	.site-header__hs { height: 27px; }
	.site-header__divider { height: 24px; }
}

/* Hero mosaic: Marquis logo above the call to action. */
.mosaic__logo {
	display: block;
	box-sizing: content-box;
	width: min(200px, 46vw);
	height: auto;
	margin: 0 auto 12px;
	padding: 14px 22px;
	background: rgba(15, 13, 13, .86);
}

/* Secondary hero button on photos. */
.btn--ghost-light {
	background: transparent;
	border: 1px solid rgba(255, 255, 255, .85);
	color: #fff;
}
.btn--ghost-light:hover, .btn--ghost-light:focus-visible { background: #fff; color: #0f0d0d; }

/* Drawer and footer logo pairs. */
.drawer__logos, .site-footer__logos {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 8px 12px;
	background: #0f0d0d;
}
.drawer__logos img, .site-footer__logos img { display: block; width: auto; height: 30px; }
.site-footer__logos { flex-direction: column; align-items: flex-start; gap: 14px; padding: 14px; }
.site-footer__logos img { height: 34px; }