const IconCounterSection = () => {
    return (
        <section className="icon-box-counter-section section-space">
            <div className="small-container">
                <div className="row g-4">
                    {[
                        { img: "icon-7.png", count: "300", label: "Successfully Projects" },
                        { img: "icon-4.png", count: "450", label: "Company Staffs" },
                        { img: "icon-5.png", count: "3,150", label: "Tons of Products" },
                        { img: "icon-6.png", count: "6,561", label: "Satisfied Clients" }
                    ].map((item, i) => (
                        <div key={i} className="col-xxl-3 col-xl-3 col-lg-6 col-md-6">
                            <div className="icon-box-counter-area">
                                <div className="icon-box">
                                    <img src={`/assets/imgs/icon/${item.img}`} alt="img" />
                                </div>
                                <div className="content">
                                    <h3><span className="counter">{item.count}</span>+</h3>
                                    <span className="text-1">{item.label}</span>
                                </div>
                            </div>
                        </div>
                    ))}
                </div>
            </div>
        </section>
    );
};

export default IconCounterSection;
