function AuthorCard() {
  return (
    <section style={{ padding: '120px 40px', maxWidth: 1160, margin: '0 auto' }}>
      <div style={{
        display: 'grid', gridTemplateColumns: '280px 1fr', gap: 56,
        paddingTop: 64, borderTop: '1px solid var(--s4-ink)',
      }}>
        <div>
          <img src="../../assets/sam-meyer.png" alt="Sam Meyer" style={{
            width: 240, height: 300, objectFit: 'cover',
            display: 'block',
            border: '1px solid var(--s4-rule)',
            filter: 'grayscale(1) contrast(1.02)',
          }} />
        </div>
        <div>
          <div style={{
            fontFamily: 'var(--font-sans)', fontSize: 12, fontWeight: 600,
            textTransform: 'uppercase', letterSpacing: '0.14em', color: 'var(--fg-3)',
            marginBottom: 12,
          }}>
            The author
          </div>
          <h2 style={{
            fontFamily: 'var(--font-display)', fontWeight: 600,
            fontSize: 48, lineHeight: 1.0, letterSpacing: '-0.02em',
            margin: 0,
          }}>
            Sam Meyer
          </h2>
          <div style={{
            fontFamily: 'var(--font-sans)', fontSize: 16, color: 'var(--fg-2)',
            marginTop: 6,
          }}>
            Principal Consultant, Step 4 Consulting
          </div>
          <p style={{
            fontFamily: 'var(--font-serif)', fontSize: 18, lineHeight: 1.55,
            color: 'var(--fg-1)', marginTop: 24, maxWidth: 640,
          }}>
            Process architect and author with over a decade of experience designing,
            analyzing, and improving how work actually gets done inside complex
            organizations. Author of <em>Process Culture</em>, on how culture emerges
            predictably from the incentives embedded in everyday processes.
          </p>
          <div style={{ marginTop: 28, display: 'flex', gap: 24 }}>
            <a href="#" className="s4" style={{
              fontFamily: 'var(--font-sans)', fontSize: 14, fontWeight: 600,
              color: 'var(--fg-1)', textDecoration: 'underline', textUnderlineOffset: 4,
            }}>Email Sam</a>
            <a href="#" className="s4" style={{
              fontFamily: 'var(--font-sans)', fontSize: 14, fontWeight: 600,
              color: 'var(--fg-1)', textDecoration: 'underline', textUnderlineOffset: 4,
            }}>LinkedIn →</a>
          </div>
        </div>
      </div>
    </section>
  );
}

window.AuthorCard = AuthorCard;