From 5713216457d10dfd1155381a8c177518a13d371e Mon Sep 17 00:00:00 2001
From: Vula Builder <deploy@vula.app>
Date: Tue, 23 Jun 2026 08:38:45 +0000
Subject: [PATCH] Deploy

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

diff --git a/src/components/sections/BrandAnthemSection.tsx b/src/components/sections/BrandAnthemSection.tsx
new file mode 100644
index 0000000..5d992b1
--- /dev/null
+++ b/src/components/sections/BrandAnthemSection.tsx
@@ -0,0 +1,38 @@
+'use client'
+
+import Image from 'next/image'
+import Button from '@/components/ui/Button'
+
+export default function BrandAnthemSection() {
+  return (
+    <section data-vula-section="brandanthem" id="brand-anthem" className="relative min-h-screen flex items-center justify-center bg-[#18181b] text-white overflow-hidden">
+      <div className="absolute inset-0">
+        <Image
+          src="https://images.pexels.com/photos/2259131/pexels-photo-2259131.jpeg?auto=compress&cs=tinysrgb&h=650&w=940"
+          alt="Urban streetwear style"
+          fill
+          sizes="100vw"
+          className="object-cover opacity-50"
+          priority
+        />
+      </div>
+      <div className="relative z-10 max-w-4xl mx-auto px-6 text-center">
+        <h1 className="text-6xl md:text-8xl font-black tracking-tight uppercase mb-6">S.A.W</h1>
+        <p className="text-2xl md:text-3xl font-light mb-4">South African Youth Streetwear</p>
+        <p className="text-xl md:text-2xl font-medium text-gray-300 mb-8">
+          Born in 2024. 19-year-old founder. Black &amp; white. No cap.
+        </p>
+        <p className="text-lg text-gray-400 mb-12 max-w-2xl mx-auto">
+          This is Smiso Khumalo&apos;s vision — quality T-shirts that speak your language. 
+          From the townships to the city, we dress the movement.
+        </p>
+        <div className="flex flex-col sm:flex-row gap-4 justify-center">
+          <Button variant="default" size="lg">Join the Movement</Button>
+          <Button variant="secondary" size="lg" className="border-white text-white hover:bg-white hover:text-[#18181b]">
+            Check the Tees
+          </Button>
+        </div>
+      </div>
+    </section>
+  )
+}
\ No newline at end of file