Add Meshkee product catalog navigation and details

Co-authored-by: Cursor <cursoragent@cursor.com>

app/components/InteriorShell.tsx

@@ -3,7 +3,6 @@
 import {
   ArrowUpLeft,
   Camera,
-  ChevronLeft,
   CircleUserRound,
   Link as LinkIcon,
   Mail,
@@ -17,22 +16,14 @@ import {
 } from "lucide-react";
 import Link from "next/link";
 import { useState } from "react";
+import HeaderNavigation from "./HeaderNavigation";
 
 const assetBase = "/assets";
 
-const navItems = [
-  { label: "صفحه اصلی", href: "/" },
-  { label: "محصولات", href: "/#products" },
-  { label: "خدمات", href: "/#services" },
-  { label: "اخبار", href: "/#news" },
-  { label: "درباره ما", href: "/about-us", key: "about" },
-  { label: "تماس با ما", href: "/contact-us", key: "contact" },
-];
-
 export function InteriorHeader({
   active,
 }: {
-  active?: "about" | "contact";
+  active?: "products" | "about" | "contact";
 }) {
   const [mobileOpen, setMobileOpen] = useState(false);
 
@@ -62,17 +53,11 @@ export function InteriorHeader({
           <Link className="logo" href="/" aria-label="سامان اندیش">
             <img src={`${assetBase}/KN83Drb6oI.png`} alt="سامان اندیش" />
           </Link>
-          <nav className="desktop-nav" aria-label="ناوبری اصلی">
-            {navItems.map((item) => (
-              <Link
-                className={item.key === active ? "active" : ""}
-                href={item.href}
-                key={item.label}
-              >
-                {item.label}
-              </Link>
-            ))}
-          </nav>
+          <HeaderNavigation
+            active={active}
+            mobileOpen={mobileOpen}
+            onNavigate={() => setMobileOpen(false)}
+          />
           <div className="header__actions">
             <Link className="icon-button" href="/#smart-search" aria-label="جستجو">
               <Search size={22} />
@@ -93,20 +78,6 @@ export function InteriorHeader({
             </button>
           </div>
         </div>
-        {mobileOpen && (
-          <nav className="mobile-nav">
-            {navItems.map((item) => (
-              <Link
-                href={item.href}
-                key={item.label}
-                onClick={() => setMobileOpen(false)}
-              >
-                {item.label}
-                <ChevronLeft size={17} />
-              </Link>
-            ))}
-          </nav>
-        )}
       </header>
     </>
   );
@@ -138,7 +109,7 @@ export function InteriorFooter() {
         <div className="footer__links">
           <h3>دسترسی سریع</h3>
           <Link href="/">صفحه اصلی</Link>
-          <Link href="/#products">ماشین‌آلات</Link>
+          <Link href="/products">ماشین‌آلات</Link>
           <Link href="/about-us">درباره ما</Link>
           <Link href="/contact-us">تماس با ما</Link>
         </div>