import CountUp from '../shared/CountUp'
export default function HomeWhyChooseUs() {
  return (
    <div
      className="elementor-element elementor-element-9ff3146 e-flex e-con-boxed e-con e-parent"
      data-id="9ff3146"
      data-element_type="container"
      data-e-type="container"
      data-settings={JSON.stringify({ background_background: "classic" })}
    >
      <div className="e-con-inner">
        {/* Section Title */}
        <div
          className="elementor-element elementor-element-d78b401 elementor-widget elementor-widget-rakarsectiontitle"
          data-id="d78b401"
          data-element_type="widget"
          data-e-type="widget"
          data-widget_type="rakarsectiontitle.default"
        >
          <div className="elementor-widget-container">
            <div className="title-area text-center">
              <span className="sub-title2">
                <img decoding="async" src="/assets/images/title_icon5.svg" alt="Shape" />
                Why Choose Us
              </span>
              <h2 className="sec-title">Great Reasons To Hire PROFEN</h2>
            </div>
          </div>
        </div>

        {/* Features Columns */}
        <div
          className="elementor-element elementor-element-2a912e6 e-con-full e-flex e-con e-child"
          data-id="2a912e6"
          data-element_type="container"
          data-e-type="container"
        >
          {/* Left Column - Features 1-3 */}
          <div
            className="elementor-element elementor-element-9d48ffe e-con-full e-flex e-con e-child"
            data-id="9d48ffe"
            data-element_type="container"
            data-e-type="container"
          >
            <div
              className="elementor-element elementor-element-4d4c447 elementor-widget elementor-widget-rakarchooseus"
              data-id="4d4c447"
              data-element_type="widget"
              data-e-type="widget"
              data-widget_type="rakarchooseus.default"
            >
              <div className="elementor-widget-container">
                <div className="why-feature">
                  <div className="box-number">01</div>
                  <div className="box-icon"><img decoding="async" src="/assets/images/why_feature_1.svg" alt="why_feature_1" /></div>
                  <h3 className="box-title">Industry Expertise</h3>
                  <p className="box-text">With years of experience, we have successfully supplied high-performance solutions to a diverse range of industries, ensuring efficiency &amp; durability.</p>
                </div>
                <div className="why-feature">
                  <div className="box-number">02</div>
                  <div className="box-icon"><img decoding="async" src="/assets/images/why_feature_2.svg" alt="why_feature_2" /></div>
                  <h3 className="box-title">Reliable Global Sourcing</h3>
                  <p className="box-text">With an extensive network of suppliers worldwide, we efficiently source materials &amp; equipment, offering competitive pricing &amp; timely delivery.</p>
                </div>
                <div className="why-feature">
                  <div className="box-number">03</div>
                  <div className="box-icon"><img decoding="async" src="/assets/images/why_feature_3.svg" alt="why_feature_3" /></div>
                  <h3 className="box-title">ISO 9001:2015 Certified</h3>
                  <p className="box-text">Our commitment to quality and excellence is backed by ISO certification, ensuring that every product and service meets global industry standards.</p>
                </div>
              </div>
            </div>
          </div>

          {/* Center Image */}
          <div
            className="elementor-element elementor-element-c18e14e e-con-full elementor-hidden-tablet elementor-hidden-mobile e-flex e-con e-child"
            data-id="c18e14e"
            data-element_type="container"
            data-e-type="container"
          >
            <div
              className="elementor-element elementor-element-9180573 elementor-widget elementor-widget-image"
              data-id="9180573"
              data-element_type="widget"
              data-e-type="widget"
              data-widget_type="image.default"
            >
              <div className="elementor-widget-container">
                <img fetchpriority="high" decoding="async" width="424" height="632" src="/assets/images/Workerimg.png" className="attachment-full size-full wp-image-2826" alt="" srcSet="/assets/images/Workerimg.png 424w, /assets/images/Workerimg-201x300.png 201w" sizes="(max-width: 424px) 100vw, 424px" />
              </div>
            </div>
          </div>

          {/* Right Column - Features 4-6 */}
          <div
            className="elementor-element elementor-element-bfd123f e-con-full e-flex e-con e-child"
            data-id="bfd123f"
            data-element_type="container"
            data-e-type="container"
          >
            <div
              className="elementor-element elementor-element-b4f3587 elementor-widget elementor-widget-rakarchooseus"
              data-id="b4f3587"
              data-element_type="widget"
              data-e-type="widget"
              data-widget_type="rakarchooseus.default"
            >
              <div className="elementor-widget-container">
                <div className="why-feature">
                  <div className="box-number">04</div>
                  <div className="box-icon"><img decoding="async" src="/assets/images/why_feature_4.svg" alt="why_feature_4" /></div>
                  <h3 className="box-title">High-Quality Products &amp; Services</h3>
                  <p className="box-text">We offer a diverse range of premium products from over 35 internationally recognized manufacturers, ensuring the best solutions for our clients.</p>
                </div>
                <div className="why-feature">
                  <div className="box-number">05</div>
                  <div className="box-icon"><img decoding="async" src="/assets/images/why_feature_5.svg" alt="why_feature_5" /></div>
                  <h3 className="box-title">Customer-Centric Approach</h3>
                  <p className="box-text">We prioritize our clients' needs, providing personalized support, technical expertise, and exceptional services from the beginning to completion of the project.</p>
                </div>
                <div className="why-feature">
                  <div className="box-number">06</div>
                  <div className="box-icon"><img decoding="async" src="/assets/images/why_feature_6.svg" alt="why_feature_6" /></div>
                  <h3 className="box-title">Reputation &amp; Trust</h3>
                  <p className="box-text">More than 80% of our business comes from repeat customers and word-of-mouth referrals, a testament to our reliable services, customer satisfaction, and market leadership.</p>
                </div>
              </div>
            </div>
          </div>
        </div>

        {/* Counter Stats */}
        <div
          className="elementor-element elementor-element-af64a0d elementor-widget elementor-widget-rakarcounterup"
          data-id="af64a0d"
          data-element_type="widget"
          data-e-type="widget"
          data-widget_type="rakarcounterup.default"
        >
          <div className="elementor-widget-container">
            <div className="counter-card-wrap style4">
              <div className="counter-card">
                <div className="media-body">
                  <h2 className="box-number"><CountUp end={350} suffix="+" /></h2>
                  <p className="box-text">PROJECTS FINISHED</p>
                </div>
              </div>
              <div className="divider"></div>
              <div className="counter-card">
                <div className="media-body">
                  <h2 className="box-number"><CountUp end={80} suffix="+" /></h2>
                  <p className="box-text">SATISFIED CLIENTS</p>
                </div>
              </div>
              <div className="divider"></div>
              <div className="counter-card">
                <div className="media-body">
                  <h2 className="box-number"><CountUp end={35} suffix="+" /></h2>
                  <p className="box-text">EXPERT WORKERS</p>
                </div>
              </div>
              <div className="divider"></div>
              <div className="counter-card">
                <div className="media-body">
                  <h2 className="box-number"><CountUp end={20} suffix="+" /></h2>
                  <p className="box-text">YEARS OF EXPERIENCE</p>
                </div>
              </div>
              <div className="divider"></div>
            </div>
          </div>
        </div>
      </div>
    </div>
  )
}
