Update src/app/page.tsx

Merge version_3 into main

src/app/page.tsx

@@ -31,12 +31,13 @@ export default function LandingPage() {
   <div id="nav" data-section="nav">
       <NavbarStyleApple
       navItems={[
-        { name: "Home", id: "hero" },
-        { name: "About", id: "about" },
-        { name: "Menu", id: "menu" },
-        { name: "Contact", id: "contact" },
+        { name: "Home", id: "/" },
+        { name: "About", id: "#about" },
+        { name: "Menu", id: "#menu" },
+        { name: "Pricing", id: "/pricing" },
+        { name: "Contact", id: "#contact" },
       ]}
-      brandName="Cosmic Crust"
+      brandName="Science Fiction Pizza "
     />
   </div>
 
@@ -166,10 +167,10 @@ export default function LandingPage() {
   <div id="footer" data-section="footer">
       <FooterLogoEmphasis
       columns={[
-        { items: [{ label: "About", href: "#about" }, { label: "Menu", href: "#menu" }, { label: "Privacy Policy", href: "#" }] },
+        { items: [{ label: "About", href: "#about" }, { label: "Menu", href: "#menu" }, { label: "Pricing", href: "/pricing" }, { label: "Privacy Policy", href: "#" }] },
         { items: [{ label: "Contact", href: "#contact" }, { label: "Careers", href: "#" }, { label: "Locations", href: "#" }] }
       ]}
-      logoText="Cosmic Crust"
+      logoText="science fiction pizza "
     />
   </div>
       </ReactLenis>

src/app/pricing/page.tsx

@@ -0,0 +1,64 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import PricingCardTwo from "@/components/sections/pricing/PricingCardTwo";
+import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
+import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
+
+export default function PricingPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="expand-hover"
+        defaultTextAnimation="reveal-blur"
+        borderRadius="soft"
+        contentWidth="smallMedium"
+        sizing="medium"
+        background="blurBottom"
+        cardStyle="gradient-mesh"
+        primaryButtonStyle="radial-glow"
+        secondaryButtonStyle="layered"
+        headingFontWeight="bold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleApple
+            navItems={[
+              { name: "Home", id: "/" },
+              { name: "About", id: "/#about" },
+              { name: "Menu", id: "/#menu" },
+              { name: "Pricing", id: "/pricing" },
+              { name: "Contact", id: "/#contact" },
+            ]}
+            brandName="Cosmic Crust"
+          />
+        </div>
+
+        <div id="pricing" data-section="pricing">
+          <PricingCardTwo
+            title="Interstellar Membership Tiers"
+            description="Choose the flight path that best suits your caloric trajectory."
+            animationType="slide-up"
+            textboxLayout="split"
+            useInvertedBackground={false}
+            plans={[
+              { id: "1", badge: "Cadet", price: "12 Credits", subtitle: "Essential planetary fuel", buttons: [{ text: "Select Plan", href: "#" }], features: ["Standard Crust", "Basic Toppings", "Sub-orbital Delivery"] },
+              { id: "2", badge: "Captain", price: "35 Credits", subtitle: "Pro-level exploration", buttons: [{ text: "Select Plan", href: "#" }], features: ["Nebula-Infused Crust", "Premium Alien Ingredients", "Priority Drone Delivery", "Molecule Optimization"] },
+              { id: "3", badge: "Admiral", price: "75 Credits", subtitle: "Total cosmic control", buttons: [{ text: "Select Plan", href: "#" }], features: ["Infinite Customization", "Quantum-Speed Delivery", "Personalized Flavor Mapping", "Direct Link to Command"] }
+            ]}
+          />
+        </div>
+
+        <div id="footer" data-section="footer">
+          <FooterLogoEmphasis
+            columns={[
+              { items: [{ label: "Home", href: "/" }, { label: "About", href: "/#about" }, { label: "Menu", href: "/#menu" }, { label: "Pricing", href: "/pricing" }] },
+              { items: [{ label: "Contact", href: "/#contact" }, { label: "Careers", href: "#" }, { label: "Locations", href: "#" }] }
+            ]}
+            logoText="Cosmic Crust"
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #ffffff;
-  --card: #f9f9f9;
-  --foreground: #000f06e6;
-  --primary-cta: #0a7039;
-  --primary-cta-text: #ffffff;
-  --secondary-cta: #f9f9f9;
-  --secondary-cta-text: #000f06e6;
-  --accent: #e2e2e2;
-  --background-accent: #c4c4c4;
+  --background: #f7f6f7;
+  --card: #ffffff;
+  --foreground: #0c1325;
+  --primary-cta: #0798ff;
+  --primary-cta-text: #f7f6f7;
+  --secondary-cta: #ffffff;
+  --secondary-cta-text: #0c1325;
+  --accent: #93c7ff;
+  --background-accent: #a8cde8;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);