
<section class="py-16 lg:py-24 ">

    <div class="max-w-7xl mx-auto px-6">

        <div class="flex items-center justify-center gap-1" class="">
            <img class="w-[50px]" src="{{ asset('site/payment-methods/multicaixa-referencia.png') }}" alt="">
            <img class="w-[50px]" src="{{ asset('site/payment-methods/multicaixa-express.png') }}" alt="">
            <img class="rounded-[8px] w-[50px] h-[50px]" object-contain "  src="{{ asset('site/payment-methods/banco-bci.png') }}" alt="">
        </div>
    </div>

</section>


<section>
    <footer class="bg-white border-t border-gray-200 py-10">
        <div class="max-w-7xl mx-auto px-6">
            
            <!-- Linha superior: Links + Métodos de Pagamento -->
            <div class="flex flex-col lg:flex-row items-center justify-between gap-8 text-sm text-gray-600">
                
                <!-- Links à esquerda -->
                <div class="text-center lg:text-left space-x-4">
                    <a href="#" class="hover:text-blue-600 transition">Sobre nós</a>
                    <span class="text-gray-400">|</span>
                    <a href="#" class="hover:text-blue-600 transition">Utilização de Dados</a>
                    <span class="text-gray-400">|</span>
                    <a href="#" class="hover:text-blue-600 transition">Condições de Uso</a>
                    <span class="text-gray-400">|</span>
                    <a href="#" class="hover:text-blue-600 transition">SLA</a>
                </div>
    
    
            </div>
    
            <hr class="my-8 border-gray-200">
    
            <!-- Linha inferior: Copyright + Trustpilot + Redes Sociais -->
            <div class="flex flex-col lg:flex-row items-center justify-between gap-6 text-sm text-gray-700">
                
                <!-- Copyright -->
                <div class="text-center lg:text-left">
                    <p>© 2013-{{ now()->year }} ZEINER Inc. Todos os direitos reservados | Alojamento de Sites, E-mail Profissional e Domínios AO.</p>
                </div>
    
                <!-- Trustpilot -->
                <div class="flex items-center gap-2">             
                 
                </div>
    
                <!-- Redes sociais + WhatsApp flutuante (já vem do seu componente) -->
                <div class="flex items-center gap-4">
                    <a href="#" class="text-blue-600 hover:text-blue-800">
                     <i class="fab text-[20px] fa-facebook"></i>
                    </a>
                    <a href="#" class="text-blue-400 hover:text-blue-600">
                      <i class="fab fa-instagram text-[20px] "></i>
                    </a>
                    <a href="#" class="text-gray-600 hover:text-gray-800">
                      <i class="fa fa-arrow-up text-[20px] "></i>
                    </a>
                </div>
            </div>
        </div>
    </footer>
</section>