Deploy
This commit is contained in:
@@ -0,0 +1,68 @@
|
|||||||
|
'use client'
|
||||||
|
|
||||||
|
import { Shield, TreePine, Users, Waves } from 'lucide-react'
|
||||||
|
|
||||||
|
export default function GracefulBeginningsSection() {
|
||||||
|
return (
|
||||||
|
<section data-vula-section="gracefulbeginnings" id="graceful-beginnings" className="py-20 bg-[#f9fafb]">
|
||||||
|
<div className="max-w-7xl mx-auto px-4">
|
||||||
|
<div className="grid grid-cols-1 lg:grid-cols-2 gap-12 items-center">
|
||||||
|
{/* Image */}
|
||||||
|
<div className="relative h-80 lg:h-96 rounded-xl overflow-hidden shadow-card">
|
||||||
|
<img
|
||||||
|
src="https://images.pexels.com/photos/6354991/pexels-photo-6354991.jpeg?auto=compress&cs=tinysrgb&h=350"
|
||||||
|
alt="KwaNtofoNtofo pool and braai area"
|
||||||
|
className="object-cover w-full h-full"
|
||||||
|
/>
|
||||||
|
<div className="absolute inset-0 bg-gradient-to-t from-black/20 to-transparent" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Story */}
|
||||||
|
<div>
|
||||||
|
<p className="text-[#d4af37] uppercase tracking-widest text-sm font-semibold mb-2">
|
||||||
|
Since 2004
|
||||||
|
</p>
|
||||||
|
<h2 className="text-3xl md:text-4xl font-bold text-[#111827] mb-6">
|
||||||
|
Graceful Beginnings
|
||||||
|
</h2>
|
||||||
|
<div className="space-y-4 text-[#8b5a3c] text-base leading-relaxed">
|
||||||
|
<p>
|
||||||
|
KwaNtofoNtofo was born from a dream — to create a home-away-from-home in the heart of Pietermaritzburg.
|
||||||
|
Rooted in the Zulu philosophy of <em>ubuntu</em> ("I am because we are"), we opened our doors in 2004
|
||||||
|
with four thoughtfully designed rooms, each telling its own story through theme and decor.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Just across from a nature reserve, our guests wake to the sight of zebras grazing and monkeys swinging
|
||||||
|
in the trees. We are 1 km from Pietermaritzburg Airport, 4 km from UKZN, and a short drive to major
|
||||||
|
shopping centres — yet you feel a world away in our private, secure compound.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Behind the burglar alarm and the shaded parking lies a place where traditional South African
|
||||||
|
hospitality meets modern luxury. Our staff, trained in professional service with a warm smile,
|
||||||
|
ensure every stay is memorable. Whether it's a full English breakfast by the pool, a braai in the
|
||||||
|
tranquil entertainment area, or a quiet evening in the lounge, you are treated like royalty.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
{/* Feature highlights */}
|
||||||
|
<div className="grid grid-cols-2 gap-4 mt-8">
|
||||||
|
{[
|
||||||
|
{ icon: Shield, label: "Secure Parking & Alarm" },
|
||||||
|
{ icon: TreePine, label: "Across from Nature Reserve" },
|
||||||
|
{ icon: Waves, label: "Pool & Braai Area" },
|
||||||
|
{ icon: Users, label: "Attentive Professional Staff" },
|
||||||
|
].map((item, i) => {
|
||||||
|
const Icon = item.icon
|
||||||
|
return (
|
||||||
|
<div key={i} className="flex items-center gap-2 text-sm text-[#111827]">
|
||||||
|
<Icon className="w-5 h-5 text-[#16a34a]" />
|
||||||
|
<span>{item.label}</span>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
)
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user