Update src/app/passenger-options/page.tsx

Merge version_1 into main

src/app/baggage-selection/page.tsx

@@ -0,0 +1,104 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
+import PricingCardThree from "@/components/sections/pricing/PricingCardThree";
+import FooterMedia from "@/components/sections/footer/FooterMedia";
+import { CheckCircle, Luggage } from "lucide-react";
+
+export default function BaggageSelectionPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="expand-hover"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="rounded"
+      contentWidth="medium"
+      sizing="largeSmallSizeMediumTitles"
+      background="blurBottom"
+      cardStyle="subtle-shadow"
+      primaryButtonStyle="primary-glow"
+      secondaryButtonStyle="glass"
+      headingFontWeight="light"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleFullscreen
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Check-in", id: "/check-in" },
+            { name: "Booking", id: "/booking" },
+            { name: "Loading", id: "/loading-screen" },
+            { name: "Confirmation", id: "/confirmation" },
+          ]}
+          brandName="Dealta Airlines"
+          bottomLeftText="Touchscreen Kiosk"
+          bottomRightText="Terminal 1 - Gate B45"
+        />
+      </div>
+
+      <div id="baggage-selection" data-section="baggage-selection">
+        <PricingCardThree
+          plans={[
+            {
+              id: "0-bags",              price: "No Bags",              name: "Carry-on Only",              buttons: [{ text: "Select", href: "/loading-screen" }],
+              features: [
+                "Carry-on bag allowed",                "Personal item included",                "No checked baggage"],
+            },
+            {
+              id: "1-bag",              price: "1 Bag",              name: "Single Checked Bag",              badge: "Most Common",              badgeIcon: CheckCircle,
+              buttons: [{ text: "Select", href: "/loading-screen" }],
+              features: [
+                "1 checked bag (up to 50 lbs)",                "Carry-on bag allowed",                "Personal item included"],
+            },
+            {
+              id: "2-bags",              price: "2 Bags",              name: "Multiple Checked Bags",              buttons: [{ text: "Select", href: "/loading-screen" }],
+              features: [
+                "2 checked bags (up to 50 lbs each)",                "Carry-on bag allowed",                "Personal item included"],
+            },
+          ]}
+          title="Select Baggage"
+          description="Choose the number of checked bags you're bringing on this flight"
+          tag="Baggage Options"
+          tagIcon={Luggage}
+          tagAnimation="slide-up"
+          textboxLayout="default"
+          useInvertedBackground={false}
+          animationType="slide-up"
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterMedia
+          imageSrc="http://img.b2bpic.net/free-photo/woman-with-shopping-bags-sitting-coach-shopping-mall_1303-29617.jpg?_wi=2"
+          imageAlt="Dealta Airlines terminal footer"
+          columns={[
+            {
+              title: "Quick Links",              items: [
+                { label: "Check-in", href: "/check-in" },
+                { label: "Booking", href: "/booking" },
+                { label: "Flight Status", href: "https://example.com/status" },
+              ],
+            },
+            {
+              title: "Support",              items: [
+                { label: "Help Center", href: "https://example.com/help" },
+                { label: "Contact Us", href: "#contact" },
+                { label: "FAQ", href: "https://example.com/faq" },
+              ],
+            },
+            {
+              title: "Legal",              items: [
+                { label: "Privacy Policy", href: "https://example.com/privacy" },
+                {
+                  label: "Terms of Service",                  href: "https://example.com/terms"
+                },
+                { label: "Accessibility", href: "https://example.com/accessibility" },
+              ],
+            },
+          ]}
+          logoText="Dealta Airlines"
+          copyrightText="© 2025 Dealta Airlines | All rights reserved"
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/booking/page.tsx

