/* Site footer — stacked logo, contact, link columns, gold hairline. */
function Footer({ onGo, onAll }) {
  const cols = [
    ["Navegar", [["Início", () => onGo("top")], ["Imóveis", () => onGo("#imoveis")], ["Como funciona", () => onGo("#processo")], ["A Carina", () => onGo("#bio")], ["Depoimentos", () => onGo("#depoimentos")]]],
    ["Imóveis", [["Casas", onAll], ["Apartamentos", onAll], ["Terrenos", onAll], ["Ver portfólio", onAll]]]
  ];
  return (
    <footer style={{ background: "var(--black)", borderTop: "1px solid var(--border-gold)" }}>
      <div className="cn-foot-grid" style={{ maxWidth: 1280, margin: "0 auto", padding: "72px 40px 36px", display: "grid", gridTemplateColumns: "1.5fr 1fr 1fr 1.2fr", gap: 48 }}>
        <div>
          <img src="assets/logo-stacked-gold.png" alt="78 Carina Imóveis" style={{ height: 120 }} />
          <p style={{ fontFamily: "var(--font-sans)", fontWeight: 300, fontSize: 15, color: "var(--fg-muted)", marginTop: 18, maxWidth: 300, lineHeight: 1.72 }}>
            Comprar, vender ou investir em Gurupi — com segurança, agilidade e quem conhece cada bairro da cidade.
          </p>
        </div>
        {cols.map(([title, links]) => (
          <div key={title}>
            <div style={footTitle}>{title}</div>
            <div style={{ marginTop: 18, display: "flex", flexDirection: "column", gap: 12, alignItems: "flex-start" }}>
              {links.map(([l, fn]) => (
                <button key={l} onClick={fn} style={footLink}
                  onMouseEnter={e => e.currentTarget.style.color = "var(--accent)"}
                  onMouseLeave={e => e.currentTarget.style.color = "var(--ink-300)"}
                >{l}</button>
              ))}
            </div>
          </div>
        ))}
        <div>
          <div style={footTitle}>Atendimento</div>
          <div style={{ marginTop: 18, display: "flex", flexDirection: "column", gap: 14 }}>
            <a href={window.CARINA_WHATS_SITE} target="_blank" rel="noopener" style={footContact}><Icon name="whatsapp" size={16} color="var(--accent)" /> (63) 98107-7000</a>
            <a href="https://instagram.com/carina.corretoradeimoveis78" target="_blank" rel="noopener" style={footContact}><Icon name="instagram" size={16} color="var(--accent)" /> @carina.corretoradeimoveis78</a>
            <span style={{ ...footContact, cursor: "default" }}><Icon name="marker" size={16} color="var(--accent)" /> Gurupi-TO</span>
          </div>
          <a href={window.CARINA_WHATS_SITE} target="_blank" rel="noopener" className="cn-primary-cta cn-primary-cta--sm" style={{ marginTop: 22 }}><span className="cn-primary-cta__label">Falar com a Carina</span></a>
        </div>
      </div>
      <div style={{ maxWidth: 1280, margin: "0 auto", padding: "24px 40px", borderTop: "1px solid var(--surface-line)", display: "flex", alignItems: "center", justifyContent: "space-between", flexWrap: "wrap", gap: 14 }}>
        <span style={{ fontFamily: "var(--font-sans)", fontWeight: 300, fontSize: 13.5, color: "var(--fg-subtle)" }}>© 2026 Carina Imóveis · Creci 39.689 GO · Gurupi-TO</span>
        <span style={{ fontFamily: "var(--font-sans)", fontWeight: 300, fontSize: 13, color: "var(--fg-subtle)", letterSpacing: "0.04em" }}>Atendimento via WhatsApp · seg a sáb</span>
      </div>
    </footer>
  );
}
const footTitle = { fontFamily: "var(--font-sans)", fontSize: 10.5, fontWeight: 500, letterSpacing: "0.2em", textTransform: "uppercase", color: "var(--accent)" };
const footLink = { background: "none", border: "none", textAlign: "left", padding: 0, cursor: "pointer", fontFamily: "var(--font-sans)", fontWeight: 300, fontSize: 15, color: "var(--ink-300)", transition: "color var(--dur) var(--ease)" };
const footContact = { display: "flex", alignItems: "center", gap: 10, fontFamily: "var(--font-sans)", fontWeight: 300, fontSize: 15, color: "var(--ink-200)", textDecoration: "none" };

Object.assign(window, { Footer });