/**
 * SOS New Nav — Figma "New" header style + mobile full-screen sheet
 * Colors / type from Sources of Strength Sitemap (NEW)
 */

/*
 * Beaver Themer previously used a separate logo+menu row only on medium/mobile
 * (node 6086e3130d157). That row is marked fl-visible-never in layout data so the
 * shortcode can own all breakpoints — hide it hard so the old hamburger never wins.
 */
.fl-builder-content-52 .fl-node-6086e3130d157,
.fl-visible-never {
	display: none !important;
}

/* Close control for the Zeffy donation popup (their script has no visible X). */
#sos-zeffy-close {
	display: none;
	position: fixed;
	top: max(12px, env(safe-area-inset-top, 0px));
	right: max(12px, env(safe-area-inset-right, 0px));
	z-index: 10070;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	margin: 0;
	border: 0;
	border-radius: 999px;
	background: #fff;
	color: #2b2140;
	font: 700 28px/1 Lato, "Helvetica Neue", Helvetica, Arial, sans-serif;
	cursor: pointer;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.28);
}

#sos-zeffy-close.is-open {
	display: flex;
}

#sos-zeffy-close:hover,
#sos-zeffy-close:focus-visible {
	background: #f3eef8;
}

.sos-new-nav {
	--sos-nav-crisis-bg: #6b6b6b;
	--sos-nav-pill-bg: rgba(0, 0, 0, 0.34);
	--sos-nav-cta-from: #47bbcd;
	--sos-nav-cta-to: #8765ab;
	--sos-nav-dropdown: #7a5f9d;
	--sos-nav-dropdown-hover: #5d3f83;
	--sos-nav-sheet-from: #3d2759;
	--sos-nav-sheet-to: #6b4d94;
	--sos-nav-text: #ffffff;
	--sos-nav-font: Lato, "Helvetica Neue", Helvetica, Arial, sans-serif;
	--sos-nav-radius-pill: 120px;
	--sos-nav-radius-menu: 16px;
	--sos-nav-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
	--sos-nav-gap: 1.1rem;
	--sos-nav-z: 10050;

	position: relative;
	z-index: var(--sos-nav-z);
	width: 100%;
	font-family: var(--sos-nav-font);
	color: var(--sos-nav-text);
	box-sizing: border-box;
}

.sos-new-nav *,
.sos-new-nav *::before,
.sos-new-nav *::after {
	box-sizing: border-box;
}

.sos-new-nav a {
	color: inherit;
	text-decoration: none;
}

.sos-new-nav button {
	font: inherit;
	color: inherit;
	background: none;
	border: 0;
	padding: 0;
	cursor: pointer;
}

/* —— Crisis bar —— */
.sos-new-nav__crisis {
	background: var(--sos-nav-crisis-bg);
	padding: 8px 20px;
	text-align: center;
}

.sos-new-nav__crisis-text {
	margin: 0;
	font-family: var(--sos-nav-font);
	font-weight: 700;
	font-size: 14px;
	line-height: 22px;
	letter-spacing: 1.4px;
	color: var(--sos-nav-text);
}

.sos-new-nav__crisis-link {
	color: var(--sos-nav-text);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.sos-new-nav__crisis-link:hover,
.sos-new-nav__crisis-link:focus-visible {
	opacity: 0.9;
}

/* —— Main bar —— */
.sos-new-nav__bar {
	position: relative;
	background: transparent;
}

.sos-new-nav__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	width: 100%;
	max-width: 1600px;
	margin: 0 auto;
	padding: 18px 22px;
}

.sos-new-nav__logo {
	display: flex;
	align-items: center;
	flex: 0 0 auto;
	max-width: min(239px, 42vw);
	z-index: 2;
}

.sos-new-nav__logo img {
	display: block;
	width: 100%;
	height: auto;
	max-height: 69px;
	object-fit: contain;
}

