智能解决方案 Tailwind网站组件

<section class="bg-gray-900 text-white py-16 px-8 rounded-3xl mb-16 relative overflow-hidden">
                <div class="absolute inset-0 bg-gradient-to-br from-blue-900/20 to-purple-900/20"></div>
                <div class="relative z-10">
                    <h2 class="text-4xl md:text-5xl font-bold text-center mb-4 bg-gradient-to-r from-cyan-400 to-blue-400 bg-clip-text text-transparent">智能解决方案</h2>
                    <p class="text-xl text-center text-gray-300 mb-12 max-w-3xl mx-auto">探索未来科技，为您的业务提供前沿的智能化解决方案</p>
                    <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
                        <div class="group bg-gray-800/50 p-6 rounded-xl border border-cyan-500/30 hover:border-cyan-400 transition-all duration-300 hover:transform hover:scale-105">
                            <div class="w-16 h-16 bg-gradient-to-br from-cyan-400 to-blue-500 rounded-lg flex items-center justify-center mb-4 group-hover:rotate-12 transition-transform duration-300">
                                <svg class="w-8 h-8 text-white" fill="currentColor" viewBox="0 0 20 20">
                                    <path d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path>
                                </svg>
                            </div>
                            <h3 class="text-xl font-semibold mb-3 text-cyan-300">AI智能分析</h3>
                            <p class="text-gray-400">运用机器学习算法，为您的数据提供深度分析和预测</p>
                        </div>
                        <div class="group bg-gray-800/50 p-6 rounded-xl border border-purple-500/30 hover:border-purple-400 transition-all duration-300 hover:transform hover:scale-105">
                            <div class="w-16 h-16 bg-gradient-to-br from-purple-400 to-pink-500 rounded-lg flex items-center justify-center mb-4 group-hover:rotate-12 transition-transform duration-300">
                                <svg class="w-8 h-8 text-white" fill="currentColor" viewBox="0 0 20 20">
                                    <path d="M3 4a1 1 0 011-1h12a1 1 0 011 1v2a1 1 0 01-1 1H4a1 1 0 01-1-1V4zM3 10a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H4a1 1 0 01-1-1v-6zM14 9a1 1 0 00-1 1v6a1 1 0 001 1h2a1 1 0 001-1v-6a1 1 0 00-1-1h-2z"></path>
                                </svg>
                            </div>
                            <h3 class="text-xl font-semibold mb-3 text-purple-300">云端部署</h3>
                            <p class="text-gray-400">弹性伸缩的云基础设施，确保高可用性和性能</p>
                        </div>
                        <div class="group bg-gray-800/50 p-6 rounded-xl border border-green-500/30 hover:border-green-400 transition-all duration-300 hover:transform hover:scale-105">
                            <div class="w-16 h-16 bg-gradient-to-br from-green-400 to-emerald-500 rounded-lg flex items-center justify-center mb-4 group-hover:rotate-12 transition-transform duration-300">
                                <svg class="w-8 h-8 text-white" fill="currentColor" viewBox="0 0 20 20">
                                    <path d="M9 6a3 3 0 11-6 0 3 3 0 016 0zM17 6a3 3 0 11-6 0 3 3 0 016 0zM12.93 17c.046-.327.07-.66.07-1a6.97 6.97 0 00-1.5-4.33A5 5 0 0119 16v1h-6.07zM6 11a5 5 0 015 5v1H1v-1a5 5 0 015-5z"></path>
                                </svg>
                            </div>
                            <h3 class="text-xl font-semibold mb-3 text-green-300">专业支持</h3>
                            <p class="text-gray-400">24/7专业技术团队支持，确保您的系统稳定运行</p>
                        </div>
                    </div>
                </div>
            </section>