Rebuild mobile nav: absolute positioned dropdown panel, outside doc flow

src/components/navigation.tsx

@@ -41,7 +41,7 @@ export async function Navigation() {
 					menuLabel={t("openMenu") || "Open menu"}
 					closeLabel={t("closeMenu") || "Close menu"}
 				>
-					<Link href="/" className="nav-item md:hidden" role="menuitem">
+					<Link href="/" className="nav-item" role="menuitem">
 						<Image
 							src="/assets/images/icons/navigation/me.png"
 							alt=""
@@ -173,7 +173,7 @@ export async function Navigation() {
 					) : null}
 
 					<div
-						className="flex items-center gap-x-1 pt-2 mt-2 border-t md:hidden"
+						className="flex items-center gap-x-1 pt-2 mt-2 border-t"
 						style={{
 							borderColor:
 								"color-mix(in srgb, var(--color-text-muted) 10%, transparent)",
@@ -185,7 +185,7 @@ export async function Navigation() {
 					</div>
 				</MobileNav>
 
-				<div className="ml-auto flex items-center gap-x-1 hidden md:flex">
+				<div className="ml-auto hidden md:flex items-center gap-x-1">
 					<LanguageSwitcher />
 					<NavbarColorPicker />
 					<ThemeSwitcher />