Deploy
This commit is contained in:
@@ -0,0 +1,43 @@
|
||||
'use client'
|
||||
|
||||
export default function UmlolozeloSection() {
|
||||
const testimonials = [
|
||||
{
|
||||
name: 'Thandi Mthembu',
|
||||
role: 'Frequent visitor, Johannesburg',
|
||||
quote: 'The staff remembered our names and dietary preferences from our first stay. That kind of attention makes Zulu Lodge feel like home.'
|
||||
},
|
||||
{
|
||||
name: 'David & Sarah Johnson',
|
||||
role: 'First-time safari guests, London',
|
||||
quote: 'We came for the wildlife but left with a deep appreciation for Zulu culture. The storytelling around the boma fire was unforgettable.'
|
||||
},
|
||||
{
|
||||
name: 'Mr. & Mrs. Van der Merwe',
|
||||
role: 'Cape Town, yearly family reunion',
|
||||
quote: 'Three generations under one thatched roof — the lodge catered to toddlers and grandparents alike with grace and warmth.'
|
||||
}
|
||||
]
|
||||
|
||||
return (
|
||||
<section data-vula-section="umlolozelo" id="umlolozelo-testimonials" className="py-20 bg-[#f9f7f4]">
|
||||
<div className="max-w-7xl mx-auto px-4">
|
||||
<h2 className="text-4xl font-semibold text-[#211c0d] mb-2 text-center">
|
||||
A Chorus of Guest Praise
|
||||
</h2>
|
||||
<p className="text-lg text-[#211c0d]/70 mb-12 text-center max-w-2xl mx-auto">
|
||||
Real voices that convey trust and warmth — stories of serenity, adventure, and heartfelt Zulu hospitality.
|
||||
</p>
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-8">
|
||||
{testimonials.map((t, i) => (
|
||||
<div key={i} className="bg-white rounded-xl p-6 shadow-md border border-[#e2dfd4]">
|
||||
<p className="text-[#211c0d] mb-4 italic leading-relaxed">"{t.quote}"</p>
|
||||
<p className="font-semibold text-[#211c0d]">{t.name}</p>
|
||||
<p className="text-sm text-[#211c0d]/60">{t.role}</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user