/* ==========================================================================
   Classic menus (Appearance > Menus) — Main Menu in the header, the two
   footer columns. Translated from the reference design's .nav / .nav-toggle
   / .foot-list rules. Top Bar menu reuses the existing .topbar styles.
   ========================================================================== */

/* ---- Main Menu ---- */
.masthead .masm-primary { margin-left: auto; display: flex; align-items: center; }
.masthead .masm-nav { display: flex; align-items: center; }
.masthead .masm-menu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	align-items: center;
	gap: 26px;
}
.masthead .masm-menu li { position: relative; margin: 0; padding: 0; }
.masthead .masm-menu a {
	display: inline-block;
	font-family: var(--masm-sans);
	font-size: 14.5px;
	line-height: 1.62;
	letter-spacing: .005em;
	text-decoration: none;
	color: var(--masm-ink-soft);
	padding: 6px 0;
	position: relative;
	white-space: nowrap;
	box-sizing: border-box;
}
.masthead .masm-menu > li > a::after {
	content: "";
	position: absolute;
	left: 0;
	right: 100%;
	bottom: 0;
	height: 1.5px;
	background: var(--masm-rust);
	transition: right .32s cubic-bezier(.2, .7, .3, 1);
}
.masthead .masm-menu a:hover,
.masthead .masm-menu .current-menu-item > a { color: var(--masm-ink); }
.masthead .masm-menu > li > a:hover::after,
.masthead .masm-menu > li > a:focus-visible::after,
.masthead .masm-menu > li.current-menu-item > a::after { right: 0; }

/* pill button: give a menu item the CSS class "btn-register" */
.masthead .masm-menu > li.btn-register > a {
	font-size: 14px;
	letter-spacing: .01em;
	background: var(--masm-ink);
	color: var(--masm-paper);
	padding: 10px 18px;
	border-radius: 999px;
	line-height: 1.4;
	transition: background .25s, transform .25s;
}
.masthead .masm-menu > li.btn-register > a::after { display: none; }
.masthead .masm-menu > li.btn-register > a:hover,
.masthead .masm-menu > li.btn-register > a:focus-visible {
	background: #0A1C36;
	color: var(--masm-paper);
	transform: translateY(-1px);
}

/* sub-menus (desktop): drop-down card */
.masthead .masm-menu > li.menu-item-has-children > a { padding-right: 16px; }
.masthead .masm-menu > li.menu-item-has-children > a::before {
	content: "";
	position: absolute;
	right: 1px;
	top: 50%;
	width: 6px;
	height: 6px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: translateY(-75%) rotate(45deg);
	opacity: .7;
}
.masthead .masm-menu .sub-menu {
	list-style: none;
	margin: 0;
	padding: 8px 0;
	position: absolute;
	top: calc(100% + 8px);
	left: -18px;
	min-width: 230px;
	background: var(--masm-paper);
	border: 1px solid var(--masm-rule);
	border-radius: 4px;
	box-shadow: 0 24px 40px -30px rgba(17, 41, 75, .5);
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity .2s, transform .2s, visibility 0s linear .2s;
	z-index: 10;
}
.masthead .masm-menu .sub-menu::before { /* hover bridge over the 8px gap */
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: -9px;
	height: 9px;
}
.masthead .masm-menu li:hover > .sub-menu,
.masthead .masm-menu li:focus-within > .sub-menu,
.masthead .masm-menu li.is-open > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: none;
	transition: opacity .2s, transform .2s, visibility 0s;
}
.masthead .masm-menu .sub-menu a {
	display: block;
	padding: 8px 18px;
	white-space: normal;
}
.masthead .masm-menu .sub-menu a:hover { background: var(--masm-paper-deep, #EFE5D0); color: var(--masm-ink); }
.masthead .masm-menu .sub-menu .sub-menu { top: -9px; left: 100%; }

.masthead .nav-toggle { display: none; }

@media (max-width: 1080px) {
	.masthead .masm-nav {
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		display: none;
		background: var(--masm-paper);
		border-bottom: 1px solid var(--masm-rule);
		padding: 8px var(--masm-gut) 22px;
		max-height: calc(100svh - var(--masm-header-h, 154px));
		overflow-y: auto;
		box-shadow: 0 24px 40px -30px rgba(17, 41, 75, .5);
	}
	.masthead .masm-nav.open { display: block; }
	.masthead .masm-menu { flex-direction: column; align-items: stretch; gap: 0; }
	.masthead .masm-menu a {
		display: block;
		width: 100%;
		padding: 14px 0;
		border-bottom: 1px solid var(--masm-rule);
		font-size: 17px;
		white-space: normal;
	}
	.masthead .masm-menu > li > a::after,
	.masthead .masm-menu > li.menu-item-has-children > a::before { display: none; }
	.masthead .masm-menu > li.menu-item-has-children > a { padding-right: 0; }
	.masthead .masm-menu .sub-menu,
	.masthead .masm-menu .sub-menu .sub-menu {
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		min-width: 0;
		padding: 0 0 0 18px;
		background: none;
		border: 0;
		border-radius: 0;
		box-shadow: none;
		transition: none;
	}
	.masthead .masm-menu .sub-menu::before { display: none; }
	.masthead .masm-menu .sub-menu a { font-size: 15.5px; padding: 11px 0; }
	.masthead .masm-menu .sub-menu a:hover { background: none; }
	.masthead .masm-menu > li.btn-register { margin-top: 18px; align-self: flex-start; }
	.masthead .masm-menu > li.btn-register > a {
		border-bottom: 0;
		text-align: center;
		padding: 14px 32px;
		width: auto;
		font-size: 14px;
	}

	.masthead .nav-toggle {
		display: inline-flex;
		flex-direction: column;
		justify-content: center;
		gap: 5px;
		margin-left: auto;
		width: 44px;
		height: 44px;
		background: none;
		border: 0;
		cursor: pointer;
		padding: 10px;
	}
	.masthead .nav-toggle span {
		display: block;
		height: 1.6px;
		background: var(--masm-ink);
		transition: transform .3s, opacity .2s;
	}
	.masthead .nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(6.6px) rotate(45deg); }
	.masthead .nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
	.masthead .nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6.6px) rotate(-45deg); }
}

@media (max-width: 860px) {
	.masthead .masm-menu > li.btn-register { align-self: stretch; }
	.masthead .masm-menu > li.btn-register > a { width: 100%; }
}

/* ---- Footer columns ---- */
.site-footer .foot-list {
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: 15px;
	line-height: 1.62;
}
.site-footer .foot-list li { margin: 0 0 10px; padding: 0; }
.site-footer .foot-list a { color: var(--masm-ink-soft); text-decoration: none; }
.site-footer .foot-list a:hover { color: var(--masm-ink); text-decoration: underline; text-underline-offset: 3px; }
