From e78c49b70ef2a8faca127171e82ba3e5795f4d40 Mon Sep 17 00:00:00 2001
From: Vula Builder <deploy@vula.app>
Date: Wed, 29 Jul 2026 18:15:23 +0000
Subject: [PATCH] Deploy

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

diff --git a/src/components/sections/MzansiStorySection.tsx b/src/components/sections/MzansiStorySection.tsx
new file mode 100644
index 0000000..233dbcf
--- /dev/null
+++ b/src/components/sections/MzansiStorySection.tsx
@@ -0,0 +1,22 @@
+import Image from 'next/image'
+
+export default function MzansiStorySection() {
+  return (
+    <section data-vula-section="mzansistory" id="our-story" className="py-20 bg-[#101418] border-y-2 border-[#ea580c]">
+      <div className="container mx-auto px-4 grid grid-cols-1 lg:grid-cols-2 gap-0">
+        <div className="relative h-[400px] lg:h-auto">
+          <Image src="https://images.pexels.com/photos/2464687/pexels-photo-2464687.jpeg?auto=compress&cs=tinysrgb&h=350" alt="Mzansi street culture" fill className="object-cover grayscale contrast-150 border-2 border-[#d4af37] shadow-[8px_8px_0_0_#ea580c]" sizes="50vw" />
+        </div>
+        <div className="flex flex-col justify-center p-8 bg-[#ea580c] text-white">
+          <h2 className="text-4xl font-['Archivo_Black'] uppercase leading-tight">Born on the streets of <mark className="bg-[#16a34a] text-white px-2">South Africa</mark></h2>
+          <p className="mt-6 text-lg leading-relaxed">Mzansi isn't just a label — it's a movement. From Soweto to Sandton, we fuse global streetwear with local pride. Every stitch carries the energy of the township, the swagger of the city, and the soul of ubuntu.</p>
+          <p className="mt-4 text-lg">Our drops drop hard because we know the streets that raised us. <strong className="text-[#d4af37]">Built for the bold, worn by the real.</strong></p>
+          <div className="mt-8 flex items-center gap-4">
+            <div className="w-12 h-1 bg-[#d4af37]" />
+            <span className="uppercase text-sm tracking-widest">#MzansiFit</span>
+          </div>
+        </div>
+      </div>
+    </section>
+  )
+}
\ No newline at end of file