Update src/app/styles/variables.css

Merge version_2 into main

src/app/page.tsx

@@ -4,7 +4,7 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import ContactCTA from '@/components/sections/contact/ContactCTA';
 import FeatureHoverPattern from '@/components/sections/feature/featureHoverPattern/FeatureHoverPattern';
-import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
 import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleCarousel';
 import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
 import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
@@ -31,21 +31,13 @@ export default function LandingPage() {
       <NavbarStyleApple
       navItems={[
         {
-          name: "Accueil",
+          name: "Accueil",          id: "hero"},
-          id: "hero",
-        },
         {
-          name: "Détails",
+          name: "Détails",          id: "details"},
-          id: "details",
-        },
         {
-          name: "Avantages",
+          name: "Avantages",          id: "features"},
-          id: "features",
-        },
         {
-          name: "Réserver",
+          name: "Réserver",          id: "contact"},
-          id: "contact",
-        },
       ]}
       brandName="Bidawi Car"
     />
@@ -54,116 +46,67 @@ export default function LandingPage() {
   <div id="hero" data-section="hero">
       <HeroSplitDoubleCarousel
       background={{
-        variant: "radial-gradient",
+        variant: "radial-gradient"}}
-      }}
       title="Location Dacia Logan Simple & Rapide"
-      description="Réservez votre voiture facilement partout au Maroc."
+      description="Réservez votre voiture facilement partout au Maroc. Aucun frais caché, une transparence totale pour votre tranquillité."
       leftCarouselItems={[
         {
-          imageSrc: "http://img.b2bpic.net/free-photo/view-small-four-wheeled-vehicle-mobility-fast-travel_23-2151016456.jpg",
+          imageSrc: "http://img.b2bpic.net/free-photo/view-small-four-wheeled-vehicle-mobility-fast-travel_23-2151016456.jpg",          imageAlt: "Dacia Logan Premium"},
-          imageAlt: "Dacia Logan Premium",
-        },
         {
-          imageSrc: "http://img.b2bpic.net/free-photo/senior-man-driving-while-another-man-is-sitting-car-roof-with-blackboard_1194-1187.jpg",
+          imageSrc: "http://img.b2bpic.net/free-photo/senior-man-driving-while-another-man-is-sitting-car-roof-with-blackboard_1194-1187.jpg",          imageAlt: "Dacia Logan Premium"},
-          imageAlt: "Dacia Logan Premium",
-        },
         {
-          imageSrc: "http://img.b2bpic.net/free-photo/blue-crossover-driving-city-street-modern-suv-moving-urban-traffic_169016-72788.jpg",
+          imageSrc: "http://img.b2bpic.net/free-photo/blue-crossover-driving-city-street-modern-suv-moving-urban-traffic_169016-72788.jpg",          imageAlt: "Dacia Logan Premium"},
-          imageAlt: "Dacia Logan Premium",
-        },
         {
-          imageSrc: "http://img.b2bpic.net/free-photo/empty-concrete-room-with-neon-lights_1048-13690.jpg",
+          imageSrc: "http://img.b2bpic.net/free-photo/empty-concrete-room-with-neon-lights_1048-13690.jpg",          imageAlt: "Dacia Logan Premium"},
-          imageAlt: "Dacia Logan Premium",
-        },
         {
-          imageSrc: "http://img.b2bpic.net/free-photo/abstract-store-with-futuristic-concept-architecture_23-2150861912.jpg",
+          imageSrc: "http://img.b2bpic.net/free-photo/abstract-store-with-futuristic-concept-architecture_23-2150861912.jpg",          imageAlt: "Dacia Logan Premium"},
-          imageAlt: "Dacia Logan Premium",
-        },
         {
-          imageSrc: "http://img.b2bpic.net/free-photo/single-spotlight-illuminating-dark-concrete-room_84443-81989.jpg",
+          imageSrc: "http://img.b2bpic.net/free-photo/single-spotlight-illuminating-dark-concrete-room_84443-81989.jpg",          imageAlt: "Dacia Logan Premium"},
-          imageAlt: "Dacia Logan Premium",
-        },
       ]}
       rightCarouselItems={[
         {
-          imageSrc: "http://img.b2bpic.net/free-photo/mechanic-holding-tire-tire-repair-garage-replacement-winter-summer-tires_146671-18338.jpg",
+          imageSrc: "http://img.b2bpic.net/free-photo/mechanic-holding-tire-tire-repair-garage-replacement-winter-summer-tires_146671-18338.jpg",          imageAlt: "Dacia Logan"},
-          imageAlt: "Dacia Logan",
-        },
         {
-          imageSrc: "http://img.b2bpic.net/free-photo/abstract-daytime-shadows-from-outdoors_23-2149080212.jpg",
+          imageSrc: "http://img.b2bpic.net/free-photo/abstract-daytime-shadows-from-outdoors_23-2149080212.jpg",          imageAlt: "Dacia Logan"},
-          imageAlt: "Dacia Logan",
-        },
         {
-          imageSrc: "http://img.b2bpic.net/free-photo/empty-dark-room-modern-futuristic-sci-fi-background_35913-2413.jpg",
+          imageSrc: "http://img.b2bpic.net/free-photo/empty-dark-room-modern-futuristic-sci-fi-background_35913-2413.jpg",          imageAlt: "Dacia Logan"},
-          imageAlt: "Dacia Logan",
-        },
         {
-          imageSrc: "http://img.b2bpic.net/free-photo/dramatic-spotlight-dark-metallic-wall-floor_84443-81939.jpg",
+          imageSrc: "http://img.b2bpic.net/free-photo/dramatic-spotlight-dark-metallic-wall-floor_84443-81939.jpg",          imageAlt: "Dacia Logan"},
-          imageAlt: "Dacia Logan",
-        },
         {
-          imageSrc: "http://img.b2bpic.net/free-vector/white-hatchback-car-isolated-white-vector_53876-67619.jpg",
+          imageSrc: "http://img.b2bpic.net/free-vector/white-hatchback-car-isolated-white-vector_53876-67619.jpg",          imageAlt: "Dacia Logan"},
-          imageAlt: "Dacia Logan",
-        },
         {
-          imageSrc: "http://img.b2bpic.net/free-photo/large-modern-architecture-hall_181624-239.jpg",
+          imageSrc: "http://img.b2bpic.net/free-photo/large-modern-architecture-hall_181624-239.jpg",          imageAlt: "Dacia Logan"},
-          imageAlt: "Dacia Logan",
-        },
       ]}
       buttons={[
         {
-          text: "Réserver Maintenant",
+          text: "Réserver Maintenant",          href: "#contact"},
-          href: "#contact",
-        },
         {
-          text: "Voir Disponibilité",
+          text: "Voir Disponibilité",          href: "#details"},
-          href: "#details",
-        },
       ]}
       avatars={[
         {
-          src: "http://img.b2bpic.net/free-photo/family-with-daughter-autumn-park_1157-22526.jpg",
+          src: "http://img.b2bpic.net/free-photo/family-with-daughter-autumn-park_1157-22526.jpg",          alt: "Client satisfait 1"},
-          alt: "Client satisfait 1",
-        },
         {
-          src: "http://img.b2bpic.net/free-photo/internationals-people-standing-cafe-drinking-coffee_1157-31442.jpg",
+          src: "http://img.b2bpic.net/free-photo/internationals-people-standing-cafe-drinking-coffee_1157-31442.jpg",          alt: "Client satisfait 2"},
-          alt: "Client satisfait 2",
-        },
         {
-          src: "http://img.b2bpic.net/free-photo/store-employee-hands-man-gift-certificate-he-bought-christmas-present-copy-space-jewelry-store-promotion_166373-8892.jpg",
+          src: "http://img.b2bpic.net/free-photo/store-employee-hands-man-gift-certificate-he-bought-christmas-present-copy-space-jewelry-store-promotion_166373-8892.jpg",          alt: "Client satisfait 3"},
-          alt: "Client satisfait 3",
-        },
         {
-          src: "http://img.b2bpic.net/free-photo/internationals-people-standing-cafe-with-shopping-bags_1157-31449.jpg",
+          src: "http://img.b2bpic.net/free-photo/internationals-people-standing-cafe-with-shopping-bags_1157-31449.jpg",          alt: "Client satisfait 4"},
-          alt: "Client satisfait 4",
-        },
         {
-          src: "http://img.b2bpic.net/free-photo/young-blonde-girl-smiling-happy-standing-city_839833-28609.jpg",
+          src: "http://img.b2bpic.net/free-photo/young-blonde-girl-smiling-happy-standing-city_839833-28609.jpg",          alt: "Client satisfait 5"},
-          alt: "Client satisfait 5",
-        },
       ]}
       avatarText="Plus de 500 clients nous ont fait confiance."
       marqueeItems={[
         {
-          type: "text",
+          type: "text",          text: "Kilométrage illimité"},
-          text: "Kilométrage illimité",
-        },
         {
-          type: "text",
+          type: "text",          text: "Assurance incluse"},
-          text: "Assurance incluse",
-        },
         {
-          type: "text",
+          type: "text",          text: "Assistance 24/7"},
-          text: "Assistance 24/7",
-        },
         {
-          type: "text",
+          type: "text",          text: "Livraison à l'aéroport"},
-          text: "Livraison à l'aéroport",
-        },
         {
-          type: "text",
+          type: "text",          text: "Annulation gratuite"},
-          text: "Annulation gratuite",
-        },
       ]}
     />
   </div>
