Merge version_4 into main

Merge version_4 into main

src/app/page.tsx

@@ -23,10 +23,10 @@ export default function LandingPage() {
         contentWidth="small"
         sizing="largeSizeMediumTitles"
         background="noise"
-        cardStyle="gradient-bordered"
-        primaryButtonStyle="shadow"
-        secondaryButtonStyle="radial-glow"
-        headingFontWeight="extrabold"
+        cardStyle="glass-elevated"
+        primaryButtonStyle="primary-glow"
+        secondaryButtonStyle="glass"
+        headingFontWeight="semibold"
     >
       <ReactLenis root>
   <div id="nav" data-section="nav">
@@ -65,7 +65,7 @@ export default function LandingPage() {
 
   <div id="about" data-section="about">
       <AboutMetric
-      useInvertedBackground={false}
+      useInvertedBackground={true}
       title="Proven Excellence"
       metrics={[
         { label: "Perfect Rating", value: "5.0", icon: Star },
@@ -81,7 +81,7 @@ export default function LandingPage() {
       animationType="slide-up"
       textboxLayout="split"
       gridVariant="two-columns-alternating-heights"
-      useInvertedBackground={false}
+      useInvertedBackground={true}
       products={[
         { id: "p1", name: "Vintage Cruiser", price: "Call for Price", imageSrc: "http://img.b2bpic.net/free-photo/vertical-closeup-shot-green-car-headlamps_181624-8290.jpg" },
         { id: "p2", name: "Classic Sport", price: "Call for Price", imageSrc: "http://img.b2bpic.net/free-photo/vintage-car-headlight-vintage-auto-detail-selective-focus-idea-interior-article_166373-3398.jpg" },
@@ -117,7 +117,7 @@ export default function LandingPage() {
       <FeatureBorderGlow
       animationType="slide-up"
       textboxLayout="split"
-      useInvertedBackground={false}
+      useInvertedBackground={true}
       features={[
         { title: "Transparent Sales", description: "No hidden fees, no pressure, just clear answers.", icon: ShieldCheck },
         { title: "Quality Assured", description: "Every vehicle is inspected before it hits our lot.", icon: CheckCircle },
@@ -148,7 +148,7 @@ export default function LandingPage() {
 
   <div id="faq" data-section="faq">
       <FaqSplitText
-      useInvertedBackground={false}
+      useInvertedBackground={true}
       faqs={[
         { id: "q1", title: "Do you offer financing?", content: "We work with local lenders to help secure the best financing for your needs." },
         { id: "q2", title: "Can I trade in my car?", content: "Yes, we accept trade-ins at fair market value after professional appraisal." },
@@ -183,4 +183,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}