// ═══════════════════════════════════════════════════════════════════
// src/components/Footer.jsx
// Site footer with brand, navigation columns, and legal bar.
// All contact data sourced from CONTACT constant in data.jsx.
// ═══════════════════════════════════════════════════════════════════

function Footer() {
  return (
    <footer className="footer">
      <div className="container">
        <div className="footer-grid">

          {/* Brand + tagline */}
          <div>
            <a href="#top" className="brand">
              <span className="brand-mark">O</span>
              <span>
                <b>Odonto</b>
                <span style={{ color: "var(--gold-600)", fontStyle: "italic" }}>Pro</span>
              </span>
            </a>
            <p style={{ marginTop: "20px" }}>
              Odontologia premium e humanizada. Cuidamos do seu sorriso com a mesma
              dedicação que cuidaríamos do nosso.
            </p>
          </div>

          {/* Treatment links */}
          <div>
            <h4>Tratamentos</h4>
            <ul>
              <li><a href="#servicos">Limpeza</a></li>
              <li><a href="#servicos">Clareamento</a></li>
              <li><a href="#servicos">Aparelho</a></li>
              <li><a href="#servicos">Implantes</a></li>
              <li><a href="#servicos">Estética</a></li>
            </ul>
          </div>

          {/* Clinic links */}
          <div>
            <h4>Clínica</h4>
            <ul>
              <li><a href="#diferenciais">Por que nós</a></li>
              <li><a href="#antes-depois">Resultados</a></li>
              <li><a href="#faq">Perguntas</a></li>
              <li><a href="#local">Localização</a></li>
            </ul>
          </div>

          {/* Contact */}
          <div>
            <h4>Contato</h4>
            <ul>
              <li>
                <a href={CONTACT.waLink} target="_blank" rel="noopener noreferrer">
                  WhatsApp {CONTACT.whatsapp}
                </a>
              </li>
              <li><a href={CONTACT.phoneLink}>{CONTACT.phone}</a></li>
              <li><a href={"mailto:" + CONTACT.email}>{CONTACT.email}</a></li>
              <li><a href="#">{CONTACT.instagram}</a></li>
            </ul>
          </div>

        </div>

        <div className="footer-bottom">
          <span>© 2026 OdontoPro Odontologia · CNPJ 00.000.000/0001-00 · Resp. técnica Dra. Helena Cardoso CRO/SP 00000</span>
          <span>Feito com cuidado em São Paulo.</span>
        </div>
      </div>
    </footer>
  );
}