@@ -175,21 +118,13 @@ export default function LandingPage() {
       description="Découvrez le véhicule parfait pour vos déplacements au Maroc, alliant économie et espace."
       metrics={[
         {
-          value: "5",
+          value: "5",          title: "Places"},
-          title: "Places",
-        },
         {
-          value: "Diesel",
+          value: "Diesel",          title: "Moteur"},
-          title: "Moteur",
-        },
         {
-          value: "A/C",
+          value: "A/C",          title: "Climatisation"},
-          title: "Climatisation",
-        },
         {
-          value: "Manuelle",
+          value: "Manuelle",          title: "Boîte"},
-          title: "Boîte",
-        },
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/it-has-few-special-functions-female-customer-modern-stylish-bearded-businessman-automobile-saloon_146671-16061.jpg"
       mediaAnimation="slide-up"
@@ -204,29 +139,19 @@ export default function LandingPage() {
       features={[
         {
           icon: Zap,
-          title: "Réservation rapide",
+          title: "Réservation rapide",          description: "Réservez en quelques clics."},
-          description: "Réservez en quelques clics.",
-        },
         {
           icon: CheckCircle,
-          title: "Prix abordable",
+          title: "Prix abordable",          description: "Tarifs transparents."},
-          description: "Tarifs transparents.",
-        },
         {
           icon: MessageSquare,
-          title: "Support WhatsApp",
+          title: "Support WhatsApp",          description: "Une équipe à votre écoute."},
-          description: "Une équipe à votre écoute.",
-        },
         {
           icon: Clock,
-          title: "Disponible 24/7",
+          title: "Disponible 24/7",          description: "Service client réactif."},
-          description: "Service client réactif.",
-        },
         {
           icon: Shield,
-          title: "Sécurité garantie",
+          title: "Sécurité garantie",          description: "Assurance tous risques."},
-          description: "Assurance tous risques.",
-        },
       ]}
       title="Pourquoi Choisir Bidawi Car?"
       description="Nous mettons tout en œuvre pour simplifier votre expérience de location au quotidien."
