MorleyMujansi's picture
So there is this part were external users interact with the tool which the prototype has clearly demonstrated. There is also an admin part that should be added. The admin and registered member portal should be added to track how many members the system has, the matching process, and all other services being offered including summary information on a dashboard for easy decision making. plus the member portal where members can track the services they are receiving and the likes
0dadafa verified
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Lumikiza - Advisor-Founder Matching Platform</title>
<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.net.min.js"></script>
</head>
<body class="bg-gray-50">
<custom-navbar></custom-navbar>
<main>
<!-- Hero Section -->
<section id="hero" class="relative overflow-hidden">
<div class="absolute inset-0 z-0" id="vanta-bg"></div>
<div class="container mx-auto px-4 py-32 relative z-10">
<div class="max-w-3xl mx-auto text-center">
<h1 class="text-5xl font-bold text-white mb-6">Connecting Zambian Entrepreneurs with Expert Advisors</h1>
<p class="text-xl text-white opacity-90 mb-8">Intelligent matching for meaningful business growth</p>
<div class="flex flex-col sm:flex-row gap-4 justify-center">
<a href="/register-founder.html" class="bg-blue-600 hover:bg-blue-700 text-white font-bold py-3 px-6 rounded-lg transition">
I'm a Founder
</a>
<a href="/register-advisor.html" class="bg-purple-600 hover:bg-purple-700 text-white font-bold py-3 px-6 rounded-lg transition">
I'm an Advisor
</a>
<a href="/admin-login.html" class="bg-gray-600 hover:bg-gray-700 text-white font-bold py-3 px-6 rounded-lg transition">
Admin Access
</a>
</div>
</div>
</div>
</section>
<!-- How It Works -->
<section class="py-20 bg-white">
<div class="container mx-auto px-4">
<h2 class="text-3xl font-bold text-center mb-12">How Lumikiza Works</h2>
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
<div class="bg-gray-50 p-6 rounded-xl">
<div class="bg-blue-100 w-14 h-14 rounded-full flex items-center justify-center mb-4">
<i data-feather="edit" class="text-blue-600"></i>
</div>
<h3 class="text-xl font-semibold mb-2">1. Create Your Profile</h3>
<p class="text-gray-600">Founders detail their needs, advisors specify expertise and availability.</p>
</div>
<div class="bg-gray-50 p-6 rounded-xl">
<div class="bg-purple-100 w-14 h-14 rounded-full flex items-center justify-center mb-4">
<i data-feather="zap" class="text-purple-600"></i>
</div>
<h3 class="text-xl font-semibold mb-2">2. Smart Matching</h3>
<p class="text-gray-600">Our algorithm pairs you with the most relevant matches instantly.</p>
</div>
<div class="bg-gray-50 p-6 rounded-xl">
<div class="bg-green-100 w-14 h-14 rounded-full flex items-center justify-center mb-4">
<i data-feather="users" class="text-green-600"></i>
</div>
<h3 class="text-xl font-semibold mb-2">3. Connect & Grow</h3>
<p class="text-gray-600">Secure introductions lead to valuable mentorship relationships.</p>
</div>
</div>
</div>
</section>
<!-- Testimonials -->
<section class="py-20 bg-gradient-to-r from-blue-50 to-purple-50">
<div class="container mx-auto px-4">
<h2 class="text-3xl font-bold text-center mb-12">Success Stories</h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
<div class="bg-white p-6 rounded-xl shadow-sm">
<p class="text-gray-600 italic mb-4">"Lumikiza connected me with a financial advisor who understood the Zambian market. Within 3 months, we secured funding!"</p>
<div class="flex items-center">
<img src="http://static.photos/people/200x200/1" alt="Musonda Chisha." class="w-12 h-12 rounded-full mr-4">
<div>
<h4 class="font-semibold">Musonda Chisha.</h4>
<p class="text-sm text-gray-500">Founder, AgriTech Startup</p>
</div>
</div>
</div>
<div class="bg-white p-6 rounded-xl shadow-sm">
<p class="text-gray-600 italic mb-4">"As an advisor, I love how Lumikiza matches me with founders who truly need my specific expertise in tech scaling."</p>
<div class="flex items-center">
<img src="http://static.photos/technology/200x200/2" alt="Dr. James M." class="w-12 h-12 rounded-full mr-4">
<div>
<h4 class="font-semibold">Dr. James Mwansa.</h4>
<p class="text-sm text-gray-500">Technology Advisor</p>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- CTA -->
<section class="py-16 bg-blue-600">
<div class="container mx-auto px-4 text-center">
<h2 class="text-3xl font-bold text-white mb-4">Ready to Find Your Perfect Match?</h2>
<p class="text-xl text-blue-100 mb-8">Join Lumikiza today and accelerate your business growth</p>
<a href="/register.html" class="bg-white text-blue-600 hover:bg-gray-100 font-bold py-3 px-8 rounded-lg transition inline-block">
Get Started Now
</a>
</div>
</section>
</main>
<custom-footer></custom-footer>
<script src="components/navbar.js"></script>
<script src="components/footer.js"></script>
<script src="components/notification-bell.js"></script>
<script src="script.js"></script>
<script>
feather.replace();
VANTA.NET({
el: "#vanta-bg",
mouseControls: true,
touchControls: true,
gyroControls: false,
minHeight: 200.00,
minWidth: 200.00,
scale: 1.00,
scaleMobile: 1.00,
color: 0x4f46e5,
backgroundColor: 0x1e1b4b
});
</script>
<script src="https://huggingface.co/deepsite/deepsite-badge.js"></script>
</body>
</html>