function Footer() {
  const cols = [
    { h: 'Industries', links: ['Mining & search', 'Hospitality', 'Commercial cleaning', 'Perimeter patrol', 'Coastal surveillance', 'Aged care'] },
    { h: 'Services', links: ['Rental', 'Purchase', 'Localization', 'Managed service', 'Training'] },
    { h: 'Company', links: ['About', 'Case studies', 'Careers', 'Press', 'Contact'] },
    { h: 'Resources', links: ['Spec sheets', 'Whitepapers', 'Compliance', 'Support portal'] },
  ];
  return (
    <footer style={{ background: '#0A0F1A', color: '#AAB3BF', padding: '72px 32px 32px' }}>
      <div style={{ maxWidth: 1280, margin: '0 auto' }}>
        <div style={{ display: 'grid', gridTemplateColumns: '1.2fr 1fr 1fr 1fr 1fr', gap: 32, paddingBottom: 48, borderBottom: '1px solid #17294D' }}>
          <div>
            <img src="../../assets/logo-mono-placeholder.svg" alt="AusMotion" style={{ height: 28 }}/>
            <p style={{ fontFamily: 'Inter', fontSize: 13, lineHeight: 1.6, color: '#7B8593', marginTop: 16, maxWidth: 260 }}>
              Localizing world-class robots for Australian industries. Rental, purchase, and managed service.
            </p>
            <div style={{ display: 'flex', gap: 14, marginTop: 20, fontFamily: 'Inter', fontSize: 13, flexWrap: 'wrap' }}>
              <a href="mailto:contact@ausmotion.com.au" style={{ color: '#AAB3BF', textDecoration: 'none', borderBottom: '1px solid #17294D', display: 'inline-flex', alignItems: 'center', gap: 6 }}>
                <Icons.Mail size={14}/> contact@ausmotion.com.au
              </a>
              <a href="tel:+6146805588" style={{ color: '#AAB3BF', textDecoration: 'none', borderBottom: '1px solid #17294D', display: 'inline-flex', alignItems: 'center', gap: 6 }}>
                <Icons.Phone size={14}/> +61 46805588
              </a>
            </div>
          </div>
          {cols.map(c => (
            <div key={c.h}>
              <div style={{ fontFamily: 'JetBrains Mono', fontSize: 11, fontWeight: 600, letterSpacing: '0.14em', textTransform: 'uppercase', color: '#FAFBFC', marginBottom: 14 }}>{c.h}</div>
              <ul style={{ listStyle: 'none', padding: 0, margin: 0, display: 'flex', flexDirection: 'column', gap: 10 }}>
                {c.links.map(l => (
                  <li key={l}><a href="#" style={{ fontFamily: 'Inter', fontSize: 13.5, color: '#AAB3BF', textDecoration: 'none', border: 'none' }}>{l}</a></li>
                ))}
              </ul>
            </div>
          ))}
        </div>

        {/* Certifications row */}
        <div style={{
          padding: '32px 0', display: 'flex', alignItems: 'center', gap: 32, flexWrap: 'wrap',
          borderBottom: '1px solid #17294D',
        }}>
          <div style={{ fontFamily: 'JetBrains Mono', fontSize: 11, fontWeight: 600, letterSpacing: '0.14em', textTransform: 'uppercase', color: '#7B8593' }}>Certifications</div>
          {['AS/NZS 3820', 'ISO 9001', 'WHS compliant', 'CASA approved', 'DISP member'].map(c => (
            <div key={c} style={{
              fontFamily: 'JetBrains Mono', fontSize: 11, letterSpacing: '0.1em', color: '#FAFBFC',
              padding: '6px 10px', border: '1px solid #17294D', borderRadius: 0,
            }}>{c}</div>
          ))}
        </div>

        <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', paddingTop: 24, gap: 20, flexWrap: 'wrap', fontFamily: 'Inter', fontSize: 12, color: '#7B8593' }}>
          <div>© 2026 AusMotion Robotics PTY LTD · ABN 12 345 678 901 · Perth, Western Australia</div>
          <div style={{ display: 'flex', gap: 18 }}>
            <a href="#" style={{ color: '#7B8593', border: 'none', textDecoration: 'none' }}>Privacy</a>
            <a href="#" style={{ color: '#7B8593', border: 'none', textDecoration: 'none' }}>Terms</a>
            <a href="#" style={{ color: '#7B8593', border: 'none', textDecoration: 'none' }}>Modern slavery statement</a>
          </div>
        </div>
      </div>
    </footer>
  );
}

window.Footer = Footer;