@@ -240,38 +165,20 @@ export default function LandingPage() {
       useInvertedBackground={false}
       plans={[
         {
-          id: "daily",
+          id: "daily",          badge: "Premium",          price: "250 MAD",          subtitle: "Par jour",          buttons: [
-          badge: "Premium",
-          price: "250 MAD",
-          subtitle: "Par jour",
-          buttons: [
             {
-              text: "Réserver",
+              text: "Réserver",              href: "#contact"},
-              href: "#contact",
-            },
           ],
           features: [
-            "Kilométrage illimité",
+            "Kilométrage illimité",            "Assurance incluse",            "Service de livraison"],
-            "Assurance incluse",
-            "Service de livraison",
-          ],
         },
         {
-          id: "weekly",
+          id: "weekly",          badge: "Populaire",          price: "1600 MAD",          subtitle: "Par semaine",          buttons: [
-          badge: "Populaire",
-          price: "1600 MAD",
-          subtitle: "Par semaine",
-          buttons: [
             {
-              text: "Réserver",
+              text: "Réserver",              href: "#contact"},
-              href: "#contact",
-            },
           ],
           features: [
-            "Kilométrage illimité",
+            "Kilométrage illimité",            "Assurance premium",            "Assistance 24/7"],
-            "Assurance premium",
-            "Assistance 24/7",
-          ],
         },
       ]}
       title="Nos Forfaits"
