Merge version_4 into main

Merge version_4 into main

src/app/page.tsx

@@ -2,14 +2,16 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactCenter from '@/components/sections/contact/ContactCenter';
+import ContactSplit from '@/components/sections/contact/ContactSplit';
 import FeatureBorderGlow from '@/components/sections/feature/featureBorderGlow/FeatureBorderGlow';
-import FooterCard from '@/components/sections/footer/FooterCard';
+import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
 import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
 import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
 import PricingCardOne from '@/components/sections/pricing/PricingCardOne';
+import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
+import TimelineProcessFlow from '@/components/cardStack/layouts/timelines/TimelineProcessFlow';
 import TextAbout from '@/components/sections/about/TextAbout';
-import { Activity, BarChart2, Cog, Facebook, Globe, Lightbulb, Linkedin, Package, Search, Settings, Twitter } from "lucide-react";
+import { Activity, BarChart2, Cog, Globe, Lightbulb, Package, Search, Settings } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -120,20 +122,40 @@ export default function LandingPage() {
   </div>
 
   <div id="process" data-section="process">
-      <FeatureBorderGlow
-      animationType="scale-rotate"
+      <TimelineProcessFlow
+      animationType="slide-up"
       textboxLayout="default"
-      useInvertedBackground={true}
-      features={[
+      items={[
         {
-          icon: Search,
-          title: "1. Audit Approfondi",          description: "Analysez vos systèmes, identifiez les blocages et fixez des objectifs ROI clairs. Image: http://img.b2bpic.net/free-photo/menu-circle-button-front-side-white-background_187299-40323.jpg"},
+          content: (
+            <div>
+              <h3>1. Audit Approfondi</h3>
+              <p>Analysez vos systèmes, identifiez les blocages et fixez des objectifs ROI clairs.</p>
+            </div>
+          ),
+          media: <img src="http://img.b2bpic.net/free-photo/menu-circle-button-front-side-white-background_187299-40323.jpg" alt="Audit Approfondi" className="h-full w-full object-cover rounded-xl" />,
+          reverse: false,
+        },
         {
-          icon: Package,
-          title: "2. Construction & Intégration",          description: "Déployez des workflows IA sur mesure, intégrés à vos outils pour une transition fluide. Image: http://img.b2bpic.net/free-photo/man-doing-software-quality-assurance-using-tablet-reading-source-code_482257-82926.jpg"},
+          content: (
+            <div>
+              <h3>2. Construction & Intégration</h3>
+              <p>Déployez des workflows IA sur mesure, intégrés à vos outils pour une transition fluide.</p>
+            </div>
+          ),
+          media: <img src="http://img.b2bpic.net/free-photo/man-doing-software-quality-assurance-using-tablet-reading-source-code_482257-82926.jpg" alt="Construction & Intégration" className="h-full w-full object-cover rounded-xl" />,
+          reverse: true,
+        },
         {
-          icon: Activity,
-          title: "3. Suivi & Optimisation",          description: "Surveillez la performance, ajustez et optimisez pour maximiser votre retour sur investissement. Image: http://img.b2bpic.net/free-photo/gear-front-side-white-background_187299-40157.jpg"},
+          content: (
+            <div>
+              <h3>3. Suivi & Optimisation</h3>
+              <p>Surveillez la performance, ajustez et optimisez pour maximiser votre retour sur investissement.</p>
+            </div>
+          ),
+          media: <img src="http://img.b2bpic.net/free-photo/gear-front-side-white-background_187299-40157.jpg" alt="Suivi & Optimisation" className="h-full w-full object-cover rounded-xl" />,
+          reverse: false,
+        },
       ]}
       title="Notre Processus en 3 Étapes pour Votre Succès"
       description="De l'analyse initiale à l'optimisation continue, nous vous accompagnons à chaque phase de votre transformation digitale."
@@ -142,15 +164,21 @@ export default function LandingPage() {
   </div>
 
   <div id="trust" data-section="trust">
-      <TextAbout
+      <SocialProofOne
+      textboxLayout="default"
       useInvertedBackground={false}
       tag="Confiance"
       title="NovaFlow Automation : Votre Partenaire de Confiance"
+      description="Nous nous engageons à offrir l'excellence, soutenue par nos certifications et l'approbation de l'industrie."
+      names={[
+        "ISO 27001 Certified",        "GDPR Compliant",        "AI Ethics Accredited",        "Certified Automation Specialist",        "Data Security Standard"
+      ]}
+      showCard={true}
     />
   </div>
 
   <div id="contact" data-section="contact">
-      <ContactCenter
+      <ContactSplit
       useInvertedBackground={true}
       background={{
         variant: "radial-gradient"}}
@@ -160,27 +188,23 @@ export default function LandingPage() {
       inputPlaceholder="Votre adresse e-mail"
       buttonText="Demander un audit gratuit"
       termsText="En cliquant sur 'Demander un audit gratuit', vous confirmez que vous acceptez nos Conditions Générales."
+      imageSrc="http://img.b2bpic.net/free-photo/modern-office-business-district_1074-6330.jpg"
+      imageAlt="Modern Office Business District for Contact"
+      mediaAnimation="slide-up"
+      mediaPosition="right"
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterCard
+      <FooterLogoReveal
       logoText="NovaFlow Automation"
-      copyrightText="© 2024 NovaFlow Automation. Tous droits réservés."
-      socialLinks={[
-        {
-          icon: Linkedin,
-          href: "https://linkedin.com/novaflow",          ariaLabel: "LinkedIn"},
-        {
-          icon: Twitter,
-          href: "https://twitter.com/novaflow",          ariaLabel: "Twitter"},
-        {
-          icon: Facebook,
-          href: "https://facebook.com/novaflow",          ariaLabel: "Facebook"},
-      ]}
+      leftLink={{
+        text: "Politique de Confidentialité",        href: "/privacy-policy"}}
+      rightLink={{
+        text: "Conditions Générales",        href: "/terms-of-service"}}
     />
   </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/styles/variables.css

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