brand partner logo added

src/app/about/page.tsx

@@ -2,6 +2,7 @@ import Image from "next/image"
 import Link from "next/link"
 import { ArrowRight, Share2, Instagram, Twitter, Facebook, Linkedin, MapPin, BrainCircuit, Captions, Hash, ChartLine, CalendarCheck } from "lucide-react"
 import Teams from "@/components/about/Teams"
+import Partners from "@/components/about/Partners"
 
 export default function AboutPage() {
     return (
@@ -216,28 +217,8 @@ export default function AboutPage() {
             </section>
 
             {/* Social Proof */}
-            <section className="py-20">
-                <div className="container px-4 mx-auto max-w-7xl">
-                    <div className="text-center mb-16">
-                        <h2 className="text-3xl font-bold text-gray-900">Trusted by Businesses Worldwide</h2>
-                        <div className="w-20 h-1 mt-2 mx-auto bg-[#6a47ed]"></div>
-                    </div>
+            <Partners />
 
-                    <div className="grid grid-cols-2 gap-8 md:grid-cols-4 lg:grid-cols-6">
-                        {[...Array(6)].map((_, i) => (
-                            <div key={i} className="flex items-center justify-center">
-                                <Image
-                                    src="/assets/images/logo.webp"
-                                    alt={`Company ${i + 1}`}
-                                    width={120}
-                                    height={60}
-                                    className="opacity-50 hover:opacity-100 transition-opacity"
-                                />
-                            </div>
-                        ))}
-                    </div>
-                </div>
-            </section>
 
             {/* Contact Section */}
             <section className="py-20 bg-gray-50">

src/components/about/Partners.tsx

@@ -0,0 +1,68 @@
+"use client";
+import Image from "next/image";
+import * as React from "react";
+
+interface BrandsItem {
+    id: string;
+    name: string;
+    logo: string;
+}
+
+const brands: BrandsItem[] = [
+    {
+        id: "1",
+        name: "Facebook",
+        logo: "/assets/images/brands/facebook.webp",
+    },
+    {
+        id: "2",
+        name: "X",
+        logo: "/assets/images/brands/x-twitter.png",
+    },
+    {
+        id: "3",
+        name: "LinkedIn",
+        logo: "/assets/images/brands/linkedin.webp",
+    },
+    {
+        id: "4",
+        name: "Chat GPT",
+        logo: "/assets/images/brands/chatgpt.webp",
+    },
+    {
+        id: "5",
+        name: "Dal E",
+        logo: "/assets/images/brands/dall-e-logo.webp",
+    },
+
+];
+
+export default function Partners() {
+
+    return (
+        <section className="py-20">
+            <div className="container px-4 mx-auto max-w-7xl">
+                <div className="text-center mb-16">
+                    <h2 className="text-3xl font-bold text-gray-900">Trusted by Businesses & Partners Worldwide</h2>
+                    <div className="w-20 h-1 mt-2 mx-auto bg-[#6a47ed]"></div>
+                </div>
+
+                <div className="grid grid-cols-2 gap-8 md:grid-cols-4 lg:grid-cols-6">
+                    {brands.map((brand) => (
+                        <div key={brand.id} className="flex items-center justify-center">
+                            <Image
+                                src={brand.logo}
+                                alt={brand.name}
+                                width={100}
+                                height={60}
+                                className="opacity-50 hover:opacity-100 transition-opacity"
+                            />
+                        </div>
+                    ))}
+                </div>
+            </div>
+        </section>
+
+
+    )
+}