Spaces:
Running
Running
coloque o icone do whatsapp com o texto "Garanta já os seus estandes na ExpoMix 2025" no número 556198301-5330" - Follow Up Deployment
a41e5f3
verified
| <html lang="pt-BR"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>ExpoMix 2025 – Feira Multissetorial de Moda, Decor e Lifestyle</title> | |
| <meta name="description" content="Evento multissetorial com expositores, lançamentos, networking e experiências."> | |
| <meta property="og:title" content="ExpoMix 2025 – Feira Multissetorial de Moda, Decor e Lifestyle"> | |
| <meta property="og:description" content="Evento multissetorial com expositores, lançamentos, networking e experiências."> | |
| <meta property="og:image" content="banner-principal-site (1).jpg"> | |
| <meta property="og:type" content="website"> | |
| <link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22 fill=%22%23ff5a1f%22>E</text></svg>"> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <script src="https://unpkg.com/feather-icons"></script> | |
| <style> | |
| @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700;900&family=Inter:wght@300;400;500;600&display=swap'); | |
| body { | |
| font-family: 'Inter', sans-serif; | |
| background-color: #f6e6f2; | |
| background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiPjxkZWZzPjxwYXR0ZXJuIGlkPSJwYXR0ZXJuIiB3aWR0aD0iNDAiIGhlaWdodD0iNDAiIHBhdHRlcm5Vbml0cz0idXNlclNwYWNlT25Vc2UiIHBhdHRlcm5UcmFuc2Zvcm09InJvdGF0ZSg0NSkiPjxyZWN0IHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0icmdiYSgyNTUsMjU1LDI1NSwwLjA1KSIvPjwvcGF0dGVybj48L2RlZnM+PHJlY3QgZmlsbD0idXJsKCNwYXR0ZXJuKSIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIvPjwvc3ZnPg=='); | |
| } | |
| .handwritten { | |
| font-family: 'Caveat', cursive; | |
| color: #ff5a1f; | |
| } | |
| .serif-title { | |
| font-family: 'Playfair Display', serif; | |
| letter-spacing: -0.5px; | |
| } | |
| .bg-grunge { | |
| background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiPjxkZWZzPjxmaWx0ZXIgaWQ9Im5vaXNlIiB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIj48ZmVUdXJidWxlbmNlIHR5cGU9ImZyYWN0YWxOb2lzZSIgYmFzZUZyZXF1ZW5jeT0iMC4wNSIgbnVtT2N0YXZlcz0iMTAiIHN0aXRjaFRpbGVzPSJzdGl0Y2giLz48L2ZpbHRlcj48L2RlZnM+PHJlY3QgZmlsdGVyPSJ1cmwoI25vaXNlKSIgb3BhY2l0eT0iMC4wNSIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIvPjwvc3ZnPg=='); | |
| } | |
| .btn-orange { | |
| background-color: #ff5a1f; | |
| transition: all 0.3s ease; | |
| } | |
| .btn-orange:hover { | |
| transform: scale(1.05); | |
| box-shadow: 0 4px 15px rgba(255, 90, 31, 0.4); | |
| } | |
| .text-blue { | |
| color: #108db6; | |
| } | |
| .bg-blue { | |
| background-color: #108db6; | |
| } | |
| .fade-in { | |
| animation: fadeIn 1s ease-in-out; | |
| } | |
| @keyframes fadeIn { | |
| from { opacity: 0; transform: translateY(20px); } | |
| to { opacity: 1; transform: translateY(0); } | |
| } | |
| .handwritten-element { | |
| position: absolute; | |
| font-family: 'Caveat', cursive; | |
| color: #ff5a1f; | |
| font-size: 1.2rem; | |
| transform: rotate(-5deg); | |
| opacity: 0.9; | |
| pointer-events: none; | |
| z-index: 1; | |
| } | |
| .parallax { | |
| background-attachment: fixed; | |
| background-position: center; | |
| background-repeat: no-repeat; | |
| background-size: cover; | |
| } | |
| @media (max-width: 768px) { | |
| .parallax { | |
| background-attachment: scroll; | |
| } | |
| } | |
| </style> | |
| </head> | |
| <body class="overflow-x-hidden"> | |
| <!-- WhatsApp Floating Button --> | |
| <a href="https://wa.me/5561983015330" aria-label="Contato via WhatsApp" class="fixed bottom-6 right-6 z-50 bg-green-500 text-white p-4 rounded-full shadow-lg hover:bg-green-600 transition-all duration-300 hover:scale-110 flex items-center gap-2"> | |
| <i data-feather="message-circle" class="w-6 h-6"></i> | |
| <span class="text-sm font-bold hidden sm:inline">Garanta já os seus estandes na ExpoMix 2025</span> | |
| </a> | |
| <!-- Hero Section --> | |
| <section class="relative h-screen w-full overflow-hidden" style="background-color: #f0e6ff;"> | |
| <div class="absolute inset-0 flex items-center justify-center"> | |
| <div class="container mx-auto px-4 text-center relative z-10"> | |
| <p class="text-xl md:text-2xl lg:text-3xl font-light text-gray-700 mb-2 fade-in">Moda • Decor • Lifestyle</p> | |
| <h1 class="serif-title text-5xl md:text-7xl lg:text-8xl font-bold text-[#ff5a1f] mb-4 fade-in">ExpoMix 2025</h1> | |
| <p class="text-lg md:text-xl lg:text-2xl font-light text-gray-700 max-w-2xl mx-auto mb-8 fade-in" style="animation-delay: 0.3s;"> | |
| Feira multissetorial voltada ao universo da moda, design e lifestyle. Lançamentos, networking e oportunidades de negócios para marcas, lojistas e consumidores. | |
| </p> | |
| <p class="text-xl font-bold text-gray-700 mb-8 fade-in" style="animation-delay: 0.4s;">24–28 SET | Anápolis–GO</p> | |
| <div class="flex flex-col sm:flex-row justify-center gap-4 fade-in" style="animation-delay: 0.6s;"> | |
| <a href="https://wa.me/5561983015330" class="btn-orange inline-block text-white font-bold py-3 px-8 rounded-md text-lg">Quero expor</a> | |
| <a href="https://wa.me/5561983015330" class="bg-white text-[#ff5a1f] inline-block font-bold py-3 px-8 rounded-md text-lg hover:bg-gray-100 transition-colors">Quero participar</a> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Handwritten background elements --> | |
| <div class="handwritten-element" style="top: 20%; left: 10%; transform: rotate(-15deg); opacity: 0.6; font-size: 2.5rem;">Objetivos</div> | |
| <div class="handwritten-element" style="top: 30%; right: 15%; transform: rotate(5deg); opacity: 0.5; font-size: 2.2rem;">Público Alvo</div> | |
| <div class="handwritten-element" style="bottom: 25%; left: 20%; transform: rotate(-8deg); opacity: 0.4; font-size: 2.8rem;">Justificativa</div> | |
| <div class="handwritten-element" style="bottom: 35%; right: 10%; transform: rotate(12deg); opacity: 0.3; font-size: 2rem;">Objetivos</div> | |
| <div class="handwritten-element" style="top: 25%; left: 25%; transform: rotate(-5deg); opacity: 0.5; font-size: 2.3rem;">Público Alvo</div> | |
| <div class="handwritten-element" style="bottom: 30%; right: 25%; transform: rotate(8deg); opacity: 0.4; font-size: 2.5rem;">Justificativa</div> | |
| </section> | |
| <!-- About Section --> | |
| <section class="py-16 bg-grunge"> | |
| <div class="container mx-auto px-4"> | |
| <div class="flex flex-col lg:flex-row items-center gap-12"> | |
| <div class="lg:w-1/2 fade-in"> | |
| <h2 class="serif-title text-4xl font-bold text-[#ff5a1f] mb-6">Sobre o evento</h2> | |
| <p class="text-lg mb-6">A ExpoMix é uma feira multissetorial que reúne os principais expositores de moda, design e lifestyle em um único espaço. Com foco em acessórios, vestuário, cama/mesa/banho, joias e decoração, o evento proporciona oportunidades únicas de negócio e networking.</p> | |
| <div class="space-y-3"> | |
| <div class="flex items-center"> | |
| <i data-feather="shopping-bag" class="text-[#ff5a1f] mr-3"></i> | |
| <span>Diversidade de segmentos em um só lugar</span> | |
| </div> | |
| <div class="flex items-center"> | |
| <i data-feather="star" class="text-[#ff5a1f] mr-3"></i> | |
| <span>Experiências exclusivas para visitantes</span> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="lg:w-1/2 fade-in" style="animation-delay: 0.3s;"> | |
| <img src="1.png" alt="Sobre a ExpoMix" class="w-full rounded-lg shadow-xl"> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Image Section --> | |
| <section class="w-full py-8 fade-in"> | |
| <div class="container mx-auto px-4"> | |
| <img src="placeholder-image.jpg" alt="Imagem Destaque" class="w-full h-auto rounded-lg shadow-xl"> | |
| </div> | |
| </section> | |
| <!-- Full Width Image Section --> | |
| <section class="w-full fade-in"> | |
| <div class="container mx-auto px-4"> | |
| <img src="placeholder-image.jpg" alt="Imagem Destaque" class="w-full h-auto rounded-lg shadow-xl"> | |
| </div> | |
| </section> | |
| <!-- Objectives Section --> | |
| <section class="py-16 bg-white"> | |
| <div class="container mx-auto px-4"> | |
| <div class="flex flex-col lg:flex-row items-center gap-12"> | |
| <div class="lg:w-1/2 order-2 lg:order-1 fade-in" style="animation-delay: 0.3s;"> | |
| <img src="2.png" alt="Objetivos da ExpoMix" class="w-full rounded-lg shadow-xl"> | |
| </div> | |
| <div class="lg:w-1/2 order-1 lg:order-2 fade-in"> | |
| <h2 class="serif-title text-4xl font-bold text-[#ff5a1f] mb-6">Objetivos</h2> | |
| <div class="space-y-4"> | |
| <div class="flex items-start"> | |
| <i data-feather="users" class="text-[#ff5a1f] mr-3 mt-1"></i> | |
| <span>Reunir os principais players regionais em um único espaço</span> | |
| </div> | |
| <div class="flex items-start"> | |
| <i data-feather="shopping-bag" class="text-[#ff5a1f] mr-3 mt-1"></i> | |
| <span>Estimular vendas diretas entre expositores e visitantes</span> | |
| </div> | |
| <div class="flex items-start"> | |
| <i data-feather="star" class="text-[#ff5a1f] mr-3 mt-1"></i> | |
| <span>Promover lançamentos e novidades do mercado</span> | |
| </div> | |
| <div class="flex items-start"> | |
| <i data-feather="eye" class="text-[#ff5a1f] mr-3 mt-1"></i> | |
| <span>Oportunidades de networking e visibilidade para marcas</span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Justification Section --> | |
| <section class="py-16 bg-gray-50 relative overflow-hidden"> | |
| <div class="container mx-auto px-4 relative z-10"> | |
| <!-- Handwritten background elements --> | |
| <div class="handwritten-element" style="top: 10%; left: 5%; transform: rotate(-12deg); opacity: 0.6; font-size: 2rem;">moda</div> | |
| <div class="handwritten-element" style="top: 25%; right: 8%; transform: rotate(8deg); opacity: 0.5; font-size: 2.5rem;">shop</div> | |
| <div class="handwritten-element" style="bottom: 20%; left: 7%; transform: rotate(-5deg); opacity: 0.4; font-size: 2.2rem;">casa</div> | |
| <div class="handwritten-element" style="bottom: 30%; right: 5%; transform: rotate(15deg); opacity: 0.3; font-size: 1.8rem;">agro</div> | |
| <div class="handwritten-element" style="top: 15%; left: 20%; transform: rotate(-8deg); opacity: 0.5; font-size: 2.3rem;">pet</div> | |
| <div class="handwritten-element" style="bottom: 15%; right: 20%; transform: rotate(10deg); opacity: 0.4; font-size: 2.4rem;">decoração</div> | |
| <div class="flex flex-col lg:flex-row items-center gap-12"> | |
| <div class="lg:w-1/2 fade-in"> | |
| <h2 class="serif-title text-4xl font-bold text-[#ff5a1f] mb-6">Justificativa</h2> | |
| <p class="text-lg mb-4">A região Centro-Oeste apresenta um crescimento econômico consistente, com destaque para os setores de moda, decoração e lifestyle. No entanto, faltam espaços qualificados que reúnam expositores e compradores em um ambiente profissional e inspirador.</p> | |
| <p class="text-lg">A ExpoMix surge para preencher essa lacuna, oferecendo uma plataforma completa para exposição, vendas e troca de experiências entre marcas e consumidores finais.</p> | |
| </div> | |
| <div class="lg:w-1/2 fade-in" style="animation-delay: 0.3s;"> | |
| <img src="3.png" alt="Justificativa da ExpoMix" class="w-full rounded-lg shadow-xl"> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Target Audience Section --> | |
| <section class="py-16" style="background-color: #e6e1f9; background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiPjxkZWZzPjxmaWx0ZXIgaWQ9Im5vaXNlIiB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIj48ZmVUdXJidWxlbmNlIHR5cGU9ImZyYWN0YWxOb2lzZSIgYmFzZUZyZXF1ZW5jeT0iMC4wNSIgbnVtT2N0YXZlcz0iMTAiIHN0aXRjaFRpbGVzPSJzdGl0Y2giLz48L2ZpbHRlcj48L2RlZnM+PHJlY3QgZmlsdGVyPSJ1cmwoI25vaXNlKSIgb3BhY2l0eT0iMC4wMiIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIvPjwvc3ZnPg==');"> | |
| <div class="container mx-auto px-4"> | |
| <h2 class="serif-title text-4xl font-bold text-[#ff5a1f] mb-12 text-center fade-in">Público-Alvo</h2> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6"> | |
| <div class="bg-white p-6 rounded-lg shadow-md hover:shadow-xl transition-shadow duration-300 fade-in"> | |
| <div class="text-blue text-4xl mb-4"> | |
| <i data-feather="shopping-bag"></i> | |
| </div> | |
| <h3 class="serif-title text-xl font-bold mb-2">Consumidores</h3> | |
| <div class="mb-4 h-32 bg-gray-100 rounded-lg flex items-center justify-center"> | |
| <span class="text-gray-400">Imagem Consumidores</span> | |
| </div> | |
| <p>Público interessado em moda, decor e lifestyle, em busca de novidades e experiências exclusivas.</p> | |
| </div> | |
| <div class="bg-white p-6 rounded-lg shadow-md hover:shadow-xl transition-shadow duration-300 fade-in" style="animation-delay: 0.2s;"> | |
| <div class="text-blue text-4xl mb-4"> | |
| <i data-feather="tag"></i> | |
| </div> | |
| <h3 class="serif-title text-xl font-bold mb-2">Lojistas e Marcas</h3> | |
| <div class="mb-4 h-32 bg-gray-100 rounded-lg flex items-center justify-center"> | |
| <span class="text-gray-400">Imagem Lojistas</span> | |
| </div> | |
| <p>Varejistas regionais e nacionais em busca de novos fornecedores e parcerias comerciais.</p> | |
| </div> | |
| <div class="bg-white p-6 rounded-lg shadow-md hover:shadow-xl transition-shadow duration-300 fade-in" style="animation-delay: 0.4s;"> | |
| <div class="text-blue text-4xl mb-4"> | |
| <i data-feather="users"></i> | |
| </div> | |
| <h3 class="serif-title text-xl font-bold mb-2">Influenciadores</h3> | |
| <div class="mb-4 h-32 bg-gray-100 rounded-lg flex items-center justify-center"> | |
| <span class="text-gray-400">Imagem Influenciadores</span> | |
| </div> | |
| <p>Criadores de conteúdo e formadores de opinião dos segmentos abordados no evento.</p> | |
| </div> | |
| <div class="bg-white p-6 rounded-lg shadow-md hover:shadow-xl transition-shadow duration-300 fade-in" style="animation-delay: 0.6s;"> | |
| <div class="text-blue text-4xl mb-4"> | |
| <i data-feather="briefcase"></i> | |
| </div> | |
| <h3 class="serif-title text-xl font-bold mb-2">Empreendedores</h3> | |
| <div class="mb-4 h-32 bg-gray-100 rounded-lg flex items-center justify-center"> | |
| <span class="text-gray-400">Imagem Empreendedores</span> | |
| </div> | |
| <p>Investidores e empresários buscando oportunidades no mercado de moda e lifestyle.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Structure Section --> | |
| <section class="py-16 bg-white relative overflow-hidden"> | |
| <div class="container mx-auto px-4 relative z-10"> | |
| <!-- Handwritten background elements --> | |
| <div class="handwritten-element" style="top: 10%; left: 5%; transform: rotate(-12deg); opacity: 0.6; font-size: 2rem;">moda</div> | |
| <div class="handwritten-element" style="top: 25%; right: 8%; transform: rotate(8deg); opacity: 0.5; font-size: 2.5rem;">shop</div> | |
| <div class="handwritten-element" style="bottom: 20%; left: 7%; transform: rotate(-5deg); opacity: 0.4; font-size: 2.2rem;">casa</div> | |
| <div class="handwritten-element" style="bottom: 30%; right: 5%; transform: rotate(15deg); opacity: 0.3; font-size: 1.8rem;">agro</div> | |
| <div class="handwritten-element" style="top: 15%; left: 20%; transform: rotate(-8deg); opacity: 0.5; font-size: 2.3rem;">pet</div> | |
| <div class="handwritten-element" style="bottom: 15%; right: 20%; transform: rotate(10deg); opacity: 0.4; font-size: 2.4rem;">decoração</div> | |
| <h2 class="serif-title text-4xl font-bold text-[#ff5a1f] mb-12 text-center fade-in">Estrutura</h2> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8"> | |
| <div class="text-center fade-in"> | |
| <div class="mb-4 h-40 bg-gray-100 rounded-lg flex items-center justify-center"> | |
| <span class="text-gray-400">Imagem Estande Básico</span> | |
| </div> | |
| <h3 class="serif-title text-xl font-bold mb-2">Estande Básico</h3> | |
| <p>Estandes modulares de 3x3m, com estrutura completa e personalização opcional.</p> | |
| </div> | |
| <div class="text-center fade-in" style="animation-delay: 0.2s;"> | |
| <div class="mb-4 h-40 bg-gray-100 rounded-lg flex items-center justify-center"> | |
| <span class="text-gray-400">Imagem Estandes Personalizados</span> | |
| </div> | |
| <h3 class="serif-title text-xl font-bold mb-2">Estandes Personalizados</h3> | |
| <p>Espaços maiores com projetos exclusivos para marcas que desejam maior impacto.</p> | |
| </div> | |
| <div class="text-center fade-in" style="animation-delay: 0.4s;"> | |
| <div class="mb-4 h-40 bg-gray-100 rounded-lg flex items-center justify-center"> | |
| <span class="text-gray-400">Imagem Áreas de Networking</span> | |
| </div> | |
| <h3 class="serif-title text-xl font-bold mb-2">Áreas de Networking</h3> | |
| <p>Lounges e espaços de convivência para reuniões e conexões entre participantes.</p> | |
| </div> | |
| <div class="text-center fade-in" style="animation-delay: 0.6s;"> | |
| <div class="mb-4 h-40 bg-gray-100 rounded-lg flex items-center justify-center"> | |
| <span class="text-gray-400">Imagem Espaço Kids</span> | |
| </div> | |
| <h3 class="serif-title text-xl font-bold mb-2">Espaço Kids</h3> | |
| <p>Área recreativa para crianças, permitindo que os pais aproveitem o evento com tranquilidade.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Action Plan Section --> | |
| <section class="py-16 bg-grunge"> | |
| <div class="container mx-auto px-4"> | |
| <h2 class="serif-title text-4xl font-bold text-[#ff5a1f] mb-12 text-center fade-in">Plano de Ação</h2> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"> | |
| <div class="bg-white p-6 rounded-lg shadow-md fade-in"> | |
| <div class="mb-4 h-40 bg-gray-100 rounded-lg flex items-center justify-center"> | |
| <span class="text-gray-400">Imagem Captação</span> | |
| </div> | |
| <div class="flex items-center mb-4"> | |
| <div class="bg-blue text-white p-3 rounded-full mr-4"> | |
| <i data-feather="search" class="w-6 h-6"></i> | |
| </div> | |
| <h3 class="serif-title text-xl font-bold">Captação e Curadoria</h3> | |
| </div> | |
| <p>Seleção estratégica de expositores alinhados ao perfil do evento e às expectativas do público.</p> | |
| </div> | |
| <div class="bg-white p-6 rounded-lg shadow-md fade-in" style="animation-delay: 0.2s;"> | |
| <div class="mb-4 h-40 bg-gray-100 rounded-lg flex items-center justify-center"> | |
| <span class="text-gray-400">Imagem Infraestrutura</span> | |
| </div> | |
| <div class="flex items-center mb-4"> | |
| <div class="bg-blue text-white p-3 rounded-full mr-4"> | |
| <i data-feather="tool" class="w-6 h-6"></i> | |
| </div> | |
| <h3 class="serif-title text-xl font-bold">Infraestrutura</h3> | |
| </div> | |
| <p>Montagem de estandes, lounges e toda a estrutura necessária para o conforto dos participantes.</p> | |
| </div> | |
| <div class="bg-white p-6 rounded-lg shadow-md fade-in" style="animation-delay: 0.4s;"> | |
| <div class="mb-4 h-40 bg-gray-100 rounded-lg flex items-center justify-center"> | |
| <span class="text-gray-400">Imagem Comunicação</span> | |
| </div> | |
| <div class="flex items-center mb-4"> | |
| <div class="bg-blue text-white p-3 rounded-full mr-4"> | |
| <i data-feather="megaphone" class="w-6 h-6"></i> | |
| </div> | |
| <h3 class="serif-title text-xl font-bold">Comunicação</h3> | |
| </div> | |
| <p>Campanhas online e offline com influenciadores para ampliar o alcance do evento.</p> | |
| </div> | |
| <div class="bg-white p-6 rounded-lg shadow-md fade-in" style="animation-delay: 0.6s;"> | |
| <div class="mb-4 h-40 bg-gray-100 rounded-lg flex items-center justify-center"> | |
| <span class="text-gray-400">Imagem Programação</span> | |
| </div> | |
| <div class="flex items-center mb-4"> | |
| <div class="bg-blue text-white p-3 rounded-full mr-4"> | |
| <i data-feather="calendar" class="w-6 h-6"></i> | |
| </div> | |
| <h3 class="serif-title text-xl font-bold">Programação</h3> | |
| </div> | |
| <p>Palestras, desfiles, workshops e experiências sensoriais para engajar o público.</p> | |
| </div> | |
| <div class="bg-white p-6 rounded-lg shadow-md fade-in" style="animation-delay: 0.8s;"> | |
| <div class="mb-4 h-40 bg-gray-100 rounded-lg flex items-center justify-center"> | |
| <span class="text-gray-400">Imagem Operacional</span> | |
| </div> | |
| <div class="flex items-center mb-4"> | |
| <div class="bg-blue text-white p-3 rounded-full mr-4"> | |
| <i data-feather="clipboard" class="w-6 h-6"></i> | |
| </div> | |
| <h3 class="serif-title text-xl font-bold">Operacional</h3> | |
| </div> | |
| <p>Recepção, segurança, limpeza, apoio técnico e gestão de expositores durante todo o evento.</p> | |
| </div> | |
| <div class="bg-white p-6 rounded-lg shadow-md fade-in" style="animation-delay: 1s;"> | |
| <div class="mb-4 h-40 bg-gray-100 rounded-lg flex items-center justify-center"> | |
| <span class="text-gray-400">Imagem Pós-Evento</span> | |
| </div> | |
| <div class="flex items-center mb-4"> | |
| <div class="bg-blue text-white p-3 rounded-full mr-4"> | |
| <i data-feather="arrow-right" class="w-6 h-6"></i> | |
| </div> | |
| <h3 class="serif-title text-xl font-bold">Pós-Evento</h3> | |
| </div> | |
| <p>Relatórios de desempenho, feedback dos participantes e planejamento para a próxima edição.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Pricing Section --> | |
| <section class="py-16 bg-gray-50"> | |
| <div class="container mx-auto px-4"> | |
| <div class="text-center mb-12 fade-in"> | |
| <h2 class="serif-title text-4xl font-bold text-[#ff5a1f] mb-4">Escolha seu Stand e participe da ExpoMix</h2> | |
| <p class="text-lg text-gray-600 max-w-2xl mx-auto">Do básico ao exclusivo, temos a opção certa para o seu negócio.</p> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-8 max-w-4xl mx-auto"> | |
| <!-- Stand 3x3 --> | |
| <div class="bg-white p-8 rounded-xl shadow-md hover:shadow-lg transition-all duration-300 fade-in"> | |
| <div class="mb-6 h-40 bg-gray-100 rounded-lg flex items-center justify-center overflow-hidden"> | |
| <img src="stand-3x3.jpg" alt="Stand 3x3" class="w-full h-full object-cover"> | |
| </div> | |
| <h3 class="serif-title text-2xl font-bold text-[#ff5a1f] mb-2">Stand 3x3</h3> | |
| <div class="text-4xl font-bold text-gray-800 mb-6">R$ 2.499<span class="text-lg font-normal">/evento</span></div> | |
| <ul class="space-y-3 mb-8"> | |
| <li class="flex items-center"> | |
| <i data-feather="check" class="text-green-500 mr-3"></i> | |
| <span>Localização estratégica</span> | |
| </li> | |
| <li class="flex items-center"> | |
| <i data-feather="check" class="text-green-500 mr-3"></i> | |
| <span>Visibilidade garantida</span> | |
| </li> | |
| <li class="flex items-center"> | |
| <i data-feather="check" class="text-green-500 mr-3"></i> | |
| <span>Estrutura básica inclusa</span> | |
| </li> | |
| </ul> | |
| <a href="https://wa.me/5561983015330" class="btn-orange block text-center text-white font-bold py-3 px-6 rounded-md">Reservar Stand</a> | |
| </div> | |
| <!-- Stand Personalizado --> | |
| <div class="bg-white p-8 rounded-xl shadow-md hover:shadow-lg transition-all duration-300 fade-in" style="animation-delay: 0.2s;"> | |
| <div class="mb-6 h-40 bg-gray-100 rounded-lg flex items-center justify-center overflow-hidden"> | |
| <img src="stand-personalizado.jpg" alt="Stand Personalizado" class="w-full h-full object-cover"> | |
| </div> | |
| <h3 class="serif-title text-2xl font-bold text-[#ff5a1f] mb-2">Stand Personalizado</h3> | |
| <div class="text-4xl font-bold text-gray-800 mb-6">Sob consulta</div> | |
| <ul class="space-y-3 mb-8"> | |
| <li class="flex items-center"> | |
| <i data-feather="star" class="text-yellow-500 mr-3"></i> | |
| <span>Projeto sob medida</span> | |
| </li> | |
| <li class="flex items-center"> | |
| <i data-feather="star" class="text-yellow-500 mr-3"></i> | |
| <span>Destaque exclusivo</span> | |
| </li> | |
| <li class="flex items-center"> | |
| <i data-feather="star" class="text-yellow-500 mr-3"></i> | |
| <span>Maior área de exposição</span> | |
| </li> | |
| </ul> | |
| <a href="https://wa.me/5561983015330" class="bg-white text-[#ff5a1f] border border-[#ff5a1f] block text-center font-bold py-3 px-6 rounded-md hover:bg-gray-50 transition-colors">Solicitar Orçamento</a> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Benefits Section --> | |
| <section class="py-16 bg-white"> | |
| <div class="container mx-auto px-4"> | |
| <h2 class="serif-title text-4xl font-bold text-[#ff5a1f] mb-12 text-center fade-in">Contrapartida aos Expositores</h2> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"> | |
| <div class="text-center p-4 rounded-lg border border-gray-200 fade-in"> | |
| <div class="mb-4 h-24 bg-gray-100 rounded-lg flex items-center justify-center"> | |
| <span class="text-gray-400">Imagem Estande</span> | |
| </div> | |
| <div class="flex items-start"> | |
| <div class="bg-blue text-white p-2 rounded-full mr-4"> | |
| <i data-feather="check" class="w-4 h-4"></i> | |
| </div> | |
| <span>Estande montado e equipado</span> | |
| </div> | |
| </div> | |
| <div class="text-center p-4 rounded-lg border border-gray-200 fade-in" style="animation-delay: 0.1s;"> | |
| <div class="mb-4 h-24 bg-gray-100 rounded-lg flex items-center justify-center"> | |
| <span class="text-gray-400">Imagem Divulgação</span> | |
| </div> | |
| <div class="flex items-start"> | |
| <div class="bg-blue text-white p-2 rounded-full mr-4"> | |
| <i data-feather="check" class="w-4 h-4"></i> | |
| </div> | |
| <span>Divulgação nas redes sociais e site</span> | |
| </div> | |
| </div> | |
| <div class="text-center p-4 rounded-lg border border-gray-200 fade-in" style="animation-delay: 0.2s;"> | |
| <div class="mb-4 h-24 bg-gray-100 rounded-lg flex items-center justify-center"> | |
| <span class="text-gray-400">Imagem Catálogo</span> | |
| </div> | |
| <div class="flex items-start"> | |
| <div class="bg-blue text-white p-2 rounded-full mr-4"> | |
| <i data-feather="check" class="w-4 h-4"></i> | |
| </div> | |
| <span>Catálogo digital com todas as marcas</span> | |
| </div> | |
| </div> | |
| <div class="text-center p-4 rounded-lg border border-gray-200 fade-in" style="animation-delay: 0.3s;"> | |
| <div class="mb-4 h-24 bg-gray-100 rounded-lg flex items-center justify-center"> | |
| <span class="text-gray-400">Imagem Negócios</span> | |
| </div> | |
| <div class="flex items-start"> | |
| <div class="bg-blue text-white p-2 rounded-full mr-4"> | |
| <i data-feather="check" class="w-4 h-4"></i> | |
| </div> | |
| <span>Rodadas de negócios programadas</span> | |
| </div> | |
| </div> | |
| <div class="text-center p-4 rounded-lg border border-gray-200 fade-in" style="animation-delay: 0.4s;"> | |
| <div class="mb-4 h-24 bg-gray-100 rounded-lg flex items-center justify-center"> | |
| <span class="text-gray-400">Imagem Promoções</span> | |
| </div> | |
| <div class="flex items-start"> | |
| <div class="bg-blue text-white p-2 rounded-full mr-4"> | |
| <i data-feather="check" class="w-4 h-4"></i> | |
| </div> | |
| <span>Ações promocionais durante o evento</span> | |
| </div> | |
| </div> | |
| <div class="text-center p-4 rounded-lg border border-gray-200 fade-in" style="animation-delay: 0.5s;"> | |
| <div class="mb-4 h-24 bg-gray-100 rounded-lg flex items-center justify-center"> | |
| <span class="text-gray-400">Imagem Certificado</span> | |
| </div> | |
| <div class="flex items-start"> | |
| <div class="bg-blue text-white p-2 rounded-full mr-4"> | |
| <i data-feather="check" class="w-4 h-4"></i> | |
| </div> | |
| <span>Certificado + selo de expositor oficial</span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Partnership Section --> | |
| <section class="py-16 bg-white relative overflow-hidden"> | |
| <div class="container mx-auto px-4 relative z-10"> | |
| <div class="flex flex-col lg:flex-row items-center gap-12"> | |
| <div class="lg:w-1/2 fade-in"> | |
| <div class="bg-[#ff5a1f] bg-opacity-10 p-8 rounded-lg"> | |
| <h2 class="serif-title text-4xl font-bold text-[#ff5a1f] mb-6">Parceria Municipal</h2> | |
| <p class="text-lg mb-6">A ExpoMix conta com o apoio institucional da Prefeitura Municipal, que disponibiliza:</p> | |
| <div class="space-y-4"> | |
| <div class="flex items-start"> | |
| <i data-feather="map-pin" class="text-[#ff5a1f] mr-3 mt-1"></i> | |
| <span>Local adequado para realização do evento</span> | |
| </div> | |
| <div class="flex items-start"> | |
| <i data-feather="file-text" class="text-[#ff5a1f] mr-3 mt-1"></i> | |
| <span>Orientações para liberações necessárias</span> | |
| </div> | |
| <div class="flex items-start"> | |
| <i data-feather="truck" class="text-[#ff5a1f] mr-3 mt-1"></i> | |
| <span>Apoio logístico completo</span> | |
| </div> | |
| <div class="flex items-start"> | |
| <i data-feather="heart" class="text-[#ff5a1f] mr-3 mt-1"></i> | |
| <span>Ações sociais que beneficiam a comunidade local</span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="lg:w-1/2 fade-in" style="animation-delay: 0.3s;"> | |
| <div class="bg-gray-100 h-96 rounded-lg flex items-center justify-center"> | |
| <span class="text-gray-400">Imagem da Prefeitura ou Selo de Parceria</span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Contact Section --> | |
| <section class="py-16 bg-[#ff5a1f] text-white"> | |
| <div class="container mx-auto px-4"> | |
| <h2 class="serif-title text-4xl font-bold mb-12 text-center fade-in">Contato</h2> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8"> | |
| <div class="text-center fade-in"> | |
| <div class="text-4xl mb-4"> | |
| <i data-feather="phone"></i> | |
| </div> | |
| <p class="font-bold">(61) 9 99307-3003</p> | |
| </div> | |
| <div class="text-center fade-in" style="animation-delay: 0.2s;"> | |
| <div class="text-4xl mb-4"> | |
| <i data-feather="phone"></i> | |
| </div> | |
| <p class="font-bold">(61) 9 99818-2140</p> | |
| </div> | |
| <div class="text-center fade-in" style="animation-delay: 0.4s;"> | |
| <div class="text-4xl mb-4"> | |
| <i data-feather="mail"></i> | |
| </div> | |
| <p class="font-bold">contato@groupbuzz.com.br</p> | |
| </div> | |
| <div class="text-center fade-in" style="animation-delay: 0.6s;"> | |
| <div class="text-4xl mb-4"> | |
| <i data-feather="globe"></i> | |
| </div> | |
| <p class="font-bold">www.groupbuzz.com.br</p> | |
| </div> | |
| </div> | |
| <div class="text-center mt-12 fade-in"> | |
| <a href="https://wa.me/5561983015330" class="btn-orange inline-block text-white font-bold py-4 px-12 rounded-md text-lg border-2 border-white">Quero expor na ExpoMix</a> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Footer --> | |
| <footer class="py-8 bg-gray-900 text-white text-center"> | |
| <div class="container mx-auto px-4"> | |
| <p>© 2025 ExpoMix – Feira Multissetorial. Todos os direitos reservados.</p> | |
| </div> | |
| </footer> | |
| <script> | |
| feather.replace(); | |
| // Add handwritten elements dynamically | |
| document.addEventListener('DOMContentLoaded', function() { | |
| // Add more handwritten elements if needed | |
| const handwrittenWords = ['novidades', 'tendências', 'inspiração', 'conexões', 'oportunidades', 'criatividade']; | |
| // Add animation to elements when they come into view | |
| const observer = new IntersectionObserver((entries) => { | |
| entries.forEach(entry => { | |
| if (entry.isIntersecting) { | |
| entry.target.classList.add('fade-in'); | |
| } | |
| }); | |
| }, { threshold: 0.1 }); | |
| document.querySelectorAll('.fade-in').forEach(el => { | |
| observer.observe(el); | |
| }); | |
| }); | |
| </script> | |
| <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=antocarloss/expomix-final" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> | |
| </html> |