/* About page — team-voice rewrite (2026-05-26).
   Replaces the earlier first-person founder essay (pulled in PR #14 for
   surface-separation compliance). Two sections + thesis pull-quote + product
   pull-quote + CTA. No signature, no personal disclosures, no founder bio. */

function AboutPage() {
  return (
    <>
      <SiteTopBar active="about" />
      <main>
        <section className="about-hero">
          <div className="about-hero-grid">
            <div>
              <div className="site-label">
                <span className="site-dot"></span>
                <span className="site-label-num">About</span>
                <span>Why Recon exists</span>
              </div>
              <h1>
                Most small businesses read their own reviews and <em>miss everything else.</em>
              </h1>
            </div>
            <aside className="about-hero-aside">
              <strong>— A note from the team</strong>
              <p>
                The owners and operators we respect most kept asking the same two questions. <em>What are my customers actually saying online?</em> and <em>what are my competitors doing about it?</em> The honest answer, every time, was: everyone's guessing. So we started building the thing that would make us stop.
              </p>
            </aside>
          </div>
        </section>

        <article className="about-essay">
          <div className="about-essay-meta">
            <span><strong>— Vol. 01</strong></span>
            <span>The Founding Memo</span>
            <span style={{ marginLeft: "auto" }}>April 2026</span>
          </div>

          <p>
            Owning a small business in 2026 is louder than it has ever been. Your customers are talking — on Google, on Reddit, on niche forums you'd never think to read, in YouTube comments, in a review someone wrote six months ago that's still ranking. Your competitors are talking too. So is every operator in your category, every supplier, every loose AI-curious neighbor with an opinion.
          </p>

          <p>
            The problem isn't that the information is hidden. <strong>The problem is that the information is everywhere</strong>, and the cost of paying attention to all of it — really paying attention — is somewhere between a part-time job and a small mortgage.
          </p>

          <div className="about-pull">
            <p>
              The interesting question isn't <em>"what are my customers thinking?"</em> The interesting question is: <em>"of the ten thousand things they said online this month, which three should change what I do Monday morning?"</em>
            </p>
            <span className="about-pull-tag">— The thesis</span>
          </div>

          <h2 className="about-section" data-num="— 01">The consultant economy is <em>broken for the small-business owner and operator.</em></h2>

          <p>
            For most of the last fifty years, the answer to that question was simple: <em>hire a consultant</em>. Six thousand dollars, a quarterly engagement, a forty-page deck, and a recommendation that you should probably do more of what's working.
          </p>

          <p>
            That worked, kind of, when markets moved at the pace of quarters. It does not work when markets move at the pace of <em>hours</em>. By the time the consultant has scheduled a kickoff, your nearest competitor has launched a new menu, two influencers have reviewed it, and the trend that prompted the engagement is over.
          </p>

          <p>
            The deeper problem is that consultants are <em>generalists in your specific business</em>. They've worked with "people like you." They have not spent six years running your specific operation. You have. The expertise lives in <em>your head</em>. The thing they can do that you can't is read the open web at scale and tell you what's actually moving. That's the hard part, and it's the part we keep — complicated on our end, simple on yours.
          </p>

          <h2 className="about-section" data-num="— 02">What we're building, and <em>why this shape.</em></h2>

          <p>
            Recon is one bet, made in three pieces.
          </p>

          <p>
            <strong>One.</strong> The right cadence is <em>thirty days</em>. Quarterly is too slow. Weekly is too noisy. Monthly is the heartbeat of a small business — payroll, rent, P&amp;L. Insight should match the rhythm.
          </p>

          <p>
            <strong>Two.</strong> The right output is <em>five things</em>. Not a deck. Not a dashboard. Five things, ranked, each with a single sentence on why and a paste-and-run prompt on how — small enough to do yourself, hand to your staff, or assign at your next team meeting. If we can't get it down to five, we haven't done the work.
          </p>

          <p>
            <strong>Three.</strong> The right tool is <em>already on your computer</em>. ChatGPT, Claude, Gemini — they're free or close to it. The bottleneck was never the AI. The bottleneck is knowing <em>what to ask</em> — and what to do with the answer. We hand you both: the prompts, and the moves. That's Recon.
          </p>

          <div className="about-pull">
            <p>
              We're not building a SaaS. We're not building a dashboard. We're writing <em>letters</em>, every month, that carry the most leveraged moves — and the prompts to run them — you'll use all month.
            </p>
            <span className="about-pull-tag">— The product</span>
          </div>

          <p>
            A report, opened on the first of the month, read with coffee. Five things to do, ranked. Your Google listing scored, with the month's fixes. A private assistant that already knows your business, for the days in between. A signature at the bottom. Permission to ignore four of the five. That's the form factor. It's old-fashioned on purpose — the reason a doctor's note works, a tailor's note works, a banker's note works is that <em>someone who knows your situation specifically</em> took the time to write to <em>you specifically</em>. Software hasn't replaced that in six hundred years. We don't think it will next year either.
          </p>
        </article>

        <section className="about-cta">
          <div className="about-cta-card">
            <div>
              <h2>Ask for a <em>sample.</em></h2>
              <p>Tell us your business name. We'll build a free sample report on you and have it back inside 48 hours. If it's not useful, you don't owe us anything.</p>
            </div>
            <a href="/site/signup.html" className="about-cta-btn">
              <span>Send me my free Recon Report now</span>
              <span>→</span>
            </a>
          </div>
        </section>
      </main>
      <SiteFooter />
    </>
  );
}

window.AboutPage = AboutPage;
