/* HeroGSC.jsx — Custom GSC home hero matching the original page copy. */

const HERO_PHOTO = "uploads/Home Renovation Maplewood1.jpg";


const HeroGSC = ({ onCta }) =>
<section className="hero" data-screen-label="hero">
    <div className="container hero__grid">
      <div>
        <h1 className="hero__title">YOUR LOCAL GENERAL CONTRACTOR SERVING NORTH & CENTRAL JERSEY

      </h1>
        <p className="hero__sub">
          Providing General Contracting services for residential and commercial properties all over North and Central Jersey.
        </p>
        <p className="hero__cta-line">Get A Fair And Honest Estimate Today!</p>
        <ul className="hero__list">
          <li><IconCheck size={22} stroke={3.5} style={{ color: "#7BC242", flexShrink: 0, marginTop: 1 }} /> Expert Services At Reasonable Prices.</li>
          <li><IconCheck size={22} stroke={3.5} style={{ color: "#7BC242", flexShrink: 0, marginTop: 1 }} /> Licensed &amp; insured sub-contractors used on every project.</li>
          <li><IconCheck size={22} stroke={3.5} style={{ color: "#7BC242", flexShrink: 0, marginTop: 1 }} /> Projects Finished On-Time and On-Budget.</li>
        </ul>
        <button className="btn btn--primary" onClick={onCta}>
          Get Your Free Estimate Here
        </button>
      </div>
      <div className="collage collage--single">
        <div className="collage__photo collage__photo--solo" style={{ backgroundImage: `url("${HERO_PHOTO}")` }} />
      </div>
    </div>
  </section>;


window.HeroGSC = HeroGSC;