Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Azure Horizon Pro | Professional Digital Solutions</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://unpkg.com/feather-icons"></script> | |
| <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script> | |
| <script> | |
| tailwind.config = { | |
| theme: { | |
| extend: { | |
| colors: { | |
| primary: { | |
| 50: '#eff6ff', | |
| 100: '#dbeafe', | |
| 200: '#bfdbfe', | |
| 300: '#93c5fd', | |
| 400: '#60a5fa', | |
| 500: '#3b82f6', | |
| 600: '#2563eb', | |
| 700: '#1d4ed8', | |
| 800: '#1e40af', | |
| 900: '#1e3a8a', | |
| } | |
| } | |
| } | |
| } | |
| } | |
| </script> | |
| </head> | |
| <body class="bg-gray-50 text-gray-800"> | |
| <!-- Navigation Component --> | |
| <custom-navbar></custom-navbar> | |
| <!-- Hero Section --> | |
| <section class="relative overflow-hidden bg-gradient-to-br from-primary-50 via-white to-primary-100"> | |
| <div class="absolute inset-0 bg-grid-primary-900/5"></div> | |
| <div class="container mx-auto px-4 py-16 md:py-24 relative"> | |
| <div class="max-w-4xl mx-auto text-center"> | |
| <h1 class="text-4xl md:text-6xl font-bold mb-4 bg-clip-text text-transparent bg-gradient-to-r from-primary-600 to-primary-800"> | |
| Phần mềm MiCRM | |
| </h1> | |
| <p class="text-lg md:text-xl text-primary-700 mb-4 font-medium">Nền tảng quản trị Khách hàng & vận hành Doanh nghiệp toàn diện</p> | |
| <p class="text-xl md:text-2xl text-gray-600 mb-8 max-w-3xl mx-auto"> | |
| Hỗ trợ quản lý hiệu suất Bán hàng, Chăm sóc khách hàng và tối ưu vận hành trên cùng một hệ thống hiện đại, giúp Doanh nghiệp tăng trưởng bền vững trong kỷ nguyên số | |
| </p> | |
| <div class="flex flex-col sm:flex-row gap-4 justify-center"> | |
| <a href="#contact" class="bg-primary-600 hover:bg-primary-700 text-white font-semibold py-3 px-8 rounded-lg transition-all duration-300 transform hover:-translate-y-1 shadow-lg hover:shadow-xl"> | |
| <i data-feather="message-circle" class="inline-block mr-2 w-5 h-5"></i> | |
| Liên hệ tư vấn | |
| </a> | |
| <a href="#services" class="bg-white hover:bg-gray-50 text-primary-600 font-semibold py-3 px-8 rounded-lg transition-all duration-300 border-2 border-primary-200"> | |
| <i data-feather="grid" class="inline-block mr-2 w-5 h-5"></i> | |
| Đăng ký Demo ngay | |
| </a> | |
| </div> | |
| </div> | |
| <!-- Hero Stats --> | |
| <div class="max-w-5xl mx-auto mt-20"> | |
| <div class="grid grid-cols-2 md:grid-cols-4 gap-6"> | |
| <div class="bg-white/80 backdrop-blur-sm rounded-xl p-6 shadow-lg border border-primary-100"> | |
| <div class="text-3xl font-bold text-primary-600 mb-2">Quản lý</div> | |
| <div class="text-gray-600">Marketing</div> | |
| </div> | |
| <div class="bg-white/80 backdrop-blur-sm rounded-xl p-6 shadow-lg border border-primary-100"> | |
| <div class="text-3xl font-bold text-primary-600 mb-2">Quản lý</div> | |
| <div class="text-gray-600">CSKH</div> | |
| </div> | |
| <div class="bg-white/80 backdrop-blur-sm rounded-xl p-6 shadow-lg border border-primary-100"> | |
| <div class="text-3xl font-bold text-primary-600 mb-2">Quản lý</div> | |
| <div class="text-gray-600">Bán hàng</div> | |
| </div> | |
| <div class="bg-white/80 backdrop-blur-sm rounded-xl p-6 shadow-lg border border-primary-100"> | |
| <div class="text-3xl font-bold text-primary-600 mb-2">Quản lý</div> | |
| <div class="text-gray-600">Vận hành</div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="absolute bottom-0 left-0 right-0 h-16 bg-gradient-to-t from-white to-transparent"></div> | |
| </section> | |
| <!-- Contact Section --> | |
| <section id="contact" class="py-16 md:py-24 bg-white"> | |
| </section> | |
| <!-- Footer Component --> | |
| <custom-footer></custom-footer> | |
| <!-- Load Components --> | |
| <script src="components/navbar.js"></script> | |
| <script src="components/footer.js"></script> | |
| <!-- Main Script --> | |
| <script src="script.js"></script> | |
| <!-- Initialize Feather Icons --> | |
| <script> | |
| document.addEventListener('DOMContentLoaded', function() { | |
| feather.replace(); | |
| }); | |
| </script> | |
| <script src="https://huggingface.co/deepsite/deepsite-badge.js"></script> | |
| <script src="https://huggingface.co/deepsite/deepsite-badge.js"></script> | |
| </body> | |
| </html> |