/**
 * Site header — the two-row Salient header styled in the SBBG language.
 * v0.11.0 (Tue 9/8/26). Selectors are Salient's own (read from the live DOM
 * once the Top Bar + Main menus went live); the sketch was
 * test/header-sketch.css. Same posture as the elements: state every property
 * Salient could otherwise decide.
 *
 * Structure Salient renders:
 *   #header-outer #header-secondary-outer > .container > nav > ul.sf-menu > li > a   (top bar)
 *   #header-outer  #logo img · nav > ul.sf-menu > li > a · ul.buttons (Pull Right)
 *   li.nectar-megamenu-menu-item > ul.sub-menu > li (column) > a (heading) > ul > li > a
 *   #slide-out-widget-area.fullscreen-alt ul.menu                          (off canvas)
 * Mobile header kicks in under 1000px (Salient default).
 */

:root {
	--awse-navy: #0a1e2f; --awse-red: #cf0c0c; --awse-ink: #1b2733; --awse-muted: #5b6b7a;
	--awse-line: rgba(10,30,47,.12); --awse-paper: #f5f7f9; --awse-ice: #9fc4d6;
	--awse-head: Roboto, "Open Sans", Helvetica, Arial, sans-serif; --awse-body: "Open Sans", Helvetica, Arial, sans-serif;
	--awse-wrap: 1180px; --awse-radius: 10px;
	--awse-panel-shadow: 0 30px 60px -24px rgba(10,30,47,.45), 0 8px 20px -12px rgba(10,30,47,.25);
}

/* ---------------------------------------------------------------- top bar */
#header-outer #header-secondary-outer { background: var(--awse-navy) !important; border: 0 !important; box-shadow: none !important; }
#header-outer #header-secondary-outer .container { display: flex; justify-content: flex-end; align-items: center; min-height: 32px; }
#header-outer #header-secondary-outer nav { float: none; }
#header-outer #header-secondary-outer nav > ul.sf-menu { display: flex; align-items: center; gap: 2px; margin: 0; padding: 0; line-height: 1; }
#header-outer #header-secondary-outer nav > ul.sf-menu > li { margin: 0; padding: 0; float: none; }
#header-outer #header-secondary-outer nav > ul.sf-menu > li > a { display: inline-flex; align-items: center; gap: 6px; padding: 9px 8px; margin: 0; border-radius: 4px; font: 700 10px/1 var(--awse-head) !important; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.85) !important; line-height: 1 !important; transition: background .25s, color .25s; }
#header-outer #header-secondary-outer nav > ul.sf-menu > li > a:hover, #header-outer #header-secondary-outer nav > ul.sf-menu > li.sfHover > a { background: rgba(255,255,255,.08); color: #fff !important; }
#header-outer #header-secondary-outer nav > ul.sf-menu > li > a .menu-title-text { line-height: 1; }
/* Salient's sf-arrows caret → our red chevron */
#header-outer #header-secondary-outer ul.sf-menu li.menu-item-has-children > a.sf-with-ul::after { content: "" !important; display: inline-block; width: 5px; height: 5px; border-right: 2px solid #ff6b6b; border-bottom: 2px solid #ff6b6b; transform: translateY(-2px) rotate(45deg); margin-left: 4px; border-top: 0; border-left: 0; position: static; transition: transform .3s; }
#header-outer #header-secondary-outer ul.sf-menu li.menu-item-has-children.sfHover > a.sf-with-ul::after { transform: translateY(1px) rotate(225deg); }
#header-outer #header-secondary-outer nav > ul.sf-menu > li > a[href^="tel:"]::before, #header-outer #header-secondary-outer nav > ul.sf-menu > li.awse-call > a::before { content: ""; width: 11px; height: 11px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ff6b6b' d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1A17 17 0 0 1 3 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.3 0 .7-.2 1L6.6 10.8z'/%3E%3C/svg%3E") no-repeat center / contain; }

