function BuyHire() {
  return (
    <section className="buyhire section-pad" id="buyhire">
      <div className="shell">
        <div className="bh-head">
          <div>
            <div className="eyebrow">§ 09–10 — Commercial</div>
            <h2 className="kicker" style={{marginTop:14, color:'var(--bone)'}}>Buy it, or<br/><span style={{color:'var(--signal)'}}>hire it.</span></h2>
          </div>
          <p className="body-lg" style={{opacity:0.78}}>
            A hybrid model. The same fleet underwrites both lines — every rental introduces the brand to a hundred prospects, and every sale is a long-term operator who understands the platform from the inside.
          </p>
        </div>

        <div className="bh-grid">
          {/* BUY */}
          <div className="bh-card">
            <div className="bh-tag"><Bolt size={12} stroke={2}/> Direct sale</div>
            <h3>Own one.</h3>
            <p className="bh-lede">For long-horizon owner-operators — farms, civil contractors, off-grid lifestyle owners. <strong style={{color:'var(--bone)'}}>$500 refundable deposit</strong> holds your slot. Balance on delivery. 4–6 week build for stock configurations, 8–12 weeks bespoke.</p>
            <ul className="bh-points">
              <li><Check size={16} stroke={2}/> 2-year workmanship warranty · 5-year battery</li>
              <li><Check size={16} stroke={2}/> Telematics included from day one</li>
              <li><Check size={16} stroke={2}/> Modular battery upgrades — never replace the trailer</li>
              <li><Check size={16} stroke={2}/> Full deposit refund up to 14 days before despatch</li>
              <li><Check size={16} stroke={2}/> NZ Electrical Safety Certificate, transport-engineer certified</li>
            </ul>
            <div className="price-table">
              <div className="price-row head"><span className="name">Tier</span><span className="v">Sale</span><span className="v">Build</span><span className="v">Bay</span></div>
              <div className="price-row"><span className="name">Solo</span><span className="v">$19,500</span><span className="v">4 wks</span><span className="v">0.6 m³</span></div>
              <div className="price-row"><span className="name">Crew</span><span className="v">$36,500</span><span className="v">5 wks</span><span className="v">2.4 m³</span></div>
              <div className="price-row"><span className="name">Command</span><span className="v">$58,000</span><span className="v">6 wks</span><span className="v">5.0 m³</span></div>
            </div>
            <div className="bh-foot">
              <a href="#contact" className="btn btn-primary">Reserve a build slot <ArrowRight size={14} stroke={2} className="arrow"/></a>
            </div>
          </div>

          {/* HIRE */}
          <div className="bh-card">
            <div className="bh-tag"><Sun size={12} stroke={2}/> Rental fleet</div>
            <h3>Hire one.</h3>
            <p className="bh-lede">Online booking with availability calendar, instant deposit via Stripe, telematics on every fleet trailer. <strong style={{color:'var(--bone)'}}>48-hour turnaround</strong> between rentals. Standby contracts for councils and civil defence.</p>
            <ul className="bh-points">
              <li><Check size={16} stroke={2}/> Daily, weekly, monthly — or annual standby</li>
              <li><Check size={16} stroke={2}/> Customer collection or local delivery</li>
              <li><Check size={16} stroke={2}/> Module-only rental on top of a hire</li>
              <li><Check size={16} stroke={2}/> Optional rental insurance at point of booking</li>
              <li><Check size={16} stroke={2}/> Free swap if a unit fails on-site, same day</li>
            </ul>
            <div className="price-table">
              <div className="price-row head"><span className="name">Tier</span><span className="v">Day</span><span className="v">Week</span><span className="v">Month</span></div>
              <div className="price-row"><span className="name">Solo</span><span className="v">$150</span><span className="v">$700</span><span className="v">$2,000</span></div>
              <div className="price-row"><span className="name">Crew</span><span className="v">$320</span><span className="v">$1,400</span><span className="v">$4,200</span></div>
              <div className="price-row"><span className="name">Command</span><span className="v">$520</span><span className="v">$2,400</span><span className="v">$7,500</span></div>
            </div>
            <div className="bh-foot">
              <a href="#contact" className="btn btn-primary">Join the waitlist <ArrowRight size={14} stroke={2} className="arrow"/></a>
            </div>
          </div>
        </div>
      </div>
    </section>
  );
}
window.BuyHire = BuyHire;