Update src/app/page.tsx

src/app/globals.css

@@ -4,13 +4,13 @@
   /* Base units */
   /* --vw is set by ThemeProvider */
 
-  --background: #f5faff;;
-  --card: #f1f8ff;;
-  --foreground: #001122;;
-  --primary-cta: #15479c;;
+  --background: #ffffff;;
+  --card: #fcfcfc;;
+  --foreground: #000000e6;;
+  --primary-cta: #1a1a1a;;
   --secondary-cta: #ffffff;;
-  --accent: #a8cce8;;
-  --background-accent: #7ba3cf;;
+  --accent: #808080;;
+  --background-accent: #d3d3d3;;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);

src/app/page.tsx

@@ -7,6 +7,7 @@ import MediaSplitTabsAbout from '@/components/sections/about/MediaSplitTabsAbout
 import FeatureCardEight from '@/components/sections/feature/FeatureCardEight';
 import TeamCardThree from '@/components/sections/team/TeamCardThree';
 import TestimonialCardEight from '@/components/sections/testimonial/TestimonialCardEight';
+import MetricCardFive from '@/components/sections/metrics/MetricCardFive';
 import ContactText from '@/components/sections/contact/ContactText';
 import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
 import { Linkedin } from "lucide-react";
@@ -19,7 +20,7 @@ export default function LandingPage() {
       borderRadius="pill"
       contentWidth="mediumSmall"
       sizing="medium"
-      background="noiseGradient"
+      background="none"
       cardStyle="gradient-bordered"
       primaryButtonStyle="layered-depth"
       secondaryButtonStyle="glass"
@@ -239,6 +240,39 @@ export default function LandingPage() {
         />
       </div>
 
+      <div id="metrics" data-section="metrics">
+        <MetricCardFive
+          title="Our Impact in Numbers"
+          description="Delivering measurable results for our clients"
+          tag="Key Metrics"
+          textboxLayout="default"
+          useInvertedBackground="noInvert"
+          animationType="slide-up"
+          metrics={[
+            {
+              id: "1",
+              value: "25+",
+              description: "Years of combined legal expertise and industry leadership"
+            },
+            {
+              id: "2",
+              value: "500+",
+              description: "Successful cases resolved with favorable outcomes"
+            },
+            {
+              id: "3",
+              value: "98%",
+              description: "Client satisfaction rate and repeat business rate"
+            },
+            {
+              id: "4",
+              value: "$2B+",
+              description: "Total value of transactions and settlements handled"
+            }
+          ]}
+        />
+      </div>
+
       <div id="contact" data-section="contact">
         <ContactText
           text="Ready to move forward with your legal matter? Contact our team today for a confidential consultation."