/* Header matched to nw-motors.com. Values remain editable in Customizer. */
.nw-site-header {
	--nw-topbar-bg: #202428;
	--nw-topbar-color: #ffffff;
	--nw-header-bg: #ffffff;
	--nw-menu-color: #2d2d2d;
	--nw-menu-active-bg: #00aeef;
	--nw-menu-active-text: #ffffff;
	--nw-logo-width: 195px;
	--nw-header-height: 100px;
	background: var(--nw-header-bg);
	position: relative;
	z-index: 1000;
}

.nw-header-top { background: var(--nw-topbar-bg); color: var(--nw-topbar-color); font-size: 14px; font-weight: 500; }
.nw-header-top__inner { align-items: center; display: flex; justify-content: space-between; margin-inline: auto; max-width: 1450px; min-height: 38px; padding-inline: 15px; width: 100%; }
.nw-header-top__contacts { align-items: center; display: flex; gap: 18px; }
.nw-header-top a { color: var(--nw-topbar-color); font-weight: 600; }
.nw-header-top a:hover { color: var(--color-primary); }
.nw-header-top__separator { background: var(--nw-topbar-color); height: 14px; opacity: .85; width: 1px; }

.nw-site-header #header.nw-header { background: var(--nw-header-bg); border: 0; box-shadow: 0 2px 8px var(--color-shadow-soft); height: var(--nw-header-height); position: relative; }
.nw-header .inner-header { background: var(--nw-header-bg); height: var(--nw-header-height); }
.nw-site-header .nw-header .inner-header > .container { height: 100%; margin-inline: auto; max-width: 1450px !important; padding-inline: 15px; width: 100% !important; }
.nw-header .header-wrap { align-items: center; display: flex; height: var(--nw-header-height); justify-content: space-between; min-height: var(--nw-header-height); width: 100%; }
.nw-header .header-ct-left.nw-header__brand { align-items: center; display: flex; flex: 0 0 var(--nw-logo-width); flex-grow: 0; height: auto; margin-right: clamp(28px, 5vw, 76px); max-width: var(--nw-logo-width); }
.nw-header__logo { align-items: center; display: flex; width: var(--nw-logo-width); }
.nw-header__logo img { display: block; height: auto; max-height: 76px; object-fit: contain; width: 100%; }
.nw-header__navigation.header-ct-center { align-items: center; display: flex; flex: 1 1 auto; height: auto; justify-content: flex-end; min-width: 0; }
.nw-header__navigation .nav-wrap, .nw-header__navigation #mainnav { display: block; width: 100%; }
.nw-header__navigation #mainnav > ul { align-items: center; display: flex; gap: 4px; justify-content: flex-end; margin: 0; width: 100% !important; }
.nw-header__navigation #mainnav > ul > li { align-items: center; display: flex; height: var(--nw-header-height); margin: 0; }
.nw-header__navigation #mainnav > ul > li > a { align-items: center; border-radius: 6px; box-sizing: border-box; color: var(--nw-menu-color) !important; display: inline-flex; font-size: 14px !important; font-weight: 500; height: 48px !important; line-height: 1.3 !important; padding: 0 12px !important; white-space: nowrap; }
.nw-header__navigation #mainnav > ul > li.current-menu-item > a,
.nw-header__navigation #mainnav > ul > li.current-menu-ancestor > a,
.nw-header__navigation #mainnav > ul > li.current-menu-parent > a { background: var(--nw-menu-active-bg); color: var(--nw-menu-active-text) !important; }
.nw-header__navigation #mainnav > ul > li:not(.current-menu-item):not(.current-menu-ancestor):not(.current-menu-parent) > a:hover,
.nw-header__navigation #mainnav > ul > li:not(.current-menu-item):not(.current-menu-ancestor):not(.current-menu-parent) > a:focus { background: transparent; color: var(--nw-menu-active-bg) !important; }
.nw-header__navigation #mainnav > ul > li > a { overflow: hidden; position: relative; }
.nw-header__navigation #mainnav > ul > li > a::before {
	background: var(--nw-menu-active-bg) !important;
	bottom: 7px !important;
	content: "" !important;
	height: 2px !important;
	left: 12px !important;
	opacity: 1 !important;
	position: absolute !important;
	right: 12px !important;
	top: auto !important;
	transform: scaleX(0) !important;
	transform-origin: left center !important;
	transition: transform .25s ease !important;
	width: auto !important;
}
.nw-header__navigation #mainnav > ul > li:not(.current-menu-item):not(.current-menu-ancestor):not(.current-menu-parent) > a:hover::before,
.nw-header__navigation #mainnav > ul > li:not(.current-menu-item):not(.current-menu-ancestor):not(.current-menu-parent) > a:focus::before { transform: scaleX(1) !important; }
.nw-header__navigation #mainnav > ul > li.current-menu-item > a::before,
.nw-header__navigation #mainnav > ul > li.current-menu-ancestor > a::before,
.nw-header__navigation #mainnav > ul > li.current-menu-parent > a::before { transform: scaleX(0) !important; }
.nw-header__navigation #mainnav > ul > li.menu-item-has-children > a::after { border: solid currentColor; border-width: 0 1px 1px 0; content: ""; display: inline-block; font-family: inherit; height: 5px; margin: 3px 0 0 7px; transform: rotate(45deg); width: 5px; }
.nw-header__navigation #mainnav .sub-menu { background: var(--nw-header-bg); border: 1px solid var(--color-border); border-radius: 8px; box-shadow: var(--shadow-card); margin-top: 12px; padding: 8px; }
.nw-header__navigation #mainnav .sub-menu a { border-radius: 5px; color: var(--nw-menu-color); font-size: 13px; padding: 10px 13px; }
.nw-header__navigation #mainnav .sub-menu a:hover { background: var(--color-primary-soft); color: var(--color-primary-dark); }