@@ -0,0 +1,85 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
+import HeroLogo from "@/components/sections/hero/HeroLogo";
+import FooterMedia from "@/components/sections/footer/FooterMedia";
+
+export default function BookingPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="expand-hover"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="rounded"
+      contentWidth="medium"
+      sizing="largeSmallSizeMediumTitles"
+      background="blurBottom"
+      cardStyle="subtle-shadow"
+      primaryButtonStyle="primary-glow"
+      secondaryButtonStyle="glass"
+      headingFontWeight="light"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleFullscreen
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Check-in", id: "/check-in" },
+            { name: "Booking", id: "/booking" },
+            { name: "Loading", id: "/loading-screen" },
+            { name: "Confirmation", id: "/confirmation" },
+          ]}
+          brandName="Dealta Airlines"
+          bottomLeftText="Touchscreen Kiosk"
+          bottomRightText="Terminal 1 - Gate B45"
+        />
+      </div>
+
+      <div id="hero" data-section="hero">
+        <HeroLogo
+          logoText="Book a Flight"
+          description="Search and book your next Dealta Airlines flight"
+          buttons={[{ text: "Back to Home", href: "/" }]}
+          imageSrc="http://img.b2bpic.net/free-photo/woman-with-shopping-bags-sitting-coach-shopping-mall_1303-29617.jpg?_wi=1"
+          imageAlt="Airport terminal booking"
+          showDimOverlay={true}
+          buttonAnimation="slide-up"
+          ariaLabel="Book a flight with Dealta Airlines"
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterMedia
+          imageSrc="http://img.b2bpic.net/free-photo/woman-with-shopping-bags-sitting-coach-shopping-mall_1303-29617.jpg?_wi=2"
+          imageAlt="Dealta Airlines terminal footer"
+          columns={[
+            {
+              title: "Quick Links",              items: [
+                { label: "Check-in", href: "/check-in" },
+                { label: "Booking", href: "/booking" },
+                { label: "Flight Status", href: "https://example.com/status" },
+              ],
+            },
+            {
+              title: "Support",              items: [
+                { label: "Help Center", href: "https://example.com/help" },
+                { label: "Contact Us", href: "#contact" },
+                { label: "FAQ", href: "https://example.com/faq" },
+              ],
+            },
+            {
+              title: "Legal",              items: [
+                { label: "Privacy Policy", href: "https://example.com/privacy" },
+                {
+                  label: "Terms of Service",                  href: "https://example.com/terms"
+                },
+                { label: "Accessibility", href: "https://example.com/accessibility" },
+              ],
+            },
+          ]}
+          logoText="Dealta Airlines"
+          copyrightText="© 2025 Dealta Airlines | All rights reserved"
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/check-in/page.tsx

