/* Sitewide header/footer restyle to the 2026 theme. Loaded unconditionally by
   site-header.php on every page (marketing site, auth pages, legal pages,
   error pages) — NOT loaded by the internal app/portal, which has its own
   separate header/footer partials.

   This makes the light nav (cream bg, dark text, true-colour logo) the
   permanent default everywhere, replacing the old dark-at-top/light-on-scroll
   behaviour. scrolling-nav.js still toggles .top-nav-collapse on scroll, but
   since both states now look the same, the toggle is harmless. !important is
   required in a few places to beat the old dark-default rules in
   style.min.css regardless of that toggle's state. */

:root{
	--mah-2026: #774543;
	--sky-2026: #A1BEC5;
	--skd-2026: #4f717a;
	--ash-2026: #EDEBE3;
	--char-2026: #171F21;
}

.navbar-default {
	background: var(--ash-2026) !important;
	box-shadow: 0 2px 12px rgba(0,0,0,.08) !important;
}
.navbar-default .navbar-brand img {
	filter: none !important;
	height: auto !important;
	max-height: 48px;
	max-width: 200px;
	width: auto;
}
.navbar-default .navbar-nav > li a {
	color: var(--char-2026) !important;
	opacity: 1 !important;
	font-family: 'Figtree', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-weight: 500;
	font-size: 15px;
}
.navbar-default .navbar-nav > li a:hover,
.navbar-default .navbar-nav > li a:focus,
.navbar-default .navbar-nav > li.active a {
	color: var(--mah-2026) !important;
}
.navbar-default .navbar-nav > li.active span {
	background: var(--mah-2026) !important;
}
.navbar-toggle span,
.navbar-toggle span:before,
.navbar-toggle span:after {
	background: var(--mah-2026) !important;
}
.navbar-default .download-btn {
	border-radius: 9px;
	font-family: 'Figtree', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-weight: 600;
}

/* FOOTER */
.footer {
	font-family: 'Figtree', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
.footer .footjoin h4 {
	font-family: inherit;
	font-size: 32px;
}
.footer .footjoin a {
	font-family: inherit;
	font-size: 15px;
	font-weight: 600;
	border-radius: 9px !important;
}

.footer-main {
	max-width: 1100px;
	margin: 0 auto;
	padding: 54px 36px 0;
	display: flex;
	flex-wrap: wrap;
	gap: 40px;
	justify-content: space-between;
	text-align: left;
}
.footer-main__brand { max-width: 260px; }
.footer-main__brand p { margin-top: 14px; font-size: 14px; color: #9aa0a0; }
.footer-main__cols { display: flex; gap: 64px; flex-wrap: wrap; }
.footer-main__col-title { font-weight: 600; color: #fff; margin-bottom: 12px; font-size: 15px; }
.footer-main__col { display: flex; flex-direction: column; gap: 9px; font-size: 14px; }
.footer-main__col a { color: #9aa0a0; text-decoration: none; }
.footer-main__col a:hover { color: var(--sky-2026); text-decoration: underline; }

.footer .sub-footer {
	/* style.min.css sets float:left + width:100% on .sub-footer, which makes
	   margin:auto centering a no-op on floated elements — reset both here */
	float: none;
	width: auto;
	max-width: 1100px;
	margin: 40px auto 0;
	padding: 18px 36px 30px;
	border-top: 1px solid rgba(255,255,255,.12);
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
	text-align: left;
}
.footer .sub-footer span {
	font-size: 13px;
	color: #7e8484;
	line-height: 1.6;
}
.footer .sub-footer span a {
	color: #7e8484;
	text-decoration: underline;
	font-weight: 400;
}
.footer .sub-footer .social-media {
	display: flex;
	gap: 14px;
	width: auto;
}
.footer .sub-footer .social-media li {
	margin: 0;
}
.footer .sub-footer .social-media li a {
	width: auto;
	height: auto;
	float: none;
	border: none;
	border-radius: 0;
	font-size: 17px;
	line-height: 1;
	color: #cfd0cf;
}
.footer .sub-footer .social-media li a:hover {
	background: none;
	color: var(--sky-2026);
}

@media (max-width: 700px) {
	.footer-main { padding: 40px 20px 0; flex-direction: column; }
	.footer-main__cols { gap: 32px; }
	.footer .sub-footer { flex-direction: column; align-items: flex-start; padding: 18px 20px 30px; }
	.navbar-default .navbar-brand img { max-width: 160px; max-height: 40px; }
}

/* Collapse the top nav below desktop — Bootstrap's default 767px leaves
   tablet widths with a wrapping link row that looks broken. */
@media (max-width: 991px) {
	.navbar-default .navbar-header {
		float: none;
	}
	.navbar-default .navbar-toggle {
		display: block !important;
		float: right;
		margin-top: 18px;
		margin-right: 12px;
	}
	.navbar-default .navbar-collapse.collapse {
		display: none !important;
		height: auto !important;
		padding-bottom: 0;
		overflow: hidden !important;
	}
	.navbar-default .navbar-collapse.collapse.in,
	.navbar-default .navbar-collapse.collapsing {
		display: block !important;
	}
	.navbar-default .navbar-nav {
		float: none !important;
		margin: 0;
	}
	.navbar-default .navbar-nav > li {
		float: none !important;
	}
	.navbar-default .navbar-nav > li > a {
		padding: 14px 22px !important;
		text-align: left;
	}
	/* Header pill is desktop-only; menu item covers tablet + phone */
	.navbar-default .download-btn.hidden-xs {
		display: none !important;
	}
	.navbar-default .visible-xs {
		display: list-item !important;
	}

	/* Light 2026 slide-out (overrides dark #2e2e2f push-menu chrome) */
	.navbar-default .cbp-spmenu {
		background: var(--ash-2026) !important;
		box-shadow: -8px 0 28px rgba(0,0,0,.12);
		border-left: 1px solid rgba(23,31,33,.08);
	}
	.navbar-default .cbp-spmenu-vertical {
		width: 280px;
		position: fixed;
		top: 0;
		bottom: 0;
		right: -280px;
		left: auto;
		height: auto !important;
		z-index: 1050;
		overflow-y: auto;
		padding-top: 72px;
	}
	.navbar-default .cbp-spmenu-right.cbp-spmenu-open {
		right: 0;
	}
	.navbar-default .navbar-nav > li > a,
	.navbar-default .navbar-nav > li.active a {
		color: var(--char-2026) !important;
	}
	.navbar-default .navbar-nav > li > a:hover,
	.navbar-default .navbar-nav > li > a:focus {
		color: var(--mah-2026) !important;
		background: rgba(119,69,67,.06) !important;
	}
	.navbar-default .navbar-nav > li.active span {
		display: none !important;
	}
}
