Update src/app/page.tsx

Merge version_5 into main

src/app/layout.tsx

@@ -1404,4 +1404,4 @@ export default function RootLayout({
       </ServiceWrapper>
     </html>
   );
-}
+}

src/app/page.tsx

@@ -3,7 +3,7 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import { Flame, HeartCrack } from "lucide-react";
 import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
-import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
+import HeroLogo from '@/components/sections/hero/HeroLogo';
 import MediaAbout from '@/components/sections/about/MediaAbout';
 import ProductCardOne from '@/components/sections/product/ProductCardOne';
 import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
@@ -39,18 +39,17 @@ export default function LandingPage() {
       </div>
 
       <div id="hero" data-section="hero">
-        <HeroLogoBillboard
+        <HeroLogo
           logoText="Pepper Peak"
           description="Crafted with passion, bottled with fire. Experience the peak of flavor with our gourmet hot sauces."
           buttons={[
             { text: "Shop Now", href: "/shop" },
             { text: "Explore Flavors", href: "#flavors" }
           ]}
-          background={{ variant: "sparkles-gradient" }}
           imageSrc="https://img.b2bpic.net/free-photo/chili-sauce-peppers-dark-wooden-surface_1150-42161.jpg?_wi=1"
           imageAlt="Gourmet hot sauce bottle with chili peppers, minimalist style"
-          mediaAnimation="blur-reveal"
+          buttonAnimation="blur-reveal"
-          frameStyle="card"
+          showDimOverlay={true}
           ariaLabel="Hero section with Pepper Peak logo and hot sauce bottle"
         />
       </div>
@@ -71,10 +70,10 @@ export default function LandingPage() {
       <div id="flavors" data-section="flavors">
         <ProductCardOne
           products={[
-            { id: "mild-sauce", name: "Smokey Chipotle", price: "$12.99", imageSrc: "https://img.b2bpic.net/free-photo/pair-lime-herbal-soup_140725-4371.jpg", imageAlt: "Mild chipotle hot sauce bottle" },
+            { id: "mild-sauce", name: "Smokey Chipotle", price: "$12.99", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SgGlSmvaVv2SYOkECykbr8Q49/tmp/smoky-pepper-hot-1771593988177-90862242.png", imageAlt: "Mild chipotle hot sauce bottle" },
-            { id: "medium-sauce", name: "Fiery Habanero", price: "$13.99", imageSrc: "https://img.b2bpic.net/free-photo/closeup-shot-various-sauces-glass-jars_181624-58324.jpg?_wi=1", imageAlt: "Medium habanero hot sauce bottle" },
+            { id: "medium-sauce", name: "Fiery Habanero", price: "$13.99", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SgGlSmvaVv2SYOkECykbr8Q49/tmp/habanero-1771593959884-62a7f9cb.png", imageAlt: "Medium habanero hot sauce bottle" },
-            { id: "hot-sauce", name: "Ghost Pepper Blast", price: "$14.99", imageSrc: "https://img.b2bpic.net/free-photo/chili-sauce-bottle-peppers-dark-wooden-surface_1150-42209.jpg?_wi=1", imageAlt: "Hot ghost pepper sauce bottle" },
+            { id: "hot-sauce", name: "Ghost Pepper Blast", price: "$14.99", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SgGlSmvaVv2SYOkECykbr8Q49/tmp/ghost-pepper-1771594304332-ae1dba58.png", imageAlt: "Hot ghost pepper sauce bottle" },
-            { id: "extra-hot-sauce", name: "Carolina Reaper Fury", price: "$15.99", imageSrc: "https://img.b2bpic.net/free-photo/chili-sauce-bottle-peppers-dark-wooden-surface_1150-42209.jpg?_wi=2", imageAlt: "Extra hot carolina reaper sauce bottle" }
+            { id: "extra-hot-sauce", name: "Carolina Reaper Fury", price: "$15.99", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SgGlSmvaVv2SYOkECykbr8Q49/tmp/carolina-reaper-1771593730563-90c00cbc.png", imageAlt: "Extra hot carolina reaper sauce bottle" }
           ]}
           title="Discover Our Fiery Flavors"
           description="From a subtle kick to an intense inferno, find your perfect heat level."
@@ -113,14 +112,14 @@ export default function LandingPage() {
               title: "Crafted with Care",              description: "Each bottle of Pepper Peak hot sauce is a testament to quality, made with meticulously sourced ingredients and traditional methods for unparalleled flavor.",              icon: HeartCrack,
               mediaItems: [
                 { imageSrc: "https://img.b2bpic.net/free-photo/closeup-shot-various-sauces-glass-jars_181624-58324.jpg?_wi=2", imageAlt: "Artisan hot sauce bottling process" },
-                { imageSrc: "https://img.b2bpic.net/free-photo/closeup-shot-various-sauces-glass-jars_181624-58324.jpg?_wi=3", imageAlt: "Selection of fresh chili peppers" }
+                { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SgGlSmvaVv2SYOkECykbr8Q49/tmp/jar-of-hot-sause-1771594380756-f2ae1fac.png", imageAlt: "Selection of fresh chili peppers" }
               ]
             },
             {
               title: "Unleash Your Inner Chef",              description: "Elevate your culinary creations. Our diverse range of sauces inspires experimentation, turning everyday meals into gourmet experiences.",              icon: Flame,
               mediaItems: [
-                { imageSrc: "https://img.b2bpic.net/free-photo/closeup-shot-various-sauces-glass-jars_181624-58324.jpg?_wi=4", imageAlt: "Dish seasoned with hot sauce" },
+                { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SgGlSmvaVv2SYOkECykbr8Q49/tmp/jar-of-hot-sause-1771594468564-e8d86109.png", imageAlt: "Dish seasoned with hot sauce" },
-                { imageSrc: "https://img.b2bpic.net/free-photo/closeup-shot-various-sauces-glass-jars_181624-58324.jpg?_wi=5", imageAlt: "Gourmet food pairing with hot sauce" }
+                { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SgGlSmvaVv2SYOkECykbr8Q49/tmp/jar-of-flamable-hot-sause-1771594878421-660036df.png", imageAlt: "Gourmet food pairing with hot sauce" }
               ]
             }
           ]}

src/app/styles/variables.css

@@ -2,21 +2,21 @@
   /* Base units */
   /* --vw is set by ThemeProvider */
 
-  /* --background: #060000;;
+  /* --background: #060000;;;
-  --card: #1d0d0d;;
+  --card: #1d0d0d;;;
-  --foreground: #ffe6e6;;
+  --foreground: #ffe6e6;;;
-  --primary-cta: #ff3d4a;;
+  --primary-cta: #ff3d4a;;;
-  --secondary-cta: #1f0a0a;;
+  --secondary-cta: #1f0a0a;;;
-  --accent: #7b2d2d;;
+  --accent: #7b2d2d;;;
-  --background-accent: #b8111f;; */
+  --background-accent: #b8111f;;; */
 
-  --background: #060000;;
+  --background: #060000;;;
-  --card: #1d0d0d;;
+  --card: #1d0d0d;;;
-  --foreground: #ffe6e6;;
+  --foreground: #ffe6e6;;;
-  --primary-cta: #ff3d4a;;
+  --primary-cta: #ff3d4a;;;
-  --secondary-cta: #1f0a0a;;
+  --secondary-cta: #1f0a0a;;;
-  --accent: #7b2d2d;;
+  --accent: #7b2d2d;;;
-  --background-accent: #b8111f;;
+  --background-accent: #b8111f;;;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);