@@ -0,0 +1,169 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
+import HeroLogo from "@/components/sections/hero/HeroLogo";
+import FeatureCardThree from "@/components/sections/feature/featureCardThree/FeatureCardThree";
+import ContactSplit from "@/components/sections/contact/ContactSplit";
+import SplitAbout from "@/components/sections/about/SplitAbout";
+import FooterMedia from "@/components/sections/footer/FooterMedia";
+import {
+  QrCode,
+  Plane,
+  User,
+  Navigation,
+  Clock,
+  Armchair,
+} from "lucide-react";
+
+export default function CheckInPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="expand-hover"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="rounded"
+      contentWidth="medium"
+      sizing="largeSmallSizeMediumTitles"
+      background="blurBottom"
+      cardStyle="subtle-shadow"
+      primaryButtonStyle="primary-glow"
+      secondaryButtonStyle="glass"
+      headingFontWeight="light"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleFullscreen
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Check-in", id: "/check-in" },
+            { name: "Booking", id: "/booking" },
+            { name: "Loading", id: "/loading-screen" },
+            { name: "Confirmation", id: "/confirmation" },
+          ]}
+          brandName="Dealta Airlines"
+          bottomLeftText="Touchscreen Kiosk"
+          bottomRightText="Terminal 1 - Gate B45"
+        />
+      </div>
+
+      <div id="hero" data-section="hero">
+        <HeroLogo
+          logoText="Check-In Process"
+          description="Scan your ticket and confirm your information"
+          buttons={[{ text: "Next", href: "/loading-screen" }]}
+          imageSrc="http://img.b2bpic.net/free-photo/woman-with-shopping-bags-sitting-coach-shopping-mall_1303-29617.jpg?_wi=1"
+          imageAlt="Airport terminal check-in"
+          showDimOverlay={true}
+          buttonAnimation="slide-up"
+          ariaLabel="Check-in process for Dealta Airlines"
+        />
+      </div>
+
+      <div id="passenger-options" data-section="passenger-options">
+        <FeatureCardThree
+          features={[
+            {
+              id: "01",              title: "Scan Boarding Pass",              description: "Use the QR code scanner to quickly verify your ticket and boarding information",              imageSrc: "http://img.b2bpic.net/free-photo/close-up-senior-person-while-learning_23-2149072435.jpg?_wi=1",              imageAlt: "QR code scanning interface"
+            },
+            {
+              id: "02",              title: "Confirm Details",              description: "Review and confirm your passenger information, seat assignment, and baggage selection",              imageSrc: "http://img.b2bpic.net/free-vector/collection-flat-travel-elements_23-2147766294.jpg?_wi=3",              imageAlt: "Flight confirmation details"
+            },
+          ]}
+          title="Complete Your Check-In"
+          description="Follow these steps to complete your check-in process"
+          tag="Check-In Steps"
+          tagAnimation="slide-up"
+          textboxLayout="default"
+          useInvertedBackground={false}
+          animationType="slide-up"
+          gridVariant="two-columns-alternating-heights"
+        />
+      </div>
+
+      <div id="qr-scanner" data-section="qr-scanner">
+        <ContactSplit
+          tag="Ticket Verification"
+          title="Scan Your Boarding Pass"
+          description="Position your mobile ticket or printed boarding pass under the camera scanner. Ensure the QR code is clearly visible for quick verification."
+          tagIcon={QrCode}
+          tagAnimation="slide-up"
+          imageSrc="http://img.b2bpic.net/free-photo/close-up-senior-person-while-learning_23-2149072435.jpg?_wi=2"
+          imageAlt="QR code scanner demonstration"
+          mediaAnimation="slide-up"
+          mediaPosition="right"
+          background={{ variant: "plain" }}
+          useInvertedBackground={false}
+          inputPlaceholder="Scanning..."
+          buttonText="Rescan"
+          termsText="Hold your ticket steady until the scan completes. Green light indicates successful scan."
+          ariaLabel="QR code scanner section"
+        />
+      </div>
+
+      <div id="passenger-info" data-section="passenger-info">
+        <SplitAbout
+          tag="Flight Details"
+          tagIcon={Plane}
+          tagAnimation="slide-up"
+          title="Your Flight Information"
+          description="Confirm your travel details are correct before proceeding to baggage selection"
+          textboxLayout="default"
+          useInvertedBackground={false}
+          imagePosition="right"
+          imageSrc="http://img.b2bpic.net/free-vector/star-with-check-mark-set_78370-4768.jpg?_wi=3"
+          imageAlt="Flight confirmation details"
+          mediaAnimation="slide-up"
+          bulletPoints={[
+            {
+              title: "Passenger: John Smith",              description: "Name as it appears on ticket",              icon: User,
+            },
+            {
+              title: "Flight: DL 2847",              description: "New York (JFK) to Los Angeles (LAX)",              icon: Navigation,
+            },
+            {
+              title: "Boarding Time: 14:45",              description: "Gate B45 - Departure 15:30",              icon: Clock,
+            },
+            {
+              title: "Seat: 12A",              description: "Window seat, First Class",              icon: Armchair,
+            },
+          ]}
+          buttons={[{ text: "Continue", href: "/baggage-selection" }]}
+          buttonAnimation="slide-up"
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterMedia
+          imageSrc="http://img.b2bpic.net/free-photo/woman-with-shopping-bags-sitting-coach-shopping-mall_1303-29617.jpg?_wi=2"
+          imageAlt="Dealta Airlines terminal footer"
+          columns={[
+            {
+              title: "Quick Links",              items: [
+                { label: "Check-in", href: "/check-in" },
+                { label: "Booking", href: "/booking" },
+                { label: "Flight Status", href: "https://example.com/status" },
+              ],
+            },
+            {
+              title: "Support",              items: [
+                { label: "Help Center", href: "https://example.com/help" },
+                { label: "Contact Us", href: "#contact" },
+                { label: "FAQ", href: "https://example.com/faq" },
+              ],
+            },
+            {
+              title: "Legal",              items: [
+                { label: "Privacy Policy", href: "https://example.com/privacy" },
+                {
+                  label: "Terms of Service",                  href: "https://example.com/terms"
+                },
+                { label: "Accessibility", href: "https://example.com/accessibility" },
+              ],
+            },
+          ]}
+          logoText="Dealta Airlines"
+          copyrightText="© 2025 Dealta Airlines | All rights reserved"
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/confirmation/page.tsx

