diff --git a/src/App.tsx b/src/App.tsx
index 33d15f9..ec6fe35 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 RoomReservationPage from "@/pages/RoomReservationPage";
 export default function App() {
   return (
     <Routes>
       <Route element={<Layout />}>
         <Route path="/" element={<HomePage />} />
+        <Route path="/room-reservation" element={<RoomReservationPage />} />
       </Route>
     </Routes>
   );
diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx
index 3f5cfb7..4dc5b21 100644
--- a/src/components/Layout.tsx
+++ b/src/components/Layout.tsx
@@ -34,7 +34,9 @@ export default function Layout() {
   {
     "name": "Contact",
     "href": "#contact"
-  }
+  },
+  { name: "Room Reservation", href: "/room-reservation" },
+
 ];
 
   return (
diff --git a/src/pages/RoomReservationPage.tsx b/src/pages/RoomReservationPage.tsx
new file mode 100644
index 0000000..fbe5309
--- /dev/null
+++ b/src/pages/RoomReservationPage.tsx
@@ -0,0 +1,38 @@
+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 AvatarGroup from "@/components/ui/AvatarGroup";
+import { Check } from "lucide-react";
+import GridOrCarousel from "@/components/ui/GridOrCarousel";
+import ScrollReveal from "@/components/ui/ScrollReveal";
+import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
+
+export default function RoomReservationPage() {
+  return (
+    <>
+      <div data-webild-section="HeroOverlay"><section aria-label="Hero section" className="relative w-full h-svh overflow-hidden flex flex-col justify-end mb-20"><HeroBackgroundSlot /><ImageOrVideo imageSrc="https://img.freepik.com/free-photo/luxury-classic-modern-bedroom-suite-hotel_105762-1787.jpg" className="absolute inset-0 w-full h-full object-cover rounded-none" /><div className="absolute z-10 w-[150vw] h-[150vw] left-0 bottom-0 -translate-x-1/2 translate-y-1/2 backdrop-blur mask-[radial-gradient(circle,black_20%,transparent_70%)]" aria-hidden="true" /><div className="relative z-10 w-content-width mx-auto pb-10 md:pb-25"><div className="flex flex-col gap-3 w-full md:w-6/10 lg:w-1/2 xl:w-45/100 2xl:w-4/10"><div className="w-fit px-3 py-1 mb-1 text-sm card rounded"><p>Book Your Stay</p></div><TextAnimation text="Secure Your Stay in Batna" variant="fade" gradientText={true} tag="h1" className="text-7xl 2xl:text-8xl leading-[1.15] font-semibold text-white text-balance" /><TextAnimation text="Experience comfort and hospitality. Book your room directly online for the best rates and a seamless arrival at Hôtel El Hayat." variant="fade" gradientText={false} tag="p" className="text-lg md:text-xl text-white leading-snug text-balance" /><div className="flex flex-wrap gap-3 mt-2 md:mt-3"><Button text="Check Availability" href="#booking-form" variant="primary" /><Button text="View Rooms" href="/rooms" variant="secondary" animationDelay={0.1} /></div><div className="mt-3 md:mt-4"><AvatarGroup avatarsSrc={["https://img.freepik.com/free-photo/portrait-smiling-young-man-looking-camera_23-2148155634.jpg","https://img.freepik.com/free-photo/young-beautiful-woman-pink-warm-sweater-natural-look-smiling-portrait-isolated-long-hair_285396-896.jpg","https://img.freepik.com/free-photo/handsome-corporate-man-real-estate-agent-assistant-smiling-holding-hands-together-how-can-i-help-smiling-camera-standing-white-background_176420-45257.jpg"]} size="lg" label="Join Sarah J., Fatima A., and our happy guests" labelClassName="text-primary-cta-text" /></div></div></div></section></div>
+      <div data-webild-section="PricingSimpleCards"><section aria-label="Pricing section" className="py-20"><div className="flex flex-col gap-8 md:gap-10"><div className="flex flex-col items-center w-content-width mx-auto gap-2"><div className="px-3 py-1 mb-1 text-sm card rounded w-fit"><p>Room Rates</p></div><TextAnimation text="Choose Your Perfect Stay" variant="fade-blur" gradientText={true} tag="h2" className="md:max-w-8/10 text-6xl 2xl:text-7xl leading-[1.15] font-semibold text-center text-balance" /><TextAnimation text="Select from our range of comfortable and elegant rooms, designed for both business and leisure travelers in Batna." variant="fade-blur" gradientText={false} tag="p" className="md:max-w-7/10 text-lg md:text-xl leading-snug text-center text-balance" /><div className="flex flex-wrap justify-center gap-3 mt-2 md:mt-3"><Button text="Book Now" href="#booking-form" variant="primary" /><Button text="Contact Us" href="/contact" variant="secondary" animationDelay={0.1} /></div></div><ScrollReveal variant="fade-blur"><GridOrCarousel><div key="Standard Room" className="flex flex-col gap-4 xl:gap-5 2xl:gap-6 p-6 xl:p-7 2xl:p-8 h-full card rounded"><div className="px-3 py-1 text-sm card rounded w-fit"><p>Standard Room</p></div><div className="flex flex-col gap-1"><span className="text-5xl md:text-6xl font-semibold">6,000 DZD/nt</span><span className="text-base font-medium">A cozy and comfortable room perfect for solo travelers or short business trips.</span></div><div className="w-full h-px bg-foreground/20" /><div className="flex flex-col gap-3"><div key="1 Queen Bed" className="flex items-start gap-3"><div className="flex items-center justify-center shrink-0 size-6 primary-button rounded"><Check className="size-3 text-primary-cta-text" strokeWidth={2} /></div><span className="text-base">1 Queen Bed</span></div>
+<div key="Free Wi-Fi" className="flex items-start gap-3"><div className="flex items-center justify-center shrink-0 size-6 primary-button rounded"><Check className="size-3 text-primary-cta-text" strokeWidth={2} /></div><span className="text-base">Free Wi-Fi</span></div>
+<div key="Air Conditioning" className="flex items-start gap-3"><div className="flex items-center justify-center shrink-0 size-6 primary-button rounded"><Check className="size-3 text-primary-cta-text" strokeWidth={2} /></div><span className="text-base">Air Conditioning</span></div>
+<div key="En-suite Bathroom" className="flex items-start gap-3"><div className="flex items-center justify-center shrink-0 size-6 primary-button rounded"><Check className="size-3 text-primary-cta-text" strokeWidth={2} /></div><span className="text-base">En-suite Bathroom</span></div></div></div>
+<div key="Deluxe Room" className="flex flex-col gap-4 xl:gap-5 2xl:gap-6 p-6 xl:p-7 2xl:p-8 h-full card rounded"><div className="px-3 py-1 text-sm card rounded w-fit"><p>Deluxe Room</p></div><div className="flex flex-col gap-1"><span className="text-5xl md:text-6xl font-semibold">9,000 DZD/nt</span><span className="text-base font-medium">Spacious and elegantly furnished, ideal for couples or extended stays.</span></div><div className="w-full h-px bg-foreground/20" /><div className="flex flex-col gap-3"><div key="1 King Bed" className="flex items-start gap-3"><div className="flex items-center justify-center shrink-0 size-6 primary-button rounded"><Check className="size-3 text-primary-cta-text" strokeWidth={2} /></div><span className="text-base">1 King Bed</span></div>
+<div key="City View" className="flex items-start gap-3"><div className="flex items-center justify-center shrink-0 size-6 primary-button rounded"><Check className="size-3 text-primary-cta-text" strokeWidth={2} /></div><span className="text-base">City View</span></div>
+<div key="Mini-bar" className="flex items-start gap-3"><div className="flex items-center justify-center shrink-0 size-6 primary-button rounded"><Check className="size-3 text-primary-cta-text" strokeWidth={2} /></div><span className="text-base">Mini-bar</span></div>
+<div key="Free Breakfast" className="flex items-start gap-3"><div className="flex items-center justify-center shrink-0 size-6 primary-button rounded"><Check className="size-3 text-primary-cta-text" strokeWidth={2} /></div><span className="text-base">Free Breakfast</span></div></div></div>
+<div key="Executive Suite" className="flex flex-col gap-4 xl:gap-5 2xl:gap-6 p-6 xl:p-7 2xl:p-8 h-full card rounded"><div className="px-3 py-1 text-sm card rounded w-fit"><p>Executive Suite</p></div><div className="flex flex-col gap-1"><span className="text-5xl md:text-6xl font-semibold">15,000 DZD/nt</span><span className="text-base font-medium">Our premium offering with a separate living area for ultimate comfort and luxury.</span></div><div className="w-full h-px bg-foreground/20" /><div className="flex flex-col gap-3"><div key="Separate Living Area" className="flex items-start gap-3"><div className="flex items-center justify-center shrink-0 size-6 primary-button rounded"><Check className="size-3 text-primary-cta-text" strokeWidth={2} /></div><span className="text-base">Separate Living Area</span></div>
+<div key="Premium Amenities" className="flex items-start gap-3"><div className="flex items-center justify-center shrink-0 size-6 primary-button rounded"><Check className="size-3 text-primary-cta-text" strokeWidth={2} /></div><span className="text-base">Premium Amenities</span></div>
+<div key="Room Service" className="flex items-start gap-3"><div className="flex items-center justify-center shrink-0 size-6 primary-button rounded"><Check className="size-3 text-primary-cta-text" strokeWidth={2} /></div><span className="text-base">Room Service</span></div>
+<div key="Late Check-out" className="flex items-start gap-3"><div className="flex items-center justify-center shrink-0 size-6 primary-button rounded"><Check className="size-3 text-primary-cta-text" strokeWidth={2} /></div><span className="text-base">Late Check-out</span></div></div></div></GridOrCarousel></ScrollReveal></div></section></div>
+      <div data-webild-section="ContactSplitForm"><ContactSplitForm
+        tag="Book Your Stay"
+        title="Reserve Your Room at Hôtel El Hayat"
+        description="Plan your visit to Batna. Fill out the form below to request a room reservation, and our team will confirm your booking shortly."
+        inputs={[{"name":"fullName","type":"text","placeholder":"Full Name","required":true},{"name":"email","type":"email","placeholder":"Email Address","required":true},{"name":"phone","type":"tel","placeholder":"Phone Number","required":true},{"name":"checkIn","type":"date","placeholder":"Check-in Date","required":true},{"name":"checkOut","type":"date","placeholder":"Check-out Date","required":true},{"name":"guests","type":"number","placeholder":"Number of Guests","required":true}]}
+        textarea={{"name":"specialRequests","placeholder":"Special requests or preferences?","rows":4,"required":false}}
+        buttonText="Request Reservation"
+        imageSrc="https://img.freepik.com/free-photo/luxury-classic-modern-bedroom-suite-hotel_105762-1787.jpg"
+      /></div>
+    </>
+  );
+}
diff --git a/src/routes.ts b/src/routes.ts
index 362ecb5..4ed5653 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: '/room-reservation', label: 'Room Reservation', pageFile: 'RoomReservationPage' },
 ];