.sos-new-nav__logo-text {
	font-weight: 700;
	font-size: 1.1rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

/* —— Panel shell (desktop: inline; mobile: full-screen sheet) —— */
.sos-new-nav__panel {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex: 1 1 auto;
	gap: 1rem;
	min-width: 0;
}

.sos-new-nav__sheet {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex: 1 1 auto;
	gap: 1rem;
	min-width: 0;
	width: 100%;
}

.sos-new-nav__sheet-body {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex: 0 1 auto;
	min-width: 0;
}

.sos-new-nav__sheet-footer {
	display: none;
}

/* Sheet head / close — mobile only (hidden on desktop) */
.sos-new-nav__sheet-head {
	display: none;
}

.sos-new-nav__close {
	display: none;
}

.sos-new-nav__backdrop {
	display: none;
}

/* —— Main zones: primary | spacer | Donate | spacer | utility —— */
.sos-new-nav__nav {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex-wrap: wrap;
	gap: 0;
	width: 100%;
}

.sos-new-nav__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.sos-new-nav__spacer {
	display: block;
	flex: 0 0 auto;
	width: clamp(8px, 1vw, 16px);
	height: 1px;
}

.sos-new-nav__list--primary.sos-new-nav__list--level-0 {
	display: flex;
	align-items: center;
	gap: var(--sos-nav-gap);
	background: var(--sos-nav-pill-bg);
	border-radius: var(--sos-nav-radius-pill);
	padding: 14px 18px;
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}

.sos-new-nav__list--cta.sos-new-nav__list--level-0 {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	background: transparent;
	padding: 0;
	border-radius: 0;
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
}

.sos-new-nav__list--utility.sos-new-nav__list--level-0 {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	background: var(--sos-nav-pill-bg);
	border-radius: var(--sos-nav-radius-pill);
	padding: 12px 16px;
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}

/* Login | Contact Us (or My Resources | Contact Us) */
.sos-new-nav__list--utility > .sos-new-nav__item:not(:first-child) {
	display: flex;
	align-items: center;
	gap: 0.75rem;
}

.sos-new-nav__list--utility > .sos-new-nav__item:not(:first-child)::before {
	content: "|";
	font-weight: 400;
	font-size: 14px;
	letter-spacing: 0;
	opacity: 0.45;
	color: var(--sos-nav-text);
	line-height: 1;
	speak: never;
}

.sos-new-nav__list--level-0:not(.sos-new-nav__list--primary):not(.sos-new-nav__list--cta):not(.sos-new-nav__list--utility) {
	display: flex;
	align-items: center;
	gap: var(--sos-nav-gap);
	background: var(--sos-nav-pill-bg);
	border-radius: var(--sos-nav-radius-pill);
	padding: 14px 18px;
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}

.sos-new-nav__item {
	position: relative;
	margin: 0;
	list-style: none;
}

/* Top-level links */
.sos-new-nav__item--level-0 > .sos-new-nav__link {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	font-weight: 700;
	font-size: 15px;
	line-height: 1.2;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	white-space: nowrap;
	color: var(--sos-nav-text);
	transition: opacity 0.15s ease;
}

.sos-new-nav__item--level-0 > .sos-new-nav__link:hover,
.sos-new-nav__item--level-0 > .sos-new-nav__link:focus-visible,
.sos-new-nav__item--level-0.is-open > .sos-new-nav__link {
	opacity: 0.88;
}

/* Donate accent */
.sos-new-nav__item--cta > .sos-new-nav__link--cta,
.sos-new-nav__link--cta {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: 9px;
	min-height: 44px;
	padding: 12px 22px !important;
	border-radius: var(--sos-nav-radius-pill);
	background: linear-gradient(90deg, #5ec8d8 0%, var(--sos-nav-cta-from) 55%, #3aa8bc 100%) !important;
	border: 0 !important;
	font-weight: 700;
	font-size: 15px;
	line-height: 1.2;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	white-space: nowrap;
	color: #fff !important;
	opacity: 1 !important;
	box-shadow: 0 4px 14px rgba(71, 187, 205, 0.35);
	transition: filter 0.15s ease, box-shadow 0.15s ease;
}

.sos-new-nav__item--cta > .sos-new-nav__link--cta:hover,
.sos-new-nav__item--cta > .sos-new-nav__link--cta:focus-visible {
	filter: brightness(1.06);
	opacity: 1 !important;
	box-shadow: 0 6px 18px rgba(71, 187, 205, 0.45);
}

.sos-new-nav__chevron {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 16px;
	height: 16px;
	flex: 0 0 auto;
	color: currentColor;
	transition: transform 0.22s ease;
}

.sos-new-nav__chevron svg {
	display: block;
	width: 100%;
	height: 100%;
}

.sos-new-nav__item--level-0 > .sos-new-nav__link .sos-new-nav__chevron {
	width: 18px;
	height: 18px;
}

.sos-new-nav__chevron--right {
	transform: rotate(-90deg);
}

.sos-new-nav__item.is-open > .sos-new-nav__link .sos-new-nav__chevron--down {
	transform: rotate(180deg);
}

/* Legacy unused CTA class kept harmless */
.sos-new-nav__cta {
	display: none;
	font-weight: 700;
	font-size: 17px;
	line-height: 1.2;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	white-space: nowrap;
	color: var(--sos-nav-text) !important;
	box-shadow: none;
	transition: filter 0.15s ease, transform 0.15s ease;
}

.sos-new-nav__cta:hover,
.sos-new-nav__cta:focus-visible {
	filter: brightness(1.06);
	color: var(--sos-nav-text) !important;
}

/* —— Dropdowns (level 1+) —— */
.sos-new-nav__submenu {
	list-style: none;
	margin: 0;
	padding: 4px;
	min-width: 249px;
	background: var(--sos-nav-dropdown);
	border-radius: var(--sos-nav-radius-menu);
	box-shadow: var(--sos-nav-shadow);
	overflow: visible;
}

/* Desktop flyouts */
@media (min-width: 992px) {
	.sos-new-nav__backdrop {
		display: none !important;
	}

	.sos-new-nav__submenu {
		position: absolute;
		top: calc(100% + 14px);
		left: 50%;
		transform: translateX(-50%);
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transition: opacity 0.15s ease, visibility 0.15s ease;
		z-index: 20;
	}

	.sos-new-nav__submenu .sos-new-nav__submenu {
		top: -4px;
		left: calc(100% - 8px);
		transform: none;
	}

	.sos-new-nav__item.is-open > .sos-new-nav__submenu,
	.sos-new-nav__item:hover > .sos-new-nav__submenu,
	.sos-new-nav__item:focus-within > .sos-new-nav__submenu {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
	}

	.sos-new-nav__item--level-0 > .sos-new-nav__submenu::before {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		top: -16px;
		height: 16px;
	}

	.sos-new-nav__item--has-children:not(.sos-new-nav__item--level-0) > .sos-new-nav__submenu::before {
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		left: -12px;
		width: 12px;
	}
}

/* Submenu link rows */
.sos-new-nav__item:not(.sos-new-nav__item--level-0) > .sos-new-nav__link {
	position: relative;
	display: flex;
	align-items: flex-start;
	gap: 10px;
	width: 100%;
	padding: 20px 16px;
	font-weight: 700;
	font-size: 11px;
	line-height: 1.25;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--sos-nav-text);
	text-align: left;
	border-radius: 12px;
	transition: background-color 0.12s ease;
}

.sos-new-nav__item:not(.sos-new-nav__item--level-0) > .sos-new-nav__link .sos-new-nav__link-label {
	flex: 1 1 auto;
	min-width: 0;
	word-break: break-word;
}

.sos-new-nav__item:not(.sos-new-nav__item--level-0) > .sos-new-nav__link .sos-new-nav__chevron {
	position: absolute;
	right: 12px;
	top: 50%;
	margin-top: -8px;
	opacity: 0.95;
}

.sos-new-nav__item:not(.sos-new-nav__item--level-0) > .sos-new-nav__link:hover,
.sos-new-nav__item:not(.sos-new-nav__item--level-0) > .sos-new-nav__link:focus-visible,
.sos-new-nav__item:not(.sos-new-nav__item--level-0).is-open > .sos-new-nav__link,
.sos-new-nav__item:not(.sos-new-nav__item--level-0):hover > .sos-new-nav__link {
	background: var(--sos-nav-dropdown-hover);
}

/* —— Mobile toggle —— */
.sos-new-nav__toggle {
	display: none;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: 999px;
	background: var(--sos-nav-pill-bg);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	z-index: 4;
	transition: background 0.2s ease, transform 0.2s ease;
}

.sos-new-nav__toggle:active {
	transform: scale(0.96);
}

.sos-new-nav__toggle-box {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	width: 20px;
}

.sos-new-nav__toggle-bar {
	display: block;
	height: 2px;
	width: 100%;
	background: #fff;
	border-radius: 2px;
	transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s ease;
	transform-origin: center;
}

.sos-new-nav.is-mobile-open .sos-new-nav__toggle {
	background: rgba(255, 255, 255, 0.18);
}

.sos-new-nav.is-mobile-open .sos-new-nav__toggle-bar:nth-child(1) {
	transform: translateY(7px) rotate(45deg);
}

.sos-new-nav.is-mobile-open .sos-new-nav__toggle-bar:nth-child(2) {
	opacity: 0;
	transform: scaleX(0);
}

.sos-new-nav.is-mobile-open .sos-new-nav__toggle-bar:nth-child(3) {
	transform: translateY(-7px) rotate(-45deg);
}

/* Screen reader helper if theme doesn't provide one */
.sos-new-nav .screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

/* Body scroll lock while mobile sheet is open */
html.sos-new-nav-lock,
html.sos-new-nav-lock body {
	overflow: hidden !important;
	touch-action: none;
}

/* —— Mobile layout: immersive full-screen sheet —— */
@media (max-width: 991.98px) {
	/*
	 * BB rows/cols often use overflow/transform that trap position:fixed
	 * and shrink children to the column width (~half). Force full bleed.
	 */
	.fl-builder-content-52,
	.fl-builder-content-52 .fl-row,
	.fl-builder-content-52 .fl-row-content-wrap,
	.fl-builder-content-52 .fl-row-content,
	.fl-builder-content-52 .fl-col-group,
	.fl-builder-content-52 .fl-col,
	.fl-builder-content-52 .fl-col-content,
	.fl-builder-content-52 .fl-module,
	.fl-builder-content-52 .fl-module-content,
	.fl-builder-content-52 .fl-html {
		overflow: visible !important;
		transform: none !important;
		filter: none !important;
		perspective: none !important;
		contain: none !important;
		max-width: none !important;
	}

	.fl-builder-content-52 .fl-col,
	.fl-builder-content-52 .fl-col-group,
	.fl-builder-content-52 .fl-module,
	.fl-builder-content-52 .fl-html {
		width: 100% !important;
		float: none !important;
		flex: 1 1 100% !important;
	}

	/*
	 * Stacking inside .sos-new-nav (site z-index is already high):
	 *   backdrop  → 1  (dim page, UNDER the sheet)
	 *   bar/panel → 2  (menu is interactive)
	 * Backdrop used to sit above the sheet because it was a sibling of
	 * .sos-new-nav__bar while the panel lived *inside* the bar's stacking context.
	 */
	.sos-new-nav {
		width: 100% !important;
		max-width: none !important;
	}

	/* Hamburger: open only (hidden while sheet is open — Close is the single control) */
	.sos-new-nav__toggle {
		display: inline-flex !important;
		flex: 0 0 auto;
		position: relative;
		z-index: 2;
		width: 48px;
		height: 48px;
		background: rgba(0, 0, 0, 0.45);
		border: 1px solid rgba(255, 255, 255, 0.35);
		box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
	}

	.sos-new-nav.is-mobile-open .sos-new-nav__toggle {
		/* Single close control lives in the sheet head */
		visibility: hidden;
		pointer-events: none;
	}

	.sos-new-nav__inner {
		width: 100% !important;
		max-width: none !important;
		position: relative;
		z-index: 2;
	}

	.sos-new-nav__bar {
		position: relative;
		z-index: 2;
		width: 100% !important;
	}

	.sos-new-nav.is-mobile-open .sos-new-nav__bar,
	.sos-new-nav.is-mobile-open .sos-new-nav__crisis {
		position: relative;
		z-index: 2;
	}

	/* Dimmed backdrop — MUST stay under the panel */
	.sos-new-nav__backdrop {
		display: block;
		position: fixed;
		top: 0;
		left: 0;
		width: 100vw;
		height: 100dvh;
		height: 100vh;
		z-index: 1;
		background: rgba(20, 10, 35, 0.55);
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transition: opacity 0.28s ease, visibility 0.28s ease;
	}

	.sos-new-nav.is-mobile-open .sos-new-nav__backdrop {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
	}

	/*
	 * Full-viewport sheet. Use 100vw + left:0 so we escape BB columns
	 * that would otherwise make the menu look ~half width.
	 * z-index 2 keeps it above the backdrop (1) inside this component.
	 */
	.sos-new-nav__panel {
		position: fixed !important;
		top: 0 !important;
		left: 0 !important;
		right: auto !important;
		bottom: auto !important;
		width: 100vw !important;
		max-width: 100vw !important;
		height: 100dvh !important;
		height: 100vh !important;
		margin: 0 !important;
		z-index: 2;
		display: flex !important;
		flex-direction: column;
		align-items: stretch;
		justify-content: flex-start;
		padding: 0;
		padding-top: var(--sos-nav-sheet-top, 100px);
		box-sizing: border-box;
		background: linear-gradient(
			165deg,
			var(--sos-nav-sheet-from) 0%,
			var(--sos-nav-dropdown) 48%,
			var(--sos-nav-sheet-to) 100%
		);
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transform: translateY(12px);
		transition:
			opacity 0.28s ease,
			visibility 0.28s ease,
			transform 0.32s cubic-bezier(0.22, 1, 0.36, 1);
	}

	.sos-new-nav.is-mobile-open .sos-new-nav__panel {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		transform: translateY(0);
	}

	.sos-new-nav__sheet {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		justify-content: flex-start;
		flex: 1 1 auto;
		min-height: 0;
		width: 100% !important;
		max-width: none !important;
		gap: 0;
		padding: 0;
		box-sizing: border-box;
	}

	/* In-sheet close row */
	.sos-new-nav__sheet-head {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		flex: 0 0 auto;
		width: 100%;
		padding: 8px 16px 4px;
		box-sizing: border-box;
	}

	.sos-new-nav__sheet-title {
		font-weight: 700;
		font-size: 13px;
		letter-spacing: 0.18em;
		text-transform: uppercase;
		opacity: 0.75;
	}

	.sos-new-nav__close {
		display: inline-flex !important;
		align-items: center;
		justify-content: center;
		gap: 8px;
		flex: 0 0 auto;
		min-height: 44px;
		padding: 10px 16px;
		border-radius: 999px;
		background: rgba(0, 0, 0, 0.35);
		border: 1px solid rgba(255, 255, 255, 0.4);
		color: #fff !important;
		font-weight: 700;
		font-size: 13px;
		letter-spacing: 0.12em;
		text-transform: uppercase;
		cursor: pointer;
		box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
	}

	.sos-new-nav__close:hover,
	.sos-new-nav__close:focus-visible {
		background: rgba(0, 0, 0, 0.5);
		border-color: rgba(255, 255, 255, 0.6);
	}

	.sos-new-nav__close-icon {
		display: inline-flex;
		line-height: 0;
	}

	.sos-new-nav__close-label {
		line-height: 1;
	}

	.sos-new-nav__sheet-body {
		display: block;
		flex: 1 1 auto;
		min-height: 0;
		width: 100% !important;
		max-width: none !important;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		overscroll-behavior: contain;
		padding: 8px 16px 24px;
		box-sizing: border-box;
	}

	.sos-new-nav__sheet-footer {
		display: none;
	}

	.sos-new-nav__nav,
	.sos-new-nav__list,
	.sos-new-nav__item {
		width: 100% !important;
		max-width: none !important;
		box-sizing: border-box;
	}

	.sos-new-nav__nav {
		flex-direction: column;
		align-items: stretch;
		gap: 8px;
	}

	.sos-new-nav__spacer {
		display: block;
		width: 100%;
		height: 1px;
		margin: 8px 0;
		background: rgba(255, 255, 255, 0.18);
	}

	/* Stacked on mobile — no inline pipe between utility items */
	.sos-new-nav__list--utility > .sos-new-nav__item:not(:first-child) {
		display: block;
		gap: 0;
	}

	.sos-new-nav__list--utility > .sos-new-nav__item:not(:first-child)::before {
		content: none;
	}

	/* Top-level: large, full-width rows */
	.sos-new-nav__list--level-0,
	.sos-new-nav__list--primary.sos-new-nav__list--level-0,
	.sos-new-nav__list--cta.sos-new-nav__list--level-0,
	.sos-new-nav__list--utility.sos-new-nav__list--level-0 {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 6px;
		padding: 0;
		margin: 0;
		border-radius: 0;
		background: transparent;
		backdrop-filter: none;
		-webkit-backdrop-filter: none;
		width: 100% !important;
	}

	.sos-new-nav__item--level-0 > .sos-new-nav__link {
		display: flex;
		width: 100% !important;
		max-width: none !important;
		justify-content: space-between;
		align-items: center;
		padding: 18px 16px;
		font-size: 18px;
		letter-spacing: 0.12em;
		border-radius: 14px;
		background: rgba(255, 255, 255, 0.06);
		border: 1px solid rgba(255, 255, 255, 0.08);
		opacity: 1;
		box-sizing: border-box;
		transition: background 0.15s ease, border-color 0.15s ease;
	}

	.sos-new-nav__item--level-0 > .sos-new-nav__link--cta {
		justify-content: center;
		padding: 18px 16px !important;
	}

	.sos-new-nav__item--level-0 > .sos-new-nav__link:hover,
	.sos-new-nav__item--level-0 > .sos-new-nav__link:focus-visible,
	.sos-new-nav__item--level-0.is-open > .sos-new-nav__link {
		background: rgba(255, 255, 255, 0.12);
		border-color: rgba(255, 255, 255, 0.16);
		opacity: 1;
	}

	.sos-new-nav__item--level-0 > .sos-new-nav__link .sos-new-nav__chevron {
		width: 22px;
		height: 22px;
		opacity: 0.9;
	}

	/* Purple accordion panels (match desktop dropdowns) */
	.sos-new-nav__submenu {
		position: static;
		transform: none;
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		display: none;
		margin: 8px 0 10px;
		min-width: 0;
		width: 100%;
		padding: 6px;
		background: var(--sos-nav-dropdown);
		border-radius: var(--sos-nav-radius-menu);
		box-shadow: var(--sos-nav-shadow);
		overflow: hidden;
	}

	.sos-new-nav__item.is-open > .sos-new-nav__submenu {
		display: block;
		animation: sos-nav-submenu-in 0.22s ease;
	}

	/* Nested level sits slightly inset / deeper purple */
	.sos-new-nav__submenu .sos-new-nav__submenu {
		margin: 4px 0 6px;
		background: var(--sos-nav-dropdown-hover);
		box-shadow: none;
	}

	/* Nested chevrons point down on mobile accordion */
	.sos-new-nav__chevron--right {
		transform: rotate(0deg);
	}

	.sos-new-nav__item.is-open > .sos-new-nav__link .sos-new-nav__chevron--right {
		transform: rotate(180deg);
	}

	.sos-new-nav__item:not(.sos-new-nav__item--level-0) > .sos-new-nav__link {
		align-items: center;
		padding: 16px 14px;
		font-size: 12px;
		letter-spacing: 0.16em;
	}

	.sos-new-nav__item:not(.sos-new-nav__item--level-0) > .sos-new-nav__link .sos-new-nav__chevron {
		position: static;
		margin-top: 0;
		margin-left: 8px;
	}

	.sos-new-nav__cta {
		width: 100%;
		min-width: 0;
		padding: 18px 28px;
		font-size: 16px;
		text-align: center;
		box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
	}

	.sos-new-nav__cta:active {
		transform: scale(0.99);
	}

	.sos-new-nav__crisis-text {
		font-size: 12px;
		letter-spacing: 0.8px;
		line-height: 1.4;
	}
}

@keyframes sos-nav-submenu-in {
	from {
		opacity: 0;
		transform: translateY(-4px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* Optional utility: solid bar variant when not over a hero */
.sos-new-nav--solid .sos-new-nav__bar {
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.45) 0%, rgba(0, 0, 0, 0.15) 100%);
}