@@ -286,40 +193,15 @@ export default function LandingPage() {
       useInvertedBackground={true}
       testimonials={[
         {
-          id: "1",
+          id: "1",          name: "Amine L.",          handle: "@aminel",          testimonial: "Excellent service et voiture impeccable.",          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-couple-having-lunch-luxury-restaurant_23-2150598344.jpg"},
-          name: "Amine L.",
-          handle: "@aminel",
-          testimonial: "Excellent service et voiture impeccable.",
-          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-couple-having-lunch-luxury-restaurant_23-2150598344.jpg",
-        },
         {
-          id: "2",
+          id: "2",          name: "Sarah K.",          handle: "@sarahk",          testimonial: "Très simple pour réserver.",          imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-smiling-blond-model-dressed-summer-hipster-clothes-trendy-girl-posing-street-background-funny-positive-woman_158538-5479.jpg"},
-          name: "Sarah K.",
-          handle: "@sarahk",
-          testimonial: "Très simple pour réserver.",
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-smiling-blond-model-dressed-summer-hipster-clothes-trendy-girl-posing-street-background-funny-positive-woman_158538-5479.jpg",
-        },
         {
-          id: "3",
+          id: "3",          name: "Youssef M.",          handle: "@youssefm",          testimonial: "Prix très compétitifs et service réactif.",          imageSrc: "http://img.b2bpic.net/free-photo/black-businessman-happy-expression_1194-2626.jpg"},
-          name: "Youssef M.",
-          handle: "@youssefm",
-          testimonial: "Prix très compétitifs et service réactif.",
-          imageSrc: "http://img.b2bpic.net/free-photo/black-businessman-happy-expression_1194-2626.jpg",
-        },
         {
-          id: "4",
+          id: "4",          name: "Fatima Z.",          handle: "@fatimaz",          testimonial: "La voiture était très confortable.",          imageSrc: "http://img.b2bpic.net/free-photo/elegant-smiling-woman-is-trying-beautiful-necklace-posh-jewellery-shop_613910-20742.jpg"},
-          name: "Fatima Z.",
-          handle: "@fatimaz",
-          testimonial: "La voiture était très confortable.",
-          imageSrc: "http://img.b2bpic.net/free-photo/elegant-smiling-woman-is-trying-beautiful-necklace-posh-jewellery-shop_613910-20742.jpg",
-        },
         {
-          id: "5",
+          id: "5",          name: "Hicham R.",          handle: "@hichamr",          testimonial: "Professionnalisme au top.",          imageSrc: "http://img.b2bpic.net/free-photo/smiling-stylish-bearded-man-with-hairstyle-elegant-retro-gray-suit-bow-tie-posing-studio-isolated-gray-background_613910-20001.jpg"},
-          name: "Hicham R.",
-          handle: "@hichamr",
-          testimonial: "Professionnalisme au top.",
-          imageSrc: "http://img.b2bpic.net/free-photo/smiling-stylish-bearded-man-with-hairstyle-elegant-retro-gray-suit-bow-tie-posing-studio-isolated-gray-background_613910-20001.jpg",
-        },
       ]}
       title="Ils nous font confiance"
       description="Retours de nos clients satisfaits de leur location."
@@ -330,48 +212,35 @@ export default function LandingPage() {
       <ContactCTA
       useInvertedBackground={false}
       background={{
-        variant: "radial-gradient",
+        variant: "radial-gradient"}}
-      }}
       tag="Réserver"
       title="Prêt à louer votre véhicule ?"
       description="Envoyez-nous un message dès maintenant pour bloquer votre Dacia Logan."
       buttons={[
         {
-          text: "Envoyer sur WhatsApp",
+          text: "Envoyer sur WhatsApp",          href: "https://wa.me/212600000000"},
-          href: "https://wa.me/212600000000",
-        },
       ]}
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterBaseCard
+      <FooterBaseReveal
       logoText="Bidawi Car"
       columns={[
         {
-          title: "Service",
+          title: "Service",          items: [
-          items: [
             {
-              label: "Réserver",
+              label: "Réserver",              href: "#contact"},
-              href: "#contact",
-            },
             {
-              label: "Tarifs",
+              label: "Tarifs",              href: "#pricing"},
-              href: "#pricing",
-            },
           ],
         },
         {
-          title: "Légal",
+          title: "Légal",          items: [
-          items: [
             {
-              label: "CGU",
+              label: "CGU",              href: "#"},
-              href: "#",
-            },
             {
-              label: "Confidentialité",
+              label: "Confidentialité",              href: "#"},
-              href: "#",
-            },
           ],
         },
       ]}
@@ -380,4 +249,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #ffffff;
+  --background: #fdfaf6;
-  --card: #f9f7f2;
+  --card: #f5f3ef;
-  --foreground: #2b2521;
+  --foreground: #2f2c28;
   --primary-cta: #c5a059;
   --primary-cta-text: #ffffff;
-  --secondary-cta: #ffffff;
+  --secondary-cta: #e8e5e1;
   --secondary-cta-text: #2b2521;
   --accent: #d4af37;
-  --background-accent: #f3eee5;
+  --background-accent: #e0dcd5;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);