Merge version_40 into main

Merge version_40 into main

src/app/page.tsx

@@ -3,15 +3,16 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import AboutMetric from '@/components/sections/about/AboutMetric';
-import ContactCenter from '@/components/sections/contact/ContactCenter';
+import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
 import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
-import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
+import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
-import HeroBillboard from '@/components/sections/hero/HeroBillboard';
+import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
 import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
-import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
 import ProductCardOne from '@/components/sections/product/ProductCardOne';
-import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
+import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
-import { Award, ShieldCheck, Users, Search, ShoppingCart } from "lucide-react";
+import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
+import { Award, ShieldCheck, Users } from "lucide-react";
 
 export default function LandingPage() {
   const handleProductClick = () => {
@@ -36,39 +37,43 @@ export default function LandingPage() {
     >
       <ReactLenis root>
         <div id="nav" data-section="nav">
-          <div className="w-full flex items-center justify-between p-4 bg-white/80 backdrop-blur-md sticky top-0 z-50 border-b">
+          <NavbarStyleFullscreen
-              <div className="flex items-center gap-4 border rounded-full px-4 py-2 bg-gray-50">
+            navItems={[
-                  <Search className="w-5 h-5 text-gray-500" />
+              { name: "Accueil", id: "#hero" },
-                  <input type="text" placeholder="Rechercher des produits..." className="bg-transparent outline-none" />
+              { name: "Produits", id: "#products" },
-              </div>
+              { name: "À Propos", id: "#about" },
-              <NavbarStyleApple
+              { name: "Contact", id: "#contact" },
-                navItems={[
+              { name: "Mon Panier", id: "#cart" },
-                  { name: "Accueil", id: "#hero" },
+            ]}
-                  { name: "Produits", id: "#products" },
+            brandName="SAE Réunion"
-                  { name: "À Propos", id: "#about" },
+          />
-                  { name: "Contact", id: "#contact" },
-                ]}
-                brandName="SAE Réunion"
-              />
-              <button className="flex items-center gap-2 px-6 py-2 bg-primary text-white rounded-full font-semibold">
-                  <ShoppingCart className="w-5 h-5" />
-                  Mon Panier
-              </button>
-          </div>
         </div>
 
         <div id="hero" data-section="hero">
-          <HeroBillboard
+          <HeroBillboardCarousel
             title="Expertise en EPI pour les Professionnels de la Réunion"
-            description="Assurez une sécurité immédiate pour les professionnels de l'île de La Réunion. 
+            description="Bénéficiez de notre expertise locale unique et de nos délais de livraison ultra-rapides. Contrairement aux fournisseurs généralistes, nous garantissons une disponibilité immédiate et un accompagnement technique de proximité pour sécuriser vos chantiers réunionnais sans attente."
-Nos solutions d'EPI certifiées protègent vos collaborateurs et assurent la conformité totale de vos chantiers."
             buttons={[{ text: "Obtenir un devis rapide", href: "#contact" }]}
-            imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Df1ETXUvuyYPxkhnyZJKVSXGQj/chantier-1778660616866-4fd2157e.png"
+            mediaItems={[
-            imageAlt="Chantier de construction avec un professionnel en équipement de sécurité"
+                { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Df1ETXUvuyYPxkhnyZJKVSXGQj/chantier-1778660616866-4fd2157e.png?_wi=1", imageAlt: "Chantier de construction" },
+                { imageSrc: "http://img.b2bpic.net/free-photo/warehouse-worker-checking-inventory_23-2152001550.jpg?_wi=1", imageAlt: "Entrepôt logistique" },
+                { imageSrc: "http://img.b2bpic.net/free-photo/industrial-safety-equipment_23-2148784084.jpg", imageAlt: "Équipements de protection" },
+                { imageSrc: "http://img.b2bpic.net/free-photo/worker-wearing-protective-gear_23-2148921397.jpg", imageAlt: "Professionnel équipé" }
+            ]}
             background={{ variant: "plain" }}
           />
         </div>
 
+        <div id="socialProof" data-section="socialProof">
+          <SocialProofOne
+            title="Ils nous font confiance"
+            names={["BTP 974", "SecurPro", "BatirRéunion", "Réunion Construction", "EPI Pro Réunion", "SécuriChantier"]}
+            description="Nos partenaires de confiance"
+            textboxLayout="default"
+            useInvertedBackground={false}
+          />
+        </div>
+
         <div id="about" data-section="about">
           <AboutMetric
             useInvertedBackground={true}
@@ -110,7 +115,7 @@ Nos solutions d'EPI certifiées protègent vos collaborateurs et assurent la con
             gridVariant="three-columns-all-equal-width"
             useInvertedBackground={true}
             features={[
-              { title: "Expertise Locale", description: "Connaissance approfondie des contraintes du marché local réunionnais.", imageSrc: "http://img.b2bpic.net/free-photo/warehouse-worker-checking-inventory_23-2152001550.jpg" },
+              { title: "Expertise Locale", description: "Connaissance approfondie des contraintes du marché local réunionnais.", imageSrc: "http://img.b2bpic.net/free-photo/warehouse-worker-checking-inventory_23-2152001550.jpg?_wi=2" },
               { title: "Normes Strictes", description: "Tous nos EPI répondent aux dernières normes européennes de sécurité.", imageSrc: "http://img.b2bpic.net/free-photo/manual-worker-with-face-mask-working-carpentry-warehouse-coronavirus-pandemic_637285-11777.jpg" },
               { title: "Stock Permanent", description: "Un large choix disponible immédiatement pour vos chantiers.", imageSrc: "http://img.b2bpic.net/free-photo/engineers-industry-40-industrial-plant-controlling-automated-machinery_482257-120564.jpg" },
             ]}
@@ -136,42 +141,43 @@ Nos solutions d'EPI certifiées protègent vos collaborateurs et assurent la con
         </div>
 
         <div id="testimonials" data-section="testimonials">
-          <TestimonialCardTwelve
+          <TestimonialCardOne
-            useInvertedBackground={true}
+            title="Ce que nos partenaires disent"
+            animationType="blur-reveal"
+            gridVariant="uniform-all-items-equal"
+            useInvertedBackground={false}
+            description="Retours d'expérience"
+            textboxLayout="default"
             testimonials={[
-              { id: "t1", name: "Jean Dupont", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-plus-size-man-working-construction_23-2150772851.jpg" },
+              { id: "t1", name: "Jean Dupont", role: "Chef de chantier", company: "BTP 974", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-plus-size-man-working-construction_23-2150772851.jpg" },
-              { id: "t2", name: "Marc Martin", imageSrc: "http://img.b2bpic.net/free-photo/woman-wearing-special-industrial-protective-equipment_23-2148991969.jpg" },
+              { id: "t2", name: "Marc Martin", role: "Responsable Sécurité", company: "SecurPro", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/woman-wearing-special-industrial-protective-equipment_23-2148991969.jpg" },
-              { id: "t3", name: "Sophie Leroy", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-engineer-talking-phone_23-2148233674.jpg" },
+              { id: "t3", name: "Sophie Leroy", role: "Ingénieure", company: "BatirRéunion", rating: 5, imageSrc: "http://close-up-portrait-engineer-talking-phone_23-2148233674.jpg" },
-              { id: "t4", name: "Lucie Bernard", imageSrc: "http://img.b2bpic.net/free-photo/male-worker-with-arms-crossed-standing-factory_107420-96042.jpg" },
-              { id: "t5", name: "Pierre Vidal", imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-young-man-with-helmet_23-2148269289.jpg" },
             ]}
-            cardTitle="Ce que nos partenaires disent"
-            cardTag="Témoignages"
-            cardAnimation="slide-up"
           />
         </div>
 
         <div id="contact" data-section="contact">
-          <ContactCenter
+          <ContactSplitForm
-            tag="Contact"
+            title="Nous contacter"
-            title="Obtenez votre devis personnalisé en 24h"
+            description="Envoyez-nous vos besoins, nous y répondrons sous 24h."
-            description="Nous nous engageons à traiter vos demandes rapidement pour assurer votre sécurité."
+            inputs={[
-            background={{ variant: "gradient-bars" }}
+                { name: "name", type: "text", placeholder: "Votre Nom" },
-            useInvertedBackground={true}
+                { name: "email", type: "email", placeholder: "Votre Email" },
+                { name: "title", type: "text", placeholder: "Votre Job / Taille Entreprise" }
+            ]}
+            imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Df1ETXUvuyYPxkhnyZJKVSXGQj/chantier-1778660616866-4fd2157e.png?_wi=2"
+            useInvertedBackground={false}
           />
         </div>
 
         <div id="footer" data-section="footer">
-          <FooterLogoEmphasis
+          <FooterLogoReveal
             logoText="SAE Réunion"
-            columns={[
+            leftLink={{ text: "Mentions Légales" }}
-              { items: [{ label: "Accueil", href: "#hero" }, { label: "Produits", href: "#products" }] },
+            rightLink={{ text: "Confidentialité" }}
-              { items: [{ label: "À Propos", href: "#about" }, { label: "Contact", href: "#contact" }] },
-              { items: [{ label: "Mentions Légales" }, { label: "Confidentialité" }] },
-            ]}
           />
         </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}