Update src/app/page.tsx

Merge version_15 into main

src/app/page.tsx

@@ -6,15 +6,16 @@ import ContactText from '@/components/sections/contact/ContactText';
 import FaqBase from '@/components/sections/faq/FaqBase';
 import FeatureCardTwentyNine from '@/components/sections/feature/featureCardTwentyNine/FeatureCardTwentyNine';
 import FooterBase from '@/components/sections/footer/FooterBase';
-import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
+import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
 import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
 import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
-import ProductCardFour from '@/components/sections/product/ProductCardFour';
+import ProductCardThree from '@/components/sections/product/ProductCardThree';
 import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
 import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
-import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
-import TeamCardOne from '@/components/sections/team/TeamCardOne';
-import { Sparkles, Star } from "lucide-react";
+import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
+import TeamCardSix from '@/components/sections/team/TeamCardSix';
+import FeatureBento from '@/components/sections/feature/FeatureBento';
+import { Sparkles, Star, CheckCircle, Clock, Award } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -41,6 +42,11 @@ export default function LandingPage() {
         {
           name: "Services",          id: "#services"},
         {
+          name: "Timeline",          id: "#timeline-features"},
+        {
+          name: "Démarche Détaillée",          id: "#detailed-steps"},
+        {
+          name: "Nouvelles Fonctionnalités",          id: "#features-timeline-cards"},        {
           name: "Produits",          id: "#products"},
         {
           name: "Équipe",          id: "#team"},
@@ -60,9 +66,9 @@ export default function LandingPage() {
   </div>
 
   <div id="hero" data-section="hero">
-      <HeroSplitDualMedia
-      title="Donnez Vie à Vos Idées avec une Qualité d'Impression Inégalée"
-      description="De l'idée à la réalité, nous donnons vie à vos projets avec une qualité et un savoir-faire inégalés. Obtenez des résultats exceptionnels, à chaque fois."
+      <HeroBillboardScroll
+      title="Vos Idées Imprimées. Qualité Inégalée. Zéro Souci."
+      description="Nous transformons vos visions créatives en réalités tangibles grâce à des techniques d'impression de pointe et un engagement inébranlable envers l'excellence. Chaque projet est une œuvre d'art, méticuleusement conçue et exécutée pour captiver votre public et laisser une impression durable."
       tag="Impression sur Mesure"
       buttons={[
         {
@@ -70,32 +76,30 @@ export default function LandingPage() {
         {
           text: "Demander un Devis",          href: "#contact"},
       ]}
-      mediaItems={[
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/high-angle-paint-cans-with-paint_23-2148591312.jpg",          imageAlt: "Atelier d'impression moderne"},
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/young-businesswoman-prepared-meeting_1098-2188.jpg",          imageAlt: "Businesswoman in meeting"},
-      ]}
-      mediaAnimation="slide-up"
+      imageSrc="http://img.b2bpic.net/free-photo/high-angle-paint-cans-with-paint_23-2148591312.jpg"
+      imageAlt="Atelier d'impression moderne"
       background={{
         variant: "plain"}}
-      rating={5}
-      ratingText="Basé sur +100 avis 5 étoiles"
     />
   </div>
 
   <div id="about" data-section="about">
-      <TextSplitAbout
+      <MetricSplitMediaAbout
       useInvertedBackground={true}
       title="À Propos de Notre Imprimerie"
-      description={[
-        "Depuis plus de 20 ans, Maison d'Imprimeur est le leader de l'impression sur mesure. Nous combinons tradition et innovation pour des résultats exceptionnels.",        "Notre équipe d'experts est dédiée à la réalisation de vos visions, avec un service client personnalisé et une attention méticuleuse aux détails. Nous nous engageons à offrir des solutions d'impression écologiques et durables."]}
-      buttons={[
+      description="Depuis plus de 20 ans, Maison d'Imprimeur est le leader de l'impression sur mesure. Nous combinons tradition et innovation pour des résultats exceptionnels. Notre équipe d'experts est dédiée à la réalisation de vos visions, avec un service client personnalisé et une attention méticuleuse aux détails. Nous nous engageons à offrir des solutions d'impression écologiques et durables."
+      metrics={[
         {
-          text: "Notre Histoire",          href: "#"},
+          value: "20+",          title: "Années d'Expérience"},
         {
-          text: "Nos Valeurs",          href: "#"},
+          value: "10K+",          title: "Projets Réalisés"},
+        {
+          value: "98%",          title: "Satisfaction Client"},
       ]}
+      mediaAnimation="slide-up"
+      metricsAnimation="slide-up"
+      imageSrc="http://img.b2bpic.net/free-photo/industrial-printing-machine_23-2151675276.jpg"
+      imageAlt="Machine d'impression industrielle"
     />
   </div>
 
@@ -120,25 +124,149 @@ export default function LandingPage() {
     />
   </div>
 
+  <div id="timeline-features" data-section="timeline-features">
+    <FeatureBento
+      animationType="slide-up"
+      textboxLayout="default"
+      useInvertedBackground={true}
+      title="Notre Processus Simple et Efficace"
+      description="Du concept à la livraison, suivez les étapes de votre projet avec Maison d'Imprimeur."
+      features={[
+        {
+          title: "Conception Initial",          description: "Nous écoutons vos idées et vos besoins pour une première esquisse.",          bentoComponent: "timeline",          heading: "Phase 1: Idéation",          subheading: "Votre vision prend forme.",          items: [
+            { label: "Brief Client", detail: "Discussion approfondie des besoins" },
+            { label: "Proposition de Design", detail: "Création des premières maquettes" },
+            { label: "Validation du Concept", detail: "Approbation du design final" }
+          ],
+          completedLabel: "Concept Validé"
+        },
+        {
+          title: "Préparation à l'Impression",          description: "Optimisation des fichiers pour une qualité maximale.",          bentoComponent: "timeline",          heading: "Phase 2: Pré-presse",          subheading: "La précision avant tout.",          items: [
+            { label: "Vérification des Fichiers", detail: "Contrôle technique des documents" },
+            { label: "Étalonnage des Couleurs", detail: "Garantie de fidélité colorimétrique" },
+            { label: "Bon à Tirer (BAT)", detail: "Dernière validation avant production" }
+          ],
+          completedLabel: "BAT Approuvé"
+        },
+        {
+          title: "Production et Finition",          description: "Impression et finitions pour un résultat impeccable.",          bentoComponent: "timeline",          heading: "Phase 3: Production",          subheading: "L'art de l'impression.",          items: [
+            { label: "Impression", detail: "Utilisation de technologies offset ou numérique" },
+            { label: "Finition", detail: "Découpe, pelliculage, gaufrage, etc." },
+            { label: "Contrôle Qualité", detail: "Inspection rigoureuse de chaque pièce" }
+          ],
+          completedLabel: "Prêt à l'Expédition"
+        },
+        {
+          title: "Livraison et Suivi",          description: "Votre commande livrée en temps et en heure.",          bentoComponent: "timeline",          heading: "Phase 4: Livraison",          subheading: "Le succès à votre porte.",          items: [
+            { label: "Emballage Sécurisé", detail: "Protection optimale de vos imprimés" },
+            { label: "Expédition", detail: "Livraison rapide et fiable" },
+            { label: "Satisfaction Client", detail: "Assistance après-vente" }
+          ],
+          completedLabel: "Projet Terminé"
+        }
+      ]}
+    />
+  </div>
+
+  <div id="detailed-steps" data-section="detailed-steps">
+    <FeatureBento
+      animationType="slide-up"
+      textboxLayout="default"
+      useInvertedBackground={false}
+      title="Comment Nous Procédons : Les Étapes Détaillées"
+      description="Découvrez en profondeur chaque phase de notre collaboration, de la première idée à la livraison finale de votre projet d'impression."
+      features={[
+        {
+          title: "Consultation & Stratégie",          description: "Nous commençons par une écoute attentive de vos objectifs, suivi d'une analyse pour définir la stratégie d'impression la plus adaptée.",          bentoComponent: "timeline",          heading: "Phase 1: Définition du Projet",          subheading: "Vos besoins, notre expertise.",          items: [
+            { label: "Analyse des Besoins", detail: "Comprendre votre marché et vos cibles." },
+            { label: "Conseil Expert", detail: "Propositions de matériaux et techniques." },
+            { label: "Planification Stratégique", detail: "Élaboration d'un calendrier et budget." }
+          ],
+          completedLabel: "Stratégie Validée"
+        },
+        {
+          title: "Design & Conception",          description: "Nos designers transforment vos concepts en visuels percutants, en assurant une cohérence avec votre identité de marque.",          bentoComponent: "timeline",          heading: "Phase 2: Création Visuelle",          subheading: "L'art de la mise en page.",          items: [
+            { label: "Création Graphique", detail: "Développement des éléments visuels." },
+            { label: "Maquettes & Révisions", detail: "Présentation et ajustements du design." },
+            { label: "Validation Artistique", detail: "Approbation du rendu visuel final." }
+          ],
+          completedLabel: "Design Approuvé"
+        },
+        {
+          title: "Production & Qualité",          description: "Nos équipements de pointe et notre savoir-faire garantissent une impression de la plus haute qualité, avec des finitions impeccables.",          bentoComponent: "timeline",          heading: "Phase 3: Réalisation Impeccable",          subheading: "La précision à l'œuvre.",          items: [
+            { label: "Pré-presse Détaillée", detail: "Vérification et préparation des fichiers." },
+            { label: "Impression Avancée", detail: "Utilisation des technologies les plus récentes." },
+            { label: "Finitions & Contrôle", detail: "Découpe, assemblage et inspection finale." }
+          ],
+          completedLabel: "Qualité Assurée"
+        },
+        {
+          title: "Livraison & Support",          description: "Votre commande est livrée en toute sécurité, et notre équipe reste disponible pour toute question post-production.",          bentoComponent: "timeline",          heading: "Phase 4: Succès Garanti",          subheading: "Votre projet, livré à temps.",          items: [
+            { label: "Emballage Soigné", detail: "Protection optimale des produits." },
+            { label: "Expédition Rapide", detail: "Logistique efficace pour une livraison ciblée." },
+            { label: "Suivi Clientèle", detail: "Support après-vente et satisfaction." }
+          ],
+          completedLabel: "Projet Livré"
+        }
+      ]}
+    />
+  </div>
+
+  <div id="features-timeline-cards" data-section="features-timeline-cards">
+    <FeatureBento
+      animationType="slide-up"
+      textboxLayout="default"
+      useInvertedBackground={true}
+      title="Nos Prochaines Innovations et Fonctionnalités"
+      description="Découvrez la feuille de route de Maison d'Imprimeur et les nouvelles fonctionnalités que nous développerons pour vous."
+      features={[
+        {
+          title: "Intégration IA pour le Design",          description: "Automatisation de la mise en page et suggestions créatives.",          bentoComponent: "timeline",          heading: "Développement IA",          subheading: "Optimisation de votre processus de création.",          items: [
+            { label: "Recherche & Développement", detail: "Exploration des modèles d'AI pour le design." },
+            { label: "Tests Alpha", detail: "Intégration avec nos outils de conception." },
+            { label: "Lancement Beta", detail: "Mise à disposition pour les utilisateurs test." }
+          ],
+          completedLabel: "Bientôt Disponible"
+        },
+        {
+          title: "Suivi de Production en Temps Réel",          description: "Visualisez l'état de votre commande à chaque étape du processus.",          bentoComponent: "timeline",          heading: "Transparence Accrue",          subheading: "Gardez le contrôle sur votre projet.",          items: [
+            { label: "Conception du Tableau de Bord", detail: "Développement de l'interface utilisateur." },
+            { label: "Intégration des Capteurs", detail: "Connexion aux machines d'impression." },
+            { label: "Déploiement", detail: "Accessible via votre espace client." }
+          ],
+          completedLabel: "En Cours"
+        },
+        {
+          title: "Nouvelles Options de Matériaux Écologiques",          description: "Élargissement de notre gamme de papiers recyclés et encres végétales.",          bentoComponent: "timeline",          heading: "Engagement Durable",          subheading: "Pour une impression plus respectueuse de l'environnement.",          items: [
+            { label: "Sélection des Fournisseurs", detail: "Recherche de partenaires certifiés écologiques." },
+            { label: "Tests de Qualité", detail: "Assurance des standards d'impression." },
+            { label: "Mise à Disposition", detail: "Ajout des options au catalogue." }
+          ],
+          completedLabel: "Prévu Q3 2024"
+        }
+      ]}
+    />
+  </div>
+
   <div id="products" data-section="products">
-      <ProductCardFour
+      <ProductCardThree
       animationType="slide-up"
       textboxLayout="default"
       gridVariant="four-items-2x2-equal-grid"
       useInvertedBackground={true}
       products={[
         {
-          id: "p-1",          name: "Cartes de Visite Premium",          price: "À partir de 29€",          variant: "Mat ou Brillant",          imageSrc: "http://img.b2bpic.net/free-psd/opulence-business-card-template-design_23-2152016131.jpg"},
+          id: "p-1",          name: "Cartes de Visite Premium",          price: "À partir de 29€",          imageSrc: "http://img.b2bpic.net/free-psd/opulence-business-card-template-design_23-2152016131.jpg",          priceButtonProps: { text: "Commander", href: "#contact" }},
         {
-          id: "p-2",          name: "Flyers Publicitaires",          price: "À partir de 49€",          variant: "Format A5, A6",          imageSrc: "http://img.b2bpic.net/free-photo/clipboard-near-blurs-heaps-different-bright-dry-colors_23-2148016427.jpg"},
+          id: "p-2",          name: "Flyers Publicitaires",          price: "À partir de 49€",          imageSrc: "http://img.b2bpic.net/free-photo/clipboard-near-blurs-heaps-different-bright-dry-colors_23-2148016427.jpg",          priceButtonProps: { text: "Commander", href: "#contact" }},
         {
-          id: "p-3",          name: "Brochures Pliantes",          price: "À partir de 89€",          variant: "2 ou 3 volets",          imageSrc: "http://img.b2bpic.net/free-vector/geometric-business-brochure-blue-tones_23-2147599337.jpg"},
+          id: "p-3",          name: "Brochures Pliantes",          price: "À partir de 89€",          imageSrc: "http://img.b2bpic.net/free-vector/geometric-business-brochure-blue-tones_23-2147599337.jpg",          priceButtonProps: { text: "Commander", href: "#contact" }},
         {
-          id: "p-4",          name: "Affiches Grand Format",          price: "À partir de 129€",          variant: "A2, A1, B1",          imageSrc: "http://img.b2bpic.net/free-photo/blank-white-advertisement-panel-city_23-2147845889.jpg"},
+          id: "p-4",          name: "Affiches Grand Format",          price: "À partir de 129€",          imageSrc: "http://img.b2bpic.net/free-photo/blank-white-advertisement-panel-city_23-2147845889.jpg",          priceButtonProps: { text: "Commander", href: "#contact" }},
         {
-          id: "p-5",          name: "Bannières et Roll-ups",          price: "À partir de 149€",          variant: "Diverses tailles",          imageSrc: "http://img.b2bpic.net/free-psd/business-corporation-template-design_23-2151405481.jpg"},
+          id: "p-5",          name: "Bannières et Roll-ups",          price: "À partir de 149€",          imageSrc: "http://img.b2bpic.net/free-psd/business-corporation-template-design_23-2151405481.jpg",          priceButtonProps: { text: "Commander", href: "#contact" }},
         {
-          id: "p-6",          name: "Emballages Personnalisés",          price: "Sur devis",          variant: "Carton, Kraft",          imageSrc: "http://img.b2bpic.net/free-photo/top-view-woman-preparing-cyber-monday-package_23-2148675033.jpg"},
+          id: "p-6",          name: "Emballages Personnalisés",          price: "Sur devis",          imageSrc: "http://img.b2bpic.net/free-photo/top-view-woman-preparing-cyber-monday-package_23-2148675033.jpg",          priceButtonProps: { text: "Demander un Devis", href: "#contact" }},
       ]}
       title="Explorez Notre Gamme de Produits Imprimés"
       description="Des cartes de visite élégantes aux brochures percutantes, trouvez le support idéal pour communiquer votre message."
@@ -146,7 +274,7 @@ export default function LandingPage() {
   </div>
 
   <div id="team" data-section="team">
-      <TeamCardOne
+      <TeamCardSix
       animationType="slide-up"
       textboxLayout="default"
       gridVariant="three-columns-all-equal-width"
@@ -300,10 +428,13 @@ export default function LandingPage() {
           title: "Entreprise",          items: [
             {
               label: "À Propos",              href: "#about"},
+            {
+              label: "Timeline",              href: "#timeline-features"},
             {
               label: "Produits",              href: "#products"},
             {
-              label: "Témoignages",              href: "#testimonials-section"},
+            "label": "Témoignages",              "href": "#testimonials-section"
+            },
             {
               label: "FAQ",              href: "#faq"},
           ],
@@ -325,4 +456,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}