.zd-topbar,
.zd-banner {
	--zd-navy: #07214d;
	--zd-yellow: #ffd200;
	--zd-flag: linear-gradient(90deg, #0046ae 33.33%, var(--zd-yellow) 33.33% 66.66%, #cc092f 66.66%);
}

.nec-gl-row {
	display: none !important;
}

.zd-topbar {
	position: relative;
	color: #fff;
	background-color: var(--zd-navy);
	box-shadow: inset 0 2px 0 #fff;
	background-image: var(--zd-flag);
	background-size: 100% 3px;
	background-position: bottom;
	background-repeat: no-repeat;
}

.zd-topbar[hidden] {
	display: none;
}

/* The topbar renders right under the nav, later in the DOM. Without an explicit
   z-index the open nav dropdown (position:absolute, z-index auto) paints BENEATH
   the topbar — the yellow CTA covers the submenu. Lift the dropdown above it. */
.header .header-nav .header-nav__list .nav-list__item .submenu {
	z-index: 20;
}

/* .zd-topbar prefix keeps specificity above style.min.css's generic
   [class*="__container"] { padding: 0 15px } which strips the vertical padding. */
.zd-topbar .zd-topbar__container {
	max-width: 1290px;
	margin: 0 auto;
	padding: 8px 15px 10px; /* extra 1px bottom clears the 3px flag stripe */
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}

.zd-topbar__link {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	color: #fff;
	text-decoration: none;
	min-width: 0;
	transition: opacity 0.15s ease;
}

.zd-topbar__link:hover {
	opacity: 0.9;
}

.zd-topbar__plane {
	flex: 0 0 auto;
	color: var(--zd-yellow);
}

.zd-topbar__text {
	font-size: 14px;
	font-weight: 600;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.zd-topbar__actions {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 14px;
}

.zd-topbar__cta {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	font-weight: 700;
	color: var(--zd-navy);
	background: var(--zd-yellow);
	padding: 5px 14px;
	border-radius: 999px;
	white-space: nowrap;
	text-decoration: none;
	transition: filter 0.15s ease;
}

.zd-topbar__cta:hover {
	filter: brightness(0.95);
}

.zd-topbar__cta .icon-arrow-right {
	font-size: 11px;
}

.zd-topbar__close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: rgba(255, 255, 255, 0.7);
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease;
}

.zd-topbar__close:hover,
.zd-topbar__close:focus-visible {
	background: rgba(255, 255, 255, 0.15);
	color: #fff;
	outline: none;
}

@media (max-width: 600px) {
	.zd-topbar__cta {
		display: none;
	}

	.zd-topbar__text {
		font-size: 13px;
	}
}

.zd-banner {
	margin: 40px 0;
	padding: 0 15px;
}

.zd-banner__card {
	position: relative;
	max-width: 1290px;
	margin: 0 auto;
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 8px 24px rgba(7, 33, 77, 0.12);
}

.zd-banner__stripe {
	display: block;
	height: 4px;
	background: var(--zd-flag);
}

.zd-banner__body {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 28px;
	padding: 34px 40px;
	min-height: 150px;
	color: #fff;
	text-decoration: none;
	background-image:
		linear-gradient(90deg, var(--zd-navy) 0%, var(--zd-navy) 36%, rgba(7, 33, 77, 0.82) 56%, rgba(7, 33, 77, 0.35) 100%),
		var(--zd-banner-bg);
	background-size: cover, cover;
	background-position: center, right center;
	background-repeat: no-repeat, no-repeat;
	background-color: var(--zd-navy);
	transition: transform 0.2s ease;
}

.zd-banner__card:hover .zd-banner__body {
	transform: translateY(-1px);
}

.zd-banner__text {
	position: relative;
	z-index: 1;
	flex: 1 1 auto;
	min-width: 0;
}

.zd-banner__eyebrow {
	display: inline-block;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	color: var(--zd-yellow);
	margin-bottom: 6px;
}

.zd-banner__heading {
	margin: 0 0 8px;
	font-size: 1.6rem !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	color: #fff;
	text-shadow: 0 1px 12px rgba(7, 33, 77, 0.45);
}

.zd-banner__subtext {
	margin: 0;
	font-size: 15px;
	color: rgba(255, 255, 255, 0.9);
	max-width: 640px;
	text-shadow: 0 1px 10px rgba(7, 33, 77, 0.45);
}

.zd-banner__cta {
	position: relative;
	z-index: 1;
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 15px;
	font-weight: 700;
	color: var(--zd-navy);
	background: var(--zd-yellow);
	padding: 12px 22px;
	border-radius: 999px;
	white-space: nowrap;
	transition: filter 0.15s ease;
}

.zd-banner__card:hover .zd-banner__cta {
	filter: brightness(0.96);
}

@media (max-width: 768px) {
	.zd-banner {
		margin: 28px 0;
	}

	.zd-banner__body {
		flex-direction: column;
		align-items: flex-start;
		gap: 18px;
		padding: 24px 22px;
		background-image:
			linear-gradient(180deg, rgba(7, 33, 77, 0.86) 0%, rgba(7, 33, 77, 0.7) 100%),
			var(--zd-banner-bg);
	}

	.zd-banner__heading {
		font-size: 1.3rem !important;
	}

	.zd-banner__cta {
		width: 100%;
		justify-content: center;
	}
}
