Update src/app/page.tsx

Merge version_4 into main

src/app/page.tsx

@@ -6,7 +6,7 @@ import ContactCenter from '@/components/sections/contact/ContactCenter';
 import FaqDouble from '@/components/sections/faq/FaqDouble';
 import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
 import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
-import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
+import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
 import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
 import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
 import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
@@ -45,22 +45,18 @@ export default function LandingPage() {
   </div>
 
   <div id="hero" data-section="hero">
-      <HeroSplitDualMedia
-      background={{
-        variant: "gradient-bars"}}
+      <HeroBillboardGallery
+      background={{ variant: "gradient-bars" }}
       title="Precision Japanese Automotive Care"
       description="Expert diagnostics, maintenance, and repairs for your Japanese vehicle. Trust Kiyo's for authentic parts and unmatched craftsmanship."
       tag="Trusted Auto Specialists"
+      tagIcon={Wrench}
       mediaItems={[
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/mechanic-servicing-car-engine_1170-1253.jpg",          imageAlt: "japanese car in modern garage"},
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-woman-talking_23-2150171287.jpg",          imageAlt: "automotive maintenance tools clean"}
+        { imageSrc: "http://img.b2bpic.net/free-photo/mechanic-servicing-car-engine_1170-1253.jpg", imageAlt: "Mechanic servicing car" },
+        { imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-woman-talking_23-2150171287.jpg", imageAlt: "Automotive maintenance tools" },
+        { imageSrc: "http://img.b2bpic.net/free-photo/hands-mechanic-using-diagnostic-tool_1170-1188.jpg?_wi=1", imageAlt: "Diagnostic tools" }
       ]}
       mediaAnimation="slide-up"
-      rating={5}
-      ratingText="5/5 Star Service Rating"
-      tagIcon={Wrench}
     />
   </div>
 
@@ -94,7 +90,7 @@ export default function LandingPage() {
         {
           id: "f1",          title: "Advanced Diagnostics",          author: "Kiyo's",          description: "Cutting-edge software to identify issues accurately.",          tags: [
             "Precision"],
-          imageSrc: "http://img.b2bpic.net/free-photo/hands-mechanic-using-diagnostic-tool_1170-1188.jpg"},
+          imageSrc: "http://img.b2bpic.net/free-photo/hands-mechanic-using-diagnostic-tool_1170-1188.jpg?_wi=2"},
         {
           id: "f2",          title: "Preventive Maintenance",          author: "Kiyo's",          description: "Oil changes, filters, and scheduled tune-ups.",          tags: [
             "Reliability"],
@@ -202,8 +198,7 @@ export default function LandingPage() {
   <div id="contact" data-section="contact">
       <ContactCenter
       useInvertedBackground={false}
-      background={{
-        variant: "gradient-bars"}}
+      background={{ variant: "gradient-bars" }}
       tag="Contact Us"
       title="Get a Free Quote"
       description="Let's keep your vehicle running like new."

src/app/styles/variables.css

@@ -12,11 +12,11 @@
 
   --background: #ffffff;
   --card: #f9f9f9;
-  --foreground: #000612e6;
-  --primary-cta: #15479c;
+  --foreground: #000f06e6;
+  --primary-cta: #0a7039;
   --primary-cta-text: #ffffff;
   --secondary-cta: #f9f9f9;
-  --secondary-cta-text: #000612e6;
+  --secondary-cta-text: #000f06e6;
   --accent: #e2e2e2;
   --background-accent: #c4c4c4;