diff --git a/src/app/about/page.tsx b/src/app/about/page.tsx
index 4d19cea..a0456ae 100644
--- a/src/app/about/page.tsx
+++ b/src/app/about/page.tsx
@@ -3,9 +3,8 @@
 import ReactLenis from "lenis/react";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
-import MediaAbout from "@/components/sections/about/MediaAbout";
 import TeamCardTen from "@/components/sections/team/TeamCardTen";
-import FooterCard from "@/components/sections/footer/FooterCard";
+import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
 
 export default function AboutPage() {
     const navItems = [
@@ -16,28 +15,35 @@ export default function AboutPage() {
     ];
 
     return (
-        <ThemeProvider>
+        <ThemeProvider defaultButtonVariant="hover-magnetic" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
             <ReactLenis root>
-                <NavbarLayoutFloatingInline navItems={navItems} brandName="Studio" />
-                <MediaAbout
-                    title="Building the Future Together"
-                    description="Studio is a collection of creative minds dedicated to delivering exceptional digital work."
-                    tag="Our Story"
-                    imageSrc="/templates/web-agency/hero/hero1.webp"
-                    useInvertedBackground={false}
-                />
-                <TeamCardTen
-                    title="Meet Our Team"
-                    tag="The People Behind Studio"
-                    memberVariant="card"
-                    useInvertedBackground={false}
-                    members={[
-                        { id: "1", name: "Alex Rivers", imageSrc: "/templates/web-agency/hero/hero2.webp" },
-                        { id: "2", name: "Jamie Smith", imageSrc: "/templates/web-agency/hero/hero3.webp" },
-                        { id: "3", name: "Casey Taylor", imageSrc: "/templates/web-agency/hero/hero4.webp" }
-                    ]}
-                />
-                <FooterCard logoText="Studio" columns={[{ title: "Links", items: [{ label: "Home", href: "/" }, { label: "Services", href: "/services" }] }]} />
+                <div id="nav" data-section="nav">
+                  <NavbarLayoutFloatingInline 
+                    navItems={navItems} 
+                    brandName="Studio" 
+                    button={{ text: "Contact", href: "/#contact" }} 
+                  />
+                </div>
+                <div id="team" data-section="team">
+                  <TeamCardTen
+                      title="Meet Our Team"
+                      tag="The People Behind Studio"
+                      memberVariant="card"
+                      useInvertedBackground={false}
+                      membersAnimation="blur-reveal"
+                      members={[
+                          { id: "1", name: "Alex Rivers", imageSrc: "/templates/web-agency/hero/hero2.webp" },
+                          { id: "2", name: "Jamie Smith", imageSrc: "/templates/web-agency/hero/hero3.webp" },
+                          { id: "3", name: "Casey Taylor", imageSrc: "/templates/web-agency/hero/hero4.webp" }
+                      ]}
+                  />
+                </div>
+                <div id="footer" data-section="footer">
+                  <FooterLogoEmphasis 
+                    logoText="Studio" 
+                    columns={[{ items: [{ label: "Home", href: "/" }, { label: "Services", href: "/services" }] }]} 
+                  />
+                </div>
             </ReactLenis>
         </ThemeProvider>
     );
diff --git a/src/app/services/page.tsx b/src/app/services/page.tsx
index 9780fcf..8a88137 100644
--- a/src/app/services/page.tsx
+++ b/src/app/services/page.tsx
@@ -3,9 +3,7 @@
 import ReactLenis from "lenis/react";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
-import FeatureCardNineteen from "@/components/sections/feature/FeatureCardNineteen";
-import FooterCard from "@/components/sections/footer/FooterCard";
-import { Layers } from "lucide-react";
+import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
 
 export default function ServicesPage() {
     const navItems = [
@@ -16,23 +14,21 @@ export default function ServicesPage() {
     ];
 
     return (
-        <ThemeProvider>
+        <ThemeProvider defaultButtonVariant="hover-magnetic" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
             <ReactLenis root>
-                <NavbarLayoutFloatingInline navItems={navItems} brandName="Studio" />
-                <FeatureCardNineteen
-                    title="Our Professional Services"
-                    description="Comprehensive digital solutions tailored to your business needs."
-                    tag="Expertise"
-                    tagIcon={Layers}
-                    features={[
-                        { id: 1, tag: "Full Stack", title: "Web Development", description: "High-performance, scalable web solutions.", imageSrc: "/templates/web-agency/process/process1.webp" },
-                        { id: 2, tag: "Digital", title: "Marketing Strategy", description: "Data-driven marketing to grow your audience.", imageSrc: "/templates/web-agency/process/process2.webp" },
-                        { id: 3, tag: "Creative", title: "Product Design", description: "User-centered design that delights customers.", imageSrc: "/templates/web-agency/process/process3.webp" }
-                    ]}
-                    textboxLayout="default"
-                    useInvertedBackground={false}
-                />
-                <FooterCard logoText="Studio" columns={[{ title: "Links", items: [{ label: "Home", href: "/" }, { label: "About", href: "/about" }] }]} />
+                <div id="nav" data-section="nav">
+                  <NavbarLayoutFloatingInline 
+                    navItems={navItems} 
+                    brandName="Studio" 
+                    button={{ text: "Contact", href: "/#contact" }} 
+                  />
+                </div>
+                <div id="footer" data-section="footer">
+                  <FooterLogoEmphasis 
+                    logoText="Studio" 
+                    columns={[{ items: [{ label: "Home", href: "/" }, { label: "About", href: "/about" }] }]} 
+                  />
+                </div>
             </ReactLenis>
         </ThemeProvider>
     );