refactor: overhaul UI architecture
This commit is contained in:
1
.astro/types.d.ts
vendored
1
.astro/types.d.ts
vendored
@@ -1 +1,2 @@
|
||||
/// <reference types="astro/client" />
|
||||
/// <reference path="content.d.ts" />
|
||||
Binary file not shown.
BIN
public/img/industry-chemical.webp
Normal file
BIN
public/img/industry-chemical.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 33 KiB |
BIN
public/img/industry-city-government.webp
Normal file
BIN
public/img/industry-city-government.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 66 KiB |
BIN
public/img/industry-finance-retail.webp
Normal file
BIN
public/img/industry-finance-retail.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 33 KiB |
BIN
public/img/industry-healthcare.webp
Normal file
BIN
public/img/industry-healthcare.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 42 KiB |
BIN
public/img/industry-manufacturing.webp
Normal file
BIN
public/img/industry-manufacturing.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 44 KiB |
BIN
public/img/industry-smart-care.webp
Normal file
BIN
public/img/industry-smart-care.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 58 KiB |
BIN
public/img/industry-tourism.webp
Normal file
BIN
public/img/industry-tourism.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 60 KiB |
BIN
public/img/industry-transportation.webp
Normal file
BIN
public/img/industry-transportation.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 42 KiB |
BIN
public/img/mascot.webp
Normal file
BIN
public/img/mascot.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 31 KiB |
@@ -11,19 +11,27 @@
|
||||
<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">
|
||||
<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-12 lg:p-16 border border-blue-100/50 shadow-2xl shadow-blue-200/20">
|
||||
<div class="flex flex-col md:flex-row gap-8 md:gap-12 items-center">
|
||||
<div class="flex-1">
|
||||
<div class="inline-flex items-center gap-2 px-4 py-2 bg-blue-500/10 rounded-full mb-6">
|
||||
<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 class="text-gray-700 text-base md:text-lg leading-relaxed mb-6">
|
||||
浙江贝凡 2019 年 2 月成立，总部坐落于美丽的西子湖畔 · 杭州，贝凡二字源于<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">
|
||||
依托自主研发，聚焦<span class="text-blue-600 font-bold">系统研发定制</span>及<span class="text-blue-600 font-bold">自研SaaS系统</span>两大核心板块。依托多模态系统集成、AI视觉大模型等前沿技术，构建智能化、数字化、信息化服务体系；业务覆盖企业数字化转型、政企协同治理、本地化项目交付。
|
||||
</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>筑牢技术根基，未来将持续系统迭代与多场景融合，为推动行业数字化转型赋能。
|
||||
公司始终以<span class="text-blue-600 font-bold">"应用为导向，以系统为核心"</span>筑牢技术根基，未来将持续系统迭代与多场景融合，为推动行业数字化转型赋能。
|
||||
</p>
|
||||
</div>
|
||||
<div class="md:w-1/3 relative flex items-center justify-center">
|
||||
<img src="/img/mascot.webp" alt="公司吉祥物" class="w-2/3 h-auto object-contain transform hover:scale-105 transition-transform duration-500">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -2,17 +2,47 @@
|
||||
---
|
||||
<section class="bg-slate-50 overflow-hidden">
|
||||
<div class="max-w-7xl mx-auto space-y-24 px-4 lg:px-0">
|
||||
<div class="relative">
|
||||
<div class="max-w-7xl mx-auto space-y-6">
|
||||
<div class="grid lg:grid-cols-12 gap-8 lg:gap-16 items-stretch">
|
||||
|
||||
<div class="lg:col-span-4 flex flex-col">
|
||||
<div class="bg-slate-50/90 pb-4 rounded-3xl">
|
||||
<h2 class="text-4xl font-black text-gray-900 leading-[1.1] mb-6">
|
||||
全场景<span class="text-transparent bg-clip-text bg-gradient-to-r from-blue-600 to-indigo-600">产业数字化</span>
|
||||
<style>
|
||||
@keyframes float {
|
||||
0% {
|
||||
transform: translateY(0px);
|
||||
}
|
||||
|
||||
50% {
|
||||
transform: translateY(-10px);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: translateY(0px);
|
||||
}
|
||||
}
|
||||
|
||||
.animate-float {
|
||||
animation: float 4s ease-in-out infinite;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="max-w-7xl mx-auto">
|
||||
<div class="bg-white p-4 md:p-10 rounded-3xl shadow-2xl border border-indigo-100 transition-all duration-500">
|
||||
|
||||
<div class="flex flex-col md:flex-row items-center gap-8 md:gap-16 mb-12">
|
||||
<div class="md:w-5/12 w-[85%] relative">
|
||||
<div class="absolute -inset-4 bg-indigo-400/10 blur-3xl"></div>
|
||||
<div class="animate-float relative overflow-hidden rounded-2xl shadow-[0_20px_50px_rgba(79,70,229,0.2)] border border-white">
|
||||
<img src="/img/product-customization-1.webp" alt="园区IOC" class="w-full h-auto object-cover transform hover:scale-105 transition-transform duration-700">
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-gray-900/70 via-transparent to-transparent"></div>
|
||||
<div class="absolute bottom-4 left-6 text-white">
|
||||
<p class="text-sm font-bold tracking-widest opacity-80 uppercase">园区IOC</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="md:w-7/12 w-full text-center md:text-left">
|
||||
<h2 class="text-3xl md:text-4xl font-extrabold text-gray-900 tracking-tight mb-4">
|
||||
<span class="text-transparent bg-clip-text bg-gradient-to-r from-blue-600 to-indigo-600">多模态</span>软件系统研发
|
||||
</h2>
|
||||
<p class="text-gray-600 text-lg md:text-xl leading-[1.8] mb-8">
|
||||
<span class="text-indigo-600 font-extrabold">多模态软件系统研发</span>，
|
||||
<p class="text-gray-700 text-lg md:text-xl leading-relaxed mb-6">
|
||||
场景覆盖多个重点行业，核心集中在
|
||||
<span class="text-gray-900 font-bold">化工能源、生产制造、金融零售、城市政务、交通运输、景区文旅</span>
|
||||
等领域，提供从需求、方案设计、系统开发、运维交付的
|
||||
@@ -24,137 +54,206 @@
|
||||
<span class="text-indigo-600 font-black tracking-tight underline decoration-indigo-200 decoration-4 underline-offset-8">提质增效</span>。
|
||||
</p>
|
||||
|
||||
<div class="grid grid-cols-2 gap-4 mb-8">
|
||||
<div class="bg-indigo-50/50 p-4 rounded-2xl border border-indigo-100">
|
||||
<div class="text-indigo-600 font-bold text-2xl mb-1">700+</div>
|
||||
<div class="text-gray-500 text-[10px] sm:text-xs tracking-wider font-bold uppercase">自研核心算法</div>
|
||||
<div class="grid grid-cols-2 gap-4 mb-6">
|
||||
<div class="bg-indigo-50/50 p-4 rounded-2xl border border-indigo-100 flex items-center gap-3">
|
||||
<div class="w-10 h-10 bg-indigo-100 rounded-xl flex items-center justify-center text-indigo-600">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z" />
|
||||
</svg>
|
||||
</div>
|
||||
<div class="bg-blue-50/50 p-4 rounded-2xl border border-blue-100">
|
||||
<div class="text-blue-600 font-bold text-2xl mb-1">99.99%+</div>
|
||||
<div class="text-gray-500 text-[10px] sm:text-xs tracking-wider font-bold uppercase">SLA 服务可用性</div>
|
||||
<div>
|
||||
<div class="text-indigo-600 font-bold text-2xl mb-1">100+</div>
|
||||
<div class="text-gray-500 text-[10px] sm:text-xs tracking-wider font-bold uppercase">成功案例</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-blue-50/50 p-4 rounded-2xl border border-blue-100 flex items-center gap-3">
|
||||
<div class="w-10 h-10 bg-blue-100 rounded-xl flex items-center justify-center text-blue-600">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" />
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<div class="flex-1 flex flex-col gap-4">
|
||||
<div class="flex-1 relative group overflow-hidden rounded-3xl border border-slate-100 shadow-md">
|
||||
<img src="/img/product-customization-1.webp" alt="AI定制技术" class="w-full h-full object-cover transition-transform duration-700 group-hover:scale-105">
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-gray-900/70 via-transparent to-transparent"></div>
|
||||
<div class="absolute bottom-4 left-6 text-white">
|
||||
<p class="text-sm font-bold tracking-widest opacity-80 uppercase">园区IOC</p>
|
||||
<div>
|
||||
<div class="text-blue-600 font-bold text-2xl mb-1">7×24h</div>
|
||||
<div class="text-gray-500 text-[10px] sm:text-xs tracking-wider font-bold uppercase">响应支持</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-1 relative group overflow-hidden rounded-3xl border border-slate-100 shadow-md">
|
||||
<img src="/img/product-customization-2.webp" alt="数字化应用" class="w-full h-full object-cover transition-transform duration-700 group-hover:scale-105">
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-gray-900/70 via-transparent to-transparent"></div>
|
||||
<div class="absolute bottom-4 left-6 text-white">
|
||||
<p class="text-sm font-bold tracking-widest opacity-80 uppercase">数字孪生</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="lg:col-span-8 grid grid-cols-1 md:grid-cols-2 gap-5 relative z-10">
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 md:gap-8">
|
||||
|
||||
<div class="group bg-white p-7 rounded-[2rem] border border-slate-100 shadow-sm hover:shadow-xl hover:border-indigo-200 transition-all duration-500 flex flex-col">
|
||||
<div class="flex items-center gap-4 mb-5">
|
||||
<div class="w-16 h-16 bg-indigo-50 rounded-2xl flex items-center justify-center text-indigo-600 group-hover:bg-indigo-600 group-hover:text-white transition-all">
|
||||
<svg class="w-8 h-8" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<div class="group bg-white p-6 rounded-[2rem] border border-slate-100 shadow-sm hover:shadow-xl hover:border-indigo-200 transition-all duration-500 flex flex-col">
|
||||
<div class="relative overflow-hidden rounded-xl mb-5 aspect-video group-hover:scale-105 transition-transform duration-500">
|
||||
<img src="/img/industry-chemical.webp" alt="化工能源" class="w-full h-full object-cover">
|
||||
</div>
|
||||
<div class="flex items-center gap-3 mb-4">
|
||||
<div class="w-12 h-12 bg-indigo-50 rounded-xl flex items-center justify-center text-indigo-600 group-hover:bg-indigo-600 group-hover:text-white transition-all">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z" />
|
||||
</svg>
|
||||
</div>
|
||||
<h4 class="text-2xl font-black text-gray-900">化工能源</h4>
|
||||
<h4 class="text-xl font-black text-gray-900">化工能源</h4>
|
||||
</div>
|
||||
<p class="text-lg text-gray-700 leading-relaxed font-semibold">深耕危化品全流程管控体系，研发<span class="text-indigo-600 bg-indigo-50 px-1.5 py-0.5 rounded-md">储罐区动态风险评价、人员定位与安全预警平台</span>。</p>
|
||||
<div class="flex flex-wrap gap-2 mb-3">
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">储罐区监控</span>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">人员定位</span>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">风险预警</span>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">危化品管理</span>
|
||||
</div>
|
||||
<p class="text-gray-700 leading-relaxed font-semibold">为化工企业提供全方位的安全管控，通过AI技术实时监控生产环境，防止事故发生。</p>
|
||||
</div>
|
||||
|
||||
<div class="group bg-white p-7 rounded-[2rem] border border-slate-100 shadow-sm hover:shadow-xl hover:border-indigo-200 transition-all duration-500 flex flex-col">
|
||||
<div class="flex items-center gap-4 mb-5">
|
||||
<div class="w-16 h-16 bg-indigo-50 rounded-2xl flex items-center justify-center text-indigo-600 group-hover:bg-indigo-600 group-hover:text-white transition-all">
|
||||
<svg class="w-8 h-8" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<div class="group bg-white p-6 rounded-[2rem] border border-slate-100 shadow-sm hover:shadow-xl hover:border-indigo-200 transition-all duration-500 flex flex-col">
|
||||
<div class="relative overflow-hidden rounded-xl mb-5 aspect-video group-hover:scale-105 transition-transform duration-500">
|
||||
<img src="/img/industry-manufacturing.webp" alt="生产制造" class="w-full h-full object-cover">
|
||||
</div>
|
||||
<div class="flex items-center gap-3 mb-4">
|
||||
<div class="w-12 h-12 bg-indigo-50 rounded-xl flex items-center justify-center text-indigo-600 group-hover:bg-indigo-600 group-hover:text-white transition-all">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 3v2m6-2v2M9 19v2m6-2v2M5 9H3m2 6H3m18-6h-2m2 6h-2M7 19h10a2 2 0 002-2V7a2 2 0 00-2-2H7a2 2 0 00-2 2v10a2 2 0 002 2zM9 9h6v6H9V9z" />
|
||||
</svg>
|
||||
</div>
|
||||
<h4 class="text-2xl font-black text-gray-900">生产制造</h4>
|
||||
<h4 class="text-xl font-black text-gray-900">生产制造</h4>
|
||||
</div>
|
||||
<p class="text-lg text-gray-700 leading-relaxed font-semibold">聚焦核心生产管控，提供<span class="text-indigo-600 bg-indigo-50 px-1.5 py-0.5 rounded-md">MES执行系统、EAP设备自动化及AMHS物料搬运系统</span>。</p>
|
||||
<div class="flex flex-wrap gap-2 mb-3">
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">安全生产管理</span>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">设备监控</span>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">质量追溯</span>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">工艺优化</span>
|
||||
</div>
|
||||
<p class="text-gray-700 leading-relaxed font-semibold">提升生产效率的同时，确保生产过程安全可控，减少安全事故风险。</p>
|
||||
</div>
|
||||
|
||||
<div class="group bg-white p-7 rounded-[2rem] border border-slate-100 shadow-sm hover:shadow-xl hover:border-indigo-200 transition-all duration-500 flex flex-col">
|
||||
<div class="flex items-center gap-4 mb-5">
|
||||
<div class="w-16 h-16 bg-indigo-50 rounded-2xl flex items-center justify-center text-indigo-600 group-hover:bg-indigo-600 group-hover:text-white transition-all">
|
||||
<svg class="w-8 h-8" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<div class="group bg-white p-6 rounded-[2rem] border border-slate-100 shadow-sm hover:shadow-xl hover:border-indigo-200 transition-all duration-500 flex flex-col">
|
||||
<div class="relative overflow-hidden rounded-xl mb-5 aspect-video group-hover:scale-105 transition-transform duration-500">
|
||||
<img src="/img/industry-finance-retail.webp" alt="金融零售" class="w-full h-full object-cover">
|
||||
</div>
|
||||
<div class="flex items-center gap-3 mb-4">
|
||||
<div class="w-12 h-12 bg-indigo-50 rounded-xl flex items-center justify-center text-indigo-600 group-hover:bg-indigo-600 group-hover:text-white transition-all">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
|
||||
</svg>
|
||||
</div>
|
||||
<h4 class="text-2xl font-black text-gray-900">金融零售</h4>
|
||||
<h4 class="text-xl font-black text-gray-900">金融零售</h4>
|
||||
</div>
|
||||
<p class="text-lg text-gray-700 leading-relaxed font-semibold">研发高并发<span class="text-indigo-600 bg-indigo-50 px-1.5 py-0.5 rounded-md">大数据智能风控模型、反洗钱稽查及投资组合监控平台</span>。</p>
|
||||
<div class="flex flex-wrap gap-2 mb-3">
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">风险防控</span>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">交易监控</span>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">客户识别</span>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">反欺诈</span>
|
||||
</div>
|
||||
<p class="text-gray-700 leading-relaxed font-semibold">保障金融交易安全，防止欺诈行为，提升客户信任度和满意度。</p>
|
||||
</div>
|
||||
|
||||
<div class="group bg-white p-7 rounded-[2rem] border border-slate-100 shadow-sm hover:shadow-xl hover:border-indigo-200 transition-all duration-500 flex flex-col">
|
||||
<div class="flex items-center gap-4 mb-5">
|
||||
<div class="w-16 h-16 bg-indigo-50 rounded-2xl flex items-center justify-center text-indigo-600 group-hover:bg-indigo-600 group-hover:text-white transition-all">
|
||||
<svg class="w-8 h-8" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<div class="group bg-white p-6 rounded-[2rem] border border-slate-100 shadow-sm hover:shadow-xl hover:border-indigo-200 transition-all duration-500 flex flex-col">
|
||||
<div class="relative overflow-hidden rounded-xl mb-5 aspect-video group-hover:scale-105 transition-transform duration-500">
|
||||
<img src="/img/industry-smart-care.webp" alt="智慧养老" class="w-full h-full object-cover">
|
||||
</div>
|
||||
<div class="flex items-center gap-3 mb-4">
|
||||
<div class="w-12 h-12 bg-indigo-50 rounded-xl flex items-center justify-center text-indigo-600 group-hover:bg-indigo-600 group-hover:text-white transition-all">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z" />
|
||||
</svg>
|
||||
</div>
|
||||
<h4 class="text-2xl font-black text-gray-900">智慧养老</h4>
|
||||
<h4 class="text-xl font-black text-gray-900">智慧养老</h4>
|
||||
</div>
|
||||
<p class="text-lg text-gray-700 leading-relaxed font-semibold">打造<span class="text-indigo-600 bg-indigo-50 px-1.5 py-0.5 rounded-md">智慧康养大脑</span>，集成毫米波雷达跌倒监测与居家健康实时预警。</p>
|
||||
<div class="flex flex-wrap gap-2 mb-3">
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">老人监护</span>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">健康监测</span>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">紧急求助</span>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">智能护理</span>
|
||||
</div>
|
||||
<p class="text-gray-700 leading-relaxed font-semibold">为老年人提供安全保障，实时监测健康状况，及时响应紧急情况。</p>
|
||||
</div>
|
||||
|
||||
<div class="group bg-white p-7 rounded-[2rem] border border-slate-100 shadow-sm hover:shadow-xl hover:border-indigo-200 transition-all duration-500 flex flex-col">
|
||||
<div class="flex items-center gap-4 mb-5">
|
||||
<div class="w-16 h-16 bg-indigo-50 rounded-2xl flex items-center justify-center text-indigo-600 group-hover:bg-indigo-600 group-hover:text-white transition-all">
|
||||
<svg class="w-8 h-8" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<div class="group bg-white p-6 rounded-[2rem] border border-slate-100 shadow-sm hover:shadow-xl hover:border-indigo-200 transition-all duration-500 flex flex-col">
|
||||
<div class="relative overflow-hidden rounded-xl mb-5 aspect-video group-hover:scale-105 transition-transform duration-500">
|
||||
<img src="/img/industry-city-government.webp" alt="城市政务" class="w-full h-full object-cover">
|
||||
</div>
|
||||
<div class="flex items-center gap-3 mb-4">
|
||||
<div class="w-12 h-12 bg-indigo-50 rounded-xl flex items-center justify-center text-indigo-600 group-hover:bg-indigo-600 group-hover:text-white transition-all">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5" />
|
||||
</svg>
|
||||
</div>
|
||||
<h4 class="text-2xl font-black text-gray-900">城市政务</h4>
|
||||
<h4 class="text-xl font-black text-gray-900">城市政务</h4>
|
||||
</div>
|
||||
<p class="text-lg text-gray-700 leading-relaxed font-semibold">主打治理中台，研发<span class="text-indigo-600 bg-indigo-50 px-1.5 py-0.5 rounded-md">超级智能体、一网统管及智能秒批审批系统</span>。</p>
|
||||
<div class="flex flex-wrap gap-2 mb-3">
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">城市安全</span>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">应急管理</span>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">智慧城市</span>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">政务服务</span>
|
||||
</div>
|
||||
<p class="text-gray-700 leading-relaxed font-semibold">提升城市治理水平，加强公共安全管理，保障市民生命财产安全。</p>
|
||||
</div>
|
||||
|
||||
<div class="group bg-white p-7 rounded-[2rem] border border-slate-100 shadow-sm hover:shadow-xl hover:border-indigo-200 transition-all duration-500 flex flex-col">
|
||||
<div class="flex items-center gap-4 mb-5">
|
||||
<div class="w-16 h-16 bg-indigo-50 rounded-2xl flex items-center justify-center text-indigo-600 group-hover:bg-indigo-600 group-hover:text-white transition-all">
|
||||
<svg class="w-8 h-8" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<div class="group bg-white p-6 rounded-[2rem] border border-slate-100 shadow-sm hover:shadow-xl hover:border-indigo-200 transition-all duration-500 flex flex-col">
|
||||
<div class="relative overflow-hidden rounded-xl mb-5 aspect-video group-hover:scale-105 transition-transform duration-500">
|
||||
<img src="/img/industry-transportation.webp" alt="交通运输" class="w-full h-full object-cover">
|
||||
</div>
|
||||
<div class="flex items-center gap-3 mb-4">
|
||||
<div class="w-12 h-12 bg-indigo-50 rounded-xl flex items-center justify-center text-indigo-600 group-hover:bg-indigo-600 group-hover:text-white transition-all">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16V6a1 1 0 00-1-1H4a1 1 0 00-1 1v10a1 1 0 001 1h8a1 1 0 001-1zm0 0l5 4V12l-5 4z" />
|
||||
</svg>
|
||||
</div>
|
||||
<h4 class="text-2xl font-black text-gray-900">交通运输</h4>
|
||||
<h4 class="text-xl font-black text-gray-900">交通运输</h4>
|
||||
</div>
|
||||
<p class="text-lg text-gray-700 leading-relaxed font-semibold">研发调度体系，包括<span class="text-indigo-600 bg-indigo-50 px-1.5 py-0.5 rounded-md">无人集卡调度、高铁/航空票务流量预测模型</span>。</p>
|
||||
<div class="flex flex-wrap gap-2 mb-3">
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">交通监控</span>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">智能调度</span>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">安全预警</span>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">轨迹追踪</span>
|
||||
</div>
|
||||
<p class="text-gray-700 leading-relaxed font-semibold">优化交通流量，提高运输效率，保障道路交通安全。</p>
|
||||
</div>
|
||||
|
||||
<div class="group bg-white p-7 rounded-[2rem] border border-slate-100 shadow-sm hover:shadow-xl hover:border-indigo-200 transition-all duration-500 flex flex-col">
|
||||
<div class="flex items-center gap-4 mb-5">
|
||||
<div class="w-16 h-16 bg-indigo-50 rounded-2xl flex items-center justify-center text-indigo-600 group-hover:bg-indigo-600 group-hover:text-white transition-all">
|
||||
<svg class="w-8 h-8" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3.055 11H5a2 2 0 012 2v1a2 2 0 002 2 2 2 0 012 2v2.945M8 3.935V5.5A2.5 2.5 0 0010.5 8h.5a2 2 0 012 2 2 2 0 104 0 2 2 0 012-2h1.064" />
|
||||
<div class="group bg-white p-6 rounded-[2rem] border border-slate-100 shadow-sm hover:shadow-xl hover:border-indigo-200 transition-all duration-500 flex flex-col">
|
||||
<div class="relative overflow-hidden rounded-xl mb-5 aspect-video group-hover:scale-105 transition-transform duration-500">
|
||||
<img src="/img/industry-tourism.webp" alt="景区文旅" class="w-full h-full object-cover">
|
||||
</div>
|
||||
<div class="flex items-center gap-3 mb-4">
|
||||
<div class="w-12 h-12 bg-indigo-50 rounded-xl flex items-center justify-center text-indigo-600 group-hover:bg-indigo-600 group-hover:text-white transition-all">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z" />
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 11a3 3 0 11-6 0 3 3 0 016 0z" />
|
||||
</svg>
|
||||
</div>
|
||||
<h4 class="text-2xl font-black text-gray-900">景区文旅</h4>
|
||||
<h4 class="text-xl font-black text-gray-900">景区文旅</h4>
|
||||
</div>
|
||||
<p class="text-lg text-gray-700 leading-relaxed font-semibold">提供全域数字化方案，研发<span class="text-indigo-600 bg-indigo-50 px-1.5 py-0.5 rounded-md">AR导览、客流预警及分销风控平台</span>。</p>
|
||||
<div class="flex flex-wrap gap-2 mb-3">
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">客流管理</span>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">安全监控</span>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">应急响应</span>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">智能导览</span>
|
||||
</div>
|
||||
<p class="text-gray-700 leading-relaxed font-semibold">提升景区管理水平，确保游客安全，提供更好的旅游体验。</p>
|
||||
</div>
|
||||
|
||||
<div class="group bg-white p-7 rounded-[2rem] border border-slate-100 shadow-sm hover:shadow-xl hover:border-indigo-200 transition-all duration-500 flex flex-col">
|
||||
<div class="flex items-center gap-4 mb-5">
|
||||
<div class="w-16 h-16 bg-indigo-50 rounded-2xl flex items-center justify-center text-indigo-600 group-hover:bg-indigo-600 group-hover:text-white transition-all">
|
||||
<svg class="w-8 h-8" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<div class="group bg-white p-6 rounded-[2rem] border border-slate-100 shadow-sm hover:shadow-xl hover:border-indigo-200 transition-all duration-500 flex flex-col">
|
||||
<div class="relative overflow-hidden rounded-xl mb-5 aspect-video group-hover:scale-105 transition-transform duration-500">
|
||||
<img src="/img/industry-healthcare.webp" alt="医疗健康" class="w-full h-full object-cover">
|
||||
</div>
|
||||
<div class="flex items-center gap-3 mb-4">
|
||||
<div class="w-12 h-12 bg-indigo-50 rounded-xl flex items-center justify-center text-indigo-600 group-hover:bg-indigo-600 group-hover:text-white transition-all">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4" />
|
||||
</svg>
|
||||
</div>
|
||||
<h4 class="text-2xl font-black text-gray-900">医疗健康</h4>
|
||||
<h4 class="text-xl font-black text-gray-900">医疗健康</h4>
|
||||
</div>
|
||||
<p class="text-lg text-gray-700 leading-relaxed font-semibold">研发信息系统，涵盖<span class="text-indigo-600 bg-indigo-50 px-1.5 py-0.5 rounded-md">临床辅助决策(CDSS)、数字病人虚拟训练</span>。</p>
|
||||
<div class="flex flex-wrap gap-2 mb-3">
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">医院管理</span>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">患者安全</span>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">医疗数据</span>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">远程医疗</span>
|
||||
</div>
|
||||
<p class="text-gray-700 leading-relaxed font-semibold">优化医疗服务流程，保障患者安全，提升医疗质量和效率。</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="relative bg-white rounded-[3rem] p-10 md:p-14 shadow-[0_32px_64px_-16px_rgba(0,0,0,0.08)] border border-slate-100 overflow-hidden group">
|
||||
<div class="mt-16 relative bg-white rounded-[3rem] p-10 md:p-14 shadow-[0_32px_64px_-16px_rgba(0,0,0,0.08)] border border-slate-100 overflow-hidden group">
|
||||
<div class="absolute -top-24 -right-24 w-96 h-96 bg-indigo-50 rounded-full blur-3xl opacity-60 transition-all duration-700 group-hover:scale-110"></div>
|
||||
<div class="absolute -bottom-24 -left-24 w-72 h-72 bg-blue-50 rounded-full blur-3xl opacity-60"></div>
|
||||
|
||||
@@ -174,44 +273,44 @@
|
||||
|
||||
<div class="hidden lg:block w-[2px] h-24 bg-slate-100"></div>
|
||||
|
||||
<div class="flex-1 grid grid-cols-2 lg:flex lg:flex-wrap gap-4">
|
||||
<span class="flex items-center gap-2 px-5 py-3 lg:px-6 lg:py-3 rounded-2xl bg-slate-50 border border-slate-200 text-gray-700 text-base lg:text-lg font-bold hover:bg-white hover:border-indigo-400 hover:text-indigo-600 hover:shadow-md transition-all cursor-default group/tag">
|
||||
<svg class="w-5 h-5 text-gray-400 group-hover/tag:text-indigo-500 transition-colors" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<div class="flex-1 flex flex-wrap gap-3">
|
||||
<span class="flex items-center gap-2 px-4 py-2 rounded-xl bg-slate-50 border border-slate-200 text-gray-700 text-sm font-bold hover:bg-white hover:border-indigo-400 hover:text-indigo-600 hover:shadow-md transition-all cursor-default group/tag">
|
||||
<svg class="w-4 h-4 text-gray-400 group-hover/tag:text-indigo-500 transition-colors" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z" />
|
||||
</svg>
|
||||
司法监管
|
||||
</span>
|
||||
|
||||
<span class="flex items-center gap-2 px-5 py-3 lg:px-6 lg:py-3 rounded-2xl bg-slate-50 border border-slate-200 text-gray-700 text-base lg:text-lg font-bold hover:bg-white hover:border-indigo-400 hover:text-indigo-600 hover:shadow-md transition-all cursor-default group/tag">
|
||||
<svg class="w-5 h-5 text-gray-400 group-hover/tag:text-indigo-500 transition-colors" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<span class="flex items-center gap-2 px-4 py-2 rounded-xl bg-slate-50 border border-slate-200 text-gray-700 text-sm font-bold hover:bg-white hover:border-indigo-400 hover:text-indigo-600 hover:shadow-md transition-all cursor-default group/tag">
|
||||
<svg class="w-4 h-4 text-gray-400 group-hover/tag:text-indigo-500 transition-colors" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253" />
|
||||
</svg>
|
||||
智慧教育
|
||||
</span>
|
||||
|
||||
<span class="flex items-center gap-2 px-5 py-3 lg:px-6 lg:py-3 rounded-2xl bg-slate-50 border border-slate-200 text-gray-700 text-base lg:text-lg font-bold hover:bg-white hover:border-indigo-400 hover:text-indigo-600 hover:shadow-md transition-all cursor-default group/tag">
|
||||
<svg class="w-5 h-5 text-gray-400 group-hover/tag:text-indigo-500 transition-colors" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<span class="flex items-center gap-2 px-4 py-2 rounded-xl bg-slate-50 border border-slate-200 text-gray-700 text-sm font-bold hover:bg-white hover:border-indigo-400 hover:text-indigo-600 hover:shadow-md transition-all cursor-default group/tag">
|
||||
<svg class="w-4 h-4 text-gray-400 group-hover/tag:text-indigo-500 transition-colors" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z" />
|
||||
</svg>
|
||||
电力巡检
|
||||
</span>
|
||||
|
||||
<span class="flex items-center gap-2 px-5 py-3 lg:px-6 lg:py-3 rounded-2xl bg-slate-50 border border-slate-200 text-gray-700 text-base lg:text-lg font-bold hover:bg-white hover:border-indigo-400 hover:text-indigo-600 hover:shadow-md transition-all cursor-default group/tag">
|
||||
<svg class="w-5 h-5 text-gray-400 group-hover/tag:text-indigo-500 transition-colors" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<span class="flex items-center gap-2 px-4 py-2 rounded-xl bg-slate-50 border border-slate-200 text-gray-700 text-sm font-bold hover:bg-white hover:border-indigo-400 hover:text-indigo-600 hover:shadow-md transition-all cursor-default group/tag">
|
||||
<svg class="w-4 h-4 text-gray-400 group-hover/tag:text-indigo-500 transition-colors" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 01-9 9m9-9a9 9 0 00-9-9m9 9H3m9 9a9 9 0 01-9-9m9 9c1.657 0 3-4.03 3-9s-1.343-9-3-9m0 18c-1.657 0-3-4.03-3-9s1.343-9 3-9m-9 9a9 9 0 019-9" />
|
||||
</svg>
|
||||
环境监测
|
||||
</span>
|
||||
|
||||
<span class="flex items-center gap-2 px-5 py-3 lg:px-6 lg:py-3 rounded-2xl bg-slate-50 border border-slate-200 text-gray-700 text-base lg:text-lg font-bold hover:bg-white hover:border-indigo-400 hover:text-indigo-600 hover:shadow-md transition-all cursor-default group/tag">
|
||||
<svg class="w-5 h-5 text-gray-400 group-hover/tag:text-indigo-500 transition-colors" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<span class="flex items-center gap-2 px-4 py-2 rounded-xl bg-slate-50 border border-slate-200 text-gray-700 text-sm font-bold hover:bg-white hover:border-indigo-400 hover:text-indigo-600 hover:shadow-md transition-all cursor-default group/tag">
|
||||
<svg class="w-4 h-4 text-gray-400 group-hover/tag:text-indigo-500 transition-colors" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5" />
|
||||
</svg>
|
||||
物业楼宇
|
||||
</span>
|
||||
|
||||
<span class="flex items-center gap-2 px-5 py-3 lg:px-6 lg:py-3 rounded-2xl bg-slate-50 border border-slate-200 text-gray-700 text-base lg:text-lg font-bold hover:bg-white hover:border-indigo-400 hover:text-indigo-600 hover:shadow-md transition-all cursor-default group/tag">
|
||||
<svg class="w-5 h-5 text-gray-400 group-hover/tag:text-indigo-500 transition-colors" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<span class="flex items-center gap-2 px-4 py-2 rounded-xl bg-slate-50 border border-slate-200 text-gray-700 text-sm font-bold hover:bg-white hover:border-indigo-400 hover:text-indigo-600 hover:shadow-md transition-all cursor-default group/tag">
|
||||
<svg class="w-4 h-4 text-gray-400 group-hover/tag:text-indigo-500 transition-colors" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15" />
|
||||
</svg>
|
||||
梯次利用
|
||||
@@ -244,3 +343,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-24"></div>
|
||||
</section>
|
||||
|
||||
@@ -3,177 +3,212 @@
|
||||
<section id="recruitment">
|
||||
|
||||
<div class="max-w-7xl mx-auto px-4 lg:px-0">
|
||||
<div class="mb-16 relative">
|
||||
<div class="absolute top-0 left-1/2 -translate-x-1/2 w-64 h-64 bg-blue-200/30 blur-3xl rounded-full -z-10"></div>
|
||||
<div class="text-center">
|
||||
<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-blue-600 mx-auto mt-6 rounded-full"></div>
|
||||
<p class="text-gray-500 mt-6 max-w-2xl mx-auto text-lg leading-relaxed">
|
||||
生态合作，共享蓝海
|
||||
</p>
|
||||
|
||||
|
||||
<div class="space-y-16">
|
||||
|
||||
<!-- 合作优势 -->
|
||||
<div class="bg-gradient-to-br from-white to-blue-50 rounded-3xl shadow-xl p-8 md:p-12 border border-blue-100 transition-all duration-300 hover:shadow-2xl">
|
||||
<div class="text-center mb-12">
|
||||
<div class="w-20 h-20 mx-auto bg-gradient-to-r from-blue-600 to-indigo-600 rounded-full flex items-center justify-center mb-6 shadow-lg">
|
||||
<i class="fa fa-star text-white text-4xl"></i>
|
||||
</div>
|
||||
<h3 class="text-3xl font-extrabold text-gray-900 mb-4">合作优势</h3>
|
||||
<p class="text-gray-600 text-lg max-w-2xl mx-auto">与我们携手，共筑安全数字化新篇章，共享万亿级市场红利</p>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 lg:grid-cols-2 gap-12">
|
||||
|
||||
<div class="bg-white rounded-2xl shadow-xl p-8 lg:p-10 border-t-8 border-blue-600 h-full flex flex-col transition-all duration-300 hover:shadow-2xl">
|
||||
<div class="text-center mb-10">
|
||||
<div class="w-16 h-16 mx-auto bg-gradient-to-r from-blue-600 to-blue-400 rounded-full flex items-center justify-center mb-4 shadow-md">
|
||||
<i class="fa fa-star text-white text-3xl"></i>
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
|
||||
<div class="bg-white rounded-2xl p-6 border border-blue-100 shadow-sm hover:shadow-lg transition-all duration-300 hover:-translate-y-1">
|
||||
<div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center mb-5">
|
||||
<i class="fa fa-map-marker text-blue-600 text-xl"></i>
|
||||
</div>
|
||||
<h3 class="text-2xl font-extrabold text-gray-800">合作优势</h3>
|
||||
<p class="text-gray-500 mt-2">与我们携手，共筑安全数字化新篇章</p>
|
||||
<h4 class="text-xl font-bold text-gray-900 mb-3">城市独家</h4>
|
||||
<p class="text-gray-600 text-base">每个城市仅设一家合作伙伴，确保市场空间和利润最大化</p>
|
||||
</div>
|
||||
|
||||
<div class="space-y-5 flex-grow">
|
||||
|
||||
<div class="flex items-center py-4 px-4 bg-blue-50 rounded-xl border border-blue-200 transition-all duration-300 hover:shadow-lg">
|
||||
<i class="fa fa-map-marker text-blue-600 text-xl w-6 flex-shrink-0 mr-4"></i>
|
||||
<h4 class="font-bold text-gray-900 text-lg">城市独家</h4>
|
||||
<div class="bg-white rounded-2xl p-6 border border-blue-100 shadow-sm hover:shadow-lg transition-all duration-300 hover:-translate-y-1">
|
||||
<div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center mb-5">
|
||||
<i class="fa fa-bullhorn text-blue-600 text-xl"></i>
|
||||
</div>
|
||||
<h4 class="text-xl font-bold text-gray-900 mb-3">政策风口</h4>
|
||||
<p class="text-gray-600 text-base">紧跟国家数字化转型政策，抓住安全产业发展机遇</p>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center py-4 px-4 bg-blue-50 rounded-xl border border-blue-200 transition-all duration-300 hover:shadow-lg">
|
||||
<i class="fa fa-bullhorn text-blue-600 text-xl w-6 flex-shrink-0 mr-4"></i>
|
||||
<h4 class="font-bold text-gray-900 text-lg">政策风口</h4>
|
||||
<div class="bg-white rounded-2xl p-6 border border-blue-100 shadow-sm hover:shadow-lg transition-all duration-300 hover:-translate-y-1">
|
||||
<div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center mb-5">
|
||||
<i class="fa fa-line-chart text-blue-600 text-xl"></i>
|
||||
</div>
|
||||
<h4 class="text-xl font-bold text-gray-900 mb-3">市场蓝海</h4>
|
||||
<p class="text-gray-600 text-base">安全数字化市场仍处于蓝海阶段，增长空间巨大</p>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center py-4 px-4 bg-blue-50 rounded-xl border border-blue-200 transition-all duration-300 hover:shadow-lg">
|
||||
<i class="fa fa-leaf text-blue-600 text-xl w-6 flex-shrink-0 mr-4"></i>
|
||||
<h4 class="font-bold text-gray-900 text-lg">市场蓝海</h4>
|
||||
<div class="bg-white rounded-2xl p-6 border border-blue-100 shadow-sm hover:shadow-lg transition-all duration-300 hover:-translate-y-1">
|
||||
<div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center mb-5">
|
||||
<i class="fa fa-lightbulb-o text-blue-600 text-xl"></i>
|
||||
</div>
|
||||
<h4 class="text-xl font-bold text-gray-900 mb-3">轻资产运营</h4>
|
||||
<p class="text-gray-600 text-base">无需大量固定资产投入，低风险高回报的商业模式</p>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center py-4 px-4 bg-blue-50 rounded-xl border border-blue-200 transition-all duration-300 hover:shadow-lg">
|
||||
<i class="fa fa-diamond text-blue-600 text-xl w-6 flex-shrink-0 mr-4"></i>
|
||||
<h4 class="font-bold text-gray-900 text-lg">轻资产运营</h4>
|
||||
<div class="bg-white rounded-2xl p-6 border border-blue-100 shadow-sm hover:shadow-lg transition-all duration-300 hover:-translate-y-1">
|
||||
<div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center mb-5">
|
||||
<i class="fa fa-sitemap text-blue-600 text-xl"></i>
|
||||
</div>
|
||||
<h4 class="text-xl font-bold text-gray-900 mb-3">无边界客群池</h4>
|
||||
<p class="text-gray-600 text-base">覆盖全行业企业客户，客群无边界，市场潜力无限</p>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center py-4 px-4 bg-blue-50 rounded-xl border border-blue-200 transition-all duration-300 hover:shadow-lg">
|
||||
<i class="fa fa-sitemap text-blue-600 text-xl w-6 flex-shrink-0 mr-4"></i>
|
||||
<h4 class="font-bold text-gray-900 text-lg">无边界客群池</h4>
|
||||
<div class="bg-white rounded-2xl p-6 border border-blue-100 shadow-sm hover:shadow-lg transition-all duration-300 hover:-translate-y-1">
|
||||
<div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center mb-5">
|
||||
<i class="fa fa-cubes text-blue-600 text-xl"></i>
|
||||
</div>
|
||||
<h4 class="text-xl font-bold text-gray-900 mb-3">全链路赋能</h4>
|
||||
<p class="text-gray-600 text-base">提供产品培训、技术支持、营销指导等全方位赋能</p>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center py-4 px-4 bg-blue-50 rounded-xl border border-blue-200 transition-all duration-300 hover:shadow-lg">
|
||||
<i class="fa fa-line-chart text-blue-600 text-xl w-6 flex-shrink-0 mr-4"></i>
|
||||
<h4 class="font-bold text-gray-900 text-lg">管道收益</h4>
|
||||
<div class="bg-white rounded-2xl p-6 border border-blue-100 shadow-sm hover:shadow-lg transition-all duration-300 hover:-translate-y-1">
|
||||
<div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center mb-5">
|
||||
<i class="fa fa-diamond text-blue-600 text-xl"></i>
|
||||
</div>
|
||||
<h4 class="text-xl font-bold text-gray-900 mb-3">管道收益</h4>
|
||||
<p class="text-gray-600 text-base">享受长期管道收益，一次开发客户，持续受益</p>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center py-4 px-4 bg-blue-50 rounded-xl border border-blue-200 transition-all duration-300 hover:shadow-lg">
|
||||
<i class="fa fa-cubes text-blue-600 text-xl w-6 flex-shrink-0 mr-4"></i>
|
||||
<h4 class="font-bold text-gray-900 text-lg">全链路赋能</h4>
|
||||
<div class="bg-white rounded-2xl p-6 border border-blue-100 shadow-sm hover:shadow-lg transition-all duration-300 hover:-translate-y-1">
|
||||
<div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center mb-5">
|
||||
<i class="fa fa-shield text-blue-600 text-xl"></i>
|
||||
</div>
|
||||
<h4 class="text-xl font-bold text-gray-900 mb-3">技术领先</h4>
|
||||
<p class="text-gray-600 text-base">依托AI视觉大模型技术，产品竞争力强，市场认可度高</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white rounded-2xl shadow-xl p-8 lg:p-10 border h-full flex flex-col transition-all duration-300 hover:shadow-2xl">
|
||||
<div class="text-center mb-8">
|
||||
<i class="fa fa-handshake-o text-blue-600 text-5xl mb-4"></i>
|
||||
<h3 class="text-2xl font-extrabold text-gray-800">目标招商对象</h3>
|
||||
<p class="text-gray-500 mt-2">我们正在寻找以下类型的合作伙伴</p>
|
||||
<!-- 目标招商对象 -->
|
||||
<div class="bg-gradient-to-br from-white to-indigo-50 rounded-3xl shadow-xl p-8 md:p-12 border border-indigo-100 transition-all duration-300 hover:shadow-2xl">
|
||||
<div class="text-center mb-12">
|
||||
<div class="w-20 h-20 mx-auto bg-gradient-to-r from-indigo-600 to-purple-600 rounded-full flex items-center justify-center mb-6 shadow-lg">
|
||||
<i class="fa fa-handshake-o text-white text-4xl"></i>
|
||||
</div>
|
||||
<h3 class="text-3xl font-extrabold text-gray-900 mb-4">我们需要找的合作伙伴</h3>
|
||||
<p class="text-gray-600 text-lg max-w-2xl mx-auto">寻找志同道合的合作伙伴，共同开创安全数字化新时代</p>
|
||||
</div>
|
||||
|
||||
<div class="flex-grow">
|
||||
|
||||
<div class="space-y-6 mb-6">
|
||||
<h4 class="font-bold text-xl text-gray-800 mb-4">目标招商对象</h4>
|
||||
|
||||
<div class="bg-blue-50 p-4 rounded-xl border border-blue-200 transition-all duration-300 hover:shadow-md">
|
||||
<h5 class="font-bold text-gray-900 mb-2 flex items-center gap-1 text-base">
|
||||
<span class="text-blue-600 font-extrabold">1.</span> 本地企业服务机构
|
||||
</h5>
|
||||
<div class="flex flex-wrap gap-1 mb-2">
|
||||
<span class="text-xs font-medium px-2 py-0.5 rounded-full bg-blue-200 text-blue-800">财税公司</span>
|
||||
<span class="text-xs font-medium px-2 py-0.5 rounded-full bg-blue-200 text-blue-800">人力资源服务商</span>
|
||||
<span class="text-xs font-medium px-2 py-0.5 rounded-full bg-blue-200 text-blue-800">产业园运营方</span>
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
|
||||
<div class="bg-white rounded-2xl p-7 border border-indigo-100 shadow-sm hover:shadow-lg transition-all duration-300 hover:-translate-y-1">
|
||||
<div class="flex items-start gap-4 mb-5">
|
||||
<div class="w-10 h-10 bg-indigo-100 rounded-lg flex items-center justify-center flex-shrink-0">
|
||||
<span class="text-indigo-600 font-bold text-xl">1</span>
|
||||
</div>
|
||||
<p class="text-base text-gray-600">可依托现有企业客群快速转化。</p>
|
||||
<h4 class="text-xl font-bold text-gray-900">本地资源代理商</h4>
|
||||
</div>
|
||||
<div class="flex flex-wrap gap-2 mb-4">
|
||||
<span class="text-xs font-medium px-3 py-1 rounded-full bg-indigo-200 text-indigo-800">区域代理商</span>
|
||||
<span class="text-xs font-medium px-3 py-1 rounded-full bg-indigo-200 text-indigo-800">渠道合作伙伴</span>
|
||||
<span class="text-xs font-medium px-3 py-1 rounded-full bg-indigo-200 text-indigo-800">本地资源商</span>
|
||||
<span class="text-xs font-medium px-3 py-1 rounded-full bg-indigo-200 text-indigo-800">行业协会</span>
|
||||
</div>
|
||||
<p class="text-gray-600 text-base">手握本地企业资源，熟悉当地市场，可以通过代理商加盟模式与我们合作，共同推广产品。</p>
|
||||
</div>
|
||||
|
||||
<div class="bg-blue-50 p-4 rounded-xl border border-blue-200 transition-all duration-300 hover:shadow-md">
|
||||
<h5 class="font-bold text-gray-900 mb-2 flex items-center gap-1 text-base">
|
||||
<span class="text-blue-600 font-extrabold">2.</span> 安全领域从业者
|
||||
</h5>
|
||||
<div class="flex flex-wrap gap-1 mb-2">
|
||||
<span class="text-xs font-medium px-2 py-0.5 rounded-full bg-blue-200 text-blue-800">前安全监管人员</span>
|
||||
<span class="text-xs font-medium px-2 py-0.5 rounded-full bg-blue-200 text-blue-800">安全咨询顾问</span>
|
||||
<span class="text-xs font-medium px-2 py-0.5 rounded-full bg-blue-200 text-blue-800">消防工程商</span>
|
||||
<div class="bg-white rounded-2xl p-7 border border-indigo-100 shadow-sm hover:shadow-lg transition-all duration-300 hover:-translate-y-1">
|
||||
<div class="flex items-start gap-4 mb-5">
|
||||
<div class="w-10 h-10 bg-indigo-100 rounded-lg flex items-center justify-center flex-shrink-0">
|
||||
<span class="text-indigo-600 font-bold text-xl">2</span>
|
||||
</div>
|
||||
<p class="text-base text-gray-600">具备行业资源与专业认知。</p>
|
||||
<h4 class="text-xl font-bold text-gray-900">行业领域专家</h4>
|
||||
</div>
|
||||
<div class="flex flex-wrap gap-2 mb-4">
|
||||
<span class="text-xs font-medium px-3 py-1 rounded-full bg-indigo-200 text-indigo-800">化工行业专家</span>
|
||||
<span class="text-xs font-medium px-3 py-1 rounded-full bg-indigo-200 text-indigo-800">制造业顾问</span>
|
||||
<span class="text-xs font-medium px-3 py-1 rounded-full bg-indigo-200 text-indigo-800">行业分析师</span>
|
||||
<span class="text-xs font-medium px-3 py-1 rounded-full bg-indigo-200 text-indigo-800">技术顾问</span>
|
||||
</div>
|
||||
<p class="text-gray-600 text-base">了解特定行业领域，如化工、制造等，具备专业知识和行业经验，能够在细分领域推广我们的产品。</p>
|
||||
</div>
|
||||
|
||||
<div class="bg-blue-50 p-4 rounded-xl border border-blue-200 transition-all duration-300 hover:shadow-md">
|
||||
<h5 class="font-bold text-gray-900 mb-2 flex items-center gap-1 text-base">
|
||||
<span class="text-blue-600 font-extrabold">3.</span> 创业转型者
|
||||
</h5>
|
||||
<div class="flex flex-wrap gap-1 mb-2">
|
||||
<span class="text-xs font-medium px-2 py-0.5 rounded-full bg-blue-200 text-blue-800">个体创业者</span>
|
||||
<span class="text-xs font-medium px-2 py-0.5 rounded-full bg-blue-200 text-blue-800">传统行业经营者</span>
|
||||
<div class="bg-white rounded-2xl p-7 border border-indigo-100 shadow-sm hover:shadow-lg transition-all duration-300 hover:-translate-y-1">
|
||||
<div class="flex items-start gap-4 mb-5">
|
||||
<div class="w-10 h-10 bg-indigo-100 rounded-lg flex items-center justify-center flex-shrink-0">
|
||||
<span class="text-indigo-600 font-bold text-xl">3</span>
|
||||
</div>
|
||||
<p class="text-base text-gray-600">寻求低门槛、高潜力项目，或计划拓展新业务。</p>
|
||||
<h4 class="text-xl font-bold text-gray-900">园区企业负责人</h4>
|
||||
</div>
|
||||
<div class="flex flex-wrap gap-2 mb-4">
|
||||
<span class="text-xs font-medium px-3 py-1 rounded-full bg-indigo-200 text-indigo-800">工厂老板</span>
|
||||
<span class="text-xs font-medium px-3 py-1 rounded-full bg-indigo-200 text-indigo-800">园区负责人</span>
|
||||
<span class="text-xs font-medium px-3 py-1 rounded-full bg-indigo-200 text-indigo-800">企业高管</span>
|
||||
<span class="text-xs font-medium px-3 py-1 rounded-full bg-indigo-200 text-indigo-800">安全负责人</span>
|
||||
</div>
|
||||
<p class="text-gray-600 text-base">产业园区、工厂的负责人，对安全管理有高度重视，希望通过数字化手段提升安全管理水平。</p>
|
||||
</div>
|
||||
|
||||
<div class="bg-blue-50 p-4 rounded-xl border border-blue-200 transition-all duration-300 hover:shadow-md">
|
||||
<h5 class="font-bold text-gray-900 mb-2 flex items-center gap-1 text-base">
|
||||
<span class="text-blue-600 font-extrabold">4.</span> 异业渠道商
|
||||
</h5>
|
||||
<div class="flex flex-wrap gap-1 mb-2">
|
||||
<span class="text-xs font-medium px-2 py-0.5 rounded-full bg-blue-200 text-blue-800">办公软件代理商</span>
|
||||
<span class="text-xs font-medium px-2 py-0.5 rounded-full bg-blue-200 text-blue-800">工业设备供应商</span>
|
||||
<div class="bg-white rounded-2xl p-7 border border-indigo-100 shadow-sm hover:shadow-lg transition-all duration-300 hover:-translate-y-1">
|
||||
<div class="flex items-start gap-4 mb-5">
|
||||
<div class="w-10 h-10 bg-indigo-100 rounded-lg flex items-center justify-center flex-shrink-0">
|
||||
<span class="text-indigo-600 font-bold text-xl">4</span>
|
||||
</div>
|
||||
<p class="text-base text-gray-600">可通过产品捆绑实现客群互补。</p>
|
||||
<h4 class="text-xl font-bold text-gray-900">数字化转型服务商</h4>
|
||||
</div>
|
||||
<div class="flex flex-wrap gap-2 mb-4">
|
||||
<span class="text-xs font-medium px-3 py-1 rounded-full bg-indigo-200 text-indigo-800">SaaS 服务商</span>
|
||||
<span class="text-xs font-medium px-3 py-1 rounded-full bg-indigo-200 text-indigo-800">软件开发商</span>
|
||||
<span class="text-xs font-medium px-3 py-1 rounded-full bg-indigo-200 text-indigo-800">系统集成商</span>
|
||||
<span class="text-xs font-medium px-3 py-1 rounded-full bg-indigo-200 text-indigo-800">IT 服务商</span>
|
||||
</div>
|
||||
<p class="text-gray-600 text-base">从事过 SaaS 化或本地化定制转型，有成熟的项目经验和方案能力，能够与我们的产品形成互补。</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-16">
|
||||
<div class="bg-white rounded-2xl shadow-xl p-8 lg:p-10 border h-full transition-all duration-300 hover:shadow-2xl">
|
||||
<div class="text-center mb-10">
|
||||
<h3 class="text-3xl font-extrabold text-gray-800 inline-block">合作流程</h3>
|
||||
<!-- 合作流程 -->
|
||||
<div class="bg-gradient-to-br from-white to-purple-50 rounded-3xl shadow-xl p-8 md:p-12 border border-purple-100 transition-all duration-300 hover:shadow-2xl">
|
||||
<div class="text-center mb-12">
|
||||
<div class="w-20 h-20 mx-auto bg-gradient-to-r from-purple-600 to-pink-600 rounded-full flex items-center justify-center mb-6 shadow-lg">
|
||||
<i class="fa fa-sitemap text-white text-4xl"></i>
|
||||
</div>
|
||||
<h3 class="text-3xl font-extrabold text-gray-900 mb-4">合作流程</h3>
|
||||
<p class="text-gray-600 text-lg max-w-2xl mx-auto">简单高效的合作流程，快速启动您的安全数字化事业</p>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-4 gap-6 relative">
|
||||
<div class="hidden md:block absolute top-[60px] left-[15%] right-[15%] h-1 bg-blue-300 z-0"></div>
|
||||
<div class="relative">
|
||||
<div class="hidden md:block absolute top-1/2 left-0 right-0 h-1 bg-purple-200 -translate-y-1/2 z-0"></div>
|
||||
|
||||
<div class="relative flex flex-col items-center text-center p-4 pt-6 rounded-lg bg-blue-50 border border-blue-200 shadow-md transition-all duration-300 hover:shadow-lg z-10">
|
||||
<span class="w-10 h-10 rounded-full bg-blue-600 text-white flex items-center justify-center font-bold text-lg mb-3 shadow-lg">1</span>
|
||||
<p class="font-semibold text-gray-900 text-base">提交申请意向</p>
|
||||
<p class="text-sm text-gray-600 mt-1">通过官网或商务渠道<br>提交初步合作申请</p>
|
||||
<div class="grid grid-cols-1 md:grid-cols-4 gap-8 relative z-10">
|
||||
<div class="flex flex-col items-center text-center bg-white rounded-2xl p-6 border border-purple-100 shadow-sm hover:shadow-lg transition-all duration-300 hover:-translate-y-1">
|
||||
<div class="w-16 h-16 bg-purple-600 text-white rounded-full flex items-center justify-center font-bold text-2xl mb-5 shadow-lg">1</div>
|
||||
<h4 class="text-xl font-bold text-gray-900 mb-3">咨询沟通</h4>
|
||||
<p class="text-gray-600 text-base">通过电话或在线咨询，了解合作详情和条件</p>
|
||||
</div>
|
||||
|
||||
<div class="relative flex flex-col items-center text-center p-4 pt-6 rounded-lg bg-blue-50 border border-blue-200 shadow-md transition-all duration-300 hover:shadow-lg z-10">
|
||||
<span class="w-10 h-10 rounded-full bg-blue-600 text-white flex items-center justify-center font-bold text-lg mb-3 shadow-lg">2</span>
|
||||
<p class="font-semibold text-gray-900 text-base">资质审核与洽谈</p>
|
||||
<p class="text-sm text-gray-600 mt-1">总部对资质、能力、规划<br>进行审核和洽谈</p>
|
||||
<div class="flex flex-col items-center text-center bg-white rounded-2xl p-6 border border-purple-100 shadow-sm hover:shadow-lg transition-all duration-300 hover:-translate-y-1">
|
||||
<div class="w-16 h-16 bg-purple-600 text-white rounded-full flex items-center justify-center font-bold text-2xl mb-5 shadow-lg">2</div>
|
||||
<h4 class="text-xl font-bold text-gray-900 mb-3">资质审核</h4>
|
||||
<p class="text-gray-600 text-base">提交合作申请，总部对资质进行审核评估</p>
|
||||
</div>
|
||||
|
||||
<div class="relative flex flex-col items-center text-center p-4 pt-6 rounded-lg bg-blue-50 border border-blue-200 shadow-md transition-all duration-300 hover:shadow-lg z-10">
|
||||
<span class="w-10 h-10 rounded-full bg-blue-600 text-white flex items-center justify-center font-bold text-lg mb-3 shadow-lg">3</span>
|
||||
<p class="font-semibold text-gray-900 text-base">签署合作协议</p>
|
||||
<p class="text-sm text-gray-600 mt-1">双方达成一致<br>签订正式的代理或合作协议</p>
|
||||
<div class="flex flex-col items-center text-center bg-white rounded-2xl p-6 border border-purple-100 shadow-sm hover:shadow-lg transition-all duration-300 hover:-translate-y-1">
|
||||
<div class="w-16 h-16 bg-purple-600 text-white rounded-full flex items-center justify-center font-bold text-2xl mb-5 shadow-lg">3</div>
|
||||
<h4 class="text-xl font-bold text-gray-900 mb-3">签约合作</h4>
|
||||
<p class="text-gray-600 text-base">双方达成一致，签署正式合作协议</p>
|
||||
</div>
|
||||
|
||||
<div class="relative flex flex-col items-center text-center p-4 pt-6 rounded-lg bg-blue-50 border border-blue-200 shadow-md transition-all duration-300 hover:shadow-lg z-10">
|
||||
<span class="w-10 h-10 rounded-full bg-blue-600 text-white flex items-center justify-center font-bold text-lg mb-3 shadow-lg">4</span>
|
||||
<p class="font-semibold text-gray-900 text-base">授权与培训启动</p>
|
||||
<p class="text-sm text-gray-600 mt-1">提供独家区域授权<br>系统培训及全方位赋能</p>
|
||||
<div class="flex flex-col items-center text-center bg-white rounded-2xl p-6 border border-purple-100 shadow-sm hover:shadow-lg transition-all duration-300 hover:-translate-y-1">
|
||||
<div class="w-16 h-16 bg-purple-600 text-white rounded-full flex items-center justify-center font-bold text-2xl mb-5 shadow-lg">4</div>
|
||||
<h4 class="text-xl font-bold text-gray-900 mb-3">培训启动</h4>
|
||||
<p class="text-gray-600 text-base">接受产品培训和技术指导，正式启动业务</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="text-center mt-10">
|
||||
<div class="flex flex-col sm:flex-row justify-center items-center gap-6">
|
||||
<a href="docs/合作申请表.xlsx" download="合作申请表.xlsx" class="w-full sm:w-auto inline-flex items-center justify-center bg-blue-600 hover:bg-blue-700 text-white px-8 py-3 rounded-full font-medium transition-all duration-300 shadow-xl hover:shadow-2xl">
|
||||
<i class="fa fa-download mr-2"></i> 下载申请表格
|
||||
</a>
|
||||
<div class="text-center text-sm">
|
||||
<span class="font-semibold text-gray-700 block sm:inline">发送至:</span>
|
||||
<a href="mailto:zjbeifan@126.com" class="text-blue-600 font-bold ml-1 hover:text-blue-700 transition">zjbeifan@126.com</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-center mt-16">
|
||||
<div class="inline-flex items-center gap-3 px-8 py-4 bg-purple-600 text-white rounded-full font-bold text-xl shadow-lg hover:bg-purple-700 hover:shadow-xl transition-all duration-300 hover:-translate-y-1">
|
||||
<i class="fa fa-phone"></i>
|
||||
<a href="tel:400-998-5710" class="text-white hover:text-white">立即拨打 400-998-5710</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-24"></div>
|
||||
|
||||
Reference in New Issue
Block a user