  "use client";
  
import React from "react";
import Image from "next/image";

const FunFacts: React.FC = () => {
  return (
    <>
      <div className="funfacts-area bg-image pt-100 pb-70">
        <div className="container">
          <div className="row">
            <div className="col-lg-3 col-sm-3 col-6">
              <div className="single-funfacts-item">
                <div className="icon">
                  <Image
                    src="/img/funfacts/satisfied-clients.svg"
                    alt="image"
                    width={60}
                    height={60}
                  />
                </div>
                <h3>98%</h3>
                <p>Satisfied Clients</p>
              </div>
            </div>
            <div className="col-lg-3 col-sm-3 col-6">
              <div className="single-funfacts-item">
                <div className="icon">
                  <Image
                    src="/img/funfacts/years-of-experience.svg"
                    alt="image"
                    width={60}
                    height={60}
                  />
                </div>
                <h3>10+</h3>
                <p>Years of Experience</p>
              </div>
            </div>

            <div className="col-lg-3 col-sm-3 col-6">
              <div className="single-funfacts-item">
                <div className="icon">
                  <Image
                    src="/img/funfacts/project-delivered.svg"
                    alt="image"
                    width={60}
                    height={60}
                  />
                </div>
                <h3>250+</h3>
                <p>Project Delivered</p>
              </div>
            </div>

            

            <div className="col-lg-3 col-sm-3 col-6">
              <div className="single-funfacts-item">
                <div className="icon">
                  <Image
                    src="/img/funfacts/client-retention.svg"
                    alt="image"
                    width={60}
                    height={60}
                  />
                </div>
                <h3>96%</h3>
                <p>Client Retention</p>
              </div>
            </div>
          </div>
        </div>
      </div>
    </>
  );
};

export default FunFacts;
