/*
 * Learningville — site navigation (desktop dropdowns + mobile drawer accordions).
 * Pairs with assets/js/site-nav.js. Tokens fall back to brand hex values so the
 * file also works outside theme.json.
 */
.lv-nav { --n-navy: var(--navy, #13306B); --n-gold: var(--marigold, #F5B21E); --n-line: var(--line, #E7DFCF); --n-cream: var(--cream, #FFF8EE); --n-focus: var(--tech, #2E7DB8); }
.lv-nav__list { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 2px; }
.lv-nav__item { position: relative; }
.lv-nav__toggle {
	font: 600 15px/1 var(--body, "Figtree", system-ui, sans-serif);
	color: var(--n-navy);
	background: none;
	border: 0;
	border-radius: 10px;
	padding: 12px 10px;
	min-height: 44px;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	cursor: pointer;
	white-space: nowrap;
	position: relative;
}
.lv-nav__toggle svg { width: 14px; height: 14px; transition: transform .15s; flex: 0 0 auto; }
.lv-nav__toggle:hover, .lv-nav__item.is-open > .lv-nav__toggle { background: #FFF1D2; }
.lv-nav__toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.lv-nav__toggle:focus-visible, .lv-nav__panel a:focus-visible { outline: 3px solid var(--n-focus); outline-offset: 2px; }
.lv-nav__item.is-current > .lv-nav__toggle::after {
	content: ""; position: absolute; left: 10px; right: 10px; bottom: 4px; height: 3px; border-radius: 2px; background: var(--n-gold);
}

.lv-nav__panel {
	display: none;
	position: absolute;
	top: calc(100% + 10px);
	left: -6px;
	z-index: 80;
	min-width: 264px;
	background: #fff;
	border: 1px solid var(--n-line);
	border-top: 4px solid var(--n-gold);
	border-radius: 16px;
	box-shadow: 0 20px 50px rgba(10, 28, 64, .2);
	padding: 8px;
}
.lv-nav__panel::before { content: ""; position: absolute; left: 0; right: 0; top: -16px; height: 14px; } /* hover bridge */
.lv-nav__item:nth-last-child(-n+2) .lv-nav__panel { left: auto; right: -6px; }
html:not(.lv-js) .lv-nav__item:hover > .lv-nav__panel,
html:not(.lv-js) .lv-nav__item:focus-within > .lv-nav__panel,
.lv-js .lv-nav__panel:not([hidden]) { display: block; }
.lv-nav__panel ul { list-style: none; margin: 0; padding: 0; }
.lv-nav__panel a {
	display: flex; align-items: center; justify-content: space-between; gap: 10px;
	min-height: 44px; padding: 10px 14px; border-radius: 10px;
	color: var(--n-navy); text-decoration: none; font-weight: 600; font-size: 15px; line-height: 1.3;
}
.lv-nav__panel a:hover { background: var(--n-cream); }
.lv-nav__panel a[aria-current="page"] { background: #FDECCB; box-shadow: inset 3px 0 0 var(--n-gold); }
.lv-nav__note { display: block; font-weight: 500; font-size: 12px; color: #8A7F66; }

/* "Confirm before launch" tag — preview only; the live site omits pending items. */
.lv-pending { flex: 0 0 auto; font: 700 10.5px/1 var(--body, system-ui, sans-serif); letter-spacing: .04em; text-transform: uppercase; color: #A13F1F; background: #FFF0E8; border: 1px solid #F2C3AE; border-radius: 999px; padding: 4px 7px; }

@media (prefers-reduced-motion: no-preference) {
	.lv-js .lv-nav__panel:not([hidden]) { animation: lvnav-in .14s ease-out; }
	@keyframes lvnav-in { from { opacity: 0; transform: translateY(-4px); } }
}

/* ---- Burger + drawer ---- */
.lv-burger { display: none; align-items: center; gap: 8px; background: none; border: 2px solid var(--line, #E7DFCF); border-radius: 12px; cursor: pointer; padding: 8px 12px; min-height: 44px; color: var(--navy, #13306B); font: 700 15px/1 var(--body, system-ui, sans-serif); }
.lv-burger span { display: grid; gap: 4px; }
.lv-burger i { width: 20px; height: 2.4px; background: currentColor; border-radius: 2px; display: block; }
.lv-burger:focus-visible { outline: 3px solid var(--tech, #2E7DB8); outline-offset: 2px; }

.lv-drawer { position: fixed; inset: 0; z-index: 90; }
.lv-drawer[hidden] { display: none; }
.lv-drawer__scrim { position: absolute; inset: 0; background: rgba(10, 28, 64, .55); }
.lv-drawer__panel {
	position: absolute; right: 0; top: 0; bottom: 0; width: min(92vw, 400px);
	background: var(--cream, #FFF8EE); display: flex; flex-direction: column; overflow: auto;
	box-shadow: -20px 0 50px rgba(10, 28, 64, .25); overscroll-behavior: contain;
}
.lv-drawer__head { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border-bottom: 1px solid var(--line, #E7DFCF); position: sticky; top: 0; background: var(--cream, #FFF8EE); z-index: 1; }
.lv-drawer__head img { height: 40px; width: auto; }
.lv-drawer__close { width: 48px; height: 48px; border-radius: 12px; border: 2px solid var(--line, #E7DFCF); background: #fff; color: var(--navy, #13306B); font-size: 26px; line-height: 1; cursor: pointer; }
.lv-drawer__close:focus-visible, .lv-acc__toggle:focus-visible, .lv-acc__panel a:focus-visible { outline: 3px solid var(--tech, #2E7DB8); outline-offset: 2px; }

.lv-acc { list-style: none; margin: 0; padding: 6px 16px; }
.lv-acc > li { border-bottom: 1px solid var(--line, #E7DFCF); }
.lv-acc__toggle {
	width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 12px;
	min-height: 56px; padding: 14px 4px; background: none; border: 0; cursor: pointer; text-align: left;
	font: 700 18px/1.2 var(--body, system-ui, sans-serif); color: var(--navy, #13306B);
}
.lv-acc__toggle svg { width: 20px; height: 20px; transition: transform .15s; flex: 0 0 auto; }
.lv-acc__toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.lv-acc__panel { list-style: none; margin: 0 0 12px; padding: 4px; background: #fff; border: 1px solid var(--line, #E7DFCF); border-radius: 14px; }
.lv-acc__panel a { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 48px; padding: 12px 14px; border-radius: 10px; color: var(--navy, #13306B); text-decoration: none; font-weight: 600; font-size: 16px; }
.lv-acc__panel a:hover { background: var(--cream, #FFF8EE); }
.lv-acc__panel a[aria-current="page"] { background: #FDECCB; box-shadow: inset 3px 0 0 var(--marigold, #F5B21E); }

.lv-drawer__actions { padding: 16px; display: grid; gap: 10px; margin-top: auto; border-top: 1px solid var(--line, #E7DFCF); background: #fff; }
.lv-drawer__contact { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.lv-drawer__contact a { display: flex; flex-direction: column; align-items: center; gap: 4px; min-height: 64px; justify-content: center; border-radius: 12px; border: 1px solid var(--line, #E7DFCF); background: var(--cream, #FFF8EE); color: var(--navy, #13306B); font-weight: 700; font-size: 13px; text-decoration: none; }
.lv-drawer__contact svg { width: 22px; height: 22px; }
.lv-drawer__actions .btn { justify-content: center; }
.lv-drawer-open { overflow: hidden; }