This commit is contained in:
Vula Builder
2026-06-23 08:39:10 +00:00
parent b269a71e61
commit 52708c1c66
@@ -0,0 +1,45 @@
'use client'
import Button from "@/components/ui/Button"
import { MapPin } from 'lucide-react'
export default function RoyalThresholdSection() {
return (
<section data-vula-section="royalthreshold"
id="royal-threshold"
className="relative h-[80vh] lg:h-[90vh] overflow-hidden"
>
{/* Background Image */}
<div className="absolute inset-0">
<img
src="https://images.pexels.com/photos/9131039/pexels-photo-9131039.jpeg?auto=compress&cs=tinysrgb&h=650&w=940"
alt="KwaNtofoNtofo Guest House entrance"
className="object-cover w-full h-full"
/>
<div className="absolute inset-0 bg-black/50" />
</div>
{/* Content */}
<div className="relative z-10 flex flex-col justify-center items-center h-full text-center px-4">
<div className="max-w-3xl">
<p className="text-[#d4af37] uppercase tracking-widest text-sm font-semibold mb-4">
Established 2004
</p>
<h1 className="text-4xl md:text-5xl lg:text-6xl font-bold text-white leading-tight mb-4">
KwaNtofoNtofo
</h1>
<p className="text-xl md:text-2xl text-white/90 font-light mb-8">
Your Regal Home in the Bushveld
</p>
<Button variant="default" size="lg" className="bg-[#d4af37] hover:bg-[#b8962f] text-white font-semibold">
<a href="/services">Explore Our Rooms</a>
</Button>
<div className="flex items-center justify-center gap-2 text-white/70 mt-6 text-sm">
<MapPin className="w-4 h-4 text-[#d4af37]" />
<span>44 Rutherford Circle, Bisley, Pietermaritzburg</span>
</div>
</div>
</div>
</section>
)
}