From 7883b326600f092e7264bac767541dbd28e2a6be Mon Sep 17 00:00:00 2001
From: kudinDmitriyUp <kudin.dmitriy.up@gmail.com>
Date: Wed, 3 Jun 2026 12:54:08 +0000
Subject: [PATCH 1/2] Bob AI: Add book-now page

---
 src/App.tsx               |  2 +
 src/components/Layout.tsx |  4 +-
 src/pages/BookNowPage.tsx | 79 +++++++++++++++++++++++++++++++++++++++
 src/routes.ts             |  1 +
 4 files changed, 85 insertions(+), 1 deletion(-)
 create mode 100644 src/pages/BookNowPage.tsx

diff --git a/src/App.tsx b/src/App.tsx
index 33d15f9..c086d1d 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -2,11 +2,13 @@ import { Routes, Route } from 'react-router-dom';
 import Layout from './components/Layout';
 import HomePage from './pages/HomePage';
 
+import BookNowPage from "@/pages/BookNowPage";
 export default function App() {
   return (
     <Routes>
       <Route element={<Layout />}>
         <Route path="/" element={<HomePage />} />
+        <Route path="/book-now" element={<BookNowPage />} />
       </Route>
     </Routes>
   );
diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx
index 67687a2..1b04987 100644
--- a/src/components/Layout.tsx
+++ b/src/components/Layout.tsx
@@ -34,7 +34,9 @@ export default function Layout() {
   {
     "name": "Social Proof",
     "href": "#social-proof"
-  }
+  },
+  { name: "Book Now", href: "/book-now" },
+
 ];
 
   return (
diff --git a/src/pages/BookNowPage.tsx b/src/pages/BookNowPage.tsx
new file mode 100644
index 0000000..4fa1bc9
--- /dev/null
+++ b/src/pages/BookNowPage.tsx
@@ -0,0 +1,79 @@
+import { routes } from "@/routes";
+import NavbarCentered from "@/components/ui/NavbarCentered";
+import HeroBillboard from "@/components/sections/hero/HeroBillboard";
+import FeaturesDetailedSteps from "@/components/sections/features/FeaturesDetailedSteps";
+import ContactCta from "@/components/sections/contact/ContactCta";
+import FooterSimple from "@/components/sections/footer/FooterSimple";
+
+export default function BookNowPage() {
+  return (
+    <>
+      <NavbarCentered
+        logo="Bookify"
+        navItems={routes.map((r) => ({ name: r.label, href: r.path }))}
+        ctaButton={{ text: "Get Started", href: "/contact" }}
+      />
+
+      <HeroBillboard
+        tag="Book Your Experience"
+        title="Seamless Booking, Unforgettable Moments"
+        description="Discover and reserve your next adventure with ease. From cozy stays to thrilling activities, we've got you covered."
+        primaryButton={{ text: "Book Now", href: "/book-now" }}
+        secondaryButton={{ text: "Learn More", href: "/about" }}
+        imageSrc="https://img.b2bpic.net/s/placeholder-image-wide.jpg"
+      />
+
+      <FeaturesDetailedSteps
+        tag="How It Works"
+        title="Your Journey in 3 Simple Steps"
+        description="Booking your perfect experience is quick and easy. Follow these steps to get started."
+        steps={[
+          {
+            tag: "Step 1",
+            title: "Search & Discover",
+            subtitle: "Find your ideal experience",
+            description: "Browse through our curated selection of activities, accommodations, and events.",
+            imageSrc: "https://img.b2bpic.net/s/step1.jpg",
+          },
+          {
+            tag: "Step 2",
+            title: "Customize & Confirm",
+            subtitle: "Tailor your booking",
+            description: "Select dates, add extras, and confirm your reservation with secure payment.",
+            imageSrc: "https://img.b2bpic.net/s/step2.jpg",
+          },
+          {
+            tag: "Step 3",
+            title: "Enjoy Your Experience",
+            subtitle: "Create lasting memories",
+            description: "Receive instant confirmation and prepare for your unforgettable adventure.",
+            imageSrc: "https://img.b2bpic.net/s/step3.jpg",
+          },
+        ]}
+      />
+
+      <ContactCta
+        tag="Ready to Book?"
+        text="Don't wait, secure your spot today and start making memories."
+        primaryButton={{ text: "Start Booking", href: "/book-now" }}
+        secondaryButton={{ text: "Contact Us", href: "/contact" }}
+      />
+
+      <FooterSimple
+        brand="Bookify"
+        columns={[
+          {
+            title: "Product",
+            items: [{ label: "Features", href: "/features" }, { label: "Pricing", href: "/pricing" }],
+          },
+          {
+            title: "Company",
+            items: [{ label: "About Us", href: "/about" }, { label: "Contact", href: "/contact" }],
+          },
+        ]}
+        copyright="2024 Bookify. All rights reserved."
+        links={[{ label: "Privacy Policy", href: "/privacy" }, { label: "Terms of Service", href: "/terms" }]}
+      />
+    </>
+  );
+}
\ No newline at end of file
diff --git a/src/routes.ts b/src/routes.ts
index 362ecb5..f3e21fe 100644
--- a/src/routes.ts
+++ b/src/routes.ts
@@ -6,4 +6,5 @@ export interface Route {
 
 export const routes: Route[] = [
   { path: '/', label: 'Home', pageFile: 'HomePage' },
+  { path: '/book-now', label: 'Book Now', pageFile: 'BookNowPage' },
 ];
-- 
2.49.1


From 092d71250873f000654f176a7a2648933feba032 Mon Sep 17 00:00:00 2001
From: kudinDmitriyUp <kudin.dmitriy.up@gmail.com>
Date: Wed, 3 Jun 2026 12:54:25 +0000
Subject: [PATCH 2/2] Bob AI: Populate src/pages/BookNowPage.tsx (snippet
 builder, 2 sections)

---
 src/pages/BookNowPage.tsx | 90 ++++++++-------------------------------
 1 file changed, 17 insertions(+), 73 deletions(-)

diff --git a/src/pages/BookNowPage.tsx b/src/pages/BookNowPage.tsx
index 4fa1bc9..e93e463 100644
--- a/src/pages/BookNowPage.tsx
+++ b/src/pages/BookNowPage.tsx
@@ -1,79 +1,23 @@
-import { routes } from "@/routes";
-import NavbarCentered from "@/components/ui/NavbarCentered";
-import HeroBillboard from "@/components/sections/hero/HeroBillboard";
-import FeaturesDetailedSteps from "@/components/sections/features/FeaturesDetailedSteps";
-import ContactCta from "@/components/sections/contact/ContactCta";
-import FooterSimple from "@/components/sections/footer/FooterSimple";
+import Button from "@/components/ui/Button";
+import HeroBackgroundSlot from "@/components/ui/HeroBackgroundSlot";
+import TextAnimation from "@/components/ui/TextAnimation";
+import ImageOrVideo from "@/components/ui/ImageOrVideo";
+import ScrollReveal from "@/components/ui/ScrollReveal";
+import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
 
 export default function BookNowPage() {
   return (
     <>
-      <NavbarCentered
-        logo="Bookify"
-        navItems={routes.map((r) => ({ name: r.label, href: r.path }))}
-        ctaButton={{ text: "Get Started", href: "/contact" }}
-      />
-
-      <HeroBillboard
-        tag="Book Your Experience"
-        title="Seamless Booking, Unforgettable Moments"
-        description="Discover and reserve your next adventure with ease. From cozy stays to thrilling activities, we've got you covered."
-        primaryButton={{ text: "Book Now", href: "/book-now" }}
-        secondaryButton={{ text: "Learn More", href: "/about" }}
-        imageSrc="https://img.b2bpic.net/s/placeholder-image-wide.jpg"
-      />
-
-      <FeaturesDetailedSteps
-        tag="How It Works"
-        title="Your Journey in 3 Simple Steps"
-        description="Booking your perfect experience is quick and easy. Follow these steps to get started."
-        steps={[
-          {
-            tag: "Step 1",
-            title: "Search & Discover",
-            subtitle: "Find your ideal experience",
-            description: "Browse through our curated selection of activities, accommodations, and events.",
-            imageSrc: "https://img.b2bpic.net/s/step1.jpg",
-          },
-          {
-            tag: "Step 2",
-            title: "Customize & Confirm",
-            subtitle: "Tailor your booking",
-            description: "Select dates, add extras, and confirm your reservation with secure payment.",
-            imageSrc: "https://img.b2bpic.net/s/step2.jpg",
-          },
-          {
-            tag: "Step 3",
-            title: "Enjoy Your Experience",
-            subtitle: "Create lasting memories",
-            description: "Receive instant confirmation and prepare for your unforgettable adventure.",
-            imageSrc: "https://img.b2bpic.net/s/step3.jpg",
-          },
-        ]}
-      />
-
-      <ContactCta
-        tag="Ready to Book?"
-        text="Don't wait, secure your spot today and start making memories."
-        primaryButton={{ text: "Start Booking", href: "/book-now" }}
-        secondaryButton={{ text: "Contact Us", href: "/contact" }}
-      />
-
-      <FooterSimple
-        brand="Bookify"
-        columns={[
-          {
-            title: "Product",
-            items: [{ label: "Features", href: "/features" }, { label: "Pricing", href: "/pricing" }],
-          },
-          {
-            title: "Company",
-            items: [{ label: "About Us", href: "/about" }, { label: "Contact", href: "/contact" }],
-          },
-        ]}
-        copyright="2024 Bookify. All rights reserved."
-        links={[{ label: "Privacy Policy", href: "/privacy" }, { label: "Terms of Service", href: "/terms" }]}
-      />
+      <div data-webild-section="HeroSplit"><section aria-label="Hero section" className="relative flex items-center h-fit md:h-svh pt-25 pb-20 md:py-0"><HeroBackgroundSlot /><div className="flex flex-col md:flex-row items-center gap-12 md:gap-20 w-content-width mx-auto"><div className="w-full md:w-1/2"><div className="flex flex-col items-center md:items-start gap-3"><div className="px-3 py-1 mb-1 text-sm card rounded w-fit"><p>Book Now</p></div><TextAnimation text="Schedule Your Service with Brand Today" variant="fade-blur" gradientText={true} tag="h1" className="text-7xl 2xl:text-8xl leading-[1.15] font-semibold text-center md:text-left text-balance" /><TextAnimation text="Experience the convenience of booking your next appointment online. Our straightforward process ensures you can secure your preferred time quickly and efficiently, getting you closer to the service you need. Start now and take the first step." variant="fade-blur" gradientText={false} tag="p" className="md:max-w-8/10 text-lg md:text-xl leading-snug text-center md:text-left text-balance" /><div className="flex flex-wrap max-md:justify-center gap-3 mt-2 md:mt-3"><Button text="Book Now" href="#booking-form" variant="primary" /><Button text="View Services" href="/services" variant="secondary" animationDelay={0.1} /></div></div></div><ScrollReveal variant="fade-blur" delay={0.2} className="w-full md:w-1/2 h-100 md:h-[65vh] md:max-h-[75svh] p-2 xl:p-3 2xl:p-4 card rounded overflow-hidden"><ImageOrVideo imageSrc="https://img.freepik.com/premium-photo/young-woman-using-laptop-booking-online-appointment-clinic-modern-office_236854-47007.jpg" /></ScrollReveal></div></section></div>
+      <div data-webild-section="ContactSplitForm"><ContactSplitForm
+        tag="Book Now"
+        title="Schedule Your Service Today"
+        description="Ready to experience our services? Use the form below to book your appointment quickly and conveniently. We look forward to serving you."
+        inputs={[{"name":"fullName","type":"text","placeholder":"Your Full Name","required":true},{"name":"email","type":"email","placeholder":"Your Email Address","required":true},{"name":"phone","type":"tel","placeholder":"Your Phone Number","required":true},{"name":"service","type":"text","placeholder":"Preferred Service (e.g., Consultation)","required":true}]}
+        textarea={{"name":"message","placeholder":"Any specific requests or questions?","rows":4,"required":false}}
+        buttonText="Confirm Booking"
+        imageSrc="https://img.freepik.com/premium-photo/businesswoman-using-laptop-making-online-appointment-booking-calendar-schedule-management-concept_31965-10336.jpg"
+      /></div>
     </>
   );
-}
\ No newline at end of file
+}
-- 
2.49.1