// ProductHero — the /product page's own hero, distinct from the homepage's
// live-scan hero. Frames the page as "how it works": the multi-agent pipeline
// that turns a repo into proven exploits. Keeps the standard nav (product
// link active).

function ProductHero() {
  const { React } = window;
  return (
    <section className="product-hero" data-screen-label="Product hero — how it works">
      <div className="product-hero-inner">
        <p className="product-hero-eyebrow">how it works</p>
        <h1 className="product-hero-h1">
          from your repo to a <em>proven</em> exploit — one pipeline.
        </h1>
        <p className="product-hero-sub">
          Specialized AI agents run a seven-phase pipeline — static analysis, reconnaissance,
          vulnerability analysis, exploitation, and chain analysis — and hand back deterministic
          proof-of-exploit with a one-line fix. Not a pile of alerts. Not a severity score.
          It runs in your environment — your code never leaves.
        </p>
        <div className="product-hero-ctas">
          <a className="cta cta--primary" href="/#scan">scan your repo →</a>
          <a className="cta cta--ghost" href="/pricing/">see pricing</a>
        </div>
      </div>
    </section>
  );
}

window.ProductHero = ProductHero;
