服务特色列表 Tailwind网站组件

<section class="py-16">
            <div class="max-w-6xl mx-auto">
                <div class="text-center mb-16">
                    <h2 class="text-3xl sm:text-4xl font-bold text-gray-900 mb-4">服务特色</h2>
                    <p class="text-lg text-gray-600">专业团队，用心服务，为您创造更大价值</p>
                </div>
                <div class="space-y-16">
                    <div class="flex flex-col lg:flex-row items-center gap-12">
                        <div class="lg:w-1/2">
                            <div class="bg-gradient-to-br from-blue-500 to-purple-600 rounded-2xl p-8 text-white">
                                <div class="w-12 h-12 bg-white bg-opacity-20 rounded-lg flex items-center justify-center mb-6">
                                    <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24">
                                        <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"></path>
                                    </svg>
                                </div>
                                <h3 class="text-2xl font-bold mb-4">专业咨询</h3>
                                <p class="text-blue-100">资深专家团队为您提供一对一专业咨询服务</p>
                            </div>
                        </div>
                        <div class="lg:w-1/2">
                            <h3 class="text-2xl font-bold text-gray-900 mb-4">量身定制解决方案</h3>
                            <p class="text-gray-600 mb-6">我们深入了解您的业务需求，为您量身打造最适合的解决方案，确保每一个细节都符合您的期望。</p>
                            <ul class="space-y-2">
                                <li class="flex items-center text-gray-600">
                                    <svg class="w-5 h-5 text-green-500 mr-3" fill="currentColor" viewBox="0 0 20 20">
                                        <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"></path>
                                    </svg>
                                    需求分析与方案设计
                                </li>
                                <li class="flex items-center text-gray-600">
                                    <svg class="w-5 h-5 text-green-500 mr-3" fill="currentColor" viewBox="0 0 20 20">
                                        <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"></path>
                                    </svg>
                                    专业实施与部署
                                </li>
                                <li class="flex items-center text-gray-600">
                                    <svg class="w-5 h-5 text-green-500 mr-3" fill="currentColor" viewBox="0 0 20 20">
                                        <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"></path>
                                    </svg>
                                    持续优化与支持
                                </li>
                            </ul>
                        </div>
                    </div>
                    <div class="flex flex-col lg:flex-row-reverse items-center gap-12">
                        <div class="lg:w-1/2">
                            <div class="bg-gradient-to-br from-green-500 to-teal-600 rounded-2xl p-8 text-white">
                                <div class="w-12 h-12 bg-white bg-opacity-20 rounded-lg flex items-center justify-center mb-6">
                                    <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24">
                                        <path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"></path>
                                    </svg>
                                </div>
                                <h3 class="text-2xl font-bold mb-4">卓越品质</h3>
                                <p class="text-green-100">严格的质量控制体系，确保每个项目都达到最高标准</p>
                            </div>
                        </div>
                        <div class="lg:w-1/2">
                            <h3 class="text-2xl font-bold text-gray-900 mb-4">全程技术支持</h3>
                            <p class="text-gray-600 mb-6">从项目启动到后期维护，我们的技术团队始终为您提供全方位的技术支持服务。</p>
                            <div class="grid grid-cols-2 gap-4">
                                <div class="bg-gray-50 rounded-lg p-4">
                                    <div class="text-2xl font-bold text-green-600 mb-2">24/7</div>
                                    <div class="text-sm text-gray-600">技术支持</div>
                                </div>
                                <div class="bg-gray-50 rounded-lg p-4">
                                    <div class="text-2xl font-bold text-blue-600 mb-2">99.9%</div>
                                    <div class="text-sm text-gray-600">服务可用性</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>