/* top-bar dropdowns (Locations, Call Us): white card, right-anchored */
#header-outer #header-secondary-outer ul.sf-menu li ul.sub-menu { background: #fff !important; border: 0 !important; border-radius: var(--awse-radius); box-shadow: var(--awse-panel-shadow) !important; padding: 10px 8px !important; margin-top: 6px; min-width: 240px; left: auto !important; right: 0; }
#header-outer #header-secondary-outer ul.sf-menu li ul.sub-menu li { float: none; margin: 0; padding: 0; }
#header-outer #header-secondary-outer ul.sf-menu li ul.sub-menu li a { display: block; padding: 9px 12px !important; margin: 0; border-radius: 6px; border: 0 !important; background: none !important; font: 700 13px/1.3 var(--awse-head) !important; letter-spacing: 0; text-transform: none; color: var(--awse-navy) !important; transition: background .2s; }
#header-outer #header-secondary-outer ul.sf-menu li ul.sub-menu li a:hover { background: var(--awse-paper) !important; }
#header-outer #header-secondary-outer ul.sf-menu li ul.sub-menu li a[href^="tel:"] .awse-tel { display: block; font: 600 12px/1.3 var(--awse-body); color: var(--awse-red); margin-top: 1px; }

/* grouped into Michigan / Florida columns by header.js (li.awse-col > span.awse-col-head + ul.awse-col-list) */
#header-outer #header-secondary-outer ul.sf-menu li ul.sub-menu.awse-grouped { display: flex !important; padding: 0 !important; min-width: 0; width: max-content; }
#header-outer #header-secondary-outer ul.sub-menu.awse-grouped > li.awse-col { flex: 1 1 auto; min-width: 190px; padding: 18px 16px 14px; margin: 0; }
#header-outer #header-secondary-outer ul.sub-menu.awse-grouped > li.awse-col + li.awse-col { border-left: 1px solid var(--awse-line); }
#header-outer #header-secondary-outer ul.sub-menu.awse-grouped .awse-col-head { display: block; font: 800 11px/1 var(--awse-head); letter-spacing: .16em; text-transform: uppercase; color: var(--awse-muted); margin: 0 0 10px 4px; }
#header-outer #header-secondary-outer ul.sub-menu.awse-grouped ul.awse-col-list { display: block !important; position: static !important; padding: 0 !important; margin: 0 !important; background: none !important; box-shadow: none !important; border: 0 !important; opacity: 1 !important; visibility: visible !important; transform: none !important; min-width: 0; }
#header-outer #header-secondary-outer ul.sub-menu.awse-grouped ul.awse-col-list > li { float: none; margin: 0; padding: 0; }
/* Locations rows: name + red arrow at the right edge */
#header-outer #header-secondary-outer li.awse-locations ul.sub-menu li a { display: flex !important; align-items: center; justify-content: space-between; gap: 14px; }
#header-outer #header-secondary-outer li.awse-locations ul.sub-menu li a::after { content: "\2192"; color: var(--awse-red); font: 900 15px/1 var(--awse-head); transition: transform .3s; }
#header-outer #header-secondary-outer li.awse-locations ul.sub-menu li a:hover::after { transform: translateX(3px); }

/* ---------------------------------------------------------------- main row */
#header-outer { background-color: #fff !important; border-bottom: 0 !important; box-shadow: none !important; transition: box-shadow .35s; }
#header-outer.awse-scrolled { box-shadow: 0 10px 30px -18px rgba(10,30,47,.35), 0 1px 0 rgba(10,30,47,.06) !important; }
#header-outer #logo img { height: 54px; width: auto; }
#header-outer #top nav > ul.sf-menu > li > a { font: 700 15px/1 var(--awse-head) !important; letter-spacing: -.005em; color: var(--awse-navy) !important; padding: 12px 14px; border-radius: 6px; transition: background .25s; }
#header-outer #top nav > ul.sf-menu > li > a:hover, #header-outer #top nav > ul.sf-menu > li.sfHover > a, #header-outer #top nav > ul.sf-menu > li.current-menu-item > a { background: var(--awse-paper); }
#header-outer #top nav > ul.sf-menu > li > a .menu-title-text::after { display: none !important; }  /* Salient's animated underline */
#header-outer #top nav > ul.sf-menu > li.menu-item-has-children > a.sf-with-ul::after { content: "" !important; display: inline-block; width: 7px; height: 7px; border-right: 2px solid var(--awse-red); border-bottom: 2px solid var(--awse-red); border-top: 0; border-left: 0; transform: translateY(-2px) rotate(45deg); margin-left: 6px; position: static; transition: transform .3s; }
#header-outer #top nav > ul.sf-menu > li.menu-item-has-children.sfHover > a.sf-with-ul::after { transform: translateY(1px) rotate(225deg); }
/* Transparent header (a per-page Salient option): over a photo the row has no white background, so the
   nav reads white until the page scrolls and Salient adds .scrolled — then it's the white bar again. */