.nw-header__menu-toggle.btn-menu { align-items: center; background: transparent; border: 0; display: none; flex: 0 0 44px; height: 44px; justify-content: center; margin-left: auto; padding: 10px; position: relative; width: 44px; }
.nw-header__menu-toggle.btn-menu::before,
.nw-header__menu-toggle.btn-menu::after,
.nw-header__menu-toggle.btn-menu .line-1 { background: var(--nw-menu-color); content: ""; height: 2px; left: 10px; position: absolute; width: 24px; }
.nw-header__menu-toggle.btn-menu::before { top: 13px; }
.nw-header__menu-toggle.btn-menu .line-1 { top: 21px; }
.nw-header__menu-toggle.btn-menu::after { top: 29px; }

/* Keep the page breadcrumbs on the same vertical grid as the top bar and logo. */
.page-header .page-title > .container-fluid {
	margin-inline: auto;
	max-width: 1450px !important;
	width: 100% !important;
}

@media (max-width: 1199px) {
	.nw-header .header-ct-left.nw-header__brand { margin-right: 28px; }
	.nw-header__navigation #mainnav > ul > li > a { padding-inline: 9px; }
}

@media (min-width: 1025px) {
	.nw-header__navigation.header-ct-center,
	.nw-header__navigation .inner-center,
	.nw-header__navigation #mainnav { display: flex; }
	.nw-header__navigation .inner-center { justify-content: flex-end; width: 100%; }
}

@media (max-width: 1024px) {
	.nw-site-header #header.nw-header, .nw-header .inner-header, .nw-header .header-wrap { height: 72px; min-height: 72px; }
	.nw-header .header-ct-left.nw-header__brand { flex-basis: 175px; margin-right: 20px; }
	.nw-header__logo { max-width: 175px; }
	.nw-header__navigation.header-ct-center { display: none !important; }
	.nw-header__menu-toggle.btn-menu { display: flex; }
}

@media (max-width: 767px) {
	.nw-header-top { font-size: 12px; }
	.nw-header-top__inner { align-items: center; flex-direction: column; gap: 3px; padding-block: 7px; text-align: center; }
	.nw-header-top__welcome { text-align: center; width: 100%; }
	.nw-header-top__contacts { flex-wrap: wrap; gap: 7px 12px; justify-content: center; width: 100%; }
	.nw-site-header #header.nw-header, .nw-header .inner-header, .nw-header .header-wrap { height: 64px; min-height: 64px; }
	.nw-header .header-ct-left.nw-header__brand { flex-basis: 150px; left: 50%; margin: 0; max-width: 150px; position: absolute; transform: translateX(-50%); }
	.nw-header__logo { max-width: 150px; }
	.nw-header__menu-toggle.btn-menu { margin-left: auto; }
}
