// SB7 Step 4: Who Gives Them a Plan — named, numbered, second-person verbs
function SBPlan({ onOpenModal, onOpenGuide }) {
  const steps = [
    {
      n: '01',
      title: 'You tour with a Byrne agent',
      desc: 'We walk Austin neighborhoods with you, ask the questions most buyers forget, and help you find a home you love. Nothing about your buying process changes.'
    },
    {
      n: '02',
      title: 'You buy the home',
      desc: 'Same negotiation, same paperwork, same closing. The only difference is what happens after ... you have a written guarantee in your file.'
    },
    {
      n: '03',
      title: "We've got your back",
      desc: 'Move in. Take your time. If the home turns out to be wrong, call us ... we list and sell it with zero listing commission for up to 18 months.'
    },
  ];

  return (
    <section id="plan" className="section plan">
      <div className="section-inner">
        <div className="plan-name">The Byrne 3-Step Plan</div>
        <h2 className="section-title">
          A plan for the biggest<br/>
          <em>purchase of your life.</em>
        </h2>
        <p className="section-lead">
          You shouldn't need a spreadsheet to feel safe about buying a home.
          The plan is intentionally simple ... and it comes with a promise in writing.
        </p>

        <div className="plan-steps">
          {steps.map(s => (
            <div className="plan-step" key={s.n}>
              <div className="plan-step-num">{s.n}</div>
              <h3 className="plan-step-title">{s.title}</h3>
              <p className="plan-step-desc">{s.desc}</p>
            </div>
          ))}
        </div>

        <div className="plan-cta">
          <button className="btn-primary" onClick={onOpenModal}>Book a Buyer Call →</button>
          <button className="cta-transitional" onClick={onOpenGuide}>Get the Free Austin Buyer Guide</button>
        </div>
      </div>
    </section>
  );
}
window.SBPlan = SBPlan;