diff --git a/src/app/page.tsx b/src/app/page.tsx
index 81d24cb..3b68580 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -154,7 +154,18 @@ export default function LandingPage() {
           textboxLayout="default"
           useInvertedBackground={false}
           showRating={true}
-          animationType="slide-up"
+          animationType="none"
+          cardClassName="bg-white/5 backdrop-blur-sm border border-green-700/10 rounded-2xl p-8 hover:border-green-700/20 transition-colors"
+          containerClassName="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16 sm:py-20 lg:py-24 space-y-12"
+          textBoxClassName="text-center mb-12"
+          textBoxTitleClassName="text-4xl sm:text-5xl lg:text-6xl font-light tracking-tight mb-4 text-foreground"
+          textBoxDescriptionClassName="text-lg text-foreground/70 max-w-2xl mx-auto leading-relaxed"
+          imageWrapperClassName="w-12 h-12 rounded-full overflow-hidden border border-green-700/20 flex-shrink-0"
+          nameClassName="font-medium text-foreground text-sm"
+          handleClassName="text-foreground/50 text-xs"
+          testimonialClassName="text-foreground/80 text-base leading-relaxed"
+          contentWrapperClassName="flex flex-col items-start gap-6"
+          gridClassName="grid grid-cols-1 md:grid-cols-2 gap-8"
           testimonials={[
             {
               id: "1",              name: "Sarah Johnson",              handle: "CEO at TechStartup",              testimonial: "Fares transformed our brand vision into a stunning digital reality. His attention to detail and design thinking is exceptional.",              rating: 5,
@@ -184,7 +195,17 @@ export default function LandingPage() {
           ctaButton={{ text: "Send Me an Email", href: "mailto:hello@faresbeloucif.com" }}
           ctaIcon={Mail}
           useInvertedBackground={false}
-          animationType="slide-up"
+          animationType="none"
+          containerClassName="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16 sm:py-20 lg:py-24"
+          ctaPanelClassName="bg-green-700/5 border border-green-700/20 rounded-3xl p-12 sm:p-16 mb-16 hover:border-green-700/30 transition-colors"
+          ctaTitleClassName="text-4xl sm:text-5xl font-light tracking-tight mb-4 text-foreground"
+          ctaDescriptionClassName="text-lg text-foreground/70 max-w-2xl leading-relaxed mb-8"
+          ctaButtonClassName="bg-green-700 hover:bg-green-800 text-white px-8 py-3 rounded-lg transition-colors"
+          faqsPanelClassName="bg-white/5 backdrop-blur-sm border border-green-700/10 rounded-2xl overflow-hidden"
+          accordionClassName="space-y-0"
+          accordionTitleClassName="text-lg font-medium text-foreground px-6 py-4 cursor-pointer hover:bg-green-700/5 transition-colors"
+          accordionContentClassName="text-foreground/70 px-6 py-4 text-base leading-relaxed border-t border-green-700/10"
+          separatorClassName="border-green-700/10"
           faqs={[
             {
               id: "1",              title: "What's your typical project timeline?",              content: "Project timelines vary based on scope and complexity. Simple projects take 2-4 weeks, while comprehensive design systems or full-stack applications typically take 8-12 weeks. I provide detailed timelines after understanding your requirements."
@@ -207,6 +228,14 @@ export default function LandingPage() {
         <FooterBaseCard
           logoText="Fares Beloucif"
           copyrightText="© 2024 Fares Beloucif. All rights reserved."
+          containerClassName="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16 sm:py-20"
+          cardClassName="border-t border-green-700/10 pt-16"
+          logoTextClassName="text-2xl font-light tracking-tight text-foreground mb-12"
+          columnsClassName="grid grid-cols-1 md:grid-cols-3 gap-12 mb-12"
+          columnTitleClassName="text-sm font-medium text-foreground/70 uppercase tracking-wide mb-6"
+          columnItemClassName="text-foreground/60 hover:text-green-700 transition-colors text-sm"
+          copyrightContainerClassName="border-t border-green-700/10 pt-8 flex justify-between items-center"
+          copyrightTextClassName="text-foreground/50 text-sm"
           columns={[
             {
               title: "Navigation",              items: [
diff --git a/src/app/styles/variables.css b/src/app/styles/variables.css
index 3d0e32c..2b48ae9 100644
--- a/src/app/styles/variables.css
+++ b/src/app/styles/variables.css
@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #ffffff;
-  --card: #f9f9f9;
-  --foreground: #000f06e6;
-  --primary-cta: #0a7039;
+  --background: #f9f7f4;
+  --card: #ffffff;
+  --foreground: #1a1a1a;
+  --primary-cta: #166534;
   --primary-cta-text: #ffffff;
-  --secondary-cta: #f9f9f9;
+  --secondary-cta: #bbf7d0;
   --secondary-cta-text: #000f06e6;
-  --accent: #e2e2e2;
-  --background-accent: #c4c4c4;
+  --accent: #166534;
+  --background-accent: #dcfce7;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);