/**
 * Guardian Menu — desktop horizontal nav + Fleets mega menu
 *
 * Visible ≥992px. Hamburger (.nav-toggle) hidden on desktop.
 */

/* ----- Breakpoint: desktop nav on, hamburger off ----- */
.gfs-desktop-nav {
	display: none;
}

@media (min-width: 992px) {
	.gfs-desktop-nav {
		display: block;
	}

	/* Hide floating hamburger on desktop */
	.nav-toggle,
	a.nav-toggle,
	#hamburger-icon {
		display: none !important;
	}

	/*
	 * Header HTML module lives in a narrow right column (with the drawer).
	 * Pull the desktop nav into the logo row as a full-width overlay bar
	 * so links sit like a normal primary nav (mockup).
	 */
	.fl-node-6stbejlpnz7i,
	.fl-module-html:has(.gfs-desktop-nav) {
		position: static;
	}

	.fl-builder-content .fl-row:has(.gfs-desktop-nav),
	.fl-builder-content .fl-col:has(.gfs-desktop-nav),
	.fl-builder-content .fl-col-content:has(.gfs-desktop-nav) {
		position: static;
	}

	/* Position nav in the header logo row, right-aligned */
	.fl-row:has(.gfs-desktop-nav) {
		position: relative;
	}

	.gfs-desktop-nav {
		position: absolute;
		right: 120px; /* leave room for CTAs / modal if present */
		top: 0;
		bottom: 0;
		display: flex;
		align-items: center;
		z-index: 40;
		max-width: calc(100% - 280px);
		/* No transform here — it would become the mega panel's containing block
		   and push 100vw positioning off the right edge of the page. */
	}

	/* Mega panel: full viewport width, content-centered inner */
	.gfs-desktop-nav__item--fleets {
		position: static;
	}
}

@media (max-width: 991px) {
	.gfs-desktop-nav {
		display: none !important;
	}
}

/* ----- Bar ----- */
.gfs-desktop-nav__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end;
	gap: 4px 8px;
	list-style: none;
	margin: 0;
	padding: 0;
	font-family: eurostile, sans-serif;
}

.gfs-desktop-nav__item {
	position: relative;
	margin: 0;
	padding: 0;
	list-style: none;
}

.gfs-desktop-nav__link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 10px 12px;
	/* Header bar is dark (#000) — white labels by default */
	color: #ffffff !important;
	text-decoration: none !important;
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0.02em;
	text-transform: none !important;
	line-height: 1.2;
	background: none;
	border: 0;
	cursor: pointer;
	font-family: inherit;
	white-space: nowrap;
	transition: color 150ms ease;
}

.gfs-desktop-nav__link:hover,
.gfs-desktop-nav__link:focus,
.gfs-desktop-nav__item.is-open > .gfs-desktop-nav__link,
.gfs-desktop-nav__item.is-open > .gfs-desktop-nav__dropdown-trigger .gfs-desktop-nav__link {
	color: #ed1c24 !important;
	outline: none;
}

.gfs-desktop-nav__caret {
	display: inline-block;
	width: 7px;
	height: 7px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	margin-top: -4px;
	transition: transform 200ms ease;
}

.gfs-desktop-nav__item.is-open .gfs-desktop-nav__caret {
	transform: rotate(225deg);
	margin-top: 2px;
}

.gfs-desktop-nav__dropdown-trigger {
	display: inline-flex;
	align-items: center;
}

.gfs-desktop-nav__caret-btn {
	appearance: none;
	background: none;
	border: 0;
	padding: 8px 6px 8px 0;
	cursor: pointer;
	color: #ffffff;
	display: inline-flex;
	align-items: center;
}

/* ----- Services small dropdown ----- */
.gfs-desktop-nav__dropdown {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 240px;
	margin: 0;
	padding: 10px 0;
	list-style: none;
	background: #ffffff;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
	z-index: 1000;
	border-radius: 0;
}

.gfs-desktop-nav__dropdown[hidden] {
	display: none !important;
}

.gfs-desktop-nav__dropdown-item a {
	display: block;
	padding: 10px 18px;
	color: #1c1c1e !important;
	text-decoration: none !important;
	font-size: 14px;
	font-weight: 400;
	text-transform: none !important;
	white-space: nowrap;
}

.gfs-desktop-nav__dropdown-item a:hover,
.gfs-desktop-nav__dropdown-item a:focus {
	color: #ed1c24 !important;
	background: rgba(0, 0, 0, 0.04);
}

/* ----- Fleets mega: max 1400px, 20px side margins, slight drop shadow ----- */
.gfs-desktop-nav__mega {
	position: fixed;
	left: 50%;
	right: auto;
	width: calc(100% - 40px);
	max-width: 1400px;
	top: var(--gfs-mega-top, 120px);
	margin: 0;
	transform: translateX(-50%);
	background: #ffffff;
	box-shadow: 0 10px 32px rgba(0, 0, 0, 0.18);
	z-index: 999;
	padding: 28px 0 32px;
	box-sizing: border-box;
	overflow-x: hidden;
}

.gfs-desktop-nav__mega[hidden] {
	display: none !important;
}

.gfs-desktop-nav__mega-inner {
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0 28px;
	box-sizing: border-box;
}

.gfs-desktop-nav__mega-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
	gap: 20px 24px;
	align-items: start;
}

.gfs-desktop-nav__mega-heading {
	margin: 0 0 10px;
	padding: 0;
	color: #ed1c24 !important;
	font-size: 12px !important;
	font-weight: 800 !important;
	letter-spacing: 0.08em;
	text-transform: uppercase !important;
	line-height: 1.3 !important;
	font-family: eurostile, sans-serif !important;
}

.gfs-desktop-nav__mega-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.gfs-desktop-nav__mega-list li {
	margin: 0 0 8px;
	padding: 0;
}

.gfs-desktop-nav__mega-list a {
	color: #1c1c1e !important;
	text-decoration: none !important;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.35;
	text-transform: none !important;
	transition: color 120ms ease;
}

.gfs-desktop-nav__mega-list a:hover,
.gfs-desktop-nav__mega-list a:focus {
	color: #ed1c24 !important;
}

/* Soft open animation when not using [hidden] mid-transition */
.gfs-desktop-nav__mega.is-animating,
.gfs-desktop-nav__dropdown.is-animating {
	display: block !important;
}

@media (min-width: 1200px) {
	.gfs-desktop-nav__mega-grid {
		grid-template-columns: repeat(7, minmax(0, 1fr));
	}
}