#header-outer.transparent:not(.scrolled) { background-color: transparent !important; }
#header-outer.transparent:not(.scrolled) #top nav > ul.sf-menu > li > a { color: #fff !important; text-shadow: 0 1px 3px rgba(0,0,0,.45); }
#header-outer.transparent:not(.scrolled) #top nav > ul.sf-menu > li > a:hover, #header-outer.transparent:not(.scrolled) #top nav > ul.sf-menu > li.sfHover > a { background: rgba(255,255,255,.12); }
#header-outer.transparent:not(.scrolled) #top nav > ul.sf-menu > li.menu-item-has-children > a.sf-with-ul::after { border-color: #ff6b6b; }
/* Pull Right button (Shop Boats) */
#header-outer #top ul.buttons li.menu-item-btn-style-button_accent-color > a, #header-outer.transparent:not(.scrolled) #top ul.buttons li.menu-item-btn-style-button_accent-color > a { display: inline-block !important; font: 900 12px/1 var(--awse-head) !important; line-height: 1 !important; height: auto !important; padding: 11px 16px !important; margin: 0 !important; border-radius: 5px !important; color: #fff !important; text-shadow: none !important; background: none; letter-spacing: 0; }
#header-outer #top ul.buttons li.menu-item-btn-style-button_accent-color > a .menu-title-text { color: #fff !important; font: inherit !important; line-height: 1 !important; }
#header-outer #top ul.buttons li.menu-item-btn-style-button_accent-color { margin: 0 !important; }
#header-outer #top ul.buttons li.menu-item-btn-style-button_accent-color > a:hover { background: var(--awse-red) !important; opacity: .9; }

