Add 1 files

index.html

@@ -34,7 +34,7 @@
             <div class="flex flex-col md:flex-row justify-between items-center">
                 <div class="flex items-center mb-6 md:mb-0">
                     <i class="fas fa-laptop-code text-3xl mr-3"></i>
-                    <h1 class="text-3xl font-bold">TechSolutions</h1>
+                    <h1 class="text-3xl font-bold">PixelCTech</h1>
                 </div>
                 <nav class="flex space-x-1 md:space-x-6">
                     <a href="#services" class="px-3 py-2 rounded hover:bg-blue-700 transition">Serviços</a>
@@ -43,7 +43,7 @@
                 </nav>
             </div>
             <div class="mt-16 text-center">
-                <h2 class="text-4xl md:text-5xl font-bold mb-4">Soluções Digitais para seu Negócio</h2>
+                <h2 class="text-4xl md:text-5xl font-bold mb-4">Focado em Soluções e não em problemas</h2>
                 <p class="text-xl md:text-2xl mb-8 max-w-3xl mx-auto">Transformamos ideias em realidade com tecnologia de ponta e design inovador</p>
                 <a href="#services" class="bg-white text-blue-600 font-bold px-8 py-3 rounded-full hover:bg-gray-100 transition duration-300 inline-block">
                     Conheça nossos serviços
@@ -105,7 +105,7 @@
                 </div>
 
                 <!-- Service 3: Certificado Digital -->
-                <div class="service-card bg-white rounded-lg shadow-md overflow-hidden transition duration-300 animate-fadeIn">
+                <div class="service-card bg-white rounded-lg shadow-md overflow-hidden transition duration-300 animate-fageIn">
                     <div class="p-6">
                         <div class="flex items-center mb-4">
                             <div class="bg-green-100 p-3 rounded-full mr-4">
@@ -229,6 +229,27 @@
                         </div>
                     </div>
                 </div>
+
+                <!-- Service 9: Treinamento em Tecnologias -->
+                <div class="service-card bg-white rounded-lg shadow-md overflow-hidden transition duration-300 animate-fadeIn">
+                    <div class="p-6">
+                        <div class="flex items-center mb-4">
+                            <div class="bg-orange-100 p-3 rounded-full mr-4">
+                                <i class="fas fa-graduation-cap text-orange-600 text-xl"></i>
+                            </div>
+                            <h3 class="text-xl font-semibold text-gray-800">Treinamento em Tecnologias</h3>
+                        </div>
+                        <p class="text-gray-600 mb-6">Capacitação prática nas tecnologias que utilizamos para transformar seu negócio digitalmente.</p>
+                        <div class="flex space-x-3">
+                            <button onclick="openModal('modal9')" class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-md transition flex items-center">
+                                <i class="fas fa-info-circle mr-2"></i> Saiba Mais
+                            </button>
+                            <a href="https://api.whatsapp.com/send?phone=5598988106807" target="_blank" class="bg-green-600 hover:bg-green-700 text-white px-4 py-2 rounded-md transition flex items-center">
+                                <i class="fab fa-whatsapp mr-2"></i> Fale Conosco
+                            </a>
+                        </div>
+                    </div>
+                </div>
             </div>
         </div>
     </section>
@@ -238,14 +259,14 @@
         <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 md:pr-10">
-                    <img src="https://images.unsplash.com/photo-1551288049-bebda4e38f71?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" 
+                    <img src="https://img.freepik.com/vetores-premium/reuniao-de-negocios-com-colegas-de-equipe-discutindo-projeto-de-trabalho-em-escritorio-ilustracao-vetorial-plana-de-pessoas-de-desenho-animado_74855-9814.jpg" 
                          alt="Equipe de tecnologia" class="rounded-lg shadow-xl w-full">
                 </div>
                 <div class="md:w-1/2">
                     <h2 class="text-3xl font-bold text-gray-800 mb-6">Sobre Nós</h2>
                     <div class="w-20 h-1 bg-blue-600 mb-6"></div>
                     <p class="text-gray-600 mb-4">
-                        Somos uma equipe de especialistas em tecnologia comprometidos em oferecer soluções digitais inovadoras para empresas de todos os tamanhos.
+                        A PixelCTech é uma equipe de especialistas em tecnologia comprometidos em oferecer soluções digitais inovadoras para empresas de todos os tamanhos.
                     </p>
                     <p class="text-gray-600 mb-6">
                         Combinamos expertise técnica com criatividade para desenvolver produtos que realmente fazem a diferença no seu negócio, aumentando eficiência, reduzindo custos e melhorando a experiência do cliente.
@@ -253,15 +274,15 @@
                     <div class="flex flex-wrap gap-4">
                         <div class="flex items-center bg-white px-4 py-2 rounded-full shadow-sm">
                             <i class="fas fa-check-circle text-green-500 mr-2"></i>
