Almost all content on home page

src/components/our-collection.tsx

@@ -0,0 +1,42 @@
+import Image from 'next/image';
+
+const collections = [
+  {
+    title: 'Bestsellers',
+    image: '/images/collections/bestsellers.jpg', // replace with actual image path
+  },
+  {
+    title: 'New Arrivals',
+    image: '/images/collections/new-arrivals.jpg', // replace with actual image path
+  },
+  {
+    title: 'Gift Collection',
+    image: '/images/collections/gifting.jpg', // replace with actual image path
+  },
+];
+
+export function Collections() {
+  return (
+    <div className='max-w-7xl mx-auto grid gap-6 sm:grid-cols-1 md:grid-cols-2 lg:grid-cols-3'>
+      {collections.map((collection, index) => (
+        <div
+          key={index}
+          className='block rounded-lg overflow-hidden shadow-lg bg-white transition transform hover:scale-105 duration-300'
+        >
+          <Image
+            src={collection.image}
+            alt={collection.title}
+            width={500}
+            height={300}
+            className='w-full object-cover'
+          />
+          <div className='p-4'>
+            <h3 className='text-center text-base font-light'>
+              {collection.title}
+            </h3>
+          </div>
+        </div>
+      ))}
+    </div>
+  );
+}