function Callout() {
  return (
    <section style={{ padding: '120px 40px', maxWidth: 1160, margin: '0 auto' }}>
      <div style={{
        borderLeft: '2px solid var(--s4-ink)',
        paddingLeft: 40,
        maxWidth: 900,
      }}>
        <div style={{
          fontFamily: 'var(--font-sans)', fontSize: 12, fontWeight: 600,
          textTransform: 'uppercase', letterSpacing: '0.14em', color: 'var(--s4-amber-ink)',
          marginBottom: 20,
        }}>
          The tell
        </div>
        <p style={{
          fontFamily: 'var(--font-serif)', fontStyle: 'italic',
          fontSize: 32, lineHeight: 1.3, margin: 0,
          color: 'var(--fg-1)', letterSpacing: '-0.005em',
        }}>
          "I don't start with documentation requests or system audits.
          I start by asking people to describe how work actually gets done.
          What I'm listening for isn't the answer. It's the silence before the answer."
        </p>
        <div style={{
          marginTop: 32, fontFamily: 'var(--font-sans)', fontSize: 14,
          color: 'var(--fg-3)', letterSpacing: 0.2,
        }}>
          — Sam Meyer, Principal Consultant
        </div>
      </div>
    </section>
  );
}

window.Callout = Callout;