function Footer({ cta, go, onContact }) {
  return <>
    {cta && <section className="cta-band" aria-labelledby="cta-title"><Container><div className="reveal"><h2 id="cta-title" style={{ fontSize: 36 }}>{cta.title}</h2><p className="lead" style={{ marginTop: 12 }}>{cta.lead}</p></div><div className="reveal" style={{ display: 'grid', gap: 12 }}><CallButton size="lg" full /><DS.Button size="lg" variant="secondary" onClick={onContact} style={{ border: '1px solid var(--oc-line)', color: 'var(--oc-text-strong)' }}>Book a free demo</DS.Button><p className="caption" style={{ textAlign: 'center' }}>Free consultation. We call back within 1 business hour.</p></div></Container></section>}
    <footer className="footer"><Container>
      <div className="footer-grid">
        <div><Wordmark onDark onClick={() => go('home')} /><p className="small" style={{ margin: '16px 0 20px', maxWidth: 300 }}>Business phone systems from {HQ}, Texas. Real phone infrastructure, real people, since 2008.</p><a href={TEL} className="num" aria-label={'Call ' + PHONE} style={{ display: 'inline-flex', alignItems: 'center', gap: 8, color: '#fff', fontWeight: 700, fontSize: 18, textDecoration: 'none', fontFamily: 'var(--font-mono)' }}><DS.Icon name="Phone" size={18} color="var(--oc-cyan)" />{PHONE}</a></div>
        <div><h2>Product</h2><nav aria-label="Product">{[['home', 'AI receptionist'], ['phone', 'Phone systems'], ['phone', 'OCN Mobile'], ['phone', 'Admin portal'], ['carriers', 'Carrier solutions']].map(([k, l]) => <a key={l} href={pathFor(k)} onClick={e => { e.preventDefault(); go(k); }}>{l}</a>)}</nav></div>
        <div><h2>Industries</h2><nav aria-label="Industries">{INDUSTRIES.map(i => <a key={i.key} href={pathFor('industries')} onClick={e => { e.preventDefault(); go('industries'); }}>{i.name}</a>)}</nav></div>
        <div><h2>Company</h2><nav aria-label="Company">{[['about', 'About'], ['support', 'Support'], ['blog', 'Blog'], ['terms', 'Terms of service'], ['privacy', 'Privacy policy']].map(([k, l]) => <a key={l} href={pathFor(k)} onClick={e => { e.preventDefault(); go(k); }}>{l}</a>)}</nav></div>
      </div>
      <div className="footer-bottom"><span>© 2026 OneCloud Networks. {HQ}, Texas.</span><span>Serving Dallas, Plano, Frisco, McKinney and Fort Worth</span></div>
    </Container></footer>
  </>;
}
Object.assign(window, { Footer });