#vanti-mobile-header {
	display: none;
}

@media (max-width: 959px) {
	#vanti-mobile-header.is-ready + header {
		display: none;
	}

	#vanti-mobile-header.is-ready {
		--vanti-ink: #17181d;
		--vanti-gradient: linear-gradient(180deg, #1facbb 0%, #0099ff 100%);
		--vanti-line: #ffffff52;
		--vanti-gutter: clamp(18px, 5vw, 44px);
		--vanti-bar-padding: 9px;
		--vanti-bar-top: max(var(--vanti-bar-padding), env(safe-area-inset-top));
		position: relative;
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 16px;
		box-sizing: border-box;
		padding: var(--vanti-bar-top) var(--vanti-gutter) var(--vanti-bar-padding);
		background: var(--vanti-ink);
		color: #fff;
	}

	#vanti-mobile-header.is-ready.is-overlay {
		--vanti-bar-padding: 15px;
		--vanti-overlay-height: calc(46px + var(--vanti-bar-top) + var(--vanti-bar-padding));
		z-index: 10;
		box-sizing: border-box;
		min-height: var(--vanti-overlay-height);
		margin-block-end: calc(-1 * var(--vanti-overlay-height));
		background: transparent;
	}

	#content .vanti-mobile-overlay-hero .vbh-hero__inner {
		margin-block-start: 0;
		padding-block-start: 0;
	}

	#content .vanti-mobile-overlay-hero .vbh-hero__inner-inner {
		padding-block-start: 96px;
	}

	#content .vanti-mobile-overlay-spacer {
		min-height: 96px;
	}

	#vanti-mobile-header a {
		color: inherit;
		text-decoration: none;
	}

	#vanti-mobile-header button {
		font: inherit;
		text-transform: none;
		cursor: pointer;
	}

	#vanti-mobile-header :focus-visible {
		outline: 2px solid currentColor;
		outline-offset: 3px;
	}

	.vanti-mobile-skip {
		position: absolute;
		top: 8px;
		left: var(--vanti-gutter);
		z-index: 2;
		padding: 10px;
		background: var(--vanti-ink);
	}

	.vanti-mobile-skip:not(:focus) {
		clip-path: inset(50%);
	}

	.vanti-mobile-brand {
		display: flex;
		align-items: center;
		min-width: 0;
		min-height: 44px;
		font-weight: 700;
	}

	.vanti-mobile-brand img,
	.vanti-mobile-panel-brand img {
		display: block;
		width: 110px;
		max-width: 100%;
		height: auto;
	}

	#vanti-mobile-header .vanti-mobile-toggle,
	#vanti-mobile-header .vanti-mobile-close {
		display: grid;
		flex: none;
		place-items: center;
		width: 46px;
		height: 46px;
		padding: 0;
		border: 1px solid currentColor;
		border-radius: 50%;
		background: transparent;
		color: inherit;
	}

	#vanti-mobile-header .vanti-mobile-toggle {
		border: 0;
		border-radius: 0;
	}

	.vanti-mobile-icon {
		position: relative;
		width: 19px;
		height: 18px;
	}

	.vanti-mobile-icon::before,
	.vanti-mobile-icon::after {
		content: "";
		position: absolute;
		top: 8px;
		left: 0;
		width: 100%;
		height: 2px;
		background: currentColor;
	}

	.vanti-mobile-toggle .vanti-mobile-icon {
		background: linear-gradient(currentColor, currentColor) center / 100% 2px no-repeat;
	}

	.vanti-mobile-toggle .vanti-mobile-icon::before { transform: translateY(-4px); }
	.vanti-mobile-toggle .vanti-mobile-icon::after { transform: translateY(4px); }
	.vanti-mobile-close .vanti-mobile-icon::before { transform: rotate(45deg); }
	.vanti-mobile-close .vanti-mobile-icon::after { transform: rotate(-45deg); }

	html:has(#vanti-mobile-panel[open]),
	body:has(#vanti-mobile-panel[open]) {
		overflow: hidden;
		overscroll-behavior: none;
	}

	#vanti-mobile-panel {
		position: fixed;
		inset: 0;
		box-sizing: border-box;
		width: 100%;
		max-width: none;
		height: 100%;
		height: 100dvh;
		max-height: none;
		margin: 0;
		padding: 0;
		border: 0;
		overflow: hidden;
		background: var(--vanti-gradient);
		color: #fff;
		text-shadow: 0 1px 2px #00334c80;
	}

	.vanti-mobile-panel-inner {
		display: flex;
		flex-direction: column;
		height: 100%;
	}

	.vanti-mobile-panel-top {
		display: flex;
		flex: none;
		align-items: center;
		justify-content: space-between;
		gap: 16px;
		padding: var(--vanti-bar-top) var(--vanti-gutter) var(--vanti-bar-padding);
	}

	.vanti-mobile-panel-scroll {
		display: flex;
		flex: 1;
		flex-direction: column;
		min-height: 0;
		overflow-y: auto;
		overscroll-behavior-y: contain;
		padding: clamp(12px, 4vh, 38px) var(--vanti-gutter)
			max(26px, env(safe-area-inset-bottom));
	}

	#vanti-mobile-panel nav ul {
		margin: 0;
		padding: 0;
		list-style: none;
	}

	#vanti-mobile-panel nav li {
		margin: 0;
		padding-inline: 0;
	}

	#vanti-mobile-panel nav .sub-menu[hidden] {
		display: none !important;
	}

	#vanti-mobile-panel nav .sub-menu {
		/* The site also styles .sub-menu globally with important padding. */
		margin-inline: 0 !important;
		padding-inline: 0 !important;
		position: static;
		display: block;
		width: auto;
		visibility: visible;
		opacity: 1;
		transform: none;
		box-shadow: none;
	}

	#vanti-mobile-panel nav ul,
	#vanti-mobile-panel nav li,
	#vanti-mobile-panel nav .vanti-mobile-row,
	#vanti-mobile-panel nav .vanti-mobile-row > :is(a, button) {
		background: transparent !important;
	}

	#vanti-mobile-menu {
		border-bottom: 1px solid var(--vanti-line);
	}

	#vanti-mobile-panel .vanti-mobile-row {
		display: flex;
		align-items: center;
		gap: 6px;
		min-height: 44px;
		padding-inline: 8px;
		border-top: 1px solid var(--vanti-line);
		color: #fff;
	}

	#vanti-mobile-menu > li > .vanti-mobile-row {
		min-height: 58px;
		border-radius: 5px;
		font-size: clamp(25px, 5vw, 32px);
	}

	#vanti-mobile-panel .sub-menu > li > .vanti-mobile-row {
		padding-inline: 4px;
	}

	#vanti-mobile-panel nav .sub-menu .sub-menu,
	#vanti-mobile-panel nav .sub-menu .sub-menu > li,
	#vanti-mobile-panel nav .sub-menu .sub-menu > li > .vanti-mobile-row,
	#vanti-mobile-panel nav .sub-menu .sub-menu > li > .vanti-mobile-row > :is(a, button) {
		border-inline-start: 0 !important;
	}

	#vanti-mobile-panel nav .sub-menu .sub-menu > li > .vanti-mobile-row {
		padding-inline: 12px !important;
		border-top: 0;
		border-bottom: 1px solid #fff;
	}

	#vanti-mobile-panel .vanti-mobile-row.is-current {
		font-weight: 700;
	}

	#vanti-mobile-panel .vanti-mobile-row > a,
	#vanti-mobile-panel .vanti-mobile-row > .vanti-mobile-section {
		display: flex;
		flex: 1;
		align-items: center;
		min-height: 44px;
		padding: 4px 0;
		color: inherit;
		font: inherit;
		overflow-wrap: anywhere;
	}

	#vanti-mobile-panel .vanti-mobile-section,
	#vanti-mobile-panel .vanti-mobile-caret {
		background: transparent;
		border: 0;
		color: inherit;
		text-align: left;
	}

	#vanti-mobile-panel .vanti-mobile-section {
		justify-content: space-between;
		gap: 8px;
	}

	#vanti-mobile-panel .vanti-mobile-caret {
		display: grid;
		align-items: center;
		justify-items: end;
		flex: 0 0 44px;
		height: 44px;
		padding: 0;
	}

	#vanti-mobile-panel .vanti-mobile-row button::after {
		content: "";
		flex: none;
		width: 8px;
		height: 8px;
		margin-right: 8px;
		border-bottom: 2px solid;
		border-right: 2px solid;
		transform: rotate(45deg);
	}

	#vanti-mobile-panel .vanti-mobile-row button[aria-expanded="true"]::after {
		transform: rotate(225deg);
	}

	.vanti-mobile-panel-footer {
		margin-top: auto;
		padding-top: 24px;
	}

	.vanti-mobile-actions {
		display: grid;
		gap: 9px;
	}

	#vanti-mobile-panel .vanti-mobile-actions a {
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap: 10px;
		min-height: 46px;
		padding: 4px 16px;
		border: 1px solid #fff;
		border-radius: 999px;
		background: transparent;
		color: #fff;
		font: inherit;
		font-weight: 600;
	}

	.vanti-mobile-actions svg {
		flex: none;
		width: 16px;
		height: 16px;
	}

	.vanti-mobile-language {
		display: flex;
		justify-content: center;
		margin-top: 15px;
		padding-top: 12px;
		border-top: 1px solid var(--vanti-line);
	}
}
