Deploy

src/components/sections/ReservationCTASection.tsx

@@ -0,0 +1,47 @@
+'use client'
+
+import Button from '@/components/ui/Button'
+
+export default function ReservationCTASection() {
+  return (
+    <section
+      id="reservation-cta"
+      data-vula-section="reservationcta"
+      className="relative min-h-[60vh] flex items-center justify-center overflow-hidden"
+    >
+      {/* Video background */}
+      <video
+        autoPlay
+        muted
+        loop
+        playsInline
+        poster="https://images.pexels.com/photos/5907904/pexels-photo-5907904.jpeg?auto=compress&cs=tinysrgb&h=350"
+        className="absolute inset-0 w-full h-full object-cover"
+      >
+        <source src="https://player.vimeo.com/external/3129671.sd.mp4?s=dummy" type="video/mp4" />
+      </video>
+
+      {/* Overlay */}
+      <div className="absolute inset-0 bg-gradient-to-t from-black/70 via-black/40 to-black/20" />
+
+      {/* Content */}
+      <div className="relative z-10 text-center px-6 max-w-3xl">
+        <h2 className="text-5xl md:text-6xl font-bold text-white mb-4">Join the Table</h2>
+        <p className="text-lg md:text-xl text-white/80 mb-8">
+          Reserve a seat for an unforgettable evening or order takeout to enjoy Pino's at home.
+        </p>
+        <Button
+          variant="default"
+          size="lg"
+          className="bg-[#FFEB3B] text-[#212121] hover:bg-[#FFEB3B]/90 animate-pulse shadow-lg"
+          onClick={() => window.open('tel:+13125551234', '_self')}
+        >
+          Reserve Your Spot
+        </Button>
+        <p className="text-white/60 mt-4 text-sm">
+          Or call us at (312) 555-1234 for immediate reservations.
+        </p>
+      </div>
+    </section>
+  )
+}