/* ---------------------------------------------------------------- Boats mega menu */
#header-outer #top li.nectar-megamenu-menu-item > ul.sub-menu { left: 50% !important; right: auto !important; transform: translateX(-50%); width: min(var(--awse-wrap), calc(100vw - 96px)) !important; max-width: none !important; margin-top: 8px; padding: 0 !important; background: #fff !important; border: 0 !important; border-radius: var(--awse-radius) !important; box-shadow: var(--awse-panel-shadow) !important; overflow: hidden; display: flex !important; align-items: stretch; }
#header-outer li.nectar-megamenu-menu-item > ul.sub-menu > li { flex: 1 1 0; width: auto !important; min-width: 0; float: none !important; margin: 0 !important; padding: 26px 22px 24px !important; border-right: 1px solid var(--awse-line); background: none !important; }
#header-outer li.nectar-megamenu-menu-item > ul.sub-menu > li:last-child { border-right: 0; }
#header-outer li.nectar-megamenu-menu-item > ul.sub-menu > li.awse-feature { flex: 1.4 1 0; padding: 10px !important; }
/* column heading — "01 Shop by type" */
#header-outer #top li.nectar-megamenu-menu-item > ul.sub-menu > li > a { display: flex !important; align-items: center; gap: 8px; margin: 0 0 14px !important; padding: 0 !important; font: 800 11px/1 var(--awse-head) !important; letter-spacing: .16em !important; text-transform: uppercase !important; color: var(--awse-muted) !important; background: none !important; border: 0 !important; pointer-events: none; }
#header-outer #top li.nectar-megamenu-menu-item > ul.sub-menu > li > a .menu-title-text { font: inherit !important; font-size: 11px !important; line-height: 1 !important; letter-spacing: inherit !important; text-transform: inherit !important; color: inherit !important; }
#header-outer #top li.nectar-megamenu-menu-item > ul.sub-menu > li > a .awse-num { color: var(--awse-red) !important; font-weight: 900 !important; letter-spacing: .04em !important; }
#header-outer li.nectar-megamenu-menu-item > ul.sub-menu > li > a::after { display: none !important; }
/* column links */
#header-outer li.nectar-megamenu-menu-item > ul.sub-menu > li > ul { display: block !important; position: static !important; width: auto !important; padding: 0 !important; margin: 0 !important; background: none !important; box-shadow: none !important; border: 0 !important; opacity: 1 !important; visibility: visible !important; transform: none !important; }
#header-outer li.nectar-megamenu-menu-item > ul.sub-menu > li > ul > li { float: none; margin: 0; padding: 0; }
#header-outer li.nectar-megamenu-menu-item > ul.sub-menu > li > ul > li > a { display: flex !important; align-items: center; gap: 12px; padding: 8px !important; margin: 0 -8px !important; border-radius: 6px; border: 0 !important; background: none !important; font: 700 14px/1.25 var(--awse-head) !important; letter-spacing: 0; text-transform: none; color: var(--awse-navy) !important; transition: background .2s; }
#header-outer li.nectar-megamenu-menu-item > ul.sub-menu > li > ul > li > a:hover { background: var(--awse-paper) !important; }
#header-outer #top li.nectar-megamenu-menu-item > ul.sub-menu > li > ul > li > a .menu-title-text, #header-outer #top li.nectar-megamenu-menu-item > ul.sub-menu > li > ul > li > ul > li > a .menu-title-text { font: inherit !important; color: inherit !important; text-transform: none !important; letter-spacing: 0 !important; }
#header-outer li.nectar-megamenu-menu-item > ul.sub-menu > li > ul > li > a img { width: 44px; height: 32px; object-fit: cover; border-radius: 4px; flex: 0 0 auto; margin: 0; }
/* a link with children inside a column (Build A Boat) reads as a sub-heading with its list under it */
#header-outer #top li.nectar-megamenu-menu-item > ul.sub-menu > li > ul > li.menu-item-has-children > a { font: 800 10px/1 var(--awse-head) !important; letter-spacing: .14em !important; text-transform: uppercase !important; color: var(--awse-muted) !important; margin: 14px -8px 4px !important; pointer-events: none; }
#header-outer #top li.nectar-megamenu-menu-item > ul.sub-menu > li > ul > li.menu-item-has-children > a .menu-title-text { font: inherit !important; font-size: 10px !important; line-height: 1 !important; letter-spacing: inherit !important; text-transform: inherit !important; color: inherit !important; }
#header-outer li.nectar-megamenu-menu-item > ul.sub-menu > li > ul > li.menu-item-has-children > a::after { display: none !important; }
#header-outer li.nectar-megamenu-menu-item > ul.sub-menu > li > ul > li > ul { display: block !important; position: static !important; width: auto !important; padding: 0 !important; margin: 0 !important; background: none !important; box-shadow: none !important; border: 0 !important; opacity: 1 !important; visibility: visible !important; }
#header-outer li.nectar-megamenu-menu-item > ul.sub-menu > li > ul > li > ul > li > a { display: block; padding: 8px !important; margin: 0 -8px !important; border-radius: 6px; font: 700 14px/1.25 var(--awse-head) !important; color: var(--awse-navy) !important; background: none !important; border: 0 !important; }
#header-outer li.nectar-megamenu-menu-item > ul.sub-menu > li > ul > li > ul > li > a:hover { background: var(--awse-paper) !important; }
/* "All inventory" style row: last link of column 03 when it says so */
#header-outer li.nectar-megamenu-menu-item > ul.sub-menu > li > ul > li.awse-all > a { margin-top: 14px !important; color: var(--awse-red) !important; font-size: 12px !important; letter-spacing: .06em; text-transform: uppercase; }
/* feature tile: a column whose heading link carries a menu image (5th column, optional) */
#header-outer li.nectar-megamenu-menu-item > ul.sub-menu > li.awse-feature > a { display: block !important; position: relative; height: 100%; min-height: 240px; margin: 0 !important; border-radius: 8px; overflow: hidden; background: var(--awse-navy) !important; color: #fff !important; pointer-events: auto; text-transform: none; letter-spacing: -.02em; font: 900 22px/1.1 var(--awse-head) !important; isolation: isolate; }
#header-outer li.nectar-megamenu-menu-item > ul.sub-menu > li.awse-feature > a img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; margin: 0; z-index: 0; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
#header-outer li.nectar-megamenu-menu-item > ul.sub-menu > li.awse-feature > a::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(10,30,47,.05) 30%, rgba(10,30,47,.9) 100%); }
#header-outer li.nectar-megamenu-menu-item > ul.sub-menu > li.awse-feature > a .menu-title-text { position: absolute; left: 20px; right: 20px; bottom: 18px; z-index: 2; }
#header-outer li.nectar-megamenu-menu-item > ul.sub-menu > li.awse-feature > a:hover img { transform: scale(1.04); }

