refactor: redesign UI for Home and Qazk pages
This commit is contained in:
@@ -0,0 +1,77 @@
|
||||
<section id="about-us" class="bg-slate-50">
|
||||
<div class="relative pb-20">
|
||||
<div class="absolute top-0 left-1/2 -translate-x-1/2 w-80 h-80 bg-blue-100/50 blur-[100px] rounded-full -z-10"></div>
|
||||
<div class="text-center mb-12">
|
||||
<h3 class="text-3xl md:text-5xl font-black text-gray-900 tracking-tight">
|
||||
<span class="text-transparent bg-clip-text bg-gradient-to-r from-blue-600 to-indigo-600">业务赋能</span>
|
||||
</h3>
|
||||
<div class="w-20 h-1.5 bg-gradient-to-r from-blue-600 to-indigo-600 mx-auto mt-6 rounded-full"></div>
|
||||
</div>
|
||||
|
||||
<div class="max-w-7xl mx-auto px-4 lg:px-0">
|
||||
<div class="relative mb-16">
|
||||
<div class="absolute inset-0 bg-gradient-to-r from-blue-400 via-blue-400 to-blue-400 rounded-3xl blur-3xl opacity-30"></div>
|
||||
<div class="relative bg-gradient-to-br from-white via-blue-50/50 to-blue-50/50 backdrop-blur-xl rounded-[2.5rem] p-8 md:p-20 border border-blue-100/50 shadow-2xl shadow-blue-200/20">
|
||||
<div class="text-center">
|
||||
<div class="inline-flex items-center gap-2 px-4 py-2 bg-blue-500/10 rounded-full mb-8 mx-auto">
|
||||
<span class="w-2 h-2 bg-blue-500 rounded-full animate-pulse"></span>
|
||||
<span class="text-blue-600 text-sm font-semibold tracking-wider uppercase">About Us</span>
|
||||
</div>
|
||||
<p class="text-gray-700 text-base md:text-lg leading-relaxed">
|
||||
浙江贝凡 <span class="text-blue-600 font-bold">2019 年 2 月</span>成立，总部坐落于美丽的西子湖畔 · 杭州，贝凡二字源于 <span class="text-blue-600 font-bold">"赢"</span> 字之精髓，<span class="text-blue-600 font-bold">"贝"</span> 象征取财有道，坚守商业本质，<span class="text-blue-600 font-bold">"凡"</span> 代表匠心守拙，深耕技术创新。
|
||||
</p>
|
||||
<p class="text-gray-600 text-base md:text-lg leading-relaxed mt-6">
|
||||
依托自主研发，聚焦<span class="text-blue-600 font-bold">系统研发定制</span>及<span class="text-blue-600 font-bold">自研SaaS系统</span>两大核心板块。依托<span class="text-blue-600 font-bold">多模态系统集成</span>、<span class="text-blue-600 font-bold">AI视觉大模型</span>等前沿技术，构建<span class="text-blue-600 font-bold">智能化、数字化、信息化</span>服务体系；业务覆盖<span class="text-blue-600 font-bold">企业数字化转型</span>、<span class="text-blue-600 font-bold">政企协同治理</span>、<span class="text-blue-600 font-bold">本地化项目交付</span>。公司始终以<span class="text-blue-600 font-bold">"应用为导向，以系统为核心"</span>筑牢技术根基，未来将持续系统迭代与多场景融合，为推动行业数字化转型赋能。
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="text-center mb-12">
|
||||
<h3 class="text-3xl md:text-5xl font-black text-gray-900 tracking-tight">
|
||||
<span class="text-transparent bg-clip-text bg-gradient-to-r from-blue-600 to-indigo-600">多项数据表明</span>
|
||||
</h3>
|
||||
<div class="w-20 h-1.5 bg-gradient-to-r from-blue-600 to-indigo-600 mx-auto mt-6 rounded-full"></div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 md:grid-cols-4 gap-6">
|
||||
<div class="relative group">
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-blue-500/20 to-blue-600/5 rounded-2xl blur-xl group-hover:blur-2xl transition-all duration-300"></div>
|
||||
<div class="relative bg-gradient-to-br from-white to-blue-50/30 rounded-2xl p-6 border border-blue-100/50 shadow-lg group-hover:shadow-blue-500/20 group-hover:scale-[1.02] transition-all duration-300">
|
||||
<div class="text-center">
|
||||
<div class="text-4xl md:text-5xl lg:text-6xl font-black text-transparent bg-clip-text bg-gradient-to-r from-blue-600 to-blue-700 mb-3 group-hover:scale-110 transition-transform duration-300">700+</div>
|
||||
<div class="text-gray-700 text-sm md:text-base font-medium">视觉理解大模型</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="relative group">
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-blue-500/20 to-blue-600/5 rounded-2xl blur-xl group-hover:blur-2xl transition-all duration-300"></div>
|
||||
<div class="relative bg-gradient-to-br from-white to-blue-50/30 rounded-2xl p-6 border border-blue-100/50 shadow-lg group-hover:shadow-blue-500/20 group-hover:scale-[1.02] transition-all duration-300">
|
||||
<div class="text-center">
|
||||
<div class="text-4xl md:text-5xl lg:text-6xl font-black text-transparent bg-clip-text bg-gradient-to-r from-blue-600 to-blue-700 mb-3 group-hover:scale-110 transition-transform duration-300">99.9%</div>
|
||||
<div class="text-gray-700 text-sm md:text-base font-medium">SLA 可用性</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="relative group">
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-blue-500/20 to-blue-600/5 rounded-2xl blur-xl group-hover:blur-2xl transition-all duration-300"></div>
|
||||
<div class="relative bg-gradient-to-br from-white to-blue-50/30 rounded-2xl p-6 border border-blue-100/50 shadow-lg group-hover:shadow-blue-500/20 group-hover:scale-[1.02] transition-all duration-300">
|
||||
<div class="text-center">
|
||||
<div class="text-4xl md:text-5xl lg:text-6xl font-black text-transparent bg-clip-text bg-gradient-to-r from-blue-600 to-blue-700 mb-3 group-hover:scale-110 transition-transform duration-300">15+</div>
|
||||
<div class="text-gray-700 text-sm md:text-base font:medium">合作伙伴</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="relative group">
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-blue-500/20 to-blue-600/5 rounded-2xl blur-xl group-hover:blur-2xl transition-all duration-300"></div>
|
||||
<div class="relative bg-gradient-to-br from-white to-blue-50/30 rounded-2xl p-6 border border-blue-100/50 shadow-lg group-hover:shadow-blue-500/20 group-hover:scale-[1.02] transition-all duration-300">
|
||||
<div class="text-center">
|
||||
<div class="text-4xl md:text-5xl lg:text-6xl font-black text-transparent bg-clip-text bg-gradient-to-r from-blue-600 to-blue-700 mb-3 group-hover:scale-110 transition-transform duration-300">40+</div>
|
||||
<div class="text-gray-700 text-sm md:text-base font-medium">软著专利</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
Reference in New Issue
Block a user