Deploy

src/components/sections/ShopNowCtaSection.tsx

@@ -0,0 +1,40 @@
+'use client'
+
+import Image from "next/image"
+import Link from "next/link"
+import Button from "@/components/ui/Button"
+
+export default function ShopNowCtaSection() {
+  return (
+    <section data-vula-section="shopnowcta" id="shop-now" className="relative overflow-hidden bg-[#F0F8FF]">
+      <div className="grid md:grid-cols-2 min-h-[60vh]">
+        {/* Image side */}
+        <div className="relative h-72 md:h-auto">
+          <Image
+            src="https://images.pexels.com/photos/5999781/pexels-photo-5999781.jpeg?auto=compress&cs=tinysrgb&w=800&h=600&fit=crop"
+            alt="Stylish outfit on a confident young woman"
+            fill
+            sizes="(max-width: 768px) 100vw, 50vw"
+            className="object-cover"
+          />
+        </div>
+        {/* Content side */}
+        <div className="flex flex-col justify-center px-8 py-12 md:px-16 bg-[#0077BE] text-white">
+          <h2 className="text-3xl md:text-4xl font-bold mb-4 leading-tight">
+            Your Next Favourite Outfit Awaits
+          </h2>
+          <p className="text-white/80 text-lg mb-6">
+            Bold, modern fashion curated for the confident woman. Free delivery over R750, easy 14-day returns.
+          </p>
+          <div className="flex gap-4">
+            <Link href="/products">
+              <Button size="lg" className="bg-[#FFD700] text-[#1A2B3C] hover:bg-[#e6c200] transition-all duration-200">
+                Shop Now
+              </Button>
+            </Link>
+          </div>
+        </div>
+      </div>
+    </section>
+  )
+}