/* global React */
window.CaseStudy = function CaseStudy() {
  return (
    <section className="case" id="case-studies">
      <div className="section-inner">
        <header className="section-head">
          <EyebrowRow kicker="§ 02 — Case study" label="Two owner-led service firms" />
          <h2>
            <span className="serif-accent">The week back. </span>
            More leads. Less paperwork.
          </h2>
        </header>

        <div className="case-grid">
          <div className="case-body">
            <p className="lead">
              Two service-business owners came to us with the same problem: every
              week disappeared into quoting, scheduling, and chasing emails. We
              put AI inside the tools their teams already used — the inbox, the
              CRM, the shared drive — and quietly took the admin off the founders' plates.
            </p>
            <blockquote>
              "I got my Fridays back. That's the honest version of the story."
              <cite>— Founder, service firm</cite>
            </blockquote>
            <TextLink href="#">Read the full study</TextLink>
          </div>
          <aside className="case-stats">
            <div className="stat">
              <Hairline w={28} />
              <span className="stat-n">−60%</span>
              <span className="stat-l">time spent on admin tasks</span>
            </div>
            <div className="stat">
              <Hairline w={28} />
              <span className="stat-n">+43%</span>
              <span className="stat-l">qualified leads, quarter on quarter</span>
            </div>
            <div className="stat">
              <Hairline w={28} />
              <span className="stat-n">Owners</span>
              <span className="stat-l">back on the work that grows the business</span>
            </div>
          </aside>
        </div>
      </div>
    </section>
  );
};
