Hero com acento coral Eter

Hero — 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-[#FAFAF8] py-24 px-6">
  <div class="max-w-4xl mx-auto text-center">
    <span class="inline-flex items-center gap-2 bg-orange-50 text-orange-600 text-xs font-semibold px-3 py-1.5 rounded-full mb-6 border border-orange-100">🚀 Eter Growth</span>
    <h1 class="text-4xl md:text-6xl font-bold text-gray-900 leading-[1.1] mb-6">Marketing que <span class="text-orange-500">gera negócio</span>, não só likes.</h1>
    <p class="text-lg text-gray-500 max-w-xl mx-auto mb-9">Estratégia, conteúdo e automação numa só equipa. Resultados mensuráveis, sem enrolação.</p>
    <div class="flex items-center justify-center gap-3">
      <a href="#" class="bg-orange-500 text-white font-semibold px-7 py-3.5 rounded-xl hover:bg-orange-600 shadow-lg shadow-orange-200">Falar com a Eter</a>
      <a href="#" class="text-gray-700 font-semibold px-7 py-3.5 rounded-xl hover:bg-white">Ver casos de sucesso →</a>
    </div>
  </div>
</section>