@@ -0,0 +1,95 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
+import TestimonialCardThirteen from "@/components/sections/testimonial/TestimonialCardThirteen";
+import FooterMedia from "@/components/sections/footer/FooterMedia";
+import { CheckCircle } from "lucide-react";
+
+export default function ConfirmationPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="expand-hover"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="rounded"
+      contentWidth="medium"
+      sizing="largeSmallSizeMediumTitles"
+      background="blurBottom"
+      cardStyle="subtle-shadow"
+      primaryButtonStyle="primary-glow"
+      secondaryButtonStyle="glass"
+      headingFontWeight="light"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleFullscreen
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Check-in", id: "/check-in" },
+            { name: "Booking", id: "/booking" },
+            { name: "Loading", id: "/loading-screen" },
+            { name: "Confirmation", id: "/confirmation" },
+          ]}
+          brandName="Dealta Airlines"
+          bottomLeftText="Touchscreen Kiosk"
+          bottomRightText="Terminal 1 - Gate B45"
+        />
+      </div>
+
+      <div id="confirmation" data-section="confirmation">
+        <TestimonialCardThirteen
+          testimonials={[
+            {
+              id: "1",              name: "Confirmation #12847",              handle: "Check-in Complete",              testimonial: "Your baggage tags are ready for printing. Please collect them from the nearby printer and proceed to baggage drop counter B-15. Have a great flight!",              rating: 5,
+              icon: CheckCircle,
+            },
+          ]}
+          showRating={false}
+          title="Check-in Complete"
+          description="Your baggage tags have been printed. Proceed to the baggage drop counter with your confirmation"
+          tag="Success"
+          tagIcon={CheckCircle}
+          tagAnimation="slide-up"
+          textboxLayout="default"
+          useInvertedBackground={false}
+          animationType="slide-up"
+          buttons={[{ text: "Return to Home", href: "/" }]}
+          buttonAnimation="slide-up"
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterMedia
+          imageSrc="http://img.b2bpic.net/free-photo/woman-with-shopping-bags-sitting-coach-shopping-mall_1303-29617.jpg?_wi=2"
+          imageAlt="Dealta Airlines terminal footer"
+          columns={[
+            {
+              title: "Quick Links",              items: [
+                { label: "Check-in", href: "/check-in" },
+                { label: "Booking", href: "/booking" },
+                { label: "Flight Status", href: "https://example.com/status" },
+              ],
+            },
+            {
+              title: "Support",              items: [
+                { label: "Help Center", href: "https://example.com/help" },
+                { label: "Contact Us", href: "#contact" },
+                { label: "FAQ", href: "https://example.com/faq" },
+              ],
+            },
+            {
+              title: "Legal",              items: [
+                { label: "Privacy Policy", href: "https://example.com/privacy" },
+                {
+                  label: "Terms of Service",                  href: "https://example.com/terms"
+                },
+                { label: "Accessibility", href: "https://example.com/accessibility" },
+              ],
+            },
+          ]}
+          logoText="Dealta Airlines"
+          copyrightText="© 2025 Dealta Airlines | All rights reserved"
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/layout.tsx

@@ -1,57 +1,17 @@
 import type { Metadata } from "next";
-import { Halant } from "next/font/google";
-import { Inter } from "next/font/google";
-import { Source_Sans_3 } from "next/font/google";
 import "./globals.css";
