Spaces:
Running
Running
| <html lang="vi"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>AI Solutions - Ứng dụng Trí Tuệ Nhân Tạo cho Doanh Nghiệp</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> | |
| <script> | |
| tailwind.config = { | |
| theme: { | |
| extend: { | |
| colors: { | |
| primary: '#4F46E5', | |
| secondary: '#10B981', | |
| dark: '#1F2937', | |
| light: '#F9FAFB', | |
| } | |
| } | |
| } | |
| } | |
| </script> | |
| <style> | |
| .hero-gradient { | |
| background: linear-gradient(135deg, #4F46E5 0%, #10B981 100%); | |
| } | |
| .feature-card:hover { | |
| transform: translateY(-5px); | |
| box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); | |
| } | |
| .ai-agent-animation { | |
| animation: float 6s ease-in-out infinite; | |
| } | |
| @keyframes float { | |
| 0% { transform: translateY(0px); } | |
| 50% { transform: translateY(-20px); } | |
| 100% { transform: translateY(0px); } | |
| } | |
| </style> | |
| </head> | |
| <body class="font-sans bg-gray-50"> | |
| <!-- Header --> | |
| <header class="bg-white shadow-sm sticky top-0 z-50"> | |
| <div class="container mx-auto px-6 py-4"> | |
| <div class="flex items-center justify-between"> | |
| <div class="flex items-center"> | |
| <div class="w-12 h-12 bg-primary rounded-full flex items-center justify-center text-white font-bold text-xl">AI</div> | |
| <div class="ml-3"> | |
| <h1 class="text-xl font-bold text-dark">AI Solutions</h1> | |
| <p class="text-xs text-gray-500">Công nghệ thông minh cho doanh nghiệp</p> | |
| </div> | |
| </div> | |
| <nav class="hidden md:flex space-x-8"> | |
| <a href="#services" class="text-dark hover:text-primary font-medium">Dịch vụ</a> | |
| <a href="#solutions" class="text-dark hover:text-primary font-medium">Giải pháp</a> | |
| <a href="#about" class="text-dark hover:text-primary font-medium">Về chúng tôi</a> | |
| <a href="#contact" class="text-dark hover:text-primary font-medium">Liên hệ</a> | |
| </nav> | |
| <button class="md:hidden text-gray-600 focus:outline-none"> | |
| <i class="fas fa-bars text-2xl"></i> | |
| </button> | |
| <div class="hidden md:block"> | |
| <button class="bg-primary text-white px-6 py-2 rounded-full hover:bg-opacity-90 transition">Đăng ký ngay</button> | |
| </div> | |
| </div> | |
| </div> | |
| </header> | |
| <!-- Hero Section --> | |
| <section class="hero-gradient text-white"> | |
| <div class="container mx-auto px-6 py-20 md:py-32"> | |
| <div class="flex flex-col md:flex-row items-center"> | |
| <div class="md:w-1/2 mb-12 md:mb-0"> | |
| <h1 class="text-4xl md:text-5xl font-bold leading-tight mb-6"> | |
| Tự động hóa doanh nghiệp với <span class="text-yellow-300">AI Agent</span> | |
| </h1> | |
| <p class="text-xl mb-8 opacity-90"> | |
| Tăng hiệu suất - Tối ưu chi phí - Triển khai nhanh chóng. Giải pháp AI tùy biến theo nhu cầu doanh nghiệp của bạn. | |
| </p> | |
| <div class="flex flex-col sm:flex-row space-y-4 sm:space-y-0 sm:space-x-4"> | |
| <button class="bg-white text-primary px-8 py-3 rounded-full font-medium hover:bg-opacity-90 transition"> | |
| Dùng thử miễn phí | |
| </button> | |
| <button class="border-2 border-white text-white px-8 py-3 rounded-full font-medium hover:bg-white hover:bg-opacity-10 transition"> | |
| Xem demo | |
| </button> | |
| </div> | |
| </div> | |
| <div class="md:w-1/2 flex justify-center"> | |
| <img src="https://cdn-icons-png.flaticon.com/512/2702/2702154.png" alt="AI Agent" class="w-64 h-64 ai-agent-animation"> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Stats Section --> | |
| <section class="bg-white py-12"> | |
| <div class="container mx-auto px-6"> | |
| <div class="grid grid-cols-2 md:grid-cols-4 gap-8 text-center"> | |
| <div class="p-6"> | |
| <div class="text-4xl font-bold text-primary mb-2">200+</div> | |
| <div class="text-gray-600">Doanh nghiệp tin dùng</div> | |
| </div> | |
| <div class="p-6"> | |
| <div class="text-4xl font-bold text-primary mb-2">85%</div> | |
| <div class="text-gray-600">Tăng hiệu suất</div> | |
| </div> | |
| <div class="p-6"> | |
| <div class="text-4xl font-bold text-primary mb-2">40%</div> | |
| <div class="text-gray-600">Giảm chi phí</div> | |
| </div> | |
| <div class="p-6"> | |
| <div class="text-4xl font-bold text-primary mb-2">24/7</div> | |
| <div class="text-gray-600">Hỗ trợ khách hàng</div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Services Section --> | |
| <section id="services" class="py-20 bg-gray-50"> | |
| <div class="container mx-auto px-6"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl md:text-4xl font-bold text-dark mb-4">Dịch vụ AI của chúng tôi</h2> | |
| <p class="text-xl text-gray-600 max-w-2xl mx-auto"> | |
| Cung cấp giải pháp AI toàn diện giúp doanh nghiệp của bạn vận hành thông minh hơn | |
| </p> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"> | |
| <!-- Service 1 --> | |
| <div class="bg-white rounded-xl shadow-md overflow-hidden feature-card transition duration-300"> | |
| <div class="p-6"> | |
| <div class="w-16 h-16 bg-primary bg-opacity-10 rounded-full flex items-center justify-center mb-4"> | |
| <i class="fas fa-robot text-2xl text-primary"></i> | |
| </div> | |
| <h3 class="text-xl font-bold text-dark mb-3">AI Agent tự động hóa</h3> | |
| <p class="text-gray-600 mb-4"> | |
| Hệ thống AI Agent tự động xử lý các tác vụ lặp đi lặp lại, giảm thiểu sai sót và tăng tốc quy trình làm việc. | |
| </p> | |
| <ul class="space-y-2 text-gray-600"> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-secondary mt-1 mr-2"></i> | |
| <span>Tự động hóa quy trình nghiệp vụ</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-secondary mt-1 mr-2"></i> | |
| <span>Xử lý dữ liệu thông minh</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-secondary mt-1 mr-2"></i> | |
| <span>Học hỏi và cải thiện theo thời gian</span> | |
| </li> | |
| </ul> | |
| </div> | |
| </div> | |
| <!-- Service 2 --> | |
| <div class="bg-white rounded-xl shadow-md overflow-hidden feature-card transition duration-300"> | |
| <div class="p-6"> | |
| <div class="w-16 h-16 bg-primary bg-opacity-10 rounded-full flex items-center justify-center mb-4"> | |
| <i class="fas fa-chart-line text-2xl text-primary"></i> | |
| </div> | |
| <h3 class="text-xl font-bold text-dark mb-3">Phân tích dữ liệu AI</h3> | |
| <p class="text-gray-600 mb-4"> | |
| Công nghệ AI phân tích dữ liệu doanh nghiệp, đưa ra insights và dự báo chính xác giúp ra quyết định tối ưu. | |
| </p> | |
| <ul class="space-y-2 text-gray-600"> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-secondary mt-1 mr-2"></i> | |
| <span>Phân tích xu hướng kinh doanh</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-secondary mt-1 mr-2"></i> | |
| <span>Dự báo doanh thu, nhu cầu khách hàng</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-secondary mt-1 mr-2"></i> | |
| <span>Gợi ý chiến lược kinh doanh</span> | |
| </li> | |
| </ul> | |
| </div> | |
| </div> | |
| <!-- Service 3 --> | |
| <div class="bg-white rounded-xl shadow-md overflow-hidden feature-card transition duration-300"> | |
| <div class="p-6"> | |
| <div class="w-16 h-16 bg-primary bg-opacity-10 rounded-full flex items-center justify-center mb-4"> | |
| <i class="fas fa-headset text-2xl text-primary"></i> | |
| </div> | |
| <h3 class="text-xl font-bold text-dark mb-3">Hỗ trợ khách hàng AI</h3> | |
| <p class="text-gray-600 mb-4"> | |
| Trợ lý ảo AI xử lý 80% yêu cầu khách hàng tự động, giảm tải bộ phận CSKH, nâng cao trải nghiệm khách hàng. | |
| </p> | |
| <ul class="space-y-2 text-gray-600"> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-secondary mt-1 mr-2"></i> | |
| <span>Chatbot đa kênh 24/7</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-secondary mt-1 mr-2"></i> | |
| <span>Xử lý yêu cầu tự động</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-secondary mt-1 mr-2"></i> | |
| <span>Phân tích tâm trạng khách hàng</span> | |
| </li> | |
| </ul> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Solutions Section --> | |
| <section id="solutions" class="py-20 bg-white"> | |
| <div class="container mx-auto px-6"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl md:text-4xl font-bold text-dark mb-4">Giải pháp AI theo ngành</h2> | |
| <p class="text-xl text-gray-600 max-w-2xl mx-auto"> | |
| Giải pháp được thiết kế riêng cho từng lĩnh vực kinh doanh | |
| </p> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-8"> | |
| <!-- Solution 1 --> | |
| <div class="bg-gray-50 rounded-xl p-8 flex flex-col md:flex-row items-center"> | |
| <div class="md:w-1/3 mb-6 md:mb-0 flex justify-center"> | |
| <img src="https://cdn-icons-png.flaticon.com/512/2933/2933245.png" alt="Bán lẻ" class="w-24 h-24"> | |
| </div> | |
| <div class="md:w-2/3 md:pl-8"> | |
| <h3 class="text-xl font-bold text-dark mb-3">Bán lẻ & Thương mại điện tử</h3> | |
| <p class="text-gray-600 mb-4"> | |
| Giải pháp AI giúp tối ưu kho hàng, đề xuất sản phẩm cá nhân hóa, phát hiện gian lận và tự động hóa CSKH. | |
| </p> | |
| <button class="text-primary font-medium flex items-center"> | |
| Tìm hiểu thêm <i class="fas fa-arrow-right ml-2"></i> | |
| </button> | |
| </div> | |
| </div> | |
| <!-- Solution 2 --> | |
| <div class="bg-gray-50 rounded-xl p-8 flex flex-col md:flex-row items-center"> | |
| <div class="md:w-1/3 mb-6 md:mb-0 flex justify-center"> | |
| <img src="https://cdn-icons-png.flaticon.com/512/2936/2936886.png" alt="Tài chính" class="w-24 h-24"> | |
| </div> | |
| <div class="md:w-2/3 md:pl-8"> | |
| <h3 class="text-xl font-bold text-dark mb-3">Tài chính & Ngân hàng</h3> | |
| <p class="text-gray-600 mb-4"> | |
| AI hỗ trợ đánh giá rủi ro tín dụng, phát hiện gian lận, chatbot tư vấn tài chính và tự động hóa quy trình nghiệp vụ. | |
| </p> | |
| <button class="text-primary font-medium flex items-center"> | |
| Tìm hiểu thêm <i class="fas fa-arrow-right ml-2"></i> | |
| </button> | |
| </div> | |
| </div> | |
| <!-- Solution 3 --> | |
| <div class="bg-gray-50 rounded-xl p-8 flex flex-col md:flex-row items-center"> | |
| <div class="md:w-1/3 mb-6 md:mb-0 flex justify-center"> | |
| <img src="https://cdn-icons-png.flaticon.com/512/2965/2965484.png" alt="Y tế" class="w-24 h-24"> | |
| </div> | |
| <div class="md:w-2/3 md:pl-8"> | |
| <h3 class="text-xl font-bold text-dark mb-3">Y tế & Chăm sóc sức khỏe</h3> | |
| <p class="text-gray-600 mb-4"> | |
| AI hỗ trợ chẩn đoán, quản lý hồ sơ bệnh án, tối ưu lịch hẹn và phân tích dữ liệu y tế để cải thiện chất lượng dịch vụ. | |
| </p> | |
| <button class="text-primary font-medium flex items-center"> | |
| Tìm hiểu thêm <i class="fas fa-arrow-right ml-2"></i> | |
| </button> | |
| </div> | |
| </div> | |
| <!-- Solution 4 --> | |
| <div class="bg-gray-50 rounded-xl p-8 flex flex-col md:flex-row items-center"> | |
| <div class="md:w-1/3 mb-6 md:mb-0 flex justify-center"> | |
| <img src="https://cdn-icons-png.flaticon.com/512/3050/3050506.png" alt="Sản xuất" class="w-24 h-24"> | |
| </div> | |
| <div class="md:w-2/3 md:pl-8"> | |
| <h3 class="text-xl font-bold text-dark mb-3">Sản xuất & Logistics</h3> | |
| <p class="text-gray-600 mb-4"> | |
| AI tối ưu chuỗi cung ứng, dự báo nhu cầu, giám sát chất lượng sản phẩm và tự động hóa quy trình sản xuất. | |
| </p> | |
| <button class="text-primary font-medium flex items-center"> | |
| Tìm hiểu thêm <i class="fas fa-arrow-right ml-2"></i> | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Benefits Section --> | |
| <section class="py-20 bg-gray-50"> | |
| <div class="container mx-auto px-6"> | |
| <div class="flex flex-col lg:flex-row items-center"> | |
| <div class="lg:w-1/2 mb-12 lg:mb-0"> | |
| <img src="https://cdn-icons-png.flaticon.com/512/2472/2472544.png" alt="Lợi ích AI" class="w-full max-w-lg mx-auto"> | |
| </div> | |
| <div class="lg:w-1/2 lg:pl-12"> | |
| <h2 class="text-3xl md:text-4xl font-bold text-dark mb-6">Lợi ích khi triển khai AI cho doanh nghiệp</h2> | |
| <div class="space-y-6"> | |
| <div class="flex"> | |
| <div class="flex-shrink-0 mt-1"> | |
| <div class="w-10 h-10 bg-primary bg-opacity-10 rounded-full flex items-center justify-center"> | |
| <i class="fas fa-bolt text-primary"></i> | |
| </div> | |
| </div> | |
| <div class="ml-4"> | |
| <h3 class="text-xl font-bold text-dark mb-2">Tăng hiệu suất 85%</h3> | |
| <p class="text-gray-600"> | |
| Tự động hóa các quy trình thủ công, giảm thời gian xử lý từ vài giờ xuống còn vài phút. | |
| </p> | |
| </div> | |
| </div> | |
| <div class="flex"> | |
| <div class="flex-shrink-0 mt-1"> | |
| <div class="w-10 h-10 bg-primary bg-opacity-10 rounded-full flex items-center justify-center"> | |
| <i class="fas fa-dollar-sign text-primary"></i> | |
| </div> | |
| </div> | |
| <div class="ml-4"> | |
| <h3 class="text-xl font-bold text-dark mb-2">Giảm chi phí 40%</h3> | |
| <p class="text-gray-600"> | |
| Tối ưu nhân lực, giảm lỗi và tăng hiệu quả hoạt động giúp doanh nghiệp tiết kiệm đáng kể. | |
| </p> | |
| </div> | |
| </div> | |
| <div class="flex"> | |
| <div class="flex-shrink-0 mt-1"> | |
| <div class="w-10 h-10 bg-primary bg-opacity-10 rounded-full flex items-center justify-center"> | |
| <i class="fas fa-rocket text-primary"></i> | |
| </div> | |
| </div> | |
| <div class="ml-4"> | |
| <h3 class="text-xl font-bold text-dark mb-2">Triển khai nhanh chóng</h3> | |
| <p class="text-gray-600"> | |
| Hệ thống có thể tích hợp trong 2-4 tuần, không làm gián đoạn hoạt động hiện tại của doanh nghiệp. | |
| </p> | |
| </div> | |
| </div> | |
| <div class="flex"> | |
| <div class="flex-shrink-0 mt-1"> | |
| <div class="w-10 h-10 bg-primary bg-opacity-10 rounded-full flex items-center justify-center"> | |
| <i class="fas fa-cogs text-primary"></i> | |
| </div> | |
| </div> | |
| <div class="ml-4"> | |
| <h3 class="text-xl font-bold text-dark mb-2">Tùy biến theo nhu cầu</h3> | |
| <p class="text-gray-600"> | |
| Giải pháp được thiết kế riêng cho từng doanh nghiệp, đáp ứng đặc thù ngành nghề và quy mô. | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Testimonials Section --> | |
| <section class="py-20 bg-white"> | |
| <div class="container mx-auto px-6"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl md:text-4xl font-bold text-dark mb-4">Khách hàng nói về chúng tôi</h2> | |
| <p class="text-xl text-gray-600 max-w-2xl mx-auto"> | |
| Những phản hồi từ các doanh nghiệp đã triển khai giải pháp AI của chúng tôi | |
| </p> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"> | |
| <!-- Testimonial 1 --> | |
| <div class="bg-gray-50 rounded-xl p-8"> | |
| <div class="flex items-center mb-4"> | |
| <div class="w-12 h-12 rounded-full bg-primary bg-opacity-10 flex items-center justify-center"> | |
| <i class="fas fa-user text-primary text-xl"></i> | |
| </div> | |
| <div class="ml-4"> | |
| <h4 class="font-bold text-dark">Ông Nguyễn Văn A</h4> | |
| <p class="text-sm text-gray-500">Giám đốc Công ty Bán lẻ XYZ</p> | |
| </div> | |
| </div> | |
| <p class="text-gray-600 italic"> | |
| "Sau 3 tháng triển khai AI Agent, chúng tôi đã giảm 60% thời gian xử lý đơn hàng và tăng 30% doanh thu nhờ hệ thống đề xuất sản phẩm thông minh." | |
| </p> | |
| <div class="mt-4 flex text-yellow-400"> | |
| <i class="fas fa-star"></i> | |
| <i class="fas fa-star"></i> | |
| <i class="fas fa-star"></i> | |
| <i class="fas fa-star"></i> | |
| <i class="fas fa-star"></i> | |
| </div> | |
| </div> | |
| <!-- Testimonial 2 --> | |
| <div class="bg-gray-50 rounded-xl p-8"> | |
| <div class="flex items-center mb-4"> | |
| <div class="w-12 h-12 rounded-full bg-primary bg-opacity-10 flex items-center justify-center"> | |
| <i class="fas fa-user text-primary text-xl"></i> | |
| </div> | |
| <div class="ml-4"> | |
| <h4 class="font-bold text-dark">Bà Trần Thị B</h4> | |
| <p class="text-sm text-gray-500">CEO Công ty Tài chính ABC</p> | |
| </div> | |
| </div> | |
| <p class="text-gray-600 italic"> | |
| "Hệ thống AI của AI Solutions đã giúp chúng tôi phát hiện gian lận tín dụng với độ chính xác 95%, tiết kiệm hàng tỷ đồng mỗi năm." | |
| </p> | |
| <div class="mt-4 flex text-yellow-400"> | |
| <i class="fas fa-star"></i> | |
| <i class="fas fa-star"></i> | |
| <i class="fas fa-star"></i> | |
| <i class="fas fa-star"></i> | |
| <i class="fas fa-star-half-alt"></i> | |
| </div> | |
| </div> | |
| <!-- Testimonial 3 --> | |
| <div class="bg-gray-50 rounded-xl p-8"> | |
| <div class="flex items-center mb-4"> | |
| <div class="w-12 h-12 rounded-full bg-primary bg-opacity-10 flex items-center justify-center"> | |
| <i class="fas fa-user text-primary text-xl"></i> | |
| </div> | |
| <div class="ml-4"> | |
| <h4 class="font-bold text-dark">Ông Lê Văn C</h4> | |
| <p class="text-sm text-gray-500">Giám đốc Nhà máy DEF</p> | |
| </div> | |
| </div> | |
| <p class="text-gray-600 italic"> | |
| "AI Agent đã tự động hóa 70% quy trình kiểm tra chất lượng sản phẩm, giảm lỗi từ 5% xuống còn 0.8% và tăng năng suất 25%." | |
| </p> | |
| <div class="mt-4 flex text-yellow-400"> | |
| <i class="fas fa-star"></i> | |
| <i class="fas fa-star"></i> | |
| <i class="fas fa-star"></i> | |
| <i class="fas fa-star"></i> | |
| <i class="fas fa-star"></i> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- CTA Section --> | |
| <section class="py-16 bg-primary text-white"> | |
| <div class="container mx-auto px-6 text-center"> | |
| <h2 class="text-3xl md:text-4xl font-bold mb-6">Sẵn sàng chuyển đổi doanh nghiệp với AI?</h2> | |
| <p class="text-xl mb-8 max-w-2xl mx-auto"> | |
| Đăng ký ngay để nhận tư vấn miễn phí và bản demo giải pháp AI phù hợp với doanh nghiệp của bạn | |
| </p> | |
| <div class="flex flex-col sm:flex-row justify-center space-y-4 sm:space-y-0 sm:space-x-4"> | |
| <button class="bg-white text-primary px-8 py-3 rounded-full font-medium hover:bg-opacity-90 transition"> | |
| Đăng ký tư vấn | |
| </button> | |
| <button class="border-2 border-white text-white px-8 py-3 rounded-full font-medium hover:bg-white hover:bg-opacity-10 transition"> | |
| Gọi ngay: 1900 1234 | |
| </button> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- About Section --> | |
| <section id="about" class="py-20 bg-white"> | |
| <div class="container mx-auto px-6"> | |
| <div class="flex flex-col lg:flex-row items-center"> | |
| <div class="lg:w-1/2 mb-12 lg:mb-0 lg:pr-12"> | |
| <h2 class="text-3xl md:text-4xl font-bold text-dark mb-6">Về AI Solutions</h2> | |
| <p class="text-gray-600 mb-6"> | |
| AI Solutions là công ty tiên phong trong lĩnh vực ứng dụng Trí Tuệ Nhân Tạo vào doanh nghiệp tại Việt Nam. Với đội ngũ chuyên gia AI giàu kinh nghiệm, chúng tôi cam kết mang đến giải pháp công nghệ hiện đại nhất giúp doanh nghiệp của bạn vận hành thông minh và hiệu quả hơn. | |
| </p> | |
| <p class="text-gray-600 mb-8"> | |
| Từ năm 2018 đến nay, chúng tôi đã triển khai thành công giải pháp AI cho hơn 200 doanh nghiệp thuộc nhiều lĩnh vực khác nhau, giúp họ tăng trưởng vượt bậc và chiếm lĩnh thị trường. | |
| </p> | |
| <div class="flex space-x-4"> | |
| <div class="bg-gray-50 rounded-lg p-4 text-center flex-1"> | |
| <div class="text-2xl font-bold text-primary mb-2">50+</div> | |
| <div class="text-gray-600">Chuyên gia AI</div> | |
| </div> | |
| <div class="bg-gray-50 rounded-lg p-4 text-center flex-1"> | |
| <div class="text-2xl font-bold text-primary mb-2">15+</div> | |
| <div class="text-gray-600">Bằng sáng chế</div> | |
| </div> | |
| <div class="bg-gray-50 rounded-lg p-4 text-center flex-1"> | |
| <div class="text-2xl font-bold text-primary mb-2">10+</div> | |
| <div class="text-gray-600">Giải thưởng</div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="lg:w-1/2"> | |
| <img src="https://cdn-icons-png.flaticon.com/512/3565/3565418.png" alt="Về chúng tôi" class="w-full rounded-xl shadow-lg"> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Contact Section --> | |
| <section id="contact" class="py-20 bg-gray-50"> | |
| <div class="container mx-auto px-6"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl md:text-4xl font-bold text-dark mb-4">Liên hệ với chúng tôi</h2> | |
| <p class="text-xl text-gray-600 max-w-2xl mx-auto"> | |
| Để lại thông tin, chúng tôi sẽ liên hệ tư vấn giải pháp AI phù hợp nhất cho doanh nghiệp của bạn | |
| </p> | |
| </div> | |
| <div class="flex flex-col lg:flex-row"> | |
| <div class="lg:w-1/2 mb-12 lg:mb-0 lg:pr-12"> | |
| <div class="bg-white rounded-xl shadow-md p-8"> | |
| <h3 class="text-2xl font-bold text-dark mb-6">Gửi yêu cầu tư vấn</h3> | |
| <form> | |
| <div class="mb-6"> | |
| <label for="name" class="block text-gray-700 font-medium mb-2">Họ và tên</label> | |
| <input type="text" id="name" class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent"> | |
| </div> | |
| <div class="mb-6"> | |
| <label for="company" class="block text-gray-700 font-medium mb-2">Tên công ty</label> | |
| <input type="text" id="company" class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent"> | |
| </div> | |
| <div class="mb-6"> | |
| <label for="email" class="block text-gray-700 font-medium mb-2">Email</label> | |
| <input type="email" id="email" class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent"> | |
| </div> | |
| <div class="mb-6"> | |
| <label for="phone" class="block text-gray-700 font-medium mb-2">Số điện thoại</label> | |
| <input type="tel" id="phone" class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent"> | |
| </div> | |
| <div class="mb-6"> | |
| <label for="message" class="block text-gray-700 font-medium mb-2">Nhu cầu của bạn</label> | |
| <textarea id="message" rows="4" class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent"></textarea> | |
| </div> | |
| <button type="submit" class="w-full bg-primary text-white px-6 py-3 rounded-lg font-medium hover:bg-opacity-90 transition"> | |
| Gửi yêu cầu | |
| </button> | |
| </form> | |
| </div> | |
| </div> | |
| <div class="lg:w-1/2"> | |
| <div class="bg-white rounded-xl shadow-md p-8 h-full"> | |
| <h3 class="text-2xl font-bold text-dark mb-6">Thông tin liên hệ</h3> | |
| <div class="space-y-6"> | |
| <div class="flex"> | |
| <div class="flex-shrink-0"> | |
| <div class="w-12 h-12 bg-primary bg-opacity-10 rounded-full flex items-center justify-center"> | |
| <i class="fas fa-map-marker-alt text-primary"></i> | |
| </div> | |
| </div> | |
| <div class="ml-4"> | |
| <h4 class="font-bold text-dark">Địa chỉ</h4> | |
| <p class="text-gray-600">Tầng 12, Tòa nhà AI Tower, 123 Đường Trí Tuệ, Quận 1, TP.HCM</p> | |
| </div> | |
| </div> | |
| <div class="flex"> | |
| <div class="flex-shrink-0"> | |
| <div class="w-12 h-12 bg-primary bg-opacity-10 rounded-full flex items-center justify-center"> | |
| <i class="fas fa-phone-alt text-primary"></i> | |
| </div> | |
| </div> | |
| <div class="ml-4"> | |
| <h4 class="font-bold text-dark">Điện thoại</h4> | |
| <p class="text-gray-600">1900 1234 (Hỗ trợ 24/7)</p> | |
| <p class="text-gray-600">028 1234 5678</p> | |
| </div> | |
| </div> | |
| <div class="flex"> | |
| <div class="flex-shrink-0"> | |
| <div class="w-12 h-12 bg-primary bg-opacity-10 rounded-full flex items-center justify-center"> | |
| <i class="fas fa-envelope text-primary"></i> | |
| </div> | |
| </div> | |
| <div class="ml-4"> | |
| <h4 class="font-bold text-dark">Email</h4> | |
| <p class="text-gray-600">[email protected]</p> | |
| <p class="text-gray-600">[email protected]</p> | |
| </div> | |
| </div> | |
| <div class="flex"> | |
| <div class="flex-shrink-0"> | |
| <div class="w-12 h-12 bg-primary bg-opacity-10 rounded-full flex items-center justify-center"> | |
| <i class="fas fa-clock text-primary"></i> | |
| </div> | |
| </div> | |
| <div class="ml-4"> | |
| <h4 class="font-bold text-dark">Giờ làm việc</h4> | |
| <p class="text-gray-600">Thứ 2 - Thứ 6: 8:00 - 17:30</p> | |
| <p class="text-gray-600">Thứ 7: 8:00 - 12:00</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="mt-8"> | |
| <h4 class="font-bold text-dark mb-4">Theo dõi chúng tôi</h4> | |
| <div class="flex space-x-4"> | |
| <a href="#" class="w-10 h-10 bg-gray-100 rounded-full flex items-center justify-center text-primary hover:bg-primary hover:text-white transition"> | |
| <i class="fab fa-facebook-f"></i> | |
| </a> | |
| <a href="#" class="w-10 h-10 bg-gray-100 rounded-full flex items-center justify-center text-primary hover:bg-primary hover:text-white transition"> | |
| <i class="fab fa-linkedin-in"></i> | |
| </a> | |
| <a href="#" class="w-10 h-10 bg-gray-100 rounded-full flex items-center justify-center text-primary hover:bg-primary hover:text-white transition"> | |
| <i class="fab fa-youtube"></i> | |
| </a> | |
| <a href="#" class="w-10 h-10 bg-gray-100 rounded-full flex items-center justify-center text-primary hover:bg-primary hover:text-white transition"> | |
| <i class="fab fa-twitter"></i> | |
| </a> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Footer --> | |
| <footer class="bg-dark text-white py-12"> | |
| <div class="container mx-auto px-6"> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8"> | |
| <div> | |
| <div class="flex items-center mb-4"> | |
| <div class="w-10 h-10 bg-primary rounded-full flex items-center justify-center text-white font-bold text-lg">AI</div> | |
| <div class="ml-3"> | |
| <h1 class="text-lg font-bold">AI Solutions</h1> | |
| </div> | |
| </div> | |
| <p class="text-gray-400 mb-4"> | |
| Tiên phong ứng dụng Trí Tuệ Nhân Tạo vào doanh nghiệp tại Việt Nam. | |
| </p> | |
| <div class="flex space-x-4"> | |
| <a href="#" class="text-gray-400 hover:text-white transition"> | |
| <i class="fab fa-facebook-f"></i> | |
| </a> | |
| <a href="#" class="text-gray-400 hover:text-white transition"> | |
| <i class="fab fa-linkedin-in"></i> | |
| </a> | |
| <a href="#" class="text-gray-400 hover:text-white transition"> | |
| <i class="fab fa-youtube"></i> | |
| </a> | |
| <a href="#" class="text-gray-400 hover:text-white transition"> | |
| <i class="fab fa-twitter"></i> | |
| </a> | |
| </div> | |
| </div> | |
| <div> | |
| <h3 class="text-lg font-bold mb-4">Dịch vụ</h3> | |
| <ul class="space-y-2"> | |
| <li><a href="#" class="text-gray-400 hover:text-white transition">AI Agent tự động hóa</a></li> | |
| <li><a href="#" class="text-gray-400 hover:text-white transition">Phân tích dữ liệu AI</a></li> | |
| <li><a href="#" class="text-gray-400 hover:text-white transition">Hỗ trợ khách hàng AI</a></li> | |
| <li><a href="#" class="text-gray-400 hover:text-white transition">Tư vấn chuyển đổi số</a></li> | |
| <li><a href="#" class="text-gray-400 hover:text-white transition">Đào tạo AI cho doanh nghiệp</a></li> | |
| </ul> | |
| </div> | |
| <div> | |
| <h3 class="text-lg font-bold mb-4">Giải pháp</h3> | |
| <ul class="space-y-2"> | |
| <li><a href="#" class="text-gray-400 hover:text-white transition">Bán lẻ & Thương mại điện tử</a></li> | |
| <li><a href="#" class="text-gray-400 hover:text-white transition">Tài chính & Ngân hàng</a></li> | |
| <li><a href="#" class="text-gray-400 hover:text-white transition">Y tế & Chăm sóc sức khỏe</a></li> | |
| <li><a href="#" class="text-gray-400 hover:text-white transition">Sản xuất & Logistics</a></li> | |
| <li><a href="#" class="text-gray-400 hover:text-white transition">Giải pháp theo yêu cầu</a></li> | |
| </ul> | |
| </div> | |
| <div> | |
| <h3 class="text-lg font-bold mb-4">Liên hệ</h3> | |
| <ul class="space-y-2"> | |
| <li class="flex items-start"> | |
| <i class="fas fa-map-marker-alt mt-1 mr-2 text-gray-400"></i> | |
| <span class="text-gray-400">Tầng 12, Tòa nhà AI Tower, 123 Đường Trí Tuệ, Quận 1, TP.HCM</span> | |
| </li> | |
| <li class="flex items-center"> | |
| <i class="fas fa-phone-alt mr-2 text-gray-400"></i> | |
| <span class="text-gray-400">1900 1234</span> | |
| </li> | |
| <li class="flex items-center"> | |
| <i class="fas fa-envelope mr-2 text-gray-400"></i> | |
| <span class="text-gray-400">[email protected]</span> | |
| </li> | |
| </ul> | |
| </div> | |
| </div> | |
| <div class="border-t border-gray-800 mt-12 pt-8 flex flex-col md:flex-row justify-between items-center"> | |
| <p class="text-gray-400 mb-4 md:mb-0"> | |
| © 2023 AI Solutions. Bảo lưu mọi quyền. | |
| </p> | |
| <div class="flex space-x-6"> | |
| <a href="#" class="text-gray-400 hover:text-white transition">Chính sách bảo mật</a> | |
| <a href="#" class="text-gray-400 hover:text-white transition">Điều khoản sử dụng</a> | |
| <a href="#" class="text-gray-400 hover:text-white transition">Sitemap</a> | |
| </div> | |
| </div> | |
| </div> | |
| </footer> | |
| <!-- Back to Top Button --> | |
| <button id="backToTop" class="fixed bottom-8 right-8 w-12 h-12 bg-primary text-white rounded-full shadow-lg flex items-center justify-center opacity-0 invisible transition-all duration-300"> | |
| <i class="fas fa-arrow-up"></i> | |
| </button> | |
| <script> | |
| // Back to Top Button | |
| const backToTopButton = document.getElementById('backToTop'); | |
| window.addEventListener('scroll', () => { | |
| if (window.pageYOffset > 300) { | |
| backToTopButton.classList.remove('opacity-0', 'invisible'); | |
| backToTopButton.classList.add('opacity-100', 'visible'); | |
| } else { | |
| backToTopButton.classList.remove('opacity-100', 'visible'); | |
| backToTopButton.classList.add('opacity-0', 'invisible'); | |
| } | |
| }); | |
| backToTopButton.addEventListener('click', () => { | |
| window.scrollTo({ | |
| top: 0, | |
| behavior: 'smooth' | |
| }); | |
| }); | |
| // Mobile Menu Toggle (placeholder - would need actual implementation) | |
| const mobileMenuButton = document.querySelector('.md\\:hidden'); | |
| mobileMenuButton.addEventListener('click', () => { | |
| alert('Mobile menu would open here in a real implementation'); | |
| }); | |
| // Smooth scrolling for anchor links | |
| document.querySelectorAll('a[href^="#"]').forEach(anchor => { | |
| anchor.addEventListener('click', function (e) { | |
| e.preventDefault(); | |
| const targetId = this.getAttribute('href'); | |
| if (targetId === '#') return; | |
| const targetElement = document.querySelector(targetId); | |
| if (targetElement) { | |
| targetElement.scrollIntoView({ | |
| behavior: 'smooth' | |
| }); | |
| } | |
| }); | |
| }); | |
| </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=tranminhmanh/ai-agent" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> | |
| </html> |