diff --git a/src/app/checkout/page.tsx b/src/app/checkout/page.tsx
index 352814d..5e4ccf3 100644
--- a/src/app/checkout/page.tsx
+++ b/src/app/checkout/page.tsx
@@ -1,25 +1,28 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
-import FooterCard from "@/components/sections/footer/FooterCard";
-import { Instagram, Facebook, Linkedin } from "lucide-react";
+import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
+import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";
 
 export default function CheckoutPage() {
   return (
-    <ThemeProvider>
-      <NavbarLayoutFloatingInline
-        navItems={[{ name: "Home", id: "/" }, { name: "Account", id: "/account" }, { name: "Contact", id: "/contact" }]} 
-        brandName="Luxuria"
-      />
+    <ThemeProvider defaultButtonVariant="hover-magnetic" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
+      <div id="nav" data-section="nav">
+        <NavbarStyleApple 
+          navItems={[{ name: "Home", id: "/" }, { name: "Account", id: "/account" }, { name: "Contact", id: "/contact" }]} 
+          brandName="Luxuria"
+        />
+      </div>
       <div className="min-h-screen pt-32 pb-20 container">
         <h1 className="text-4xl font-bold mb-8">Secure Checkout</h1>
         <p className="text-lg">Complete your luxury travel booking.</p>
       </div>
-      <FooterCard
+      <FooterBaseReveal
         logoText="Luxuria"
+        columns={[
+          { title: "Navigation", items: [{ label: "Home", href: "/" }, { label: "Contact", href: "/contact" }] }
+        ]}
         copyrightText="© 2025 Luxuria Travel"
-        socialLinks={[{ icon: Instagram, href: "#" }, { icon: Facebook, href: "#" }, { icon: Linkedin, href: "#" }]}
       />
     </ThemeProvider>
   );