Update src/app/styles/variables.css

Merge version_2 into main

src/app/page.tsx

@@ -2,9 +2,7 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactCenter from '@/components/sections/contact/ContactCenter';
 import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwentySix';
-import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
 import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
 import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
 import ProductCardOne from '@/components/sections/product/ProductCardOne';
@@ -12,6 +10,8 @@ import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
 import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
 import TextAbout from '@/components/sections/about/TextAbout';
 import { Eye, Award, Diamond, Zap } from 'lucide-react';
+import ContactSplit from '@/components/sections/contact/ContactSplit';
+import FooterSimple from '@/components/sections/footer/FooterSimple';
 
 export default function LandingPage() {
   return (
@@ -50,7 +50,7 @@ export default function LandingPage() {
     />
   </div>
 
-  <div id="home" data-section="home">
+  <div id="home" data-section="home" className="py-16 lg:py-24">
       <HeroLogoBillboard
       background={{
         variant: "downward-rays-animated-grid"}}
@@ -66,7 +66,7 @@ export default function LandingPage() {
     />
   </div>
 
-  <div id="about" data-section="about">
+  <div id="about" data-section="about" className="py-16 lg:py-24">
       <TextAbout
       useInvertedBackground={true}
       tag="Our Story"
@@ -74,7 +74,7 @@ export default function LandingPage() {
     />
   </div>
 
-  <div id="features" data-section="features">
+  <div id="features" data-section="features" className="py-16 lg:py-24">
       <FeatureCardTwentySix
       textboxLayout="default"
       useInvertedBackground={false}
@@ -97,7 +97,7 @@ export default function LandingPage() {
     />
   </div>
 
-  <div id="collection" data-section="collection">
+  <div id="collection" data-section="collection" className="py-16 lg:py-24">
       <ProductCardOne
       animationType="scale-rotate"
       textboxLayout="default"
@@ -122,7 +122,7 @@ export default function LandingPage() {
     />
   </div>
 
-  <div id="testimonials" data-section="testimonials">
+  <div id="testimonials" data-section="testimonials" className="py-16 lg:py-24">
       <TestimonialCardOne
       animationType="scale-rotate"
       textboxLayout="default"
@@ -150,19 +150,23 @@ export default function LandingPage() {
     />
   </div>
 
-  <div id="social-proof" data-section="social-proof">
+  <div id="social-proof" data-section="social-proof" className="py-16 lg:py-24">
       <SocialProofOne
       textboxLayout="default"
       useInvertedBackground={true}
       names={[
         "Vogue",        "Elle",        "Harper's Bazaar",        "GQ",        "WWD",        "Hypebeast",        "Highsnobiety"]}
-      title="As Seen In"
-      description="KEHRI is recognized by leading voices in fashion and digital innovation."
+      title="Trusted by Industry Leaders"
+      description="Our dedication to innovation and quality has earned recognition from top fashion and digital publications."
+      buttons={[
+        {
+          text: "Learn More",          href: "#about"}
+      ]}
     />
   </div>
 
-  <div id="contact" data-section="contact">
-      <ContactCenter
+  <div id="contact" data-section="contact" className="py-16 lg:py-24">
+      <ContactSplit
       useInvertedBackground={false}
       background={{
         variant: "radial-gradient"}}
@@ -172,12 +176,14 @@ export default function LandingPage() {
       inputPlaceholder="Enter your email"
       buttonText="Subscribe"
       termsText="By subscribing you're confirming that you agree with our Terms and Conditions."
+      imageSrc="http://img.b2bpic.net/free-photo/side-view-young-beautiful-woman-working-with-laptop_23-2148425219.jpg"
+      imageAlt="Woman working with laptop"
+      mediaPosition="right"
     />
   </div>
 
-  <div id="footer" data-section="footer">
-      <FooterBaseCard
-      logoText="KEHRI"
+  <div id="footer" data-section="footer" className="py-16 lg:py-24">
+      <FooterSimple
       columns={[
         {
           title: "Company",          items: [
@@ -210,10 +216,11 @@ export default function LandingPage() {
           ],
         },
       ]}
-      copyrightText="© 2024 KEHRI. All rights reserved."
+      bottomLeftText="© 2024 KEHRI. All rights reserved."
+      bottomRightText="Privacy Policy"
     />
   </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/styles/base.css

@@ -11,7 +11,7 @@ html {
 body {
   background-color: var(--background);
   color: var(--foreground);
-  font-family: var(--font-manrope), 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-manrope), sans-serif;
+  font-family: var(--font-dm-sans), sans-serif;
 }

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #0a0a0a;
-  --card: #1a1a1a;
-  --foreground: #f5f5f5;
-  --primary-cta: #ffdf7d;
+  --background: #020617;
+  --card: #0f172a;
+  --foreground: #e2e8f0;
+  --primary-cta: #c4d8f9;
   --primary-cta-text: #0a0a0a;
-  --secondary-cta: #1a1a1a;
+  --secondary-cta: #041633;
   --secondary-cta-text: #ffffff;
-  --accent: #b8860b;
-  --background-accent: #8b6914;
+  --accent: #2d30f3;
+  --background-accent: #1d4ed8;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);