File size: 7,583 Bytes
679b160 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 | <!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>UnityLeadCapture - Conectando Devs Unity ao Mercado</title>
<link rel="icon" type="image/x-icon" href="/static/favicon.ico">
<link rel="stylesheet" href="style.css">
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
<script src="https://unpkg.com/feather-icons"></script>
<script src="https://cdn.jsdelivr.net/npm/vanta@latest/dist/vanta.globe.min.js"></script>
</head>
<body class="min-h-screen flex flex-col">
<custom-navbar></custom-navbar>
<!-- Hero Section with Vanta.js -->
<section id="hero" class="relative flex-grow flex items-center justify-center py-20 px-4">
<div class="absolute inset-0 z-0" id="vanta-bg"></div>
<div class="relative z-10 max-w-4xl mx-auto text-center text-white">
<h1 class="text-4xl md:text-6xl font-bold mb-6 bg-gradient-to-r from-purple-400 to-blue-500 bg-clip-text text-transparent">
Sua Carreira em Unity Começa Aqui! 🚀
</h1>
<p class="text-xl md:text-2xl mb-8 text-gray-200">
Conectamos desenvolvedores Unity talentosos com as melhores oportunidades do mercado
</p>
<div class="bg-white/10 backdrop-blur-lg rounded-2xl p-8 max-w-2xl mx-auto">
<h2 class="text-2xl font-bold mb-6">Cadastre-se para Oportunidades Exclusivas</h2>
<form id="leadForm" class="space-y-4">
<div class="grid md:grid-cols-2 gap-4">
<input type="text" placeholder="Nome Completo" class="w-full px-4 py-3 rounded-lg bg-white/20 border border-white/30 text-white placeholder-gray-200 focus:outline-none focus:ring-2 focus:ring-purple-400">
<input type="email" placeholder="E-mail Profissional" class="w-full px-4 py-3 rounded-lg bg-white/20 border border-white/30 text-white placeholder-gray-200 focus:outline-none focus:ring-2 focus:ring-purple-400">
</div>
<div class="grid md:grid-cols-2 gap-4">
<input type="tel" placeholder="Telefone/WhatsApp" class="w-full px-4 py-3 rounded-lg bg-white/20 border border-white/30 text-white placeholder-gray-200 focus:outline-none focus:ring-2 focus:ring-purple-400">
<select class="w-full px-4 py-3 rounded-lg bg-white/20 border border-white/30 text-white focus:outline-none focus:ring-2 focus:ring-purple-400">
<option value="" class="text-gray-800">Nível de Experiência</option>
<option value="junior" class="text-gray-800">Júnior (0-2 anos)</option>
<option value="pleno" class="text-gray-800">Pleno (2-5 anos)</option>
<option value="senior" class="text-gray-800">Sênior (5+ anos)</option>
</select>
</div>
<textarea placeholder="Conte-nos sobre suas habilidades em Unity (C#, Shaders, Multiplayer, etc.)" rows="3" class="w-full px-4 py-3 rounded-lg bg-white/20 border border-white/30 text-white placeholder-gray-200 focus:outline-none focus:ring-2 focus:ring-purple-400"></textarea>
<button type="submit" class="w-full bg-gradient-to-r from-purple-500 to-blue-600 text-white py-4 px-6 rounded-lg font-bold text-lg hover:from-purple-600 hover:to-blue-700 transition-all duration-300 transform hover:scale-105">
<i data-feather="send" class="inline mr-2"></i>
Quero Oportunidades!
</button>
</form>
</div>
</div>
</section>
<!-- Benefits Section -->
<section class="py-20 bg-gray-900 text-white">
<div class="max-w-6xl mx-auto px-4">
<h2 class="text-3xl md:text-4xl font-bold text-center mb-16">Por que se Cadastrar? 🎯</h2>
<div class="grid md:grid-cols-3 gap-8">
<div class="text-center p-6 bg-gray-800 rounded-2xl hover:bg-gray-700 transition-all duration-300">
<div class="w-16 h-16 mx-auto mb-4 bg-purple-500 rounded-full flex items-center justify-center">
<i data-feather="briefcase" class="text-white"></i>
</div>
<h3 class="text-xl font-bold mb-4">Oportunidades Reais</h3>
<p class="text-gray-300">Acesso exclusivo a vagas em empresas que buscam talentos Unity</p>
</div>
<div class="text-center p-6 bg-gray-800 rounded-2xl hover:bg-gray-700 transition-all duration-300">
<div class="w-16 h-16 mx-auto mb-4 bg-blue-500 rounded-full flex items-center justify-center">
<i data-feather="trending-up" class="text-white"></i>
</div>
<h3 class="text-xl font-bold mb-4">Crescimento Profissional</h3>
<p class="text-gray-300">Mentoria e networking com desenvolvedores seniores da indústria</p>
</div>
<div class="text-center p-6 bg-gray-800 rounded-2xl hover:bg-gray-700 transition-all duration-300">
<div class="w-16 h-16 mx-auto mb-4 bg-green-500 rounded-full flex items-center justify-center">
<i data-feather="dollar-sign" class="text-white"></i>
</div>
<h3 class="text-xl font-bold mb-4">Remuneração Competitiva</h3>
<p class="text-gray-300">Salários alinhados com o mercado internacional de games</p>
</div>
</div>
</div>
</section>
<!-- Stats Section -->
<section class="py-20 bg-gradient-to-r from-purple-600 to-blue-700 text-white">
<div class="max-w-6xl mx-auto px-4">
<div class="grid md:grid-cols-4 gap-8 text-center">
<div>
<div class="text-4xl font-bold mb-2">500+</div>
<div class="text-gray-200">Devs Cadastrados</div>
</div>
<div>
<div class="text-4xl font-bold mb-2">150+</div>
<div class="text-gray-200">Empresas Parceiras</div>
</div>
<div>
<div class="text-4xl font-bold mb-2">89%</div>
<div class="text-gray-200">Taxa de Sucesso</div>
</div>
<div>
<div class="text-4xl font-bold mb-2">R$ 8K+</div>
<div class="text-gray-200">Salário Médio</div>
</div>
</div>
</div>
</section>
<custom-footer></custom-footer>
<script src="components/navbar.js"></script>
<script src="components/footer.js"></script>
<script src="script.js"></script>
<script>
feather.replace();
// Initialize Vanta.js
VANTA.GLOBE({
el: "#vanta-bg",
mouseControls: true,
touchControls: true,
gyroControls: false,
minHeight: 200.00,
minWidth: 200.00,
scale: 1.00,
scaleMobile: 1.00,
color: 0x7c3aed,
backgroundColor: 0x111827,
size: 1.00
});
</script>
<script src="https://huggingface.co/deepsite/deepsite-badge.js"></script>
</body>
</html> |