src/app/about-us/page.tsx

@@ -35,6 +35,7 @@ export default function AboutUsPage() {
           brandName="My Website"
           logoSrc="/placeholder-logo.svg"
           logoAlt="Company Logo"
+          button={{ text: "Learn More", href: "#" }}
         />
       </div>
       <div id="about-us-section" data-section="about-us">
@@ -44,7 +45,6 @@ export default function AboutUsPage() {
           useInvertedBackground={false}
           imageSrc="https://images.unsplash.com/photo-1549692520-acc66692997b?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3w0NTYwNXwwfDF8YWxsfDV8fHx8fHwyfHwxNzA4NjA4NzU4fA&ixlib=rb-4.0.3&q=80&w=400"
           imageAlt="About Us Image"
-          mediaAnimation="blur-reveal"
         />
       </div>
     </ThemeProvider>

src/app/cart/page.tsx

@@ -34,6 +34,7 @@ export default function CartPage() {
           brandName="My Website"
           logoSrc="/placeholder-logo.svg"
           logoAlt="Company Logo"
+          button={{ text: "Learn More", href: "#" }}
         />
       </div>
       <div className="container mx-auto py-12 px-4">

src/app/contact/page.tsx

@@ -1,10 +1,10 @@
 'use client';
 
 import { ThemeProvider } from '@/providers/themeProvider/ThemeProvider';
-import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
 import ContactForm from '@/components/form/ContactForm';
-import FaqSplitText from '@/components/sections/faq/FaqSplitText';
-import ContactText from '@/components/sections/contact/ContactText';
+import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
+import ContactCenter from '@/components/sections/contact/ContactCenter';
 import Link from 'next/link';
 
 export default function ContactPage() {
@@ -32,11 +32,12 @@ export default function ContactPage() {
       headingFontWeight="normal"
     >
       <div id="nav" data-section="nav">
-        <NavbarStyleCentered
+        <NavbarLayoutFloatingInline
           navItems={navItems}
           brandName="My Website"
           logoSrc="/placeholder-logo.svg"
           logoAlt="Company Logo"
+          button={{ text: "Learn More", href: "#" }}
         />
       </div>
       <div id="contact-form" data-section="contact-form">
@@ -44,10 +45,12 @@ export default function ContactPage() {
           title="Get in touch"
           description="Fill out the form below to contact us."
           onSubmit={(data) => console.log(data)}
+          tag="Contact"
+          useInvertedBackground={false}
         />
       </div>
       <div id="faq-section" data-section="faq-section">
-        <FaqSplitText
+        <FaqSplitMedia
           title="Frequently Asked Questions"
           description="Find answers to common questions."
           faqs={[
@@ -57,10 +60,12 @@ export default function ContactPage() {
           faqsAnimation="slide-up"
           textboxLayout="default"
           useInvertedBackground={false}
+          imageSrc="https://images.unsplash.com/photo-1549692520-acc66692997b?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3w0NTYwNXwwfDF8YWxsfDV8fHx8fHwyfHwxNzA4NjA4NzU4fA&ixlib=rb-4.0.3&q=80&w=400"
+          imageAlt="FAQ Image"
         />
       </div>
       <div id="contact-text-section" data-section="contact-text-section">
-        <ContactText
+        <ContactCenter
           tag="Contact Info"
           title="Our Location"
           description="Visit us at our office or call us."

src/app/reviews/page.tsx

@@ -47,6 +47,7 @@ export default function ReviewsPage() {
           brandName="My Website"
           logoSrc="/placeholder-logo.svg"
           logoAlt="Company Logo"
+          button={{ text: "Learn More", href: "#" }}
         />
       </div>
       <div id="reviews-section" data-section="reviews">