/* ---------------------------------------------------------------- mobile (< 1000px) */
@media (max-width: 999px) {
	#header-outer #logo img { height: 40px; }
	/* Salient's hamburger stays as it is — no background (Aaron, Tue 9/8) */
	/* locations pin, injected by header.js beside the hamburger */
	.awse-mloc { display: grid; place-items: center; width: 36px; height: 36px; margin: 0 4px 0 0; padding: 0; border: 0; border-radius: 50%; background: #fff; color: var(--awse-navy); cursor: pointer; vertical-align: middle; box-shadow: 0 2px 10px rgba(10,30,47,.18); transition: background .25s, color .25s; }
	.awse-mloc.is-open { background: var(--awse-navy); color: #fff; }
	.awse-mloc svg { display: block; width: 20px; height: 20px; transition: transform .3s; }
	.awse-mloc:hover, .awse-mloc.is-open { color: var(--awse-red); background: none !important; }
	.awse-mloc-panel { position: absolute; left: 12px; right: 12px; top: calc(100% + 6px); z-index: 10000; background: #fff; border-radius: var(--awse-radius); padding: 14px 18px 12px; box-shadow: var(--awse-panel-shadow); font-family: var(--awse-body); animation: awse-in .25s cubic-bezier(.2,.7,.2,1); }
	.awse-mloc-panel[hidden] { display: none; }
	.awse-mloc-panel .awse-mloc-head { display: block; font: 800 11px/1 var(--awse-head); letter-spacing: .16em; text-transform: uppercase; color: var(--awse-muted); margin-bottom: 6px; }
	.awse-mloc-panel a { display: grid; gap: 1px; padding: 9px 0; border-top: 1px solid var(--awse-line); text-decoration: none; color: var(--awse-navy) !important; }
	.awse-mloc-panel a strong { font: 700 14px/1.2 var(--awse-head); }
	.awse-mloc-panel a span { font: 600 12px/1.3 var(--awse-body); color: var(--awse-red); }
	@keyframes awse-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
}
@media (min-width: 1000px) { .awse-mloc, .awse-mloc-panel { display: none !important; } }

/* ---------------------------------------------------------------- off-canvas menu (phones) */
/* Salient fullscreen-alt: centered, 16px link padding + 8px per item + 84/30px wrapper padding. Tightened, left-aligned. */
#slide-out-widget-area.fullscreen-alt, #slide-out-widget-area.fullscreen-alt .inner-wrap, #slide-out-widget-area.fullscreen-alt .inner { background-color: var(--awse-navy) !important; }
#slide-out-widget-area.fullscreen-alt .inner-wrap { padding-top: 72px !important; }
#slide-out-widget-area.fullscreen-alt .inner { padding: 8px 0 !important; }
#slide-out-widget-area.fullscreen-alt .off-canvas-menu-container { padding: 0 24px !important; }
#slide-out-widget-area.fullscreen-alt .menu-wrap, #slide-out-widget-area.fullscreen-alt ul.menu, #slide-out-widget-area.fullscreen-alt ul.menu li { text-align: left !important; }
#slide-out-widget-area.fullscreen-alt ul.menu > li { margin: 0 !important; padding: 0 !important; border-bottom: 1px solid rgba(255,255,255,.12); }
#slide-out-widget-area.fullscreen-alt ul.menu > li > a { display: flex !important; align-items: center; justify-content: space-between; width: 100%; font: 900 20px/1.15 var(--awse-head) !important; color: #fff !important; letter-spacing: -.01em; padding: 12px 0 !important; margin: 0 !important; border: 0 !important; }
#slide-out-widget-area.fullscreen-alt ul.menu > li > a .menu-title-text { font: inherit !important; color: inherit !important; }
#slide-out-widget-area.fullscreen-alt ul.menu ul.sub-menu { padding: 0 0 10px !important; margin: 0 !important; }
#slide-out-widget-area.fullscreen-alt ul.menu ul.sub-menu li { margin: 0 !important; padding: 0 !important; }
#slide-out-widget-area.fullscreen-alt ul.menu ul.sub-menu li a { display: block; font: 600 15px/1.3 var(--awse-body) !important; color: rgba(255,255,255,.92) !important; padding: 7px 0 !important; margin: 0 !important; }
#slide-out-widget-area.fullscreen-alt ul.menu ul.sub-menu li.menu-item-has-children > a { font: 800 10px/1 var(--awse-head) !important; letter-spacing: .14em; text-transform: uppercase; color: var(--awse-ice) !important; margin-top: 10px !important; }
#slide-out-widget-area.fullscreen-alt ul.menu ul.sub-menu li.menu-item-has-children > a .menu-title-text { font: inherit !important; color: inherit !important; }
#slide-out-widget-area.fullscreen-alt a[href^="tel:"] .awse-tel { color: var(--awse-ice); }
#slide-out-widget-area.fullscreen-alt .bottom-meta-wrap, #slide-out-widget-area.fullscreen-alt .widget { text-align: left !important; }
