Add about/contact pages, real social icons, and gallery scroll fix

- Add /about (business-info driven, falls back to existing copy) and
  /contact (business-info contact details + a working form posting to
  the contact-submissions API)
- Point header/footer "About"/"Contact" links at the new pages instead
  of homepage anchors
- Replace the hand-drawn social icons with the real brand SVGs from
  public/icons (Instagram, Telegram, WhatsApp, Bale, Eitaa), inlined
  with currentColor so hover states work; shared via a single
  socialLinks list used by both header and footer
- Remove the horizontal scrollbar under the product gallery thumbnails
  by wrapping them instead of scrolling

src/components/Footer.tsx

@@ -3,14 +3,8 @@ import Logo from "./Logo";
 import { headerNavLinks, siteInfo } from "@/data/site";
 import { categoryHref } from "@/lib/slug";
 import type { CategoryNode } from "@/lib/types";
-import {
-  InstagramIcon,
-  MailIcon,
-  PhoneIcon,
-  PinIcon,
-  TelegramIcon,
-  WhatsappIcon,
-} from "./icons";
+import { socialLinks } from "./socialLinks";
+import { MailIcon, PhoneIcon, PinIcon } from "./icons";
 
 export default function Footer({ categoryColumns }: { categoryColumns: CategoryNode[] }) {
   const categoryItems = categoryColumns.flatMap((col) => col.children).slice(0, 6);
@@ -25,27 +19,16 @@ export default function Footer({ categoryColumns }: { categoryColumns: CategoryN
             دختران و پسران با ارسال به سراسر کشور.
           </p>
           <div className="mt-5 flex items-center gap-3">
-            <a
-              href="#"
-              aria-label="اینستاگرام"
-              className="flex items-center justify-center size-9 rounded-full border border-white/15 hover:border-gold hover:text-gold transition-colors"
-            >
-              <InstagramIcon className="size-4" />
-            </a>
-            <a
-              href="#"
-              aria-label="تلگرام"
-              className="flex items-center justify-center size-9 rounded-full border border-white/15 hover:border-gold hover:text-gold transition-colors"
-            >
-              <TelegramIcon className="size-4" />
-            </a>
-            <a
-              href="#"
-              aria-label="واتساپ"
-              className="flex items-center justify-center size-9 rounded-full border border-white/15 hover:border-gold hover:text-gold transition-colors"
-            >
-              <WhatsappIcon className="size-4" />
-            </a>
+            {socialLinks.map(({ icon: Icon, label, href }) => (
+              <a
+                key={label}
+                href={href}
+                aria-label={label}
+                className="flex items-center justify-center size-9 rounded-full border border-white/15 transition-all duration-200 hover:border-gold hover:bg-gold hover:text-ink hover:scale-110"
+              >
+                <Icon className="size-4" />
+              </a>
+            ))}
           </div>
         </div>
 
@@ -54,9 +37,15 @@ export default function Footer({ categoryColumns }: { categoryColumns: CategoryN
           <ul className="space-y-2.5 text-sm">
             {headerNavLinks.map((link) => (
               <li key={link.title}>
-                <a href={link.href} className="hover:text-gold transition-colors">
-                  {link.title}
-                </a>
+                {link.href.startsWith("#") ? (
+                  <a href={link.href} className="hover:text-gold transition-colors">
+                    {link.title}
+                  </a>
+                ) : (
+                  <Link href={link.href} className="hover:text-gold transition-colors">
+                    {link.title}
+                  </Link>
+                )}
               </li>
             ))}
           </ul>