// Sample draft — full-bleed dark editorial section
function SampleDraft() {
  return (
    <section className="sample-section" id="sample">
      <div className="section-inner">
        <div className="section-eyebrow">Example draft</div>
        <h2>Specific. Researched. Sounds like <em>you</em>.</h2>
        <p className="lede">Every draft cites something specific you'd have to read about to know. Generic outreach gets ignored. This doesn't.</p>

        <div className="draft-render">
          <div className="meta">
            <span>From</span><span className="v">maria.silva@lse.ac.uk</span>
            <span>To</span><span className="v">a.morrison@thompsoncapital.co.uk</span>
            <span>Subj</span><span className="v">Question about your M&amp;A advisory work, would love to chat</span>
          </div>
          <p>Dear Alexandra,</p>
          <p>I came across Thompson Capital after reading about your work advising <mark>Whitman &amp; Reid on the Reuters deal</mark>. A remarkable outcome for a boutique on the buy-side.</p>
          <p>I'm a <mark>third-year economics undergraduate at LSE</mark>, with a <mark>summer at PwC in their UK M&amp;A practice</mark>. I'm interested specifically in firms that operate the way Thompson does: partner-led, sub-50, mid-cap mandates where you actually see the deal end-to-end.</p>
          <p>If you have fifteen minutes in the next few weeks, I'd love to ask you about how you think about hiring at this stage of the firm, and what graduates can do to stand out. I've attached my CV; happy to come to Mayfair at any time that suits you.</p>
          <p>Best,<br/>Maria Silva</p>
        </div>

        <p style={{ marginTop: 16, fontSize: 13, color: "var(--stone-3)", fontStyle: "italic" }}>
          Illustrative example. Real drafts are generated from your CV and live research.
        </p>

        <div className="draft-render-notes">
          <div className="note"><span className="lbl">Research</span>Whitman &amp; Reid / Reuters cited from FT article</div>
          <div className="note"><span className="lbl">Voice</span>Specific firm structure language drawn from her CV</div>
          <div className="note"><span className="lbl">Ask</span>Concrete and small. Fifteen minutes, in person</div>
        </div>
      </div>
    </section>
  );
}
Object.assign(window, { SampleDraft });