Update public/styles.css

public/styles.css

@@ -308,15 +308,21 @@ body::before {
   z-index: 999;
   opacity: 0;
   transition: opacity 0.3s ease;
+  pointer-events: none;
+  user-select: none;
+  -webkit-user-drag: none;
 }
 
 .nav-overlay.active {
   display: block;
   opacity: 1;
+  pointer-events: auto;
 }
 
 body.menu-open {
   overflow: hidden;
+  position: fixed;
+  width: 100%;
 }
 
 /* Mobile Navigation */
@@ -328,7 +334,7 @@ body.menu-open {
   .nav-menu {
     position: fixed;
     top: 0;
-    right: -100%;
+    right: 0;
     width: 280px;
     height: 100vh;
     background: rgba(44, 62, 80, 0.98);
@@ -337,15 +343,17 @@ body.menu-open {
     padding: 5rem 2rem 2rem;
     gap: 0.5rem;
     box-shadow: -5px 0 20px rgba(0, 0, 0, 0.5);
-    transition: right 0.3s ease;
     overflow-y: auto;
     border-left: 1px solid rgba(255, 255, 255, 0.1);
     align-items: stretch;
     z-index: 1001;
+    transform: translateX(100%);
+    transition: transform 0.3s ease;
   }
 
   .nav-menu.active {
     right: 0;
+    transform: translateX(0);
   }
 
   .nav-link {