/* Full screen menu on phones, opened by the menu button in the 2026 heroes */
.menu_2026 {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: flex;
	flex-direction: column;
	height: 100vh;
	height: 100dvh;
	background: #ffffff;
}

.menu_2026[hidden] {
	display: none;
}

/* The page behind the menu does not scroll */
body.menu_2026_open {
	overflow: hidden;
}

.menu_2026 a {
	color: inherit;
	text-decoration: none;
}

.menu_2026__top {
	flex: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 78px;
	padding: 0 20px;
	background: var(--navy-900);
}

.menu_2026__logo img {
	display: block;
	width: auto;
	height: 38px;
}

.menu_2026__close {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1px solid rgba(255, 255, 255, 0.5);
	border-radius: var(--radius-2026);
	background: transparent;
	cursor: pointer;
}

.menu_2026__list {
	flex: 1;
	overflow-y: auto;
	padding: 8px 20px 0;
	overscroll-behavior: contain;
}

.menu_2026 .menu_2026__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	min-height: 60px;
	padding: 0;
	border: 0;
	border-bottom: 1px solid var(--gray-100);
	background: none;
	color: var(--navy-600);
	font-family: var(--font-2026);
	font-size: 19px;
	font-weight: 600;
	line-height: 1.2;
	text-align: left;
	cursor: pointer;
}

.menu_2026__row > svg,
.menu_2026__end > svg {
	flex: none;
	color: var(--sky-400);
	transition: transform 0.15s ease;
}

.menu_2026__row[aria-expanded="true"] {
	border-bottom-color: transparent;
}

.menu_2026__row[aria-expanded="true"] > svg {
	transform: rotate(180deg);
}

.menu_2026__lead {
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

.menu_2026__lead svg {
	flex: none;
	color: var(--navy-600);
}

.menu_2026__end {
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

.menu_2026__end .design_2026_count {
	min-width: 26px;
	height: 26px;
	padding: 0 8px;
	font-size: 14px;
}

.menu_2026__sub {
	margin: 0 0 6px;
	padding: 4px 0 12px 14px;
	border-left: 2px solid var(--sky-400);
	border-bottom: 1px solid var(--gray-100);
}

.menu_2026__sub a {
	display: block;
	padding: 9px 0;
}

.menu_2026__sub strong {
	display: block;
	color: var(--navy-600);
	font-size: 16px;
	line-height: 1.3;
}

.menu_2026__sub span {
	display: block;
	margin-top: 2px;
	color: var(--gray-600);
	font-size: 14px;
	line-height: 1.4;
}

.menu_2026 .menu_2026__sub .menu_2026__all {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin-top: 4px;
	color: var(--sky-400);
	font-size: 15px;
	font-weight: 700;
}

/* Groups of the signed in menu, like "My profile" */
.menu_2026 .menu_2026__sub.plain a {
	padding: 10px 0;
	color: var(--navy-600);
	font-size: 16px;
	font-weight: 600;
}

.menu_2026__me {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 12px 0;
	border-bottom: 1px solid var(--gray-100);
}

.menu_2026__me .design_2026_photo {
	width: 52px;
	height: 52px;
}

.menu_2026__me strong {
	display: block;
	color: var(--navy-600);
	font-size: 19px;
	font-weight: 700;
}

.menu_2026__me span {
	display: block;
	margin-top: 2px;
	color: var(--gray-600);
	font-size: 14px;
}

.menu_2026__buttons {
	flex: none;
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 16px 20px calc(24px + env(safe-area-inset-bottom));
	border-top: 1px solid var(--gray-100);
	background: #ffffff;
}

.menu_2026.signed_in .menu_2026__buttons {
	gap: 8px;
	padding-bottom: calc(12px + env(safe-area-inset-bottom));
}

.design_2026 .menu_2026__get_started {
	width: 100%;
	min-width: 0;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14), 0 8px 20px rgba(11, 187, 239, 0.28);
}

.menu_2026__contact {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
}

/* A single button takes the full width */
.menu_2026__contact > :only-child {
	grid-column: 1 / -1;
}

.menu_2026 .menu_2026__outline {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	height: 48px;
	border: 1.5px solid var(--navy-600);
	border-radius: var(--radius-2026);
	color: var(--navy-600);
	font-size: 16px;
	font-weight: 700;
}

.menu_2026 .menu_2026__sign_out {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	/* A comfortable tap area for thumbs */
	height: 44px;
	color: var(--gray-600);
	font-size: 16px;
	font-weight: 600;
}
