From 8ade37f3eb31672c03c604bf63d1a8f21cb8bc8c Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Sun, 24 May 2026 20:47:39 +0000
Subject: [PATCH 1/2] Update src/app/page.tsx

---
 src/app/page.tsx | 390 ++++++++++++++---------------------------------
 1 file changed, 111 insertions(+), 279 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index d770293..277f8f5 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -2,301 +2,133 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import AboutMetric from '@/components/sections/about/AboutMetric';
-import ContactText from '@/components/sections/contact/ContactText';
-import FaqSplitText from '@/components/sections/faq/FaqSplitText';
-import FeatureBorderGlow from '@/components/sections/feature/featureBorderGlow/FeatureBorderGlow';
-import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
-import HeroLogo from '@/components/sections/hero/HeroLogo';
-import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
 import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
-import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
-import { Clock, MapPin, Palette, Phone, Scissors, Sparkles } from "lucide-react";
+import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
+import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
+import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
+import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
+import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
+import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
+import ContactCTA from '@/components/sections/contact/ContactCTA';
+import FooterMedia from '@/components/sections/footer/FooterMedia';
+import { Zap, ShieldCheck, Gauge, Trophy } from "lucide-react";
 
 export default function LandingPage() {
   return (
     <ThemeProvider
-        defaultButtonVariant="directional-hover"
-        defaultTextAnimation="background-highlight"
-        borderRadius="pill"
-        contentWidth="mediumSmall"
-        sizing="largeSmall"
-        background="noiseDiagonalGradient"
-        cardStyle="outline"
+        defaultButtonVariant="hover-magnetic"
+        defaultTextAnimation="reveal-blur"
+        borderRadius="soft"
+        contentWidth="mediumLarge"
+        sizing="largeSizeMediumTitles"
+        background="noise"
+        cardStyle="glass-elevated"
         primaryButtonStyle="diagonal-gradient"
-        secondaryButtonStyle="layered"
-        headingFontWeight="medium"
+        secondaryButtonStyle="glass"
+        headingFontWeight="bold"
     >
       <ReactLenis root>
-  <div id="nav" data-section="nav">
-      <NavbarStyleFullscreen
-      navItems={[
-        {
-          name: "Accueil",
-          id: "hero",
-        },
-        {
-          name: "Services",
-          id: "features",
-        },
-        {
-          name: "À propos",
-          id: "about",
-        },
-        {
-          name: "Avis",
-          id: "testimonials",
-        },
-        {
-          name: "Contact",
-          id: "contact",
-        },
-      ]}
-      brandName="D.S Coiffure"
-    />
-  </div>
+        <div id="nav" data-section="nav">
+            <NavbarStyleFullscreen
+              navItems={[
+                { name: "Modèle", id: "hero" },
+                { name: "Performance", id: "metrics" },
+                { name: "Design", id: "features" },
+                { name: "Contact", id: "contact" },
+              ]}
+              brandName="PORSCHE"
+            />
+        </div>
 
-  <div id="hero" data-section="hero">
-      <HeroLogo
-      logoText="D.S Coiffure"
-      description="Votre salon de coiffure expert au cœur de Flers. Sublimons votre style avec passion et savoir-faire."
-      buttons={[
-        {
-          text: "Prendre rendez-vous",
-          href: "tel:0233650844",
-        },
-      ]}
-      imageSrc="http://img.b2bpic.net/free-photo/perfume-bottles-woman-s-dressing-table_53876-94360.jpg?_wi=1"
-      imageAlt="Salon D.S Coiffure intérieur"
-    />
-  </div>
+        <div id="hero" data-section="hero">
+            <HeroBillboardCarousel
+                title="GT3 RS. Pure Performance."
+                description="L'expression ultime de la compétition automobile. Une ingénierie sans compromis."
+                background={{ variant: "gradient-bars" }}
+                mediaItems={[
+                    { imageSrc: "https://img.b2bpic.net/free-photo/luxury-sport-car-parked-city-street_114579-5078.jpg" }
+                ]}
+            />
+        </div>
 
-  <div id="features" data-section="features">
-      <FeatureBorderGlow
-      animationType="slide-up"
-      textboxLayout="split"
-      useInvertedBackground={false}
-      features={[
-        {
-          icon: Scissors,
-          title: "Coupes Personnalisées",
-          description: "Des coupes adaptées à votre morphologie et votre style.",
-        },
-        {
-          icon: Palette,
-          title: "Coloration Expert",
-          description: "Techniques de coloration pour un rendu naturel ou éclatant.",
-        },
-        {
-          icon: Sparkles,
-          title: "Soins Capillaires",
-          description: "Soins profonds pour revitaliser et protéger vos cheveux.",
-        },
-      ]}
-      title="Nos Services"
-      description="Des prestations sur-mesure pour sublimer vos cheveux avec des produits de qualité."
-    />
-  </div>
+        <div id="features" data-section="features">
+            <FeatureCardThree
+                title="Design Aérodynamique"
+                description="Chaque courbe est façonnée par le vent, chaque détail optimisé pour l'appui maximal."
+                gridVariant="bento-grid"
+                animationType="blur-reveal"
+                textboxLayout="split"
+                useInvertedBackground={true}
+                features={[
+                    { title: "Aileron Fixe", description: "Appui constant à haute vitesse.", imageSrc: "https://img.b2bpic.net/free-photo/car-details-interior-exterior_23-2148416631.jpg" },
+                    { title: "Entrées d'air", description: "Refroidissement optimisé moteur.", imageSrc: "https://img.b2bpic.net/free-photo/car-headlight_23-2148416629.jpg" }
+                ]}
+            />
+        </div>
 
-  <div id="about" data-section="about">
-      <AboutMetric
-      useInvertedBackground={false}
-      title="Une Passion, Votre Style"
-      metrics={[
-        {
-          icon: MapPin,
-          label: "Localisation",
-          value: "12 Rue de Domfront",
-        },
-        {
-          icon: Clock,
-          label: "Horaires",
-          value: "Samedi dès 8h",
-        },
-        {
-          icon: Phone,
-          label: "Contact",
-          value: "02 33 65 08 44",
-        },
-      ]}
-      metricsAnimation="slide-up"
-    />
-  </div>
+        <div id="about" data-section="about">
+            <MetricSplitMediaAbout
+                title="Héritage Compétition"
+                description="La GT3 RS n'est pas seulement une voiture, c'est une machine conçue pour les circuits."
+                metrics={[{ value: "525 ch", title: "Puissance" }, { value: "3.2s", title: "0 à 100 km/h" }]}
+                useInvertedBackground={false}
+                imageSrc="https://img.b2bpic.net/free-photo/luxury-car-speed-motion-blur_114579-5078.jpg"
+            />
+        </div>
 
-  <div id="metrics" data-section="metrics">
-      <MetricCardEleven
-      animationType="slide-up"
-      textboxLayout="default"
-      useInvertedBackground={false}
-      metrics={[
-        {
-          id: "m1",
-          value: "4.5/5",
-          title: "Note Google",
-          description: "Basée sur 27 avis clients.",
-          imageSrc: "http://img.b2bpic.net/free-photo/baking-time-with-best-grandmother_329181-17830.jpg",
-        },
-        {
-          id: "m2",
-          value: "100%",
-          title: "Satisfaction",
-          description: "La priorité de notre équipe.",
-          imageSrc: "http://img.b2bpic.net/free-photo/pov-entrepreneurs-online-meeting_482257-79771.jpg",
-        },
-        {
-          id: "m3",
-          value: "Local",
-          title: "Flers",
-          description: "Ancré dans votre quotidien.",
-          imageSrc: "http://img.b2bpic.net/free-photo/smiling-hispanic-girl-textured-wall_1187-5169.jpg",
-        },
-      ]}
-      title="Nos Chiffres"
-      description="La satisfaction client est au cœur de notre salon."
-    />
-  </div>
+        <div id="metrics" data-section="metrics">
+            <MetricCardSeven
+                title="Performance Pure"
+                description="Les chiffres ne mentent pas. Vivez la précision Porsche."
+                animationType="depth-3d"
+                metrics={[
+                    { id: "1", value: "8500", title: "RPM Max", items: ["Moteur atmosphérique"] },
+                    { id: "2", value: "1450kg", title: "Poids léger", items: ["Structure optimisée"] }
+                ]}
+            />
+        </div>
 
-  <div id="testimonials" data-section="testimonials">
-      <TestimonialCardFive
-      textboxLayout="split"
-      useInvertedBackground={false}
-      testimonials={[
-        {
-          id: "1",
-          name: "Sarah L.",
-          date: "1 mois",
-          title: "Super salon",
-          quote: "Toujours très satisfaite du résultat.",
-          tag: "Client",
-          avatarSrc: "http://img.b2bpic.net/free-photo/successful-young-man-stylish-hat-relaxing-alone-cozy-cafeteria-lunch-break-looking-with-happy-expression_273609-1935.jpg",
-          imageSrc: "http://img.b2bpic.net/free-photo/perfume-bottles-woman-s-dressing-table_53876-94360.jpg?_wi=2",
-          imageAlt: "happy client smiling portrait",
-        },
-        {
-          id: "2",
-          name: "Marc T.",
-          date: "3 mois",
-          title: "Pro et accueillant",
-          quote: "Excellent accueil et coupe parfaite.",
-          tag: "Client",
-          avatarSrc: "http://img.b2bpic.net/free-photo/closeup-handsome-middleaged-man-showing-okay-signs-looking-amazed-recommending-something-cool_1258-129538.jpg",
-          imageSrc: "http://img.b2bpic.net/free-vector/vintage-monochrome-straight-razor-concept_225004-1515.jpg",
-          imageAlt: "happy client smiling portrait",
-        },
-        {
-          id: "3",
-          name: "Julie D.",
-          date: "6 mois",
-          title: "Expertise",
-          quote: "Je recommande vivement ce salon.",
-          tag: "Client",
-          avatarSrc: "http://img.b2bpic.net/free-photo/portrait-young-smiling-redhaired-woman-sitting-windowsill_231208-14235.jpg",
-          imageSrc: "http://img.b2bpic.net/free-vector/hairpainting-cosmetology-accessories-set-vector_529539-213.jpg",
-          imageAlt: "happy client smiling portrait",
-        },
-        {
-          id: "4",
-          name: "Sophie M.",
-          date: "1 an",
-          title: "Top",
-          quote: "Le meilleur salon de Flers.",
-          tag: "Client",
-          avatarSrc: "http://img.b2bpic.net/free-photo/stylish-woman-wearing-yellow-bandana_273609-13345.jpg",
-          imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-hair-salon_23-2150668420.jpg",
-          imageAlt: "happy client smiling portrait",
-        },
-        {
-          id: "5",
-          name: "Thomas G.",
-          date: "2 ans",
-          title: "Habitué",
-          quote: "Toujours au top depuis des années.",
-          tag: "Client",
-          avatarSrc: "http://img.b2bpic.net/free-photo/man-taking-good-care-his-face-home_23-2148883814.jpg",
-          imageSrc: "http://img.b2bpic.net/free-photo/glamorous-model-make-up-studio_23-2148328753.jpg",
-          imageAlt: "happy client smiling portrait",
-        },
-      ]}
-      title="Ce que nos clients disent"
-      description="La fidélité de notre clientèle témoigne de notre exigence."
-    />
-  </div>
+        <div id="testimonials" data-section="testimonials">
+            <TestimonialCardTen
+                title="L'expérience GT3 RS"
+                description="Ce que les pilotes disent de l'expérience Porsche."
+                textboxLayout="split-description"
+                useInvertedBackground={true}
+                testimonials={[
+                    { id: "1", title: "Inégalable", quote: "La meilleure voiture de piste que j'ai jamais conduite.", name: "Pilote Pro", role: "Champion GT" }
+                ]}
+            />
+        </div>
 
-  <div id="faq" data-section="faq">
-      <FaqSplitText
-      useInvertedBackground={false}
-      faqs={[
-        {
-          id: "f1",
-          title: "Prenez-vous sans rendez-vous ?",
-          content: "Nous privilégions les rendez-vous pour mieux vous servir.",
-        },
-        {
-          id: "f2",
-          title: "Quels sont vos horaires ?",
-          content: "Nous ouvrons le samedi à partir de 08:00.",
-        },
-        {
-          id: "f3",
-          title: "Où êtes-vous situé ?",
-          content: "Nous sommes au 12 Rue de Domfront, 61100 Flers.",
-        },
-      ]}
-      sideTitle="Questions Fréquentes"
-      faqsAnimation="slide-up"
-    />
-  </div>
+        <div id="faq" data-section="faq">
+            <FaqSplitMedia
+                title="En savoir plus"
+                description="Questions fréquentes sur l'ingénierie et la commande."
+                faqs={[{ id: "1", title: "Disponibilité", content: "Contactez votre centre Porsche local." }]}
+                faqsAnimation="blur-reveal"
+                textboxLayout="split"
+                useInvertedBackground={false}
+            />
+        </div>
 
-  <div id="contact" data-section="contact">
-      <ContactText
-      useInvertedBackground={false}
-      background={{
-        variant: "plain",
-      }}
-      text="Besoin d'un rendez-vous ou d'une information ? Appelez-nous au 02 33 65 08 44."
-      buttons={[
-        {
-          text: "Appeler maintenant",
-          href: "tel:0233650844",
-        },
-      ]}
-    />
-  </div>
+        <div id="contact" data-section="contact">
+            <ContactCTA
+                tag="Réservation"
+                title="Expérimentez la Performance"
+                description="Prenez le volant de votre rêve."
+                buttons={[{ text: "Contactez un expert", href: "#" }]}
+                background={{ variant: "sparkles-gradient" }}
+            />
+        </div>
 
-  <div id="footer" data-section="footer">
-      <FooterBaseCard
-      logoText="D.S Coiffure"
-      columns={[
-        {
-          title: "Navigation",
-          items: [
-            {
-              label: "Accueil",
-              href: "#hero",
-            },
-            {
-              label: "Services",
-              href: "#features",
-            },
-          ],
-        },
-        {
-          title: "Contact",
-          items: [
-            {
-              label: "02 33 65 08 44",
-              href: "tel:0233650844",
-            },
-            {
-              label: "12 Rue de Domfront, 61100 Flers",
-              href: "#",
-            },
-          ],
-        },
-      ]}
-    />
-  </div>
+        <div id="footer" data-section="footer">
+            <FooterMedia
+                logoText="PORSCHE"
+                imageSrc="https://img.b2bpic.net/free-photo/dark-luxury-background-car-interior_23-2148328753.jpg"
+                columns={[{ title: "Explorez", items: [{ label: "GT3 RS", href: "#hero" }] }]}
+            />
+        </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}
\ No newline at end of file
-- 
2.49.1


From d246c287d42eb115a2000ed029a361c6d391a560 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Sun, 24 May 2026 20:47:39 +0000
Subject: [PATCH 2/2] Update src/app/styles/variables.css

---
 src/app/styles/variables.css | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/app/styles/variables.css b/src/app/styles/variables.css
index 057d811..35e7b90 100644
--- a/src/app/styles/variables.css
+++ b/src/app/styles/variables.css
@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #f5f5f5;
-  --card: #ffffff;
-  --foreground: #1c1c1c;
-  --primary-cta: #1c1c1c;
+  --background: #0a0a0a;
+  --card: #1a1a1a;
+  --foreground: #ffffff;
+  --primary-cta: #e63946;
   --primary-cta-text: #f5f5f5;
-  --secondary-cta: #ffffff;
+  --secondary-cta: #333333;
   --secondary-cta-text: #1c1c1c;
-  --accent: #159c49;
-  --background-accent: #a8e8ba;
+  --accent: #e63946;
+  --background-accent: #2a2a2a;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
-- 
2.49.1