Deploy

src/components/sections/BookingCTASection.tsx

@@ -0,0 +1,44 @@
+import Link from 'next/link'
+import Button from '@/components/ui/Button'
+
+export default function BookingCTASection() {
+  return (
+    <section
+      id="booking-cta"
+      data-vula-section="booking-cta"
+      className="py-28 bg-[#0f1712] border-t border-[#304036]"
+    >
+      <div className="container mx-auto px-4 max-w-4xl text-center">
+        {/* Framed eyebrow */}
+        <div className="flex items-center justify-center gap-4 mb-6">
+          <span className="block w-14 h-px bg-[#d4af37]" />
+          <span className="text-[#d4af37] text-xs font-sans uppercase tracking-[0.2em]">
+            Reserve Your Sanctuary
+          </span>
+          <span className="block w-14 h-px bg-[#d4af37]" />
+        </div>
+
+        <h2 className="font-serif font-light text-4xl md:text-5xl text-[#e7eeea] leading-tight mb-6">
+          <span className="italic text-[#d4af37]">Best</span> available rate,
+          <br />
+          no hidden fees
+        </h2>
+
+        <p className="text-[#b0bfb8] text-lg max-w-xl mx-auto mb-10">
+          Effortless reservation with a direct booking promise — the price you
+          see is the price you pay.
+        </p>
+
+        <Link href="/booking">
+          <Button
+            variant="default"
+            size="lg"
+            className="bg-[#d4af37] hover:bg-[#c9a230] text-[#0f1712] px-10 py-3 text-lg font-sans uppercase tracking-widest"
+          >
+            Reserve Your Room
+          </Button>
+        </Link>
+      </div>
+    </section>
+  )
+}