Contact split com mapa placeholder

Newsletter / Contact — bloco Tailwind pronto a copiar.

Instalação

Bloco em HTML + Tailwind — sem dependências de build. Copie e cole diretamente no seu projeto.

html

<section class="bg-gray-50 py-20 px-6">
  <div class="max-w-5xl mx-auto grid md:grid-cols-2 gap-8">
    <div class="bg-white p-8 rounded-2xl border border-gray-200">
      <h3 class="font-bold text-xl mb-4">Visite-nos</h3>
      <p class="text-sm text-gray-500 mb-1">Rua Exemplo, 123</p>
      <p class="text-sm text-gray-500 mb-1">Porto, Portugal</p>
      <p class="text-sm text-gray-500">geral@exemplo.com</p>
    </div>
    <div class="bg-gray-200 rounded-2xl h-full min-h-[180px] flex items-center justify-center text-gray-400 text-sm">Mapa aqui</div>
  </div>
</section>