From c12021b1327bd78e5da736b2cf31314ea891f198 Mon Sep 17 00:00:00 2001
From: Vula Builder <deploy@vula.app>
Date: Sat, 1 Aug 2026 17:20:25 +0000
Subject: [PATCH] Deploy

---
 .../sections/CTAShopDropsSection.tsx          | 37 +++++++++++++++++++
 1 file changed, 37 insertions(+)
 create mode 100644 src/components/sections/CTAShopDropsSection.tsx

diff --git a/src/components/sections/CTAShopDropsSection.tsx b/src/components/sections/CTAShopDropsSection.tsx
new file mode 100644
index 0000000..053a684
--- /dev/null
+++ b/src/components/sections/CTAShopDropsSection.tsx
@@ -0,0 +1,37 @@
+import Link from 'next/link'
+
+export default function CTAShopDropsSection() {
+  return (
+    <section data-vula-section="ctashopdrops" id="shop-drops" className="bg-[#fbbf24] border-y-[3px] border-[#18181b]">
+      <div className="grid md:grid-cols-2 min-h-[420px]">
+        <div className="bg-[#18181b] text-[#fbbf24] p-8 md:p-14 flex flex-col justify-center border-b-[3px] md:border-b-0 md:border-r-[3px] border-[#18181b]">
+          <p className="text-xs md:text-sm font-black uppercase tracking-[0.2em] text-[#fbbf24] mb-4">Drop 04 — Live now</p>
+          <h2 className="font-black uppercase leading-[0.9] text-4xl md:text-6xl text-white">
+            Copped the <span className="text-[#fbbf24]">drop</span> yet?
+          </h2>
+          <p className="mt-5 text-white/80 font-medium max-w-md">
+            Limited pieces, no restocks. Free delivery over R750 to every kasi in SA.
+          </p>
+          <Link
+            href="/products"
+            className="mt-8 inline-flex items-center justify-center bg-[#fbbf24] text-[#18181b] font-black uppercase tracking-wide text-lg px-8 py-5 border-[3px] border-[#fbbf24] shadow-[6px_6px_0_0_#fbbf24] hover:shadow-[2px_2px_0_0_#fbbf24] hover:translate-x-1 hover:translate-y-1 transition-all duration-200 ease-out w-fit"
+          >
+            SHOP THE DROP
+          </Link>
+        </div>
+        <div className="bg-[#fbbf24] text-[#18181b] p-8 md:p-14 flex flex-col justify-center">
+          <p className="text-xs md:text-sm font-black uppercase tracking-[0.2em] mb-4">No restocks. No warning.</p>
+          <h2 className="font-black uppercase leading-[0.9] text-4xl md:text-7xl text-[#18181b]">
+            <span style={{ WebkitTextStroke: "2px #18181b", color: "transparent" }}>JOIN</span> THE MOVEMENT
+          </h2>
+          <p className="mt-5 font-semibold max-w-md text-[#18181b]/80">
+            100% Durban street culture printed loud. Your fit should say it before you do.
+          </p>
+          <Link href="/products" className="mt-8 inline-flex items-center justify-center bg-[#18181b] text-[#fbbf24] font-black uppercase text-lg px-8 py-5 border-[3px] border-[#18181b] shadow-[6px_6px_0_0_#18181b] hover:shadow-[2px_2px_0_0_#18181b] hover:translate-x-1 hover:translate-y-1 transition-all duration-200 ease-out w-fit">
+            Browse latest
+          </Link>
+        </div>
+      </div>
+    </section>
+  )
+}
\ No newline at end of file