Deploy

2026-06-23 08:47:14 +00:00
parent 75f25fabe0
commit 6449ece114
1 changed files with 40 additions and 0 deletions
@@ -0,0 +1,40 @@
+'use client'
+
+import Button from "@/components/ui/Button"
+import Image from "next/image"
+
+export default function BookYourStayCTASection() {
+  return (
+    <section data-vula-section="bookyourstaycta" id="book-your-stay" className="relative h-[60vh] md:h-[70vh] overflow-hidden">
+      {/* Background image with overlay */}
+      <div className="absolute inset-0">
+        <Image
+          src="https://images.pexels.com/photos/13872620/pexels-photo-13872620.jpeg?auto=compress&cs=tinysrgb&w=1200&h=800&fit=crop"
+          alt="Bushveld sanctuary interior"
+          fill
+          sizes="100vw"
+          className="object-cover"
+          priority
+        />
+        <div className="absolute inset-0 bg-gradient-to-r from-[#C0392B]/80 via-[#C0392B]/60 to-transparent" />
+      </div>
+
+      {/* Content */}
+      <div className="relative z-10 flex flex-col items-center justify-center h-full text-center px-6 text-white">
+        <h2 className="text-4xl md:text-5xl lg:text-6xl font-bold mb-4 drop-shadow-lg">
+          Your bushveld sanctuary is waiting
+        </h2>
+        <p className="text-lg md:text-xl text-white/80 max-w-2xl mb-10">
+          Best online rates — book direct and secure your themed room today.
+        </p>
+        <Button
+          variant="default"
+          className="bg-[#F1C40F] text-[#2C1810] hover:bg-[#E67E22] hover:text-white px-10 py-4 text-lg font-semibold rounded-xl shadow-[var(--shadow-lifted)] transition-all duration-200 ease-out"
+          asChild
+        >
+          <a href="/booking">Check Availability &amp; Book</a>
+        </Button>
+      </div>
+    </section>
+  )
+}