/* global React, Icon, BrandIcon */

function Footer() {
  return (
    <footer className="footer">
      <div className="container footer-grid">
        <div className="footer-brand">
          <div className="logo-lockup">
            <div className="logo-mark">D</div>
            <div>
              <div className="logo-name">Dhany Indraswara</div>
              <div className="logo-role">AI Developer &amp; Educator · Data &amp; BI</div>
            </div>
          </div>
          <p className="footer-tag">
            Practical educational content for data and AI professionals, brand-safe and made for collaboration.
          </p>
        </div>
        <div className="footer-col">
          <h4>Sections</h4>
          <a href="#about">About</a>
          <a href="#audience">Audience</a>
          <a href="#reach">Reach</a>
          <a href="#pillars">Pillars</a>
          <a href="#collab">Collab options</a>
        </div>
        <div className="footer-col">
          <h4>Follow</h4>
          <a href="https://www.instagram.com/dhanyindraswara/" target="_blank" rel="noopener noreferrer" className="footer-social"><BrandIcon name="instagram" size={14} /> Instagram</a>
          <a href="https://www.tiktok.com/@dhany.indraswara" target="_blank" rel="noopener noreferrer" className="footer-social"><BrandIcon name="tiktok" size={14} /> TikTok</a>
          <a href="https://www.linkedin.com/in/dhany-indraswara/" target="_blank" rel="noopener noreferrer" className="footer-social"><BrandIcon name="linkedin" size={14} /> LinkedIn</a>
          <a href="https://x.com/dhanyindraswara" target="_blank" rel="noopener noreferrer" className="footer-social"><BrandIcon name="x" size={14} /> X / Twitter</a>
          <a href="https://www.facebook.com/dhany.indraswara" target="_blank" rel="noopener noreferrer" className="footer-social"><BrandIcon name="facebook" size={14} /> Facebook</a>
        </div>
        <div className="footer-col">
          <h4>Contact</h4>
          <a
            href="https://wa.me/6281805759025?text=Halo%20Dhany%2C%20saya%20tertarik%20untuk%20berkolaborasi."
            target="_blank"
            rel="noopener noreferrer"
            className="footer-social"
          >
            <BrandIcon name="whatsapp" size={14} /> +62 818 0575 9025
          </a>
          <a href="mailto:halomas@dhanyindraswara.com"><Icon name="mail" size={14} /> halomas@dhanyindraswara.com</a>
          <a href="#"><Icon name="map-pin" size={14} /> Jakarta, Indonesia</a>
        </div>
      </div>
      <div className="container footer-base">
        <span>© 2026 Dhany Indraswara · Media Kit</span>
        <span>Made for brands that care about the right audience.</span>
      </div>
    </footer>
  );
}

window.Footer = Footer;