54 lines
2.5 KiB
TypeScript
54 lines
2.5 KiB
TypeScript
import Image from 'next/image'
|
||
|
||
const originImage = 'https://images.pexels.com/photos/2035464/pexels-photo-2035464.jpeg?auto=compress&cs=tinysrgb&h=350&w=250'
|
||
|
||
export default function KhumaloOriginSection() {
|
||
return (
|
||
<section
|
||
id="khumalo-origin"
|
||
data-vula-section="khumalo-origin"
|
||
className="py-20 bg-[#ffffff] border-t border-gray-100"
|
||
>
|
||
<div className="max-w-6xl mx-auto px-4 grid md:grid-cols-2 gap-12 items-center">
|
||
{/* Portrait */}
|
||
<div className="relative aspect-[3/4] overflow-hidden rounded-xl shadow-[var(--shadow-card)]">
|
||
<Image
|
||
src={originImage}
|
||
alt="Smiso Khumalo - Founder of S.A.W"
|
||
fill
|
||
className="object-cover grayscale"
|
||
sizes="(max-width: 768px) 100vw, 50vw"
|
||
/>
|
||
</div>
|
||
|
||
{/* Story */}
|
||
<div className="space-y-6">
|
||
<div className="w-12 h-0.5 bg-[#dc2626]" />
|
||
<h2 className="text-3xl md:text-4xl font-bold text-[#18181b] uppercase tracking-tight">
|
||
The Khumalo Origin
|
||
</h2>
|
||
<p className="text-gray-700 leading-relaxed">
|
||
In 2024, 19-year-old Smiso Khumalo noticed a gap in the South African streetwear scene:
|
||
T-shirts that looked good but lacked quality fabric and construction. Most options were
|
||
either cheap prints on flimsy cotton or overpriced imports with no soul.
|
||
</p>
|
||
<p className="text-gray-700 leading-relaxed">
|
||
Smiso started S.A.W – South African Wear – with one simple belief: young people from
|
||
townships and cities alike deserve tees that feel premium, fit right, and carry the
|
||
energy of their culture. No logos plastered everywhere. Just clean design, heavyweight
|
||
cotton, and a red accent that says "this is ours."
|
||
</p>
|
||
<p className="text-gray-700 leading-relaxed">
|
||
Every S.A.W tee is cut for the urban African silhouette – broader shoulders, roomier
|
||
chest – then printed locally in Johannesburg. Smiso personally checks each batch.
|
||
If the print isn't sharp or the fabric doesn't drape right, it's pulled.
|
||
</p>
|
||
<p className="text-gray-700 font-medium text-lg">
|
||
"We're not just selling T-shirts. We're proving that quality streetwear can come from
|
||
Soweto to Sandton – and look better than anything else."
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
)
|
||
} |