feat: migrate to next/image with custom openinary loader

app/[locale]/MenuClient.tsx

@@ -2,6 +2,7 @@
 
 import React, { useEffect, useState, useRef, Fragment } from "react";
 import { motion, AnimatePresence } from "framer-motion";
+import Image from "next/image";
 import { MenuCategory, MenuItem as MenuItemType } from "@/data/menu";
 import { CategoryNav } from "@/components/CategoryNav";
 import { MenuItem } from "@/components/MenuItem";
@@ -294,7 +295,13 @@ export default function MenuClient({ initialCategories, siteSettings }: { initia
             >
               {selectedItem.image && (
                 <div className="w-full h-80 relative">
-                  <img src={selectedItem.image} alt={selectedItem.name} className="w-full h-full object-cover" />
+                  <Image 
+                    src={selectedItem.image} 
+                    alt={selectedItem.name} 
+                    fill
+                    sizes="(max-width: 768px) 100vw, 400px"
+                    className="object-cover" 
+                  />
                   <button
                     className="absolute top-3 right-3 bg-black/50 text-white w-8 h-8 rounded-full flex items-center justify-center backdrop-blur-md transition-colors hover:bg-black/70"
                     onClick={() => setSelectedItem(null)}