| <!DOCTYPE html> |
| <html lang="pt-BR"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <title>TMT Segurança e Medicina do Trabalho</title> |
| <script src="https://cdn.tailwindcss.com"></script> |
| <link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet"> |
| <script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script> |
| <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script> |
| <script src="https://unpkg.com/feather-icons"></script> |
| <style> |
| .gradient-bg { |
| background: linear-gradient(135deg, #6b8e23 0%, #556b2f 100%); |
| } |
| .hover-scale { |
| transition: transform 0.3s ease; |
| } |
| .hover-scale:hover { |
| transform: scale(1.05); |
| } |
| .whatsapp-float { |
| position: fixed; |
| width: 60px; |
| height: 60px; |
| bottom: 40px; |
| right: 40px; |
| background-color: #25d366; |
| color: #FFF; |
| border-radius: 50px; |
| text-align: center; |
| font-size: 30px; |
| box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2); |
| z-index: 100; |
| display: flex; |
| align-items: center; |
| justify-content: center; |
| } |
| </style> |
| </head> |
| <body class="font-sans bg-white"> |
| |
| <a href="https://wa.me/5534993367770" class="whatsapp-float hover:bg-green-600 transition-colors duration-300" target="_blank"> |
| <i data-feather="message-circle"></i> |
| </a> |
|
|
| |
| <header class="gradient-bg text-white shadow-lg"> |
| <div class="container mx-auto px-6 py-4"> |
| <div class="flex items-center justify-between"> |
| <div class="flex items-center"> |
| <i data-feather="shield" class="w-10 h-10 mr-3"></i> |
| <h1 class="text-2xl font-bold">TMT Segurança e Medicina do Trabalho</h1> |
| </div> |
| <nav class="hidden md:block"> |
| <ul class="flex space-x-8"> |
| <li><a href="#servicos" class="hover:text-green-200 transition-colors">Serviços</a></li> |
| <li><a href="#sobre" class="hover:text-green-200 transition-colors">Sobre Nós</a></li> |
| <li><a href="#contato" class="hover:text-green-200 transition-colors">Contato</a></li> |
| </ul> |
| </nav> |
| <button class="md:hidden focus:outline-none"> |
| <i data-feather="menu" class="w-6 h-6"></i> |
| </button> |
| </div> |
| </div> |
| </header> |
|
|
| |
| <section class="gradient-bg text-white py-20"> |
| <div class="container mx-auto px-6 text-center"> |
| <h2 class="text-4xl md:text-5xl font-bold mb-6" data-aos="fade-up">Sua empresa em conformidade com as normas</h2> |
| <p class="text-xl mb-8 max-w-2xl mx-auto" data-aos="fade-up" data-aos-delay="100"> |
| Soluções completas em segurança e medicina do trabalho para proteger sua empresa e colaboradores. |
| </p> |
| <a href="https://wa.me/5534993367770" |
| class="bg-white text-green-800 font-bold py-3 px-8 rounded-full hover:bg-green-100 hover-scale transition-all duration-300 inline-flex items-center" |
| data-aos="fade-up" |
| data-aos-delay="200"> |
| <i data-feather="message-circle" class="mr-2"></i> Fale conosco |
| </a> |
| </div> |
| </section> |
|
|
| |
| <section id="servicos" class="py-20 bg-white"> |
| <div class="container mx-auto px-6"> |
| <h2 class="text-3xl font-bold text-center text-green-800 mb-16" data-aos="fade-up">Nossos Serviços</h2> |
| |
| <div class="grid md:grid-cols-3 gap-8"> |
| |
| <div class="bg-gray-50 p-8 rounded-lg shadow-md hover:shadow-xl transition-shadow duration-300 hover-scale" data-aos="fade-up" data-aos-delay="100"> |
| <div class="text-green-700 mb-4"> |
| <i data-feather="file-text" class="w-10 h-10"></i> |
| </div> |
| <h3 class="text-xl font-bold text-green-800 mb-3">PGR - Programa de Gerenciamento de Riscos</h3> |
| <p class="text-gray-600 mb-4"> |
| Elaboração completa do PGR para identificar, avaliar e controlar os riscos ocupacionais em sua empresa. |
| </p> |
| <a href="https://wa.me/5534993367770" class="text-green-700 font-medium hover:text-green-900 inline-flex items-center"> |
| Saiba mais <i data-feather="arrow-right" class="ml-2 w-4 h-4"></i> |
| </a> |
| </div> |
| |
| |
| <div class="bg-gray-50 p-8 rounded-lg shadow-md hover:shadow-xl transition-shadow duration-300 hover-scale" data-aos="fade-up" data-aos-delay="200"> |
| <div class="text-green-700 mb-4"> |
| <i data-feather="heart" class="w-10 h-10"></i> |
| </div> |
| <h3 class="text-xl font-bold text-green-800 mb-3">PCMSO - Programa de Controle Médico de Saúde Ocupacional</h3> |
| <p class="text-gray-600 mb-4"> |
| Desenvolvimento do PCMSO para monitorar a saúde dos trabalhadores e prevenir doenças ocupacionais. |
| </p> |
| <a href="https://wa.me/5534993367770" class="text-green-700 font-medium hover:text-green-900 inline-flex items-center"> |
| Saiba mais <i data-feather="arrow-right" class="ml-2 w-4 h-4"></i> |
| </a> |
| </div> |
| |
| |
| <div class="bg-gray-50 p-8 rounded-lg shadow-md hover:shadow-xl transition-shadow duration-300 hover-scale" data-aos="fade-up" data-aos-delay="300"> |
| <div class="text-green-700 mb-4"> |
| <i data-feather="clipboard" class="w-10 h-10"></i> |
| </div> |
| <h3 class="text-xl font-bold text-green-800 mb-3">LTCAT - Laudo Técnico das Condições Ambientais de Trabalho</h3> |
| <p class="text-gray-600 mb-4"> |
| Elaboração do LTCAT para avaliação qualitativa e quantitativa dos agentes nocivos presentes no ambiente de trabalho. |
| </p> |
| <a href="https://wa.me/5534993367770" class="text-green-700 font-medium hover:text-green-900 inline-flex items-center"> |
| Saiba mais <i data-feather="arrow-right" class="ml-2 w-4 h-4"></i> |
| </a> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section id="sobre" class="py-20 bg-gray-50"> |
| <div class="container mx-auto px-6"> |
| <div class="flex flex-col md:flex-row items-center"> |
| <div class="md:w-1/2 mb-10 md:mb-0" data-aos="fade-right"> |
| <img src="http://static.photos/construction/640x360/10" alt="Equipe de Segurança do Trabalho em obra civil usando EPIs" class="rounded-lg shadow-lg w-full"> |
| </div> |
| <div class="md:w-1/2 md:pl-12" data-aos="fade-left"> |
| <h2 class="text-3xl font-bold text-green-800 mb-6">Sobre a TMT</h2> |
| <p class="text-gray-600 mb-4"> |
| A TMT Segurança e Medicina do Trabalho é especializada em oferecer soluções completas para empresas que buscam estar em conformidade com as normas regulamentadoras. |
| </p> |
| <p class="text-gray-600 mb-4"> |
| Nossa equipe de profissionais qualificados está pronta para auxiliar sua empresa na elaboração e implementação dos programas obrigatórios, garantindo a segurança e saúde de seus colaboradores. |
| </p> |
| <p class="text-gray-600 mb-6"> |
| Com anos de experiência no mercado, nos destacamos pela qualidade dos nossos serviços e compromisso com nossos clientes. |
| </p> |
| <a href="https://wa.me/5534993367770" class="gradient-bg text-white font-bold py-3 px-8 rounded-full hover:bg-green-700 hover-scale transition-all duration-300 inline-flex items-center"> |
| <i data-feather="phone" class="mr-2"></i> Entre em contato |
| </a> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section id="contato" class="py-20 bg-white"> |
| <div class="container mx-auto px-6"> |
| <h2 class="text-3xl font-bold text-center text-green-800 mb-16" data-aos="fade-up">Entre em Contato</h2> |
| |
| <div class="flex flex-col md:flex-row"> |
| <div class="md:w-1/2 mb-10 md:mb-0" data-aos="fade-right"> |
| <div class="bg-gray-50 p-8 rounded-lg shadow-md"> |
| <h3 class="text-xl font-bold text-green-800 mb-6">Informações de Contato</h3> |
| |
| <div class="flex items-start mb-6"> |
| <i data-feather="map-pin" class="text-green-700 mr-4 mt-1"></i> |
| <div> |
| <h4 class="font-bold text-gray-800">Endereço</h4> |
| <p class="text-gray-600">Rua Duque de Caxias, 626 - Centro, Uberlândia - MG</p> |
| </div> |
| </div> |
| |
| <div class="flex items-start mb-6"> |
| <i data-feather="phone" class="text-green-700 mr-4 mt-1"></i> |
| <div> |
| <h4 class="font-bold text-gray-800">Telefone</h4> |
| <p class="text-gray-600">(34) 3219-2144</p> |
| </div> |
| </div> |
| |
| <div class="flex items-start"> |
| <i data-feather="mail" class="text-green-700 mr-4 mt-1"></i> |
| <div> |
| <h4 class="font-bold text-gray-800">WhatsApp</h4> |
| <p class="text-gray-600">(34) 99336-7770</p> |
| </div> |
| </div> |
| </div> |
| </div> |
| |
| <div class="md:w-1/2 md:pl-10" data-aos="fade-left"> |
| <div class="bg-gray-50 p-8 rounded-lg shadow-md"> |
| <h3 class="text-xl font-bold text-green-800 mb-6">Envie uma Mensagem</h3> |
| <p class="text-gray-600 mb-6">Preencha o formulário abaixo e entraremos em contato o mais breve possível.</p> |
| |
| <form action="https://formsubmit.co/seu-email@tmt.com" method="POST"> |
| <input type="hidden" name="_captcha" value="false"> |
| <input type="hidden" name="_next" value="https://seusite.com/obrigado.html"> |
| |
| <div class="mb-4"> |
| <label for="name" class="block text-gray-700 font-medium mb-2">Nome</label> |
| <input type="text" id="name" name="name" required class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-green-500"> |
| </div> |
| |
| <div class="mb-4"> |
| <label for="email" class="block text-gray-700 font-medium mb-2">E-mail</label> |
| <input type="email" id="email" name="email" required class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-green-500"> |
| </div> |
| |
| <div class="mb-4"> |
| <label for="phone" class="block text-gray-700 font-medium mb-2">Telefone</label> |
| <input type="tel" id="phone" name="phone" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-green-500"> |
| </div> |
| |
| <div class="mb-4"> |
| <label for="message" class="block text-gray-700 font-medium mb-2">Mensagem</label> |
| <textarea id="message" name="message" rows="4" required class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-green-500"></textarea> |
| </div> |
| |
| <button type="submit" class="gradient-bg text-white font-bold py-3 px-6 rounded-lg hover:bg-green-700 transition-colors duration-300 w-full flex items-center justify-center"> |
| <i data-feather="send" class="mr-2"></i> Enviar Mensagem |
| </button> |
| </form> |
| </div> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16 bg-gray-50"> |
| <div class="container mx-auto px-6"> |
| <div class="flex flex-col md:flex-row items-center"> |
| <div class="w-full h-96 mb-8 md:mb-0 md:mr-8 rounded-lg overflow-hidden shadow-lg"> |
| <iframe |
| src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3773.674864644699!2d-48.2642519246874!3d-18.92302708222273!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x94a4456c5a6b6f07%3A0x6c8e1a1e3c5e5b1f!2sR.%20Duque%20de%20Caxias%2C%20626%20-%20Centro%2C%20Uberl%C3%A2ndia%20-%20MG%2C%2038400-128!5e0!3m2!1spt-BR!2sbr!4v1681234567890!5m2!1spt-BR!2sbr" |
| width="100%" |
| height="100%" |
| style="border:0;" |
| allowfullscreen="" |
| loading="lazy" |
| referrerpolicy="no-referrer-when-downgrade"> |
| </iframe> |
| </div> |
| <div class="text-center md:text-left"> |
| <h3 class="text-2xl font-bold text-green-800 mb-4">Nosso Endereço</h3> |
| <p class="text-gray-600 mb-6">Rua Duque de Caxias, 626 - Centro<br>Uberlândia - MG</p> |
| <a href="https://www.google.com/maps/dir//R.+Duque+de+Caxias,+626+-+Centro,+Uberlândia+-+MG,+38400-128" |
| target="_blank" |
| class="gradient-bg text-white font-bold py-3 px-6 rounded-lg hover:bg-green-700 transition-colors duration-300 inline-flex items-center"> |
| <i data-feather="navigation" class="mr-2"></i> Obter Direções |
| </a> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <footer class="gradient-bg text-white py-10"> |
| <div class="container mx-auto px-6"> |
| <div class="flex flex-col md:flex-row justify-between items-center"> |
| <div class="mb-6 md:mb-0"> |
| <div class="flex items-center"> |
| <i data-feather="shield" class="w-8 h-8 mr-3"></i> |
| <h3 class="text-xl font-bold">TMT Segurança e Medicina do Trabalho</h3> |
| </div> |
| <p class="mt-2 text-green-200">Soluções completas em segurança ocupacional</p> |
| </div> |
| |
| <div class="flex space-x-6"> |
| <a href="#servicos" class="hover:text-green-200 transition-colors">Serviços</a> |
| <a href="#sobre" class="hover:text-green-200 transition-colors">Sobre Nós</a> |
| <a href="#contato" class="hover:text-green-200 transition-colors">Contato</a> |
| </div> |
| </div> |
| |
| <div class="border-t border-green-700 mt-8 pt-8 text-center text-green-200"> |
| <p>© 2023 TMT Segurança e Medicina do Trabalho. Todos os direitos reservados.</p> |
| </div> |
| </div> |
| </footer> |
|
|
| <script> |
| AOS.init({ |
| duration: 800, |
| easing: 'ease-in-out', |
| once: true |
| }); |
| feather.replace(); |
| </script> |
| </body> |
| </html> |
|
|