Initial Commit

components/homes/insurance-consulting/Facts.jsx

@@ -0,0 +1,70 @@
+import OdometerComponent from "@/components/common/OdometerComponent";
+import { counterData } from "@/data/facts";
+import React from "react";
+
+export default function Facts() {
+  return (
+    <div className="section-hard-data">
+      <div className="tf-container">
+        <div className="heading-section d-flex gap_12 justify-content-between flex-wrap-md mb_86">
+          <div className="left">
+            <div className="point text-body-1 mb_12">
+              <span className="item" />
+              Hard Data
+            </div>
+            <h6 className="text_primary split-text split-lines-transform">
+              As a trusted and professional insurance company, we are committed{" "}
+              <br />
+              to providing exceptional service and comprehensive coverage to our{" "}
+              <br />
+              valued clients.
+            </h6>
+          </div>
+          <div className="right">
+            <a href="#" className="tf-btn-link">
+              <span className="h6"> Find Your Plan </span>
+              <i className="icon-arrow-top-right"> </i>
+            </a>
+          </div>
+        </div>
+        <div className="wrap-counter style-3 gap_12">
+          <div className="left">
+            {counterData.left.map((item, index) => (
+              <div key={`left-${index}`} className="counter-item style-3">
+                <div className="counter-number">
+                  <div className="odometer text_primary">
+                    <OdometerComponent max={item.value} />
+                  </div>
+                  {item.units.map((unit, i) => (
+                    <span key={i} className="sub text_primary">
+                      {unit}
+                    </span>
+                  ))}
+                </div>
+                <p className="h6 text_primary">{item.label}</p>
+              </div>
+            ))}
+          </div>
+
+          <div className="right">
+            {counterData.right.map((item, index) => (
+              <div key={`right-${index}`} className="counter-item style-3">
+                <div className="counter-number">
+                  <div className="odometer text_primary">
+                    <OdometerComponent max={item.value} />
+                  </div>
+                  {item.units.map((unit, i) => (
+                    <span key={i} className="sub text_primary">
+                      {unit}
+                    </span>
+                  ))}
+                </div>
+                <p className="h6 text_primary">{item.label}</p>
+              </div>
+            ))}
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}