-import { ServiceWrapper } from "@/components/ServiceWrapper";
-import Tag from "@/tag/Tag";
-
-const halant = Halant({
-  variable: "--font-halant",  subsets: ["latin"],
-  weight: ["300", "400", "500", "600", "700"],
-});
-
-const inter = Inter({
-  variable: "--font-inter",  subsets: ["latin"],
-});
-
-const sourceSans3 = Source_Sans_3({
-  variable: "--font-source-sans-3",  subsets: ["latin"],
-});
 
 export const metadata: Metadata = {
-  title: "Dealta Airlines Self-Service Kiosk | Check-in",  description: "Fast and easy self-service check-in with Dealta Airlines. Scan your boarding pass, select baggage options, and print your confirmation in minutes.",  keywords: "airline check-in, self-service kiosk, boarding pass, baggage, Dealta Airlines",  metadataBase: new URL("https://www.deltalairlines.com/kiosk"),
-  alternates: {
-    canonical: "https://www.deltalairlines.com/kiosk"},
-  openGraph: {
-    title: "Dealta Airlines Self-Service Kiosk",    description: "Quick and easy airport check-in with our modern touchscreen kiosks",    url: "https://www.deltalairlines.com/kiosk",    siteName: "Dealta Airlines",    type: "website",    images: [
-      {
-        url: "http://img.b2bpic.net/free-photo/woman-with-shopping-bags-sitting-coach-shopping-mall_1303-29617.jpg",        alt: "modern airline logo branding corporate"},
-    ],
-  },
-  twitter: {
-    card: "summary_large_image",    title: "Dealta Airlines Self-Service Kiosk",    description: "Check in quickly and easily with our modern touchscreen kiosks",    images: ["http://img.b2bpic.net/free-photo/woman-with-shopping-bags-sitting-coach-shopping-mall_1303-29617.jpg"],
-  },
-  robots: {
-    index: true,
-    follow: true,
-  },
-};
+  title: "Dealta Airlines - Self-Service Kiosk",  description: "Self-service check-in and booking system for Dealta Airlines"};
 
 export default function RootLayout({
   children,
-}: Readonly<{
+}: {
   children: React.ReactNode;
-}>) {
+}) {
   return (
-    <html lang="en" suppressHydrationWarning>
-      <ServiceWrapper>
-        <body
-          className={`${halant.variable} ${inter.variable} ${sourceSans3.variable} antialiased`}
-        >
-          <Tag />
-          {children}
-        
+    <html lang="en">
+      <body>{children}
         <script
           dangerouslySetInnerHTML={{
             __html: `
@@ -1419,7 +1379,6 @@ export default function RootLayout({
           }}
         />
       </body>
-      </ServiceWrapper>
     </html>
   );
 }

src/app/loading-screen/page.tsx

@@ -0,0 +1,91 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
+import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
+import FooterMedia from "@/components/sections/footer/FooterMedia";
+import { Printer } from "lucide-react";
+
+export default function LoadingScreenPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="expand-hover"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="rounded"
+      contentWidth="medium"
+      sizing="largeSmallSizeMediumTitles"
+      background="blurBottom"
+      cardStyle="subtle-shadow"
+      primaryButtonStyle="primary-glow"
+      secondaryButtonStyle="glass"
+      headingFontWeight="light"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleFullscreen
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Check-in", id: "/check-in" },
+            { name: "Booking", id: "/booking" },
+            { name: "Loading", id: "/loading-screen" },
+            { name: "Confirmation", id: "/confirmation" },
+          ]}
+          brandName="Dealta Airlines"
+          bottomLeftText="Touchscreen Kiosk"
+          bottomRightText="Terminal 1 - Gate B45"
+        />
+      </div>
+
+      <div id="loading-screen" data-section="loading-screen">
+        <MetricCardOne
+          metrics={[
+            {
+              id: "1",              value: "3",              title: "seconds",              description: "Printing baggage tag and confirmation",              icon: Printer,
+            },
+          ]}
+          title="Processing Your Check-in"
+          description="Please wait while we prepare your baggage tag and check-in confirmation"
+          tag="Loading"
+          tagAnimation="slide-up"
+          textboxLayout="default"
+          useInvertedBackground={false}
+          animationType="slide-up"
+          gridVariant="uniform-all-items-equal"
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterMedia
+          imageSrc="http://img.b2bpic.net/free-photo/woman-with-shopping-bags-sitting-coach-shopping-mall_1303-29617.jpg?_wi=2"
+          imageAlt="Dealta Airlines terminal footer"
+          columns={[
+            {
+              title: "Quick Links",              items: [
+                { label: "Check-in", href: "/check-in" },
+                { label: "Booking", href: "/booking" },
+                { label: "Flight Status", href: "https://example.com/status" },
+              ],
+            },
+            {
+              title: "Support",              items: [
+                { label: "Help Center", href: "https://example.com/help" },
+                { label: "Contact Us", href: "#contact" },
+                { label: "FAQ", href: "https://example.com/faq" },
+              ],
+            },
+            {
+              title: "Legal",              items: [
+                { label: "Privacy Policy", href: "https://example.com/privacy" },
+                {
+                  label: "Terms of Service",                  href: "https://example.com/terms"
+                },
+                { label: "Accessibility", href: "https://example.com/accessibility" },
+              ],
+            },
+          ]}
+          logoText="Dealta Airlines"
+          copyrightText="© 2025 Dealta Airlines | All rights reserved"
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/page.tsx

@@ -39,11 +39,11 @@ export default function LandingPage() {
       <div id="nav" data-section="nav">
         <NavbarStyleFullscreen
           navItems={[
-            { name: "Home", id: "home" },
-            { name: "Check-in", id: "check-in" },
-            { name: "Booking", id: "booking" },
-            { name: "Contact", id: "contact" },
-            { name: "Help", id: "help" },
+            { name: "Home", id: "/" },
+            { name: "Check-in", id: "/check-in" },
+            { name: "Booking", id: "/booking" },
+            { name: "Loading", id: "/loading-screen" },
+            { name: "Confirmation", id: "/confirmation" },
           ]}
           brandName="Dealta Airlines"
           bottomLeftText="Touchscreen Kiosk"
@@ -55,7 +55,7 @@ export default function LandingPage() {
         <HeroLogo
           logoText="Dealta Airlines"
           description="Tap anywhere to begin"
-          buttons={[{ text: "Start Check-in", href: "#passenger-options" }]}
+          buttons={[{ text: "Start Check-in", href: "/check-in" }]}
           imageSrc="http://img.b2bpic.net/free-photo/woman-with-shopping-bags-sitting-coach-shopping-mall_1303-29617.jpg?_wi=1"
           imageAlt="Modern airport terminal background"
           showDimOverlay={true}
@@ -71,7 +71,7 @@ export default function LandingPage() {
               id: "01",              title: "Check in with Existing Ticket",              description: "Scan your boarding pass or mobile ticket to check in and print baggage tags",              imageSrc: "http://img.b2bpic.net/free-photo/close-up-senior-person-while-learning_23-2149072435.jpg?_wi=1",              imageAlt: "QR code scanning interface"
             },
             {
-              id: "02",              title: "Book a New Flight",              description: "Browse available flights, select your preferred seat, and complete your booking",              imageSrc: "http://img.b2bpic.net/free-vector/collection-flat-travel-elements_23-2147766294.jpg",              imageAlt: "Flight booking and baggage options"
+              id: "02",              title: "Book a New Flight",              description: "Browse available flights, select your preferred seat, and complete your booking",              imageSrc: "http://img.b2bpic.net/free-vector/collection-flat-travel-elements_23-2147766294.jpg?_wi=1",              imageAlt: "Flight booking and baggage options"
             },
           ]}
           title="Choose Your Option"
@@ -115,7 +115,7 @@ export default function LandingPage() {
           textboxLayout="default"
           useInvertedBackground={false}
           imagePosition="right"
-          imageSrc="http://img.b2bpic.net/free-vector/star-with-check-mark-set_78370-4768.jpg"
+          imageSrc="http://img.b2bpic.net/free-vector/star-with-check-mark-set_78370-4768.jpg?_wi=1"
           imageAlt="Flight confirmation details"
           mediaAnimation="slide-up"
           bulletPoints={[
@@ -132,7 +132,7 @@ export default function LandingPage() {
               title: "Seat: 12A",              description: "Window seat, First Class",              icon: Armchair,
             },
           ]}
-          buttons={[{ text: "Continue", href: "#baggage-selection" }]}
+          buttons={[{ text: "Continue", href: "/baggage-selection" }]}
           buttonAnimation="slide-up"
         />
       </div>
@@ -203,7 +203,7 @@ export default function LandingPage() {
           textboxLayout="default"
           useInvertedBackground={false}
           animationType="slide-up"
-          buttons={[{ text: "Return to Home", href: "#hero" }]}
+          buttons={[{ text: "Return to Home", href: "/" }]}
           buttonAnimation="slide-up"
         />
       </div>
@@ -215,8 +215,8 @@ export default function LandingPage() {
           columns={[
             {
               title: "Quick Links",              items: [
-                { label: "Check-in", href: "#passenger-options" },
-                { label: "Booking", href: "#booking" },
+                { label: "Check-in", href: "/check-in" },
+                { label: "Booking", href: "/booking" },
                 { label: "Flight Status", href: "https://example.com/status" },
               ],
             },

src/app/passenger-info/page.tsx

@@ -0,0 +1,125 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
+import HeroLogo from "@/components/sections/hero/HeroLogo";
+import SplitAbout from "@/components/sections/about/SplitAbout";
+import FooterMedia from "@/components/sections/footer/FooterMedia";
+import {
+  Plane,
+  User,
+  Navigation,
+  Clock,
+  Armchair,
+} from "lucide-react";
+
+export default function PassengerInfoPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="expand-hover"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="rounded"
+      contentWidth="medium"
+      sizing="largeSmallSizeMediumTitles"
+      background="blurBottom"
+      cardStyle="subtle-shadow"
+      primaryButtonStyle="primary-glow"
+      secondaryButtonStyle="glass"
+      headingFontWeight="light"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleFullscreen
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Passenger Options", id: "/passenger-options" },
+            { name: "QR Scanner", id: "/qr-scanner" },
+            { name: "Passenger Info", id: "/passenger-info" },
+            { name: "Help", id: "help" },
+          ]}
+          brandName="Dealta Airlines"
+          bottomLeftText="Touchscreen Kiosk"
+          bottomRightText="Terminal 1 - Gate B45"
+        />
+      </div>
+
+      <div id="hero" data-section="hero">
+        <HeroLogo
+          logoText="Your Flight Information"
+          description="Review your travel details"
+          buttons={[{ text: "Back Home", href: "/" }]}
+          imageSrc="http://img.b2bpic.net/free-photo/woman-with-shopping-bags-sitting-coach-shopping-mall_1303-29617.jpg?_wi=1"
+          imageAlt="Passenger information page"
+          showDimOverlay={true}
+          buttonAnimation="slide-up"
+          ariaLabel="Passenger Information page"
+        />
+      </div>
+
+      <div id="passenger-info" data-section="passenger-info">
+        <SplitAbout
+          tag="Flight Details"
+          tagIcon={Plane}
+          tagAnimation="slide-up"
+          title="Your Flight Information"
+          description="Confirm your travel details are correct before proceeding to baggage selection"
+          textboxLayout="default"
+          useInvertedBackground={false}
+          imagePosition="right"
+          imageSrc="http://img.b2bpic.net/free-vector/star-with-check-mark-set_78370-4768.jpg?_wi=2"
+          imageAlt="Flight confirmation details"
+          mediaAnimation="slide-up"
+          bulletPoints={[
+            {
+              title: "Passenger: John Smith",              description: "Name as it appears on ticket",              icon: User,
+            },
+            {
+              title: "Flight: DL 2847",              description: "New York (JFK) to Los Angeles (LAX)",              icon: Navigation,
+            },
+            {
+              title: "Boarding Time: 14:45",              description: "Gate B45 - Departure 15:30",              icon: Clock,
+            },
+            {
+              title: "Seat: 12A",              description: "Window seat, First Class",              icon: Armchair,
+            },
+          ]}
+          buttons={[{ text: "Continue to Baggage", href: "/" }]}
+          buttonAnimation="slide-up"
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterMedia
+          imageSrc="http://img.b2bpic.net/free-photo/woman-with-shopping-bags-sitting-coach-shopping-mall_1303-29617.jpg?_wi=2"
+          imageAlt="Dealta Airlines terminal footer"
+          columns={[
+            {
+              title: "Quick Links",              items: [
+                { label: "Home", href: "/" },
+                { label: "Passenger Options", href: "/passenger-options" },
+                { label: "Flight Status", href: "https://example.com/status" },
+              ],
+            },
+            {
+              title: "Support",              items: [
+                { label: "Help Center", href: "https://example.com/help" },
+                { label: "Contact Us", href: "https://example.com/contact" },
+                { label: "FAQ", href: "https://example.com/faq" },
+              ],
+            },
+            {
+              title: "Legal",              items: [
+                { label: "Privacy Policy", href: "https://example.com/privacy" },
+                {
+                  label: "Terms of Service",                  href: "https://example.com/terms"
+                },
+                { label: "Accessibility", href: "https://example.com/accessibility" },
+              ],
+            },
+          ]}
+          logoText="Dealta Airlines"
+          copyrightText="© 2025 Dealta Airlines | All rights reserved"
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/passenger-options/page.tsx

@@ -0,0 +1,107 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
+import HeroLogo from "@/components/sections/hero/HeroLogo";
+import FeatureCardThree from "@/components/sections/feature/featureCardThree/FeatureCardThree";
+import FooterMedia from "@/components/sections/footer/FooterMedia";
+
+export default function PassengerOptionsPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="expand-hover"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="rounded"
+      contentWidth="medium"
+      sizing="largeSmallSizeMediumTitles"
+      background="blurBottom"
+      cardStyle="subtle-shadow"
+      primaryButtonStyle="primary-glow"
+      secondaryButtonStyle="glass"
+      headingFontWeight="light"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleFullscreen
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Passenger Options", id: "/passenger-options" },
+            { name: "QR Scanner", id: "/qr-scanner" },
+            { name: "Passenger Info", id: "/passenger-info" },
+            { name: "Help", id: "help" },
+          ]}
+          brandName="Dealta Airlines"
+          bottomLeftText="Touchscreen Kiosk"
+          bottomRightText="Terminal 1 - Gate B45"
+        />
+      </div>
+
+      <div id="hero" data-section="hero">
+        <HeroLogo
+          logoText="Passenger Options"
+          description="Select how you'd like to proceed with your journey"
+          buttons={[{ text: "Back Home", href: "/" }]}
+          imageSrc="http://img.b2bpic.net/free-photo/woman-with-shopping-bags-sitting-coach-shopping-mall_1303-29617.jpg?_wi=1"
+          imageAlt="Passenger options screen"
+          showDimOverlay={true}
+          buttonAnimation="slide-up"
+          ariaLabel="Passenger Options page"
+        />
+      </div>
+
+      <div id="passenger-options" data-section="passenger-options">
+        <FeatureCardThree
+          features={[
+            {
+              id: "01",              title: "Check in with Existing Ticket",              description: "Scan your boarding pass or mobile ticket to check in and print baggage tags",              imageSrc: "http://img.b2bpic.net/free-photo/close-up-senior-person-while-learning_23-2149072435.jpg?_wi=1",              imageAlt: "QR code scanning interface"
+            },
+            {
+              id: "02",              title: "Book a New Flight",              description: "Browse available flights, select your preferred seat, and complete your booking",              imageSrc: "http://img.b2bpic.net/free-vector/collection-flat-travel-elements_23-2147766294.jpg?_wi=2",              imageAlt: "Flight booking and baggage options"
+            },
+          ]}
+          title="Choose Your Option"
+          description="Select how you'd like to proceed with your Dealta Airlines journey"
+          tag="Quick Selection"
+          tagAnimation="slide-up"
+          textboxLayout="default"
+          useInvertedBackground={false}
+          animationType="slide-up"
+          gridVariant="two-columns-alternating-heights"
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterMedia
+          imageSrc="http://img.b2bpic.net/free-photo/woman-with-shopping-bags-sitting-coach-shopping-mall_1303-29617.jpg?_wi=2"
+          imageAlt="Dealta Airlines terminal footer"
+          columns={[
+            {
+              title: "Quick Links",              items: [
+                { label: "Home", href: "/" },
+                { label: "QR Scanner", href: "/qr-scanner" },
+                { label: "Flight Status", href: "https://example.com/status" },
+              ],
+            },
+            {
+              title: "Support",              items: [
+                { label: "Help Center", href: "https://example.com/help" },
+                { label: "Contact Us", href: "https://example.com/contact" },
+                { label: "FAQ", href: "https://example.com/faq" },
+              ],
+            },
+            {
+              title: "Legal",              items: [
+                { label: "Privacy Policy", href: "https://example.com/privacy" },
+                {
+                  label: "Terms of Service",                  href: "https://example.com/terms"
+                },
+                { label: "Accessibility", href: "https://example.com/accessibility" },
+              ],
+            },
+          ]}
+          logoText="Dealta Airlines"
+          copyrightText="© 2025 Dealta Airlines | All rights reserved"
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/qr-scanner/page.tsx

@@ -0,0 +1,107 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
+import HeroLogo from "@/components/sections/hero/HeroLogo";
+import ContactSplit from "@/components/sections/contact/ContactSplit";
+import FooterMedia from "@/components/sections/footer/FooterMedia";
+import { QrCode } from "lucide-react";
+
+export default function QRScannerPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="expand-hover"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="rounded"
+      contentWidth="medium"
+      sizing="largeSmallSizeMediumTitles"
+      background="blurBottom"
+      cardStyle="subtle-shadow"
+      primaryButtonStyle="primary-glow"
+      secondaryButtonStyle="glass"
+      headingFontWeight="light"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleFullscreen
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Passenger Options", id: "/passenger-options" },
+            { name: "QR Scanner", id: "/qr-scanner" },
+            { name: "Passenger Info", id: "/passenger-info" },
+            { name: "Help", id: "help" },
+          ]}
+          brandName="Dealta Airlines"
+          bottomLeftText="Touchscreen Kiosk"
+          bottomRightText="Terminal 1 - Gate B45"
+        />
+      </div>
+
+      <div id="hero" data-section="hero">
+        <HeroLogo
+          logoText="QR Scanner"
+          description="Scan your boarding pass to get started"
+          buttons={[{ text: "Back Home", href: "/" }]}
+          imageSrc="http://img.b2bpic.net/free-photo/woman-with-shopping-bags-sitting-coach-shopping-mall_1303-29617.jpg?_wi=1"
+          imageAlt="QR scanner page"
+          showDimOverlay={true}
+          buttonAnimation="slide-up"
+          ariaLabel="QR Scanner page"
+        />
+      </div>
+
+      <div id="qr-scanner" data-section="qr-scanner">
+        <ContactSplit
+          tag="Ticket Verification"
+          title="Scan Your Boarding Pass"
+          description="Position your mobile ticket or printed boarding pass under the camera scanner. Ensure the QR code is clearly visible for quick verification."
+          tagIcon={QrCode}
+          tagAnimation="slide-up"
+          imageSrc="http://img.b2bpic.net/free-photo/close-up-senior-person-while-learning_23-2149072435.jpg?_wi=2"
+          imageAlt="QR code scanner demonstration"
+          mediaAnimation="slide-up"
+          mediaPosition="right"
+          background={{ variant: "plain" }}
+          useInvertedBackground={false}
+          inputPlaceholder="Scanning..."
+          buttonText="Rescan"
+          termsText="Hold your ticket steady until the scan completes. Green light indicates successful scan."
+          ariaLabel="QR code scanner section"
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterMedia
+          imageSrc="http://img.b2bpic.net/free-photo/woman-with-shopping-bags-sitting-coach-shopping-mall_1303-29617.jpg?_wi=2"
+          imageAlt="Dealta Airlines terminal footer"
+          columns={[
+            {
+              title: "Quick Links",              items: [
+                { label: "Home", href: "/" },
+                { label: "Passenger Options", href: "/passenger-options" },
+                { label: "Flight Status", href: "https://example.com/status" },
+              ],
+            },
+            {
+              title: "Support",              items: [
+                { label: "Help Center", href: "https://example.com/help" },
+                { label: "Contact Us", href: "https://example.com/contact" },
+                { label: "FAQ", href: "https://example.com/faq" },
+              ],
+            },
+            {
+              title: "Legal",              items: [
+                { label: "Privacy Policy", href: "https://example.com/privacy" },
+                {
+                  label: "Terms of Service",                  href: "https://example.com/terms"
+                },
+                { label: "Accessibility", href: "https://example.com/accessibility" },
+              ],
+            },
+          ]}
+          logoText="Dealta Airlines"
+          copyrightText="© 2025 Dealta Airlines | All rights reserved"
+        />
+      </div>
+    </ThemeProvider>
+  );
+}