Fix: Ensure main navigation menu is always visible and functional

- Add explicit display styles to nav-menu-item class
- Ensure desktop menu is visible on large screens with proper flex layout
- Add flex-1 to menu container for proper spacing
- Add relative positioning to menu container
- Replace @apply with explicit CSS for nav-menu-item to ensure visibility
- Fix menu visibility issues that prevented navigation from appearing

Author: cursoragent

_includes/portal.html

@@ -96,8 +96,8 @@
     </div>
 
     <!-- Main Menu Bar -->
-    <div class="container-padding">
-      <div class="flex items-center justify-between">
+    <div class="container-padding relative">
+      <div class="flex items-center justify-between w-full">
         <!-- Mobile menu button -->
         <button
           class="lg:hidden py-3 px-2 text-white hover:bg-stone-700 focus:outline-none focus:ring-2 focus:ring-orange-500 rounded-md transition-colors"
@@ -111,8 +111,8 @@
           </svg>
         </button>
 
-        <!-- Desktop Navigation -->
-        <ul class="hidden lg:flex flex-row items-center" role="menubar" id="main-menu-desktop">
+        <!-- Desktop Navigation - Always visible on large screens -->
+        <ul class="hidden lg:flex flex-row items-center flex-1" role="menubar" id="main-menu-desktop">
           <li role="none">
             <a class="nav-menu-item" href="/development" role="menuitem" aria-label="Development">DEVELOPMENT</a>
           </li>

_sass/main.scss

@@ -65,9 +65,26 @@ select:focus {
 }
 
 .nav-menu-item {
-  @apply flex items-center justify-center h-16 px-4 font-semibold text-white;
-  @apply transition-colors hover:bg-stone-700;
-  @apply focus:outline-none focus:ring-2 focus:ring-inset focus:ring-orange-500;
+  display: flex !important;
+  align-items: center;
+  justify-content: center;
+  height: 4rem;
+  padding: 0 1rem;
+  font-weight: 600;
+  color: #ffffff;
+  transition-property: background-color;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
+
+.nav-menu-item:hover {
+  background-color: #57534e;
+}
+
+.nav-menu-item:focus {
+  outline: 2px solid transparent;
+  outline-offset: 2px;
+  box-shadow: inset 0 0 0 2px #f97316;
 }
 
 .nav-menu-item-mobile {