Update src/app/page.tsx

Merge version_1 into main

src/app/page.tsx

@@ -2,8 +2,8 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactCTA from '@/components/sections/contact/ContactCTA';
-import FaqSplitText from '@/components/sections/faq/FaqSplitText';
+import ContactCenter from '@/components/sections/contact/ContactCenter';
+import FaqDouble from '@/components/sections/faq/FaqDouble';
 import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
 import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
 import HeroLogo from '@/components/sections/hero/HeroLogo';
@@ -263,7 +263,7 @@ export default function LandingPage() {
   </div>
 
   <div id="faq" data-section="faq">
-      <FaqSplitText
+      <FaqDouble
       useInvertedBackground={false}
       faqs={[
         {
@@ -275,28 +275,25 @@ export default function LandingPage() {
         {
           id: "q4",          title: "Do you offer gift cards?",          content: "Absolutely! Gift cards are available for purchase at our salon and can be used for any service or product."},
       ]}
-      sideTitle="Frequently Asked Questions"
-      sideDescription="Have questions about our services, booking, or anything else? Find quick answers here."
+      title="Frequently Asked Questions"
+      description="Have questions about our services, booking, or anything else? Find quick answers here."
       faqsAnimation="slide-up"
-      textPosition="left"
+      textboxLayout="default"
     />
   </div>
 
   <div id="contact" data-section="contact">
-      <ContactCTA
+      <ContactCenter
       useInvertedBackground={false}
       background={{
         variant: "radial-gradient"}}
       tag="Ready to Transform?"
       title="Book Your Appointment Today"
       description="Experience the Elegance difference. Our team is excited to welcome you and help you achieve your beauty goals."
-      buttons={[
-        {
-          text: "Call Us Now",          href: "tel:+1234567890"},
-        {
-          text: "Email Us",          href: "mailto:info@elegancesalon.com"},
-      ]}
-      buttonAnimation="opacity"
+      inputPlaceholder="Enter your email"
+      buttonText="Sign Up for Updates"
+      termsText="By clicking Sign Up you're confirming that you agree with our Terms and Conditions."
+      onSubmit={(email) => console.log("Email submitted:", email)}
     />
   </div>
 

src/app/styles/base.css

@@ -11,7 +11,7 @@ html {
 body {
   background-color: var(--background);
   color: var(--foreground);
-  font-family: var(--font-source-sans-3), sans-serif;
+  font-family: var(--font-inter), sans-serif;
   position: relative;
   min-height: 100vh;
   overscroll-behavior: none;
@@ -24,5 +24,5 @@ h3,
 h4,
 h5,
 h6 {
-  font-family: var(--font-source-sans-3), sans-serif;
+  font-family: var(--font-public-sans), sans-serif;
 }

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #fbfaff;
-  --card: #f7f5ff;
-  --foreground: #0f0022;
-  --primary-cta: #8b5cf6;
-  --primary-cta-text: #fbfaff;
-  --secondary-cta: #ffffff;
-  --secondary-cta-text: #0f0022;
-  --accent: #d8cef5;
-  --background-accent: #c4a8f9;
+  --background: #ffffff;
+  --card: #f9f9f9;
+  --foreground: #000612e6;
+  --primary-cta: #106EFB;
+  --primary-cta-text: #ffffff;
+  --secondary-cta: #f9f9f9;
+  --secondary-cta-text: #000612e6;
+  --accent: #e2e2e2;
+  --background-accent: #106EFB;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);