Add replaceable images, category mega menu, and contact pages.

Give every placeholder a real img src, add FAQ and contact sections, and put categories first in the header.

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

src/components/ProductCard.tsx

@@ -13,9 +13,10 @@ export function ProductCard({ product }: Props) {
       className="glass-box w-[220px] shrink-0 snap-start rounded-3xl p-2.5 shadow-soft transition hover:-translate-y-1 hover:shadow-card sm:w-[240px]"
     >
       <Placeholder
+        src={product.image}
+        alt={product.title}
         width={280}
         height={340}
-        tone={product.tone}
         rounded="rounded-2xl"
       />
       <div className="px-1.5 pt-3 pb-1">