diff --git a/src/components/layout/MobileMenu.tsx b/src/components/layout/MobileMenu.tsx
index 0996d0da..cb43dbf8 100644
--- a/src/components/layout/MobileMenu.tsx
+++ b/src/components/layout/MobileMenu.tsx
@@ -3,7 +3,6 @@
 import type { Category } from "@spree/sdk";
 import { ArrowLeft, Check, ChevronRight, User, X } from "lucide-react";
 import Link from "next/link";
-import { useRouter } from "next/navigation";
 import { useRef, useState } from "react";
 import { flushSync } from "react-dom";
 import { Button } from "@/components/ui/button";
@@ -46,7 +45,6 @@ export function MobileMenu({ rootCategories, basePath }: MobileMenuProps) {
   const timeoutRef = useRef<NodeJS.Timeout | null>(null);
 
   const { country, currency, countries } = useStore();
-  const router = useRouter();
   const { isCountryNavigating, handleCountrySelect } = useCountrySwitch({
     currentCountry: country,
     onBeforeNavigate: () => setOpen(false),
@@ -98,11 +96,6 @@ export function MobileMenu({ rootCategories, basePath }: MobileMenuProps) {
     }
   };
 
-  const handleNavigate = (href: string) => {
-    setOpen(false);
-    router.push(href);
-  };
-
   // Flatten root categories: show their children directly instead of taxonomy names
   const menuCategories = rootCategories.flatMap((root) => root.children ?? []);
 
@@ -225,20 +218,20 @@ export function MobileMenu({ rootCategories, basePath }: MobileMenuProps) {
             }`}
           >
             <nav className="flex flex-col gap-1 px-4 flex-1 overflow-y-auto pt-2">
-              <button
-                type="button"
-                onClick={() => handleNavigate(basePath || "/")}
+              <Link
+                href={basePath || "/"}
+                onClick={() => setOpen(false)}
                 className={linkClass}
               >
                 Home
-              </button>
-              <button
-                type="button"
-                onClick={() => handleNavigate(`${basePath}/products`)}
+              </Link>
+              <Link
+                href={`${basePath}/products`}
+                onClick={() => setOpen(false)}
                 className={linkClass}
               >
                 All Products
-              </button>
+              </Link>
               {menuCategories.map((category) =>
                 category.children && category.children.length > 0 ? (
                   <button
@@ -251,25 +244,23 @@ export function MobileMenu({ rootCategories, basePath }: MobileMenuProps) {
                     <ChevronRight className="w-4 h-4 text-gray-400" />
                   </button>
                 ) : (
-                  <button
+                  <Link
                     key={category.id}
-                    type="button"
-                    onClick={() =>
-                      handleNavigate(`${basePath}/c/${category.permalink}`)
-                    }
+                    href={`${basePath}/c/${category.permalink}`}
+                    onClick={() => setOpen(false)}
                     className={linkClass}
                   >
                     {category.name}
-                  </button>
+                  </Link>
                 ),
               )}
-              <button
-                type="button"
-                onClick={() => handleNavigate(`${basePath}/#contact`)}
+              <Link
+                href={`${basePath}/#contact`}
+                onClick={() => setOpen(false)}
                 className={linkClass}
               >
                 Contact
-              </button>
+              </Link>
             </nav>
 
             {/* Footer: Country switcher (mobile + tablet) + Account (mobile only) */}
@@ -342,33 +333,27 @@ export function MobileMenu({ rootCategories, basePath }: MobileMenuProps) {
                         <ChevronRight className="w-4 h-4 text-gray-400" />
                       </button>
                     ) : (
-                      <button
+                      <Link
                         key={child.id}
-                        type="button"
-                        onClick={() =>
-                          handleNavigate(`${basePath}/c/${child.permalink}`)
-                        }
+                        href={`${basePath}/c/${child.permalink}`}
+                        onClick={() => setOpen(false)}
                         className={linkClass}
                       >
                         {child.name}
-                      </button>
+                      </Link>
                     ),
                   )}
                 </nav>
 
                 {/* "View all" at the bottom */}
                 <div className="border-t border-gray-200 px-4 py-3">
-                  <button
-                    type="button"
-                    onClick={() =>
-                      handleNavigate(
-                        `${basePath}/c/${panel.category.permalink}`,
-                      )
-                    }
-                    className="w-full text-center text-sm text-gray-500 hover:text-gray-900 py-2 transition-colors"
+                  <Link
+                    href={`${basePath}/c/${panel.category.permalink}`}
+                    onClick={() => setOpen(false)}
+                    className="block w-full text-center text-sm text-gray-500 hover:text-gray-900 py-2 transition-colors"
                   >
                     View all {panel.category.name}
-                  </button>
+                  </Link>
                 </div>
               </div>
             );
diff --git a/src/components/products/filters/ProductFilters.tsx b/src/components/products/filters/ProductFilters.tsx
index 32f76917..268e50e3 100644
--- a/src/components/products/filters/ProductFilters.tsx
+++ b/src/components/products/filters/ProductFilters.tsx
@@ -131,20 +131,21 @@ export const FilterBar = memo(function FilterBar({
 
   const activeSortBy = activeFilters.sortBy || filtersData?.default_sort;
 
-  if (filtersLoading) {
-    return (
-      <div className="flex items-center gap-3 mb-4 pb-4 border-b border-gray-200">
-        <div className="h-10 w-20 bg-gray-200 rounded-lg animate-pulse" />
-        <div className="h-10 w-18 bg-gray-200 rounded-lg animate-pulse" />
-        <div className="h-10 w-18 bg-gray-200 rounded-lg animate-pulse" />
-        <div className="h-10 w-24 bg-gray-200 rounded-lg animate-pulse" />
-        <div className="ml-auto h-10 w-18 bg-gray-200 rounded-lg animate-pulse" />
-      </div>
-    );
+  if (!filtersData) {
+    if (filtersLoading) {
+      return (
+        <div className="flex items-center gap-3 mb-4 pb-4 border-b border-gray-200">
+          <div className="h-10 w-20 bg-gray-200 rounded-lg animate-pulse" />
+          <div className="h-10 w-18 bg-gray-200 rounded-lg animate-pulse" />
+          <div className="h-10 w-18 bg-gray-200 rounded-lg animate-pulse" />
+          <div className="h-10 w-24 bg-gray-200 rounded-lg animate-pulse" />
+          <div className="ml-auto h-10 w-18 bg-gray-200 rounded-lg animate-pulse" />
+        </div>
+      );
+    }
+    return null;
   }
 
-  if (!filtersData) return null;
-
   const availabilityFilter = filtersData.filters.find(
     (f) => f.type === "availability",
   ) as AvailabilityFilter | undefined;