-                            <span class="text-gray-700">+100 Projetos</span>
+                            <span class="text-gray-700">+20 Projetos</span>
                         </div>
                         <div class="flex items-center bg-white px-4 py-2 rounded-full shadow-sm">
                             <i class="fas fa-check-circle text-green-500 mr-2"></i>
-                            <span class="text-gray-700">+50 Clientes</span>
+                            <span class="text-gray-700">+100 clientes atendidos por ano</span>
                         </div>
                         <div class="flex items-center bg-white px-4 py-2 rounded-full shadow-sm">
                             <i class="fas fa-check-circle text-green-500 mr-2"></i>
-                            <span class="text-gray-700">5 Anos no Mercado</span>
+                            <span class="text-gray-700">Mais de 12 anos de mercado</span>
                         </div>
                     </div>
                 </div>
@@ -319,7 +340,7 @@
                                 </div>
                                 <div>
                                     <h4 class="font-medium text-gray-800">Endereço</h4>
-                                    <p class="text-gray-600">Av. Paulista, 1000<br>São Paulo - SP</p>
+                                    <p class="text-gray-600">Rua Para N52, Chácara Brasil - Turu<br>São Luís - MA</p>
                                 </div>
                             </div>
                             <div class="flex items-start">
@@ -328,7 +349,7 @@
                                 </div>
                                 <div>
                                     <h4 class="font-medium text-gray-800">E-mail</h4>
-                                    <p class="text-gray-600">contato@techsolutions.com</p>
+                                    <p class="text-gray-600">comercial@pixelctech.com.br</p>
                                 </div>
                             </div>
                             <div class="flex items-start">
@@ -337,7 +358,7 @@
                                 </div>
                                 <div>
                                     <h4 class="font-medium text-gray-800">Telefone</h4>
-                                    <p class="text-gray-600">(11) 9999-9999</p>
+                                    <p class="text-gray-600">(98) 98810-6807</p>
                                 </div>
                             </div>
                             <div class="flex items-start">
@@ -363,7 +384,7 @@
             <div class="grid grid-cols-1 md:grid-cols-4 gap-8">
                 <div>
                     <h3 class="text-xl font-bold mb-4 flex items-center">
-                        <i class="fas fa-laptop-code mr-2"></i> TechSolutions
+                        <i class="fas fa-laptop-code mr-2"></i> PixelCTech
                     </h3>
                     <p class="text-gray-400">Soluções digitais inovadoras para impulsionar seu negócio na era digital.</p>
                 </div>
@@ -374,6 +395,7 @@
                         <li><a href="#" class="text-gray-400 hover:text-white transition">Desenvolvimento Web</a></li>
                         <li><a href="#" class="text-gray-400 hover:text-white transition">Design Gráfico</a></li>
                         <li><a href="#" class="text-gray-400 hover:text-white transition">Redes de Computadores</a></li>
+                        <li><a href="#" class="text-gray-400 hover:text-white transition">Treinamentos</a></li>
                     </ul>
                 </div>
                 <div>
@@ -386,25 +408,16 @@
                     </ul>
                 </div>
                 <div>
-                    <h4 class="text-lg font-semibold mb-4">Redes Sociais</h4>
-                    <div class="flex space-x-4">
-                        <a href="#" class="bg-gray-800 hover:bg-blue-600 p-3 rounded-full transition">
-                            <i class="fab fa-facebook-f"></i>
-                        </a>
-                        <a href="#" class="bg-gray-800 hover:bg-blue-400 p-3 rounded-full transition">
-                            <i class="fab fa-twitter"></i>
-                        </a>
-                        <a href="#" class="bg-gray-800 hover:bg-pink-600 p-3 rounded-full transition">
-                            <i class="fab fa-instagram"></i>
-                        </a>
-                        <a href="#" class="bg-gray-800 hover:bg-blue-700 p-3 rounded-full transition">
-                            <i class="fab fa-linkedin-in"></i>
-                        </a>
+                    <h4 class="text-lg font-semibold mb-4">Contato</h4>
+                    <div class="space-y-3">
+                        <p class="text-gray-400"><i class="fas fa-map-marker-alt mr-2"></i> Rua Para N52, Chácara Brasil - Turu</p>
+                        <p class="text-gray-400"><i class="fas fa-phone-alt mr-2"></i> (98) 98810-6807</p>
+                        <p class="text-gray-400"><i class="fas fa-envelope mr-2"></i> [email protected]</p>
                     </div>
                 </div>
             </div>
             <div class="border-t border-gray-800 mt-10 pt-6 flex flex-col md:flex-row justify-between items-center">
-                <p class="text-gray-400 mb-4 md:mb-0">© 2023 TechSolutions. Todos os direitos reservados.</p>
+                <p class="text-gray-400 mb-4 md:mb-0">© 2023 PixelCTech. Todos os direitos reservados.</p>
                 <div class="flex space-x-6">
                     <a href="#" class="text-gray-400 hover:text-white transition">Termos de Serviço</a>
                     <a href="#" class="text-gray-400 hover:text-white transition">Política de Privacidade</a>
@@ -546,7 +559,7 @@
                     
                     <div class="mt-8 bg-green-50 p-4 rounded-lg">
                         <h4 class="font-semibold text-green-800 mb-2">Processo simplificado:</h4>
-                        <p>Nossa equipe guia você em todas as etapas, desde a escolha do certificado adequado até a instalação e configuração, garantindo que você possa utilizar todos os recursos com segurança e eficiência.</p>
+                        <p>Nossa equipe guia você em todas as etapas, desde a escolha do certificado adequado até a instalação e configuração, garantindo que você possa utilizar todos os recursos com segurança và eficiência.</p>
                     </div>
                 </div>
                 <div class="mt-8 flex justify-end">
@@ -627,7 +640,7 @@
                     <ul class="list-disc pl-6 space-y-2">
                         <li>Criação de logotipos e identidade visual</li>
                         <li>Design de materiais gráficos (cartões, folhetos, banners)</li>
-                        <li>Produção de vídeos institucionais e promocionais</li>
+                        <li>Produção de vídeos institucionais e promocionals</li>
                         <li>Edição e pós-produção de vídeos</li>
                         <li>Motion graphics e animações</li>
                         <li>Design para redes sociais</li>
@@ -827,6 +840,64 @@
         </div>
     </div>
 
+    <!-- Modal 9: Treinamento em Tecnologias -->
+    <div id="modal9" class="modal fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 opacity-0 invisible transition">
+        <div class="modal-content bg-white rounded-lg shadow-xl w-11/12 md:w-2/3 lg:w-1/2 max-w-4xl relative">
+            <button onclick="closeModal('modal9')" class="absolute top-4 right-4 text-gray-500 hover:text-gray-700">
+                <i class="fas fa-times text-2xl"></i>
+            </button>
+            <div class="p-8">
+                <div class="flex items-center mb-6">
+                    <div class="bg-orange-100 p-3 rounded-full mr-4">
+                        <i class="fas fa-graduation-cap text-orange-600 text-xl"></i>
+                    </div>
+                    <h3 class="text-2xl font-bold text-gray-800">Treinamento em Tecnologias</h3>
+                </div>
+                <div class="space-y-4 text-gray-700">
+                    <p>Compartilhamos nosso conhecimento através de treinamentos práticos e personalizados nas tecnologias que utilizamos para transformar negócios digitalmente, capacitando sua equipe para o futuro.</p>
+                    
+                    <h4 class="font-semibold text-lg mt-6 mb-2 text-gray-800">Nossos programas de treinamento:</h4>
+                    <ul class="list-disc pl-6 space-y-2">
+                        <li>Inteligência Artificial aplicada a negócios</li>
+                        <li>Automação de processos com Python e RPA</li>
+                        <li>Desenvolvimento Web moderno (HTML5, CSS3, JavaScript)</li>
+                        <li>Gestão de Redes Sociais e Marketing Digital</li>
+                        <li>Design Gráfico e Produção de Conteúdo Visual</li>
+                        <li>Infraestrutura de Redes e Segurança da Informação</li>
+                    </ul>
+                    
+                    <h4 class="font-semibold text-lg mt-6 mb-2 text-gray-800">Metodologia:</h4>
+                    <ul class="list-disc pl-6 space-y-2">
+                        <li>Aulas teóricas e práticas com casos reais</li>
+                        <li>Material didático exclusivo e atualizado</li>
+                        <li>Ambiente de aprendizagem hands-on</li>
+                        <li>Instrutores com experiência de mercado</li>
+                        <li>Certificado de conclusão</li>
+                    </ul>
+                    
+                    <h4 class="font-semibold text-lg mt-6 mb-2 text-gray-800">Benefícios para sua equipe:</h4>
+                    <ul class="list-disc pl-6 space-y-2">
+                        <li>Atualização nas tecnologias mais demandadas</li>
+                        <li>Desenvolvimento de habilidades digitais</li>
+                        <li>Aumento da produtividade e eficiência</li>
+                        <li>Capacitação para inovação contínua</li>
+                        <li>Preparação para os desafios do mercado digital</li>
+                    </ul>
+                    
+                    <div class="mt-8 bg-orange-50 p-4 rounded-lg">
+                        <h4 class="font-semibold text-orange-800 mb-2">Formato dos treinamentos:</h4>
+                        <p>Oferecemos treinamentos presenciais e online, com turmas abertas ou in company, adaptados às necessidades específicas da sua equipe. Desenvolvemos programas desde introdução até níveis avançados, com carga horária flexível.</p>
+                    </div>
+                </div>
+                <div class="mt-8 flex justify-end">
+                    <a href="https://api.whatsapp.com/send?phone=5598988106807" target="_blank" class="bg-green-600 hover:bg-green-700 text-white px-6 py-2 rounded-md transition flex items-center">
+                        <i class="fab fa-whatsapp mr-2"></i> Fale Conosco
+                    </a>
+                </div>
+            </div>
+        </div>
+    </div>
+
     <script>
         // Modal functions
         function openModal(modalId) {