Wire Meshkee static images, SEO, and customer account menu.

Connect homepage image slots and favicon to the API, add sitemap config and page metadata, and implement header login with profile/admin dropdown.

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

src/components/OnlineProgramSection.tsx

@@ -1,6 +1,16 @@
+import SlotImage from "@/components/SlotImage";
 import { onlineProgramText } from "@/data/home";
+import type { SlotOverlay } from "@/lib/static-images";
+import { parseAspectRatio } from "@/lib/static-images";
+
+type OnlineProgramSectionProps = {
+  banner: SlotOverlay;
+};
+
+export default function OnlineProgramSection({ banner }: OnlineProgramSectionProps) {
+  const image = banner.items[0];
+  const ratio = parseAspectRatio(banner.aspectRatio);
 
-export default function OnlineProgramSection() {
   return (
     <div className="wb-frame" id="section2">
       <section
@@ -59,12 +69,20 @@ export default function OnlineProgramSection() {
             </div>
             <div className="col-lg-6 order-force-1">
               <div className="bg-img text-center">
-                <img
-                  className="mr-5"
-                  style={{ height: "450px" }}
-                  alt="برنامه آنلاین"
-                  src="/images/sections/rehab-equipment.png"
-                />
+                {image ? (
+                  <SlotImage
+                    className="mr-5"
+                    style={{
+                      height: ratio ? undefined : "450px",
+                      width: "auto",
+                      maxWidth: "100%",
+                      ...(ratio ? { aspectRatio: ratio, height: "auto", maxHeight: "450px" } : {}),
+                    }}
+                    src={image.image}
+                    alt={image.title || "برنامه آنلاین"}
+                    fallbackSrc={image.fallbackSrc}
+                  />
+                ) : null}
               </div>
             </div>
           </div>