@keyframes concord-dropdown-in {

	from {
		opacity: 0;
		transform: translateY(-5px) scale(0.98);
	}

	to {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

@keyframes concord-accordion-in {

	from {
		opacity: 0;
		transform: translateY(-6px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.concord-mobile-menu-cta {
	display: none !important;
}

.site-header {
	--dropdown-background: var(--wp--preset--color--white);
	--dropdown-foreground: var(--wp--preset--color--dark-green);
	--dropdown-border: rgb(29 60 52 / 16%);
}

body.header-color-light-green .site-header,
body.header-color-gray .site-header,
body.header-color-white .site-header {
	--dropdown-background: var(--wp--preset--color--dark-green);
	--dropdown-foreground: var(--wp--preset--color--white);
	--dropdown-border: rgb(62 223 179 / 48%);
}

/* Desktop dropdown cards. */
@media (min-width: 1281px) {

	.site-header .wp-block-navigation .wp-block-navigation__container > .wp-block-navigation-item.has-child > .wp-block-navigation__submenu-container {
		top: calc(100% + 10px);
		right: auto !important;
		left: 0 !important;
		box-sizing: border-box;
		min-width: 200px !important;
		padding: 6px;
		border: 1px solid var(--dropdown-border) !important;
		border-radius: 8px;
		background-color: var(--dropdown-background) !important;
		box-shadow: none;
		transform: none;
		transform-origin: top left;
		animation: concord-dropdown-in 180ms ease-out;
	}

	/* Invisible bridge keeps the hover state while crossing the gap. */
	.site-header .wp-block-navigation .wp-block-navigation__container > .wp-block-navigation-item.has-child > .wp-block-navigation__submenu-container::before {
		content: "";
		position: absolute;
		top: -10px;
		left: 0;
		width: 100%;
		height: 10px;
	}

	.site-header .wp-block-navigation .wp-block-navigation__container > .wp-block-navigation-item.has-child > .wp-block-navigation__submenu-container::after {
		content: "";
		position: absolute;
		top: -1px;
		left: 14px;
		width: 38px;
		height: 3px;
		border-radius: 0 0 3px 3px;
		background: var(--wp--preset--color--blue);
	}

	.site-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item {
		width: 100%;
	}

	.site-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
		display: flex;
		box-sizing: border-box;
		align-items: center;
		justify-content: space-between;
		width: 100%;
		padding: 9px 10px !important;
		border-radius: 6px;
		color: var(--dropdown-foreground) !important;
		font-size: 0.875rem;
		font-weight: 500;
		line-height: 1.3;
		transition: color 160ms ease, background-color 160ms ease;
	}

	.site-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content::after {
		content: "\2192";
		margin-left: 12px;
		font-size: 1rem;
		line-height: 1;
		opacity: 0;
		transform: translateX(-5px);
		transition: opacity 160ms ease, transform 160ms ease;
	}

	.site-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,
	.site-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:focus-visible {
		color: var(--wp--preset--color--dark-green) !important;
		background-color: var(--wp--preset--color--light-green);
	}

	.site-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover::after,
	.site-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:focus-visible::after {
		opacity: 1;
		transform: translateX(0);
	}

	.site-header .wp-block-navigation .wp-block-navigation__submenu-container .current-menu-item > .wp-block-navigation-item__content {
		color: var(--wp--preset--color--white) !important;
		background-color: var(--wp--preset--color--blue);
	}

	.site-header .wp-block-navigation-item.has-child:hover > .wp-block-navigation-submenu__toggle::before,
	.site-header .wp-block-navigation-submenu__toggle[aria-expanded="true"]::before {
		transform: rotate(180deg);
	}

	.concord-mobile-menu-topbar,
	.concord-mobile-menu-cta {
		display: none;
	}
}

/* Tablet and mobile navigation overlay. */
@media (max-width: 1280px) {

	.header-cta {
		display: none !important;
	}

	.site-header .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex !important;
		align-items: center;
		justify-content: center;
		width: 42px;
		height: 42px;
		padding: 10px;
		border: 1px solid var(--header-accent);
		border-radius: 50%;
	}

	.site-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none !important;
	}

	.site-header .wp-block-navigation__responsive-dialog {
		display: flex;
		flex-direction: column;
		min-height: calc(100dvh - 56px);
	}

	.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
		display: flex;
		flex: 1;
		flex-direction: column;
		align-items: stretch !important;
		justify-content: flex-start !important;
		padding: 24px 0 0 !important;
		row-gap: 0 !important;
	}

	.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
		display: flex;
		flex-direction: column;
		align-items: stretch !important;
		justify-content: flex-start !important;
		width: 100% !important;
	}

	.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item {
		box-sizing: border-box;
		align-items: stretch !important;
		justify-content: space-between !important;
		width: 100%;
		border-bottom: 1px solid rgb(250 248 244 / 18%);
	}

	.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
		box-sizing: border-box;
		width: 100%;
		padding: 10px 12px !important;
		border-radius: 8px;
		color: var(--wp--preset--color--white) !important;
		font-size: 1rem;
		line-height: 1.4;
		opacity: 0.82;
	}

	.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
		flex: 1;
		justify-content: flex-start !important;
		padding: 17px 0 !important;
		color: var(--wp--preset--color--white) !important;
		font-size: 1.125rem;
		font-weight: 500;
		line-height: 1.3;
		text-align: left !important;
	}

	.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item.has-child {
		align-items: center !important;
		flex-direction: row !important;
		flex-wrap: wrap !important;
		column-gap: 12px;
	}

	.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-icon {
		display: flex !important;
		flex: 0 0 44px;
		align-items: center;
		justify-content: center;
		width: 44px;
		height: 44px;
		margin-left: 0;
	}

	.site-header .wp-block-navigation__responsive-container.is-menu-open .has-child > .wp-block-navigation__submenu-container {
		display: none !important;
		position: static !important;
		box-sizing: border-box;
		flex-basis: 100%;
		width: 100% !important;
		min-width: 0 !important;
		margin: 0 0 12px;
		padding: 4px 0 4px 16px;
		border: 0 !important;
		border-left: 2px solid var(--wp--preset--color--light-green) !important;
		background: transparent !important;
		box-shadow: none;
	}

	.site-header .wp-block-navigation__responsive-container.is-menu-open .has-child > .wp-block-navigation-submenu__toggle[aria-expanded="true"] ~ .wp-block-navigation__submenu-container {
		display: flex !important;
		flex-direction: column !important;
		animation: concord-accordion-in 180ms ease-out;
	}

	.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,
	.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content:focus-visible {
		color: var(--wp--preset--color--dark-green) !important;
		background: var(--wp--preset--color--light-green);
		opacity: 1;
	}

	.concord-mobile-menu-topbar {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding-bottom: 20px;
		border-bottom: 1px solid rgb(250 248 244 / 18%);
	}

	.concord-mobile-menu-logo {
		margin: 0;
	}

	.site-header .wp-block-navigation__responsive-container-close {
		position: static;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 42px;
		height: 42px;
		padding: 10px;
		border: 1px solid var(--wp--preset--color--light-green);
		border-radius: 50%;
	}

	.concord-mobile-menu-cta {
		display: block !important;
		width: 100%;
		margin-top: auto;
		padding-top: 32px;
	}

	.concord-mobile-menu-cta .wp-block-button,
	.concord-mobile-menu-cta .wp-element-button {
		box-sizing: border-box;
		width: 100%;
	}

	.concord-mobile-menu-cta .wp-element-button {
		padding: 14px 20px;
		color: var(--wp--preset--color--dark-green);
		background: var(--wp--preset--color--light-green);
		font-size: 1rem;
		font-weight: 600;
		text-align: center;
		transition: color 180ms ease, background-color 180ms ease;
	}

	.concord-mobile-menu-cta .wp-element-button:hover {
		color: var(--wp--preset--color--dark-green);
		background: var(--wp--custom--color--button-hover-light-green);
	}
}

@media (max-width: 600px) {

	.site-header .wp-block-navigation__responsive-dialog {
		min-height: calc(100dvh - 44px);
	}
}

@media (prefers-reduced-motion: reduce) {

	.site-header .wp-block-navigation__submenu-container,
	.site-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
		animation: none;
		transition: none;
	}
}