Compare commits
11 Commits
cb1490d5a2
...
main
| Author | SHA1 | Date | |
|---|---|---|---|
a126191f1d
|
|||
|
5a869df8f6
|
|||
|
0354c5e400
|
|||
|
f815664ca6
|
|||
|
9d591f123d
|
|||
|
027f9906a1
|
|||
|
b5ad85d899
|
|||
|
0f5cb55f27
|
|||
|
6fa2fa4c36
|
|||
|
169b8f929f
|
|||
|
e26b2c7d9c
|
201
AGENTS.md
Normal file
201
AGENTS.md
Normal file
@@ -0,0 +1,201 @@
|
||||
# AGENTS.md
|
||||
|
||||
This file provides guidelines for agentic coding agents working in this repository.
|
||||
|
||||
## Tech Stack
|
||||
|
||||
- **Framework**: Astro 5.7.3 - Static site generator
|
||||
- **Styling**: Tailwind CSS 3.4.19 with custom theme
|
||||
- **Package Manager**: pnpm 10.29.2
|
||||
- **TypeScript**: 5.9.3 with @astrojs/check
|
||||
- **Icons**: FontAwesome 4.7.0 (CDN)
|
||||
|
||||
## Build & Development Commands
|
||||
|
||||
```bash
|
||||
# Development
|
||||
pnpm dev # Start dev server at http://localhost:4321
|
||||
pnpm start # Alias for pnpm dev
|
||||
|
||||
# Build & Quality
|
||||
pnpm build # Run astro check then build (production)
|
||||
pnpm preview # Preview production build locally
|
||||
|
||||
# Direct Astro commands
|
||||
pnpm astro <command> # Run any astro command directly
|
||||
```
|
||||
|
||||
**Note**: No test framework is currently configured. When adding tests, first check with the maintainers.
|
||||
|
||||
## Project Structure
|
||||
|
||||
```
|
||||
src/
|
||||
├── layouts/Layout.astro # Main layout with navigation
|
||||
├── pages/ # Route pages (use .astro files)
|
||||
│ ├── index.astro # Home page
|
||||
│ └── [route]/index.astro
|
||||
├── components/
|
||||
│ └── sections/ # Reusable section components
|
||||
└── styles/styles.css # Global styles
|
||||
```
|
||||
|
||||
## Code Style Guidelines
|
||||
|
||||
### Astro Components
|
||||
|
||||
- File extension: `.astro`
|
||||
- Frontmatter uses `---` delimiters
|
||||
- Import components at the top of the frontmatter section
|
||||
- Use TypeScript for type annotations in frontmatter and `<script>` tags
|
||||
|
||||
```astro
|
||||
---
|
||||
import { someComponent } from '../components/some-component.astro';
|
||||
|
||||
interface Props {
|
||||
title: string;
|
||||
activeNav?: string;
|
||||
}
|
||||
|
||||
const { title, activeNav = 'home' } = Astro.props;
|
||||
---
|
||||
```
|
||||
|
||||
### Imports
|
||||
|
||||
- Import Astro components with relative paths: `import Component from '../components/Component.astro'`
|
||||
- Import external libraries normally: `import { defineConfig } from 'astro/config'`
|
||||
- No default exports in components (Astro handles this)
|
||||
|
||||
### Styling with Tailwind CSS
|
||||
|
||||
- Use Tailwind utility classes for all styling
|
||||
- Custom colors available: `primary` (#165DFF), `secondary` (#36D399), `dark` (#1E293B), `light` (#F8FAFC)
|
||||
- Custom font family: `font-inter` (Inter, system-ui, sans-serif)
|
||||
- Responsive design: mobile-first approach with `md:`, `lg:` breakpoints
|
||||
- Hover states: `hover:`, `group-hover:`
|
||||
- Transitions: `transition-all duration-300` for consistent animation timing
|
||||
|
||||
### Naming Conventions
|
||||
|
||||
- **Components**: PascalCase (e.g., `Hero.astro`, `DataVisualization.astro`)
|
||||
- **Pages**: index.astro in route directories
|
||||
- **Props**: camelCase (e.g., `activeNav`, `title`)
|
||||
- **IDs for CSS/JS**: kebab-case (e.g., `data-visualization`, `contact-info`)
|
||||
- **CSS classes**: Tailwind utilities only (custom classes in `<style>` tags for animations)
|
||||
- **Functions**: camelCase (e.g., `getNavLinkClass`)
|
||||
|
||||
### Layout Pattern
|
||||
|
||||
- All pages use `<Layout>` component with `activeNav` prop for navigation highlighting
|
||||
- Navigation items defined in Layout.astro: home, qazk, customization, partnership
|
||||
- Main content wrapped in `<main>` tag
|
||||
|
||||
```astro
|
||||
<Layout title="Page Title" activeNav="nav-id">
|
||||
<main>
|
||||
<Content />
|
||||
</main>
|
||||
</Layout>
|
||||
```
|
||||
|
||||
### Scripts
|
||||
|
||||
- Inline scripts: use `<script is:inline>` for critical initialization
|
||||
- Regular scripts: use `<script>` tag without attributes
|
||||
- Wrap in IIFE to avoid global scope pollution: `(function() { ... })();`
|
||||
- Use TypeScript annotations in script tags
|
||||
- Event listeners: use `{ passive: true }` for scroll events where applicable
|
||||
|
||||
### TypeScript
|
||||
|
||||
- Enable type checking by running `astro check` before builds
|
||||
- Use interfaces for component props
|
||||
- Type DOM elements with assertions when needed: `(element as HTMLElement)`
|
||||
|
||||
### Accessibility
|
||||
|
||||
- Use semantic HTML: `<section>`, `<header>`, `<nav>`, `<main>`, `<footer>`
|
||||
- Include `alt` attributes on images
|
||||
- Use ARIA labels where needed
|
||||
- Ensure keyboard navigation works
|
||||
|
||||
### Images
|
||||
|
||||
- Prefer WebP format for images: `image.webp`
|
||||
- Place images in `public/img/` directory
|
||||
- Reference with absolute paths: `/img/image.webp`
|
||||
- Use responsive sizing classes: `w-full h-full object-cover`
|
||||
|
||||
### Color Usage
|
||||
|
||||
- Primary actions: `bg-primary` (#165DFF)
|
||||
- Secondary/success: `text-secondary` (#36D399)
|
||||
- Backgrounds: `bg-slate-50`, `bg-white`, `bg-dark`
|
||||
- Text: `text-gray-900`, `text-gray-600`, `text-white`
|
||||
- Gradients: `bg-gradient-to-r from-blue-600 to-indigo-600`
|
||||
|
||||
### Icons
|
||||
|
||||
- Use FontAwesome 4.7.0 via CDN
|
||||
- Class pattern: `fa fa-icon-name`
|
||||
- Size classes: `text-lg`, `text-xl`, `text-2xl`
|
||||
|
||||
### Animation Patterns
|
||||
|
||||
- Use Tailwind `transition-all duration-300` for consistent animations
|
||||
- Hover effects: `group-hover:scale-[1.02]`, `hover:shadow-lg`
|
||||
- Keyframe animations in `<style>` tags for complex animations
|
||||
- Fade/scale transforms common
|
||||
|
||||
### Responsive Design
|
||||
|
||||
- Mobile-first approach
|
||||
- Breakpoints: `sm:` (640px), `md:` (768px), `lg:` (1024px)
|
||||
- Hidden elements: `hidden lg:block` (hide on mobile)
|
||||
- Container: `max-w-7xl mx-auto px-4 lg:px-0`
|
||||
- Grid layouts: `grid-cols-1 md:grid-cols-2 lg:grid-cols-4`
|
||||
|
||||
### Error Handling
|
||||
|
||||
- Astro handles most errors at build time
|
||||
- Graceful degradation for optional features
|
||||
- Check for element existence before DOM manipulation: `if (element) { ... }`
|
||||
|
||||
### File Organization
|
||||
|
||||
- Keep components focused and single-purpose
|
||||
- Section components in `src/components/sections/`
|
||||
- Each page imports its required sections
|
||||
- Shared layout handles navigation and footer
|
||||
- Static assets in `public/` directory
|
||||
|
||||
## Adding New Pages
|
||||
|
||||
1. Create directory in `src/pages/[route]/`
|
||||
2. Create `index.astro` file
|
||||
3. Import `Layout` and use appropriate `activeNav` value
|
||||
4. Add navigation item to `Layout.astro`'s `navItems` array
|
||||
5. Import and render section components as needed
|
||||
|
||||
## Adding New Section Components
|
||||
|
||||
1. Create `.astro` file in `src/components/sections/`
|
||||
2. Use PascalCase naming
|
||||
3. Export component (Astro handles this automatically)
|
||||
4. Import in pages where needed
|
||||
5. Use semantic `<section>` tag with ID for navigation
|
||||
6. Follow Tailwind styling patterns
|
||||
|
||||
## Environment Variables
|
||||
|
||||
- Store in `.env` file
|
||||
- Access in Astro frontmatter: `import.meta.env.VARIABLE_NAME`
|
||||
- Commit `.env.example` if needed (currently not present)
|
||||
|
||||
## Deployment
|
||||
|
||||
- Build output: `dist/` directory
|
||||
- Static site generation - deploy to any static hosting
|
||||
- No server-side rendering requirements
|
||||
17
README.md
17
README.md
@@ -35,7 +35,9 @@ beifan.cn/
|
||||
│ ├── components/
|
||||
│ │ ├── sections/
|
||||
│ │ │ ├── Hero.astro # Hero 区域组件
|
||||
│ │ │ ├── Timeline.astro # 公司发展时间轴组件
|
||||
│ │ │ ├── CompanyIntro.astro # 公司介绍组件
|
||||
│ │ │ ├── DevelopmentHistory.astro # 发展历程组件
|
||||
│ │ │ ├── DataVisualization.astro # 数据可视化组件
|
||||
│ │ │ ├── Honors.astro # 公司荣誉资质组件
|
||||
│ │ │ ├── Contact.astro # 联系方式组件
|
||||
│ │ │ ├── SaaS.astro # SaaS化系统组件
|
||||
@@ -51,6 +53,9 @@ beifan.cn/
|
||||
│ └── styles.css # 全局样式
|
||||
├── public/ # 静态资源
|
||||
│ ├── img/ # 图片资源
|
||||
│ │ ├── partner-search.webp # 合作伙伴搜索图片
|
||||
│ │ ├── cooperation-process.webp # 合作流程图片
|
||||
│ │ └── shake-hands.webp # 握手合作图片
|
||||
│ ├── js/
|
||||
│ │ └── script.js # JavaScript 文件
|
||||
│ ├── docs/
|
||||
@@ -74,8 +79,10 @@ beifan.cn/
|
||||
|
||||
包含以下内容区块：
|
||||
- **Hero 区域**：全场景产业数字化转型服务介绍
|
||||
- **公司介绍**：浙江贝凡发展历程时间轴
|
||||
- **公司荣誉资质**：企业资质展示
|
||||
- **公司介绍**：公司基本信息和发展理念
|
||||
- **发展历程**：浙江贝凡发展历程时间轴
|
||||
- **数据可视化**：企业关键数据展示（视觉理解大模型、SLA可用性、合作伙伴、软著专利）
|
||||
- **生态合作**：合作伙伴展示
|
||||
- **联系我们**：联系方式展示
|
||||
- **页脚**：版权信息、ICP备案等
|
||||
|
||||
@@ -98,7 +105,9 @@ beifan.cn/
|
||||
### 4. 生态合作页面 - `/partnership`
|
||||
|
||||
包含以下内容区块：
|
||||
- **生态合作**：合作伙伴信息
|
||||
- **携手合作，共创未来，共享市场红利**：合作优势卡片（包含8个合作优势）
|
||||
- **我们需要找的合作伙伴**：目标招商对象卡片（包含4类合作伙伴）
|
||||
- **合作流程**：合作流程卡片（包含4步合作流程）
|
||||
- **页脚**：版权信息、ICP备案等
|
||||
|
||||
### 4. 独立产品页面（Intro）
|
||||
|
||||
BIN
public/img/cooperation-process.webp
Normal file
BIN
public/img/cooperation-process.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 49 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 42 KiB After Width: | Height: | Size: 73 KiB |
BIN
public/img/official-traceability.jpg
Normal file
BIN
public/img/official-traceability.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 76 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 54 KiB |
BIN
public/img/partner-search.webp
Normal file
BIN
public/img/partner-search.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 75 KiB |
BIN
public/img/product-customization-3.webp
Normal file
BIN
public/img/product-customization-3.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 160 KiB |
BIN
public/img/product-customization-4.webp
Normal file
BIN
public/img/product-customization-4.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 129 KiB |
BIN
public/img/product-customization-5.webp
Normal file
BIN
public/img/product-customization-5.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 84 KiB |
BIN
public/img/product-customization-6.webp
Normal file
BIN
public/img/product-customization-6.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 84 KiB |
BIN
public/img/product-customization-7.webp
Normal file
BIN
public/img/product-customization-7.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 93 KiB |
BIN
public/img/product-customization-8.webp
Normal file
BIN
public/img/product-customization-8.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 79 KiB |
BIN
public/img/shake-hands.webp
Normal file
BIN
public/img/shake-hands.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 82 KiB |
@@ -318,8 +318,8 @@
|
||||
技术对比：从固定规则到深度理解
|
||||
</h3>
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-8 mb-16">
|
||||
<div class="space-y-6">
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 mb-16">
|
||||
<div class="space-y-6 bg-orange-50 p-6">
|
||||
<div class="flex items-center gap-3 mb-6">
|
||||
<div class="w-10 h-10 bg-orange-500 rounded-xl flex items-center justify-center">
|
||||
<i class="fa fa-times text-white text-lg"></i>
|
||||
@@ -349,7 +349,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="space-y-6">
|
||||
<div class="space-y-6 bg-blue-50 p-6">
|
||||
<div class="flex items-center gap-3 mb-6">
|
||||
<div class="w-10 h-10 bg-blue-600 rounded-xl flex items-center justify-center">
|
||||
<i class="fa fa-check text-white text-lg"></i>
|
||||
@@ -360,7 +360,7 @@
|
||||
<div class="bg-blue-600 p-6 rounded-2xl border-2 border-blue-700 shadow-lg shadow-blue-100">
|
||||
<h5 class="text-lg font-bold text-white mb-3">1. 场景识别</h5>
|
||||
<p class="text-blue-100 leading-relaxed">
|
||||
模拟人类视觉进行理解，能<span class="font-semibold text-white">自主适应复杂、多变的环境</span>，准确识别目标。
|
||||
模拟人类视觉理解，能<span class="font-semibold text-white">自主适应复杂、多变的环境</span>，准确识别目标。
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
---
|
||||
<section class="py-0 md:py-16 bg-slate-50 overflow-hidden">
|
||||
<section class="pt-0 md:pt-16 bg-slate-50 overflow-hidden">
|
||||
<div class="max-w-7xl mx-auto relative">
|
||||
|
||||
<div class="text-center mb-12 relative">
|
||||
@@ -135,7 +135,7 @@
|
||||
<div class="space-y-4 flex-grow">
|
||||
<div class="bg-blue-50/50 p-4 rounded-xl border border-blue-100">
|
||||
<h5 class="font-bold text-blue-600 text-sm mb-1 uppercase">事故原因 · ROOT CAUSE</h5>
|
||||
<p class="text-base text-gray-700 leading-relaxed">架空层停放的<span class="text-blue-600 font-semibold">违规改装电动自行车</span>热失控起火。</p>
|
||||
<p class="text-base text-gray-700 leading-relaxed">停放的<span class="text-blue-600 font-semibold">违规改装电动自行车</span>热失控起火。</p>
|
||||
</div>
|
||||
<div class="bg-red-50/50 p-4 rounded-xl border border-red-100">
|
||||
<h5 class="font-bold text-red-600 text-sm mb-1 uppercase">损失情况 · IMPACT</h5>
|
||||
@@ -156,7 +156,7 @@
|
||||
<div class="space-y-4 flex-grow">
|
||||
<div class="bg-blue-50/50 p-4 rounded-xl border border-blue-100">
|
||||
<h5 class="font-bold text-blue-600 text-sm mb-1 uppercase">事故原因 · ROOT CAUSE</h5>
|
||||
<p class="text-base text-gray-700 leading-relaxed">违规带压密封操作引发爆炸；设备安全管理<span class="text-blue-600 font-semibold">缺失</span>。</p>
|
||||
<p class="text-base text-gray-700 leading-relaxed">违规带压密封操作引发爆炸，安全管理<span class="text-blue-600 font-semibold">缺失</span>。</p>
|
||||
</div>
|
||||
<div class="bg-red-50/50 p-4 rounded-xl border border-red-100">
|
||||
<h5 class="font-bold text-red-600 text-sm mb-1 uppercase">损失情况 · IMPACT</h5>
|
||||
|
||||
@@ -1,13 +1,12 @@
|
||||
<section id="about-us" class="bg-slate-50">
|
||||
<div class="relative pb-20">
|
||||
<div class="relative pt-16 pb-0">
|
||||
<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>
|
||||
<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>
|
||||
@@ -35,51 +34,6 @@
|
||||
</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>
|
||||
|
||||
@@ -12,22 +12,11 @@
|
||||
<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="relative overflow-hidden rounded-2xl shadow-[0_20px_50px_rgba(79,70,229,0.2)] border border-white">
|
||||
<div id="slider-container" class="flex transition-transform duration-1000 ease-in-out" style="width: 200%;">
|
||||
<div class="w-1/2 relative">
|
||||
<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="relative overflow-hidden rounded-2xl shadow-[0_20px_50px_rgba(79,70,229,0.2)] border border-white aspect-video">
|
||||
<img id="slider-image" src="/img/product-customization-1.webp" alt="园区IOC" class="w-full h-full object-cover transition-opacity duration-500">
|
||||
<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 class="w-1/2 relative">
|
||||
<img src="/img/product-customization-2.webp" alt="数字孪生" 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">数字孪生</p>
|
||||
</div>
|
||||
</div>
|
||||
<p id="slider-text" class="text-sm font-bold tracking-widest opacity-80 uppercase">园区IOC</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -91,8 +80,8 @@
|
||||
<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 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-6 rounded-[2rem] border border-slate-100 shadow-sm hover:shadow-xl hover:border-indigo-200 transition-all duration-500 flex flex-col">
|
||||
@@ -112,8 +101,8 @@
|
||||
<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 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-6 rounded-[2rem] border border-slate-100 shadow-sm hover:shadow-xl hover:border-indigo-200 transition-all duration-500 flex flex-col">
|
||||
@@ -130,11 +119,11 @@
|
||||
</div>
|
||||
<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>
|
||||
<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 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-6 rounded-[2rem] border border-slate-100 shadow-sm hover:shadow-xl hover:border-indigo-200 transition-all duration-500 flex flex-col">
|
||||
@@ -150,12 +139,12 @@
|
||||
<h4 class="text-xl font-black text-gray-900">智慧养老</h4>
|
||||
</div>
|
||||
<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>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">智能护理</span>
|
||||
<span class="text-indigo-600 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-6 rounded-[2rem] border border-slate-100 shadow-sm hover:shadow-xl hover:border-indigo-200 transition-all duration-500 flex flex-col">
|
||||
@@ -171,12 +160,12 @@
|
||||
<h4 class="text-xl font-black text-gray-900">城市政务</h4>
|
||||
</div>
|
||||
<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>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">政务服务</span>
|
||||
<span class="text-indigo-600 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-6 rounded-[2rem] border border-slate-100 shadow-sm hover:shadow-xl hover:border-indigo-200 transition-all duration-500 flex flex-col">
|
||||
@@ -193,11 +182,11 @@
|
||||
</div>
|
||||
<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>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">轨迹追踪</span>
|
||||
<span class="text-indigo-600 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-6 rounded-[2rem] border border-slate-100 shadow-sm hover:shadow-xl hover:border-indigo-200 transition-all duration-500 flex flex-col">
|
||||
@@ -215,11 +204,11 @@
|
||||
</div>
|
||||
<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>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">智能导览</span>
|
||||
<span class="text-indigo-600 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-6 rounded-[2rem] border border-slate-100 shadow-sm hover:shadow-xl hover:border-indigo-200 transition-all duration-500 flex flex-col">
|
||||
@@ -235,12 +224,12 @@
|
||||
<h4 class="text-xl font-black text-gray-900">医疗健康</h4>
|
||||
</div>
|
||||
<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>
|
||||
<span class="text-indigo-600 border border-indigo-200 px-1.5 py-0.5 rounded-md">远程医疗</span>
|
||||
<span class="text-indigo-600 px-1.5 py-0.5 rounded-md">...</span>
|
||||
</div>
|
||||
<p class="text-gray-700 leading-relaxed font-semibold">优化医疗服务流程，保障患者安全，提升医疗质量和效率。</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -257,8 +246,8 @@
|
||||
<span class="text-indigo-600 text-sm font-black tracking-[0.2em] uppercase">Industry Scale</span>
|
||||
</div>
|
||||
<h4 class="text-4xl md:text-5xl font-black text-gray-900 tracking-tighter leading-tight">
|
||||
全场景<br />
|
||||
<span class="text-transparent bg-clip-text bg-gradient-to-r from-indigo-600 to-blue-600">定制覆盖</span>
|
||||
定制覆盖<br />
|
||||
<span class="text-transparent bg-clip-text bg-gradient-to-r from-indigo-600 to-blue-600">更多场景</span>
|
||||
</h4>
|
||||
</div>
|
||||
|
||||
@@ -341,24 +330,38 @@
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
const sliderContainer = document.getElementById('slider-container');
|
||||
const sliderImage = document.getElementById('slider-image');
|
||||
const sliderText = document.getElementById('slider-text');
|
||||
let currentIndex = 0;
|
||||
const totalSlides = 2;
|
||||
const slides = [
|
||||
{ src: '/img/product-customization-1.webp', text: '园区IOC' },
|
||||
{ src: '/img/product-customization-2.webp', text: '数字孪生' },
|
||||
{ src: '/img/product-customization-3.webp', text: '智慧医院' },
|
||||
{ src: '/img/product-customization-4.webp', text: '智慧园区' },
|
||||
{ src: '/img/product-customization-5.webp', text: '智慧社区' },
|
||||
{ src: '/img/product-customization-6.webp', text: '智慧农业' },
|
||||
{ src: '/img/product-customization-7.webp', text: '智慧楼宇' },
|
||||
{ src: '/img/product-customization-8.webp', text: '智慧商业' }
|
||||
];
|
||||
|
||||
function updateSlide() {
|
||||
if (!sliderContainer) return;
|
||||
const translateX = -currentIndex * 50;
|
||||
sliderContainer.style.transform = `translateX(${translateX}%)`;
|
||||
if (!sliderImage || !sliderText) return;
|
||||
|
||||
sliderImage.style.opacity = '0';
|
||||
|
||||
setTimeout(() => {
|
||||
currentIndex = (currentIndex + 1) % slides.length;
|
||||
sliderImage.src = slides[currentIndex].src;
|
||||
sliderText.textContent = slides[currentIndex].text;
|
||||
sliderImage.style.opacity = '1';
|
||||
}, 500);
|
||||
}
|
||||
|
||||
function startAutoSlide() {
|
||||
setInterval(() => {
|
||||
currentIndex = (currentIndex + 1) % totalSlides;
|
||||
updateSlide();
|
||||
}, 5000);
|
||||
setInterval(updateSlide, 5000);
|
||||
}
|
||||
|
||||
if (sliderContainer) {
|
||||
if (sliderImage && sliderText) {
|
||||
startAutoSlide();
|
||||
}
|
||||
})();
|
||||
|
||||
97
src/components/sections/DataVisualization.astro
Normal file
97
src/components/sections/DataVisualization.astro
Normal file
@@ -0,0 +1,97 @@
|
||||
<section id="data-visualization" class="bg-slate-50">
|
||||
<div class="max-w-7xl mx-auto px-4 lg:px-0 py-20">
|
||||
<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 counter" data-target="700" data-suffix="+">0+</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 counter" data-target="99.9" data-suffix="%">0%</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 counter" data-target="15" data-suffix="+">0+</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 counter" data-target="40" data-suffix="+">0+</div>
|
||||
<div class="text-gray-700 text-sm md:text-base font-medium">软著专利</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
const counters = document.querySelectorAll('.counter');
|
||||
const duration = 2000;
|
||||
let animated = false;
|
||||
|
||||
function animateCounter(counter: Element) {
|
||||
const target = parseFloat(counter.getAttribute('data-target') || '0');
|
||||
const suffix = counter.getAttribute('data-suffix') || '';
|
||||
const isDecimal = target % 1 !== 0;
|
||||
const startTime = performance.now();
|
||||
const startValue = 0;
|
||||
|
||||
function update(currentTime: number) {
|
||||
const elapsed = currentTime - startTime;
|
||||
const progress = Math.min(elapsed / duration, 1);
|
||||
const easeOutQuart = 1 - Math.pow(1 - progress, 4);
|
||||
const currentValue = startValue + (target - startValue) * easeOutQuart;
|
||||
|
||||
if (isDecimal) {
|
||||
counter.textContent = currentValue.toFixed(1) + suffix;
|
||||
} else {
|
||||
counter.textContent = Math.floor(currentValue) + suffix;
|
||||
}
|
||||
|
||||
if (progress < 1) {
|
||||
requestAnimationFrame(update);
|
||||
}
|
||||
}
|
||||
|
||||
requestAnimationFrame(update);
|
||||
}
|
||||
|
||||
const observer = new IntersectionObserver((entries) => {
|
||||
entries.forEach((entry) => {
|
||||
if (entry.isIntersecting && !animated) {
|
||||
animated = true;
|
||||
counters.forEach(animateCounter);
|
||||
}
|
||||
});
|
||||
}, { threshold: 0.3 });
|
||||
|
||||
counters.forEach((counter) => {
|
||||
observer.observe(counter);
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
@@ -1,5 +1,5 @@
|
||||
<section id="timeline" class="bg-slate-50">
|
||||
<div class="max-w-7xl mx-auto px-4 lg:px-0 py-20">
|
||||
<div class="max-w-7xl mx-auto px-4 lg:px-0 pb-0">
|
||||
<div class="text-center mb-16">
|
||||
<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>
|
||||
|
||||
@@ -39,17 +39,18 @@
|
||||
|
||||
<div class="group relative flex flex-col items-center space-y-2 cursor-pointer">
|
||||
<div class="bg-white p-1 rounded-lg inline-block shadow-lg transition-transform duration-300 group-hover:scale-110">
|
||||
<img src="/img/official-xiaohongshu.jpg" alt="企业小红书" class="w-16 h-16 rounded-md">
|
||||
<img src="/img/official-traceability.jpg" alt="企业溯源码" class="w-16 h-16 rounded-md">
|
||||
</div>
|
||||
<p class="text-sm text-gray-400">企业小红书</p>
|
||||
<p class="text-sm text-gray-400">企业溯源码</p>
|
||||
|
||||
<div class="absolute bottom-full left-1/2 -translate-x-1/2 mb-4 opacity-0 invisible group-hover:opacity-100 group-hover:visible transition-all duration-300 z-50">
|
||||
<div class="bg-white p-3 rounded-xl shadow-[0_10px_30px_rgba(0,0,0,0.5)] border-2 border-blue-500 w-48 text-center">
|
||||
<img src="/img/official-xiaohongshu.jpg" alt="企业小红书大图" class="w-full h-auto rounded-lg mb-2">
|
||||
<img src="/img/official-traceability.jpg" alt="企业溯源码大图" class="w-full h-auto rounded-lg mb-2">
|
||||
<div class="absolute top-full left-1/2 -translate-x-1/2 w-0 h-0 border-l-[8px] border-l-transparent border-r-[8px] border-r-transparent border-t-[8px] border-t-white"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -16,51 +16,51 @@
|
||||
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-6 items-center">
|
||||
<div class="p-4 bg-white rounded-lg shadow-md flex flex-col justify-center items-center h-32 transition-all duration-300 hover:shadow-xl hover:-translate-y-1 space-y-3 border border-blue-100/50">
|
||||
<img src="/img/partner-cmcc.webp" alt="中国移动 logo" class="max-h-12 w-auto">
|
||||
<p class="text-sm font-semibold text-gray-700">中国移动</p>
|
||||
<p class="text-base font-semibold text-gray-700">中国移动</p>
|
||||
</div>
|
||||
<div class="p-4 bg-white rounded-lg shadow-md flex flex-col justify-center items-center h-32 transition-all duration-300 hover:shadow-xl hover:-translate-y-1 space-y-3 border border-blue-100/50">
|
||||
<img src="/img/partner-ct.webp" alt="中国电信 logo" class="max-h-12 w-auto">
|
||||
<p class="text-sm font-semibold text-gray-700">中国电信</p>
|
||||
<p class="text-base font-semibold text-gray-700">中国电信</p>
|
||||
</div>
|
||||
<div class="p-4 bg-white rounded-lg shadow-md flex flex-col justify-center items-center h-32 transition-all duration-300 hover:shadow-xl hover:-translate-y-1 space-y-3 border border-blue-100/50">
|
||||
<img src="/img/partner-inspur.webp" alt="浪潮 inspur logo" class="max-h-12 w-auto">
|
||||
<p class="text-sm font-semibold text-gray-700">浪潮 inspur</p>
|
||||
<p class="text-base font-semibold text-gray-700">浪潮 inspur</p>
|
||||
</div>
|
||||
<div class="p-4 bg-white rounded-lg shadow-md flex flex-col justify-center items-center h-32 transition-all duration-300 hover:shadow-xl hover:-translate-y-1 space-y-3 border border-blue-100/50">
|
||||
<img src="/img/partner-hikvision.webp" alt="海康威视 logo" class="max-h-12 w-auto">
|
||||
<p class="text-sm font-semibold text-gray-700">海康威视</p>
|
||||
<p class="text-base font-semibold text-gray-700">海康威视</p>
|
||||
</div>
|
||||
<div class="p-4 bg-white rounded-lg shadow-md flex flex-col justify-center items-center h-32 transition-all duration-300 hover:shadow-xl hover:-translate-y-1 space-y-3 border border-blue-100/50">
|
||||
<img src="/img/grid.webp" alt="国家电网 logo" class="max-h-12 w-auto">
|
||||
<p class="text-sm font-semibold text-gray-700">国家电网</p>
|
||||
<p class="text-base font-semibold text-gray-700">国家电网</p>
|
||||
</div>
|
||||
<div class="p-4 bg-white rounded-lg shadow-md flex flex-col justify-center items-center h-32 transition-all duration-300 hover:shadow-xl hover:-translate-y-1 space-y-3 border border-blue-100/50">
|
||||
<img src="/img/partner-aliyun.webp" alt="阿里云 logo" class="max-h-12 w-auto">
|
||||
<p class="text-sm font-semibold text-gray-700">阿里云</p>
|
||||
<p class="text-base font-semibold text-gray-700">阿里云</p>
|
||||
</div>
|
||||
<div class="p-4 bg-white rounded-lg shadow-md flex flex-col justify-center items-center h-32 transition-all duration-300 hover:shadow-xl hover:-translate-y-1 space-y-3 border border-blue-100/50">
|
||||
<img src="/img/partner-amap.webp" alt="高德地图 logo" class="max-h-12 w-auto">
|
||||
<p class="text-sm font-semibold text-gray-700">高德地图</p>
|
||||
<p class="text-base font-semibold text-gray-700">高德地图</p>
|
||||
</div>
|
||||
<div class="p-4 bg-white rounded-lg shadow-md flex flex-col justify-center items-center h-32 transition-all duration-300 hover:shadow-xl hover:-translate-y-1 space-y-3 border border-blue-100/50">
|
||||
<img src="/img/partner-zjtd.webp" alt="字节跳动 logo" class="max-h-12 w-auto">
|
||||
<p class="text-sm font-semibold text-gray-700">字节跳动</p>
|
||||
<p class="text-base font-semibold text-gray-700">字节跳动</p>
|
||||
</div>
|
||||
<div class="p-4 bg-white rounded-lg shadow-md flex flex-col justify-center items-center h-32 transition-all duration-300 hover:shadow-xl hover:-translate-y-1 space-y-3 border border-blue-100/50">
|
||||
<img src="/img/partner-cu.webp" alt="中国联通 logo" class="max-h-12 w-auto">
|
||||
<p class="text-sm font-semibold text-gray-700">中国联通</p>
|
||||
<p class="text-base font-semibold text-gray-700">中国联通</p>
|
||||
</div>
|
||||
<div class="p-4 bg-white rounded-lg shadow-md flex flex-col justify-center items-center h-32 transition-all duration-300 hover:shadow-xl hover:-translate-y-1 space-y-3 border border-blue-100/50">
|
||||
<img src="/img/hr.webp" alt="虹润 logo" class="max-h-12 w-auto">
|
||||
<p class="text-sm font-semibold text-gray-700">虹润</p>
|
||||
<p class="text-base font-semibold text-gray-700">虹润</p>
|
||||
</div>
|
||||
<div class="p-4 bg-white rounded-lg shadow-md flex flex-col justify-center items-center h-32 transition-all duration-300 hover:shadow-xl hover:-translate-y-1 space-y-3 border border-blue-100/50">
|
||||
<img src="/img/partner-tencent.webp" alt="腾讯 logo" class="max-h-12 w-auto">
|
||||
<p class="text-sm font-semibold text-gray-700">腾讯</p>
|
||||
<p class="text-base font-semibold text-gray-700">腾讯</p>
|
||||
</div>
|
||||
<div class="p-4 bg-white rounded-lg shadow-md flex flex-col justify-center items-center h-32 transition-all duration-300 hover:shadow-xl hover:-translate-y-1 space-y-3 border border-blue-100/50">
|
||||
<img src="/img/partner-doubao.webp" alt="豆包 logo" class="max-h-12 w-auto">
|
||||
<p class="text-sm font-semibold text-gray-700">豆包</p>
|
||||
<p class="text-base font-semibold text-gray-700">豆包</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -6,32 +6,38 @@
|
||||
|
||||
|
||||
<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 class="bg-gradient-to-br from-white to-blue-50 rounded-3xl shadow-xl border border-blue-100 transition-all duration-300 hover:shadow-2xl">
|
||||
<!-- 图片部分 -->
|
||||
<div class="relative">
|
||||
<div class="absolute inset-0 bg-gradient-to-r from-blue-500/20 to-purple-500/20 rounded-t-3xl blur-xl"></div>
|
||||
<div class="relative bg-white rounded-t-3xl overflow-hidden">
|
||||
<div class="h-48 md:h-64 overflow-hidden">
|
||||
<img src="/img/shake-hands.webp" alt="携手合作，共创未来，共享市场红利" class="w-full h-full object-cover transform hover:scale-110 transition-transform duration-700">
|
||||
</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 class="absolute inset-0 bg-gradient-to-t from-black/70 via-transparent to-transparent"></div>
|
||||
<div class="absolute bottom-0 left-0 right-0 p-8 text-white">
|
||||
<h4 class="text-2xl md:text-3xl font-bold mb-2">携手合作，共创未来，共享市场红利</h4>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<!-- 内容部分 -->
|
||||
<div class="p-8 md:p-12">
|
||||
<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>
|
||||
<h4 class="text-xl font-bold text-gray-900 mb-3">城市独家</h4>
|
||||
<p class="text-gray-600 text-base">每个城市仅设一家合作伙伴，确保市场空间和利润最大化</p>
|
||||
<p class="text-gray-600 text-base">一城仅招一代理，独享区域资源，无内部竞争，垄断本地商机</p>
|
||||
</div>
|
||||
|
||||
<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>
|
||||
<h4 class="text-xl font-bold text-gray-900 mb-3">政策导向</h4>
|
||||
<p class="text-gray-600 text-base">契合国家安防合规政策，刚需赛道，政策加持好拓客</p>
|
||||
</div>
|
||||
|
||||
<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">
|
||||
@@ -39,7 +45,7 @@
|
||||
<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>
|
||||
<p class="text-gray-600 text-base">各市平均约10-50万家企业、数百余家物业及园区，增量巨大</p>
|
||||
</div>
|
||||
|
||||
<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">
|
||||
@@ -47,7 +53,7 @@
|
||||
<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>
|
||||
<p class="text-gray-600 text-base">无需囤货重投入，低门槛启动，低成本快速做市场</p>
|
||||
</div>
|
||||
|
||||
<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">
|
||||
@@ -55,7 +61,7 @@
|
||||
<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>
|
||||
<p class="text-gray-600 text-base">园区 / 企业 / 商户全覆盖，客群广不设限，不愁客源</p>
|
||||
</div>
|
||||
|
||||
<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">
|
||||
@@ -63,7 +69,7 @@
|
||||
<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>
|
||||
<p class="text-gray-600 text-base">培训获客售后全支持，手把手带教，零基础也能做</p>
|
||||
</div>
|
||||
|
||||
<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">
|
||||
@@ -71,142 +77,159 @@
|
||||
<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>
|
||||
<p class="text-gray-600 text-base">一次合作长期分润，持续躺赚，收益稳定长久不断流</p>
|
||||
</div>
|
||||
|
||||
<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>
|
||||
<h4 class="text-xl font-bold text-gray-900 mb-3">持续迭代</h4>
|
||||
<p class="text-gray-600 text-base">平台不断升级优化，产品始终领先，长久稳占市场优势</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 目标招商对象 -->
|
||||
<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 class="bg-gradient-to-br from-white to-blue-50 rounded-3xl shadow-xl border border-blue-100 transition-all duration-300 hover:shadow-2xl">
|
||||
<!-- 图片部分 -->
|
||||
<div class="relative">
|
||||
<div class="absolute inset-0 bg-gradient-to-r from-blue-500/20 to-purple-500/20 rounded-t-3xl blur-xl"></div>
|
||||
<div class="relative bg-white rounded-t-3xl overflow-hidden">
|
||||
<div class="h-48 md:h-64 overflow-hidden">
|
||||
<img src="/img/partner-search.webp" alt="城市合伙人合作要求" class="w-full h-full object-cover transform hover:scale-110 transition-transform duration-700">
|
||||
</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 class="absolute inset-0 bg-gradient-to-t from-black/70 via-transparent to-transparent"></div>
|
||||
<div class="absolute bottom-0 left-0 right-0 p-8 text-white">
|
||||
<h4 class="text-2xl md:text-3xl font-bold mb-2">城市合伙人合作要求</h4>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<!-- 内容部分 -->
|
||||
<div class="p-8 md:p-12">
|
||||
<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="bg-white rounded-2xl p-7 border border-blue-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 class="w-10 h-10 bg-blue-100 rounded-lg flex items-center justify-center flex-shrink-0">
|
||||
<span class="text-blue-600 font-bold text-xl">1</span>
|
||||
</div>
|
||||
<h4 class="text-xl font-bold text-gray-900">本地资源代理商</h4>
|
||||
<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>
|
||||
<span class="text-sm font-medium px-3 py-1 rounded-full bg-blue-200 text-blue-800">政企渠道商</span>
|
||||
<span class="text-sm font-medium px-3 py-1 rounded-full bg-blue-200 text-blue-800">政务服务商</span>
|
||||
<span class="text-sm font-medium px-3 py-1 rounded-full bg-blue-200 text-blue-800">地方产业运营商</span>
|
||||
<span class="text-sm font-medium px-3 py-1 rounded-full bg-blue-200 text-blue-800">政企合作专员</span>
|
||||
</div>
|
||||
<p class="text-gray-600 text-base">手握本地企业资源，熟悉当地市场，可以通过代理商加盟模式与我们合作，共同推广产品。</p>
|
||||
<p class="text-gray-600 text-base">深耕本地政企、园区等核心渠道，手握优质政企资源，熟悉地方产业政策，能快速对接区域数字化转型需求，推动产品落地渗透。</p>
|
||||
</div>
|
||||
|
||||
<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="bg-white rounded-2xl p-7 border border-blue-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 class="w-10 h-10 bg-blue-100 rounded-lg flex items-center justify-center flex-shrink-0">
|
||||
<span class="text-blue-600 font-bold text-xl">2</span>
|
||||
</div>
|
||||
<h4 class="text-xl font-bold text-gray-900">行业领域专家</h4>
|
||||
<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>
|
||||
<span class="text-sm font-medium px-3 py-1 rounded-full bg-blue-200 text-blue-800">制造业服务商</span>
|
||||
<span class="text-sm font-medium px-3 py-1 rounded-full bg-blue-200 text-blue-800">化工行业运营商</span>
|
||||
<span class="text-sm font-medium px-3 py-1 rounded-full bg-blue-200 text-blue-800">产业园区服务商</span>
|
||||
<span class="text-sm font-medium px-3 py-1 rounded-full bg-blue-200 text-blue-800">工业领域顾问</span>
|
||||
</div>
|
||||
<p class="text-gray-600 text-base">了解特定行业领域，如化工、制造等，具备专业知识和行业经验，能够在细分领域推广我们的产品。</p>
|
||||
<p class="text-gray-600 text-base">精通制造、化工等核心产业痛点，具备丰富的产业服务经验，能精准匹配贝凡数字化解决方案，赋能区域产业智能化升级。</p>
|
||||
</div>
|
||||
|
||||
<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="bg-white rounded-2xl p-7 border border-blue-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 class="w-10 h-10 bg-blue-100 rounded-lg flex items-center justify-center flex-shrink-0">
|
||||
<span class="text-blue-600 font-bold text-xl">3</span>
|
||||
</div>
|
||||
<h4 class="text-xl font-bold text-gray-900">园区企业负责人</h4>
|
||||
<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>
|
||||
<span class="text-sm font-medium px-3 py-1 rounded-full bg-blue-200 text-blue-800">SaaS生态伙伴</span>
|
||||
<span class="text-sm font-medium px-3 py-1 rounded-full bg-blue-200 text-blue-800">系统集成商</span>
|
||||
<span class="text-sm font-medium px-3 py-1 rounded-full bg-blue-200 text-blue-800">IT解决方案商</span>
|
||||
<span class="text-sm font-medium px-3 py-1 rounded-full bg-blue-200 text-blue-800">数字化转型服务商</span>
|
||||
</div>
|
||||
<p class="text-gray-600 text-base">产业园区、工厂的负责人，对安全管理有高度重视，希望通过数字化手段提升安全管理水平。</p>
|
||||
<p class="text-gray-600 text-base">具备成熟的数字化服务能力，拥有完善的技术服务团队，可与贝凡产品形成生态互补，协同拓展区域数字化服务市场。</p>
|
||||
</div>
|
||||
|
||||
<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="bg-white rounded-2xl p-7 border border-blue-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 class="w-10 h-10 bg-blue-100 rounded-lg flex items-center justify-center flex-shrink-0">
|
||||
<span class="text-blue-600 font-bold text-xl">4</span>
|
||||
</div>
|
||||
<h4 class="text-xl font-bold text-gray-900">数字化转型服务商</h4>
|
||||
<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>
|
||||
<span class="text-sm font-medium px-3 py-1 rounded-full bg-blue-200 text-blue-800">城市渠道运营商</span>
|
||||
<span class="text-sm font-medium px-3 py-1 rounded-full bg-blue-200 text-blue-800">本地创业带头人</span>
|
||||
<span class="text-sm font-medium px-3 py-1 rounded-full bg-blue-200 text-blue-800">区域市场服务商</span>
|
||||
<span class="text-sm font-medium px-3 py-1 rounded-full bg-blue-200 text-blue-800">产业招商专员</span>
|
||||
</div>
|
||||
<p class="text-gray-600 text-base">具备优秀的市场运营、客户拓展能力，愿意投入资源深耕区域，与贝凡共筑数字化服务区域标杆。</p>
|
||||
</div>
|
||||
<p class="text-gray-600 text-base">从事过 SaaS 化或本地化定制转型，有成熟的项目经验和方案能力，能够与我们的产品形成互补。</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 合作流程 -->
|
||||
<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="bg-gradient-to-br from-white to-blue-50 rounded-3xl shadow-xl border border-blue-100 transition-all duration-300 hover:shadow-2xl">
|
||||
<!-- 图片部分 -->
|
||||
<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="absolute inset-0 bg-gradient-to-r from-blue-500/20 to-purple-500/20 rounded-t-3xl blur-xl"></div>
|
||||
<div class="relative bg-white rounded-t-3xl overflow-hidden">
|
||||
<div class="h-48 md:h-64 overflow-hidden">
|
||||
<img src="/img/cooperation-process.webp" alt="合作流程" class="w-full h-full object-cover transform hover:scale-110 transition-transform duration-700">
|
||||
</div>
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-black/70 via-transparent to-transparent"></div>
|
||||
<div class="absolute bottom-0 left-0 right-0 p-8 text-white">
|
||||
<h4 class="text-2xl md:text-3xl font-bold mb-2">合作流程</h4>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 内容部分 -->
|
||||
<div class="p-8 md:p-12">
|
||||
<div class="relative">
|
||||
<div class="hidden md:block absolute top-1/2 left-0 right-0 h-1 bg-blue-200 -translate-y-1/2 z-0"></div>
|
||||
|
||||
<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 class="grid grid-cols-1 md:grid-cols-4 gap-5 relative z-10">
|
||||
<div class="flex flex-col items-center text-center bg-white rounded-2xl p-5 border border-blue-100 shadow-sm hover:shadow-lg transition-all duration-300 hover:-translate-y-1">
|
||||
<div class="w-14 h-14 bg-blue-600 text-white rounded-full flex items-center justify-center font-bold text-xl mb-3 shadow)lg">1</div>
|
||||
<h4 class="text-xl font-bold text-gray-900 mb-2">合作咨询</h4>
|
||||
<p class="text-gray-600 text-base leading-snug">沟通意向，了解合作政策。</p>
|
||||
</div>
|
||||
|
||||
<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 class="flex flex-col items-center text-center bg-white rounded-2xl p-5 border border-blue-100 shadow-sm hover:shadow-lg transition-all duration-300 hover:-translate-y-1">
|
||||
<div class="w-14 h-14 bg-blue-600 text-white rounded-full flex items-center justify-center font-bold text-xl mb-3 shadow-lg">2</div>
|
||||
<h4 class="text-xl font-bold text-gray-900 mb-2">实地考察</h4>
|
||||
<p class="text-gray-600 text-base leading-snug">考察总部产品与落地案例。</p>
|
||||
</div>
|
||||
|
||||
<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 class="flex flex-col items-center text-center bg-white rounded-2xl p-5 border border-blue-100 shadow-sm hover:shadow-lg transition-all duration-300 hover:-translate-y-1">
|
||||
<div class="w-14 h-14 bg-blue-600 text-white rounded-full flex items-center justify-center font-bold text-xl mb-3 shadow-lg">3</div>
|
||||
<h4 class="text-xl font-bold text-gray-900 mb-2">签约授权</h4>
|
||||
<p class="text-gray-600 text-base leading-snug">签订合作协议，授予独家权限。</p>
|
||||
</div>
|
||||
|
||||
<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 class="flex flex-col items-center text-center bg-white rounded-2xl p-5 border border-blue-100 shadow-sm hover:shadow-lg transition-all duration-300 hover:-translate-y-1">
|
||||
<div class="w-14 h-14 bg-blue-600 text-white rounded-full flex items-center justify-center font-bold text-xl mb-3 shadow-lg">4</div>
|
||||
<h4 class="text-xl font-bold text-gray-900 mb-2">赋能落地</h4>
|
||||
<p class="text-gray-600 text-base leading-snug">总部全程扶持，启动市场运营。</p>
|
||||
</div>
|
||||
</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">
|
||||
<div class="inline-flex items-center gap-3 px-8 py-4 bg-blue-600 text-white rounded-full font-bold text-xl shadow-lg hover:bg-blue-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>
|
||||
|
||||
@@ -66,7 +66,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="policy-container" class="flex md:grid md:grid-cols-3 lg:grid-cols-5 gap-6 overflow-x-auto pb-12 snap-x no-scrollbar">
|
||||
<div id="policy-container" class="flex md:grid md:grid-cols-3 lg:grid-cols-5 gap-6 overflow-x-auto snap-x no-scrollbar">
|
||||
|
||||
<div class="min-w-[280px] md:min-w-0 snap-center group">
|
||||
<div class="bg-white rounded-[1.8rem] p-4 border border-slate-100 shadow-sm hover:shadow-xl hover:border-red-200 transition-all duration-300 flex flex-col h-full">
|
||||
|
||||
@@ -45,7 +45,10 @@
|
||||
</div>
|
||||
<p class="text-sm md:text-base text-gray-500 mb-6 border-b border-gray-100 pb-4 inline-block">由浙江贝凡网络科技提供云和AI服务</p>
|
||||
<p class="text-gray-700 text-lg md:text-xl leading-relaxed">
|
||||
<strong class="text-blue-600 font-extrabold">企安智控</strong>是浙江贝凡自主研发的全场景智能安全管理 SaaS 系统，专注为全国生产制造型企业、产业园区、酒店餐饮、物业楼宇、仓储物流等场景，提供<strong class="text-blue-600 font-extrabold">数字化安全管理解决方案</strong>。
|
||||
<strong class="text-blue-600 font-extrabold">企安智控</strong>是浙江贝凡自主研发的全场景智能安全管理 SaaS 系统，专注为全国工贸企业、产业园区、酒店餐饮、物业楼宇、仓储物流等场景，提供<strong class="text-blue-600 font-extrabold">数字化安全管理解决方案</strong>。
|
||||
</p>
|
||||
<p class="text-gray-700 text-lg md:text-xl leading-relaxed mt-4">
|
||||
系统采用 SaaS 化部署模式，具有<span class="text-blue-600 font-extrabold">部署快、客群广、成本低</span>等优势，让企业能够快速实现安全管理数字化转型。
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -107,14 +110,14 @@
|
||||
</p>
|
||||
|
||||
<div class="grid grid-cols-2 gap-3 mb-6">
|
||||
<div class="flex flex-col items-center justify-center py-4 bg-red-500 text-white rounded-xl shadow-md border border-red-800 transition-all">
|
||||
<div class="flex flex-col items-center justify-center py-4 bg-red-700 text-white rounded-xl shadow-md border border-red-800 transition-all">
|
||||
<svg class="w-6 h-6 text-white mb-2" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" viewBox="0 0 24 24">
|
||||
<path d="M21.21 15.89A10 10 0 1 1 8 2.83"></path>
|
||||
<path d="M22 12A10 10 0 0 0 12 2v10z"></path>
|
||||
</svg>
|
||||
<span class="text-sm font-bold tracking-wider">数据驱动</span>
|
||||
</div>
|
||||
<div class="flex flex-col items-center justify-center py-4 bg-red-500 text-white rounded-xl shadow-md border border-red-800 transition-all">
|
||||
<div class="flex flex-col items-center justify-center py-4 bg-red-700 text-white rounded-xl shadow-md border border-red-800 transition-all">
|
||||
<svg class="w-6 h-6 text-white mb-2" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" viewBox="0 0 24 24">
|
||||
<path d="M23 7l-7 5 7 5V7z"></path>
|
||||
<rect x="1" y="5" width="15" height="14" rx="2" ry="2"></rect>
|
||||
|
||||
@@ -1,185 +0,0 @@
|
||||
<section id="timeline" class="bg-slate-50">
|
||||
<div class="relative mt-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 mb-8">
|
||||
<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-16 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-6 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-lg md:text-xl leading-relaxed mb-6">
|
||||
浙江贝凡网络科技有限公司是一家专注于<span class="text-transparent bg-clip-text bg-gradient-to-r from-blue-600 to-blue-700 font-bold">产业数字化转型</span>的高科技企业，总部坐落于美丽的西子湖畔 · 杭州。
|
||||
</p>
|
||||
<p class="text-gray-600 text-base md:text-lg leading-relaxed">
|
||||
依托<span class="text-blue-600 font-semibold">风险全流程管控</span>、<span class="text-blue-600 font-semibold">中控可视化</span>、<span class="text-blue-600 font-semibold">系统秒级联动</span>、<span class="text-blue-600 font-semibold">全栈多模态协同</span>等技术优势，为政府和企业提供<span class="text-transparent bg-clip-text bg-gradient-to-r from-blue-600 to-blue-700 font-semibold">全场景的数字化解决方案</span>。与<span class="text-blue-600 font-semibold">浪潮集团</span>、<span class="text-blue-600 font-semibold">中国移动</span>、<span class="text-blue-600 font-semibold">海康威视</span>、<span class="text-blue-600 font-semibold">阿里云</span>、<span class="text-blue-600 font-semibold">字节跳动</span>等头部企业深度融合合作，构建强大的业务生态体系。
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 md:grid-cols-4 gap-6 mb-20">
|
||||
<div class="text-center group">
|
||||
<div class="text-4xl md:text-5xl lg:text-6xl font-black text-blue-600 mb-2 group-hover:scale-110 transition-transform duration-300">2019</div>
|
||||
<div class="text-gray-600 text-xs md:text-sm font-medium">成立年份</div>
|
||||
</div>
|
||||
<div class="text-center group">
|
||||
<div class="text-4xl md:text-5xl lg:text-6xl font-black text-blue-600 mb-2 group-hover:scale-110 transition-transform duration-300" style="transition-delay: 0.1s">700+</div>
|
||||
<div class="text-gray-600 text-xs md:text-sm font-medium">视觉理解模型</div>
|
||||
</div>
|
||||
<div class="text-center group">
|
||||
<div class="text-4xl md:text-5xl lg:text-6xl font-black text-blue-600 mb-2 group-hover:scale-110 transition-transform duration-300" style="transition-delay: 0.2s">99.9%</div>
|
||||
<div class="text-gray-600 text-xs md:text-sm font-medium">SLA可用性</div>
|
||||
</div>
|
||||
<div class="text-center group">
|
||||
<div class="text-4xl md:text-5xl lg:text-6xl font-black text-blue-600 mb-2 group-hover:scale-110 transition-transform duration-300" style="transition-delay: 0.3s">15+</div>
|
||||
<div class="text-gray-600 text-xs md:text-sm font-medium">合作伙伴</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="max-w-7xl mx-auto px-4 lg:px-0 pb-20">
|
||||
<div class="text-center mb-16">
|
||||
<h3 class="text-2xl md:text-3xl font-bold text-gray-900">发展历程</h3>
|
||||
<div class="w-16 h-1 bg-gradient-to-r from-blue-600 to-indigo-600 mx-auto mt-4 rounded-full"></div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col md:flex-row items-stretch gap-8 md:gap-20">
|
||||
<div class="w-full md:w-5/12 order-1 relative">
|
||||
<div class="md:sticky md:top-20 h-fit">
|
||||
<div class="grid grid-cols-2 gap-x-4 md:gap-x-5 gap-y-4 md:gap-y-5">
|
||||
<div class="col-span-2 flex flex-col rounded-2xl overflow-hidden border border-gray-100 bg-white group transition-all duration-300 shadow-sm">
|
||||
<div class="relative aspect-[3/1] md:aspect-[3/1.2] overflow-hidden">
|
||||
<img src="/img/company-hangzhou.jpg" alt="杭州" class="w-full h-full object-cover transition-transform duration-700 group-hover:scale-105">
|
||||
</div>
|
||||
<div class="relative p-3 md:p-4">
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-blue-50/50 to-white/80 backdrop-blur-md z-0"></div>
|
||||
<div class="relative z-10">
|
||||
<span class="text-blue-600/70 font-bold text-[10px] tracking-widest uppercase">Location</span>
|
||||
<h4 class="text-gray-800 font-bold text-sm md:text-base mt-0.5">总部坐落于</h4>
|
||||
<h4 class="text-gray-800 font-bold text-sm md:text-base mt-0.5">美丽的西子湖畔 · 杭州</h4>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col rounded-2xl overflow-hidden border border-gray-100 bg-white group transition-all duration-300 shadow-sm">
|
||||
<div class="relative aspect-[16/10] overflow-hidden">
|
||||
<img src="/img/company-building.jpg" alt="大楼" class="w-full h-full object-cover transition-transform duration-700 group-hover:scale-105">
|
||||
</div>
|
||||
<div class="relative p-3 md:p-4">
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-slate-100/50 to-white/80 backdrop-blur-md z-0"></div>
|
||||
<div class="relative z-10">
|
||||
<span class="text-blue-600/70 font-bold text-[10px] tracking-widest uppercase">R&D Center</span>
|
||||
<h4 class="text-gray-800 font-bold text-sm md:text-base mt-0.5">立足杭城CBD</h4>
|
||||
<h4 class="text-gray-800 font-bold text-sm md:text-base mt-0.5">驱动数字研发新引擎</h4>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col rounded-2xl overflow-hidden border border-gray-100 bg-white group transition-all duration-300 shadow-sm">
|
||||
<div class="relative aspect-[16/10] overflow-hidden">
|
||||
<img src="/img/company-showroom.jpg" alt="展示" class="w-full h-full object-cover transition-transform duration-700 group-hover:scale-105">
|
||||
</div>
|
||||
<div class="relative p-3 md:p-4">
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-blue-50/50 to-white/80 backdrop-blur-md z-0"></div>
|
||||
<div class="relative z-10">
|
||||
<span class="text-blue-600/70 font-bold text-[10px] tracking-widest uppercase">Solutions</span>
|
||||
<h4 class="text-gray-800 font-bold text-sm md:text-base mt-0.5">AI场景赋能</h4>
|
||||
<h4 class="text-gray-800 font-bold text-sm md:text-base mt-0.5">面向未来的数字展厅</h4>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="w-full md:w-7/12 order-2">
|
||||
<div class="relative">
|
||||
<div class="absolute top-0 bottom-0 left-3 md:left-6 w-px bg-gradient-to-b from-blue-600/40 via-gray-200 to-transparent z-0"></div>
|
||||
|
||||
<div class="space-y-8 md:space-y-10">
|
||||
<div class="relative flex z-10">
|
||||
<span class="absolute top-6 left-3 md:left-6 -translate-x-1/2 w-4 h-4 rounded-full bg-blue-600/30 z-20 border-2 border-white"></span>
|
||||
<div class="w-full pl-10 md:pl-16">
|
||||
<div class="relative z-10 rounded-xl p-6 bg-white border border-gray-200 shadow-sm">
|
||||
<span class="text-blue-600 font-bold tracking-wider text-sm uppercase">2019</span>
|
||||
<h4 class="text-xl font-bold mt-3 mb-2 flex items-center gap-3 text-blue-600">
|
||||
<img src="/img/timeline-2019-icon.webp" alt="icon" class="w-7 h-7 object-contain">
|
||||
公司成立
|
||||
</h4>
|
||||
<p class="text-gray-600 text-base leading-relaxed">自主研发"车险分期"系统平台，为全国商用车领域业务赋能</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="relative flex z-10">
|
||||
<span class="absolute top-6 left-3 md:left-6 -translate-x-1/2 w-4 h-4 rounded-full bg-blue-600/40 z-20 border-2 border-white"></span>
|
||||
<div class="w-full pl-10 md:pl-16">
|
||||
<div class="relative z-10 rounded-xl p-6 bg-white border border-gray-200 shadow-sm">
|
||||
<span class="text-blue-600 font-bold tracking-wider text-sm uppercase">2020-2022</span>
|
||||
<h4 class="text-xl font-bold mt-3 mb-2 flex items-center gap-3 text-blue-600">
|
||||
<img src="/img/timeline-2022-icon.webp" alt="icon" class="w-7 h-7 object-contain">
|
||||
规模化增长
|
||||
</h4>
|
||||
<p class="text-gray-600 text-base leading-relaxed">业务规模化增长阶段，实现全国市场布局，同步优化运营体系与技术架构</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="relative flex z-10">
|
||||
<span class="absolute top-6 left-3 md:left-6 -translate-x-1/2 w-4 h-4 rounded-full bg-blue-600/50 z-20 border-2 border-white"></span>
|
||||
<div class="w-full pl-10 md:pl-16">
|
||||
<div class="relative z-10 rounded-xl p-6 bg-white border border-gray-100 shadow-sm">
|
||||
<span class="text-blue-600 font-bold tracking-wider text-sm uppercase">2023-2024</span>
|
||||
<h4 class="text-xl font-bold mt-3 mb-2 flex items-center gap-3 text-blue-600">
|
||||
<img src="/img/timeline-2024-icon.webp" alt="icon" class="w-7 h-7 object-contain">
|
||||
技术升级
|
||||
</h4>
|
||||
<p class="text-gray-600 text-base leading-relaxed">技术研发转向工业互联网解决方案，企安智控1.0上线</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="relative flex z-10">
|
||||
<span class="absolute top-6 left-3 md:left-6 -translate-x-1/2 w-4 h-4 rounded-full bg-blue-600/60 z-20 border-2 border-white"></span>
|
||||
<div class="w-full pl-10 md:pl-16">
|
||||
<div class="relative z-10 rounded-xl p-6 bg-white border border-gray-100 shadow-sm">
|
||||
<span class="text-blue-600 font-bold tracking-wider text-sm uppercase">2025</span>
|
||||
<h4 class="text-xl font-bold mt-3 mb-2 flex items-center gap-3 text-blue-600">
|
||||
<img src="/img/timeline-2025-icon.webp" alt="icon" class="w-7 h-7 object-contain">
|
||||
双赛道启航
|
||||
</h4>
|
||||
<p class="text-gray-600 text-base leading-relaxed">SaaS系统交叉融合，构建业务生态，ToB、ToG多模块场景研发定制</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="relative flex z-10">
|
||||
<span class="absolute top-6 left-3 md:left-6 -translate-x-1/2 w-4 h-4 rounded-full bg-blue-600 shadow-[0_0_0_6px_rgba(37,99,235,0.15)] z-20 border-2 border-white"></span>
|
||||
<div class="w-full pl-10 md:pl-16">
|
||||
<div class="relative z-10 rounded-xl p-6 bg-gradient-to-br from-blue-600/10 to-transparent border border-blue-600/20 shadow-lg backdrop-blur-sm">
|
||||
<span class="text-blue-600 font-bold tracking-wider text-sm uppercase">2026</span>
|
||||
<h4 class="text-xl font-bold mt-3 mb-2 flex items-center gap-3 text-blue-600">
|
||||
<img src="/img/timeline-2026-icon.webp" alt="icon" class="w-7 h-7 object-contain">
|
||||
核心聚焦
|
||||
</h4>
|
||||
<p class="text-gray-600 text-base leading-relaxed">AI大模型、物联网IOT、融合开发DevOps，标准SaaS部署及行业应用，全场景产业数字化转型服务商</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -1,8 +1,9 @@
|
||||
---
|
||||
import Layout from '../layouts/Layout.astro';
|
||||
import Hero from '../components/sections/Hero.astro';
|
||||
import DevelopmentHistory from '../components/sections/DevelopmentHistory.astro';
|
||||
import CompanyIntro from '../components/sections/CompanyIntro.astro';
|
||||
import DevelopmentHistory from '../components/sections/DevelopmentHistory.astro';
|
||||
import DataVisualization from '../components/sections/DataVisualization.astro';
|
||||
import Honors from '../components/sections/Honors.astro';
|
||||
import Contact from '../components/sections/Contact.astro';
|
||||
---
|
||||
@@ -10,8 +11,9 @@ import Contact from '../components/sections/Contact.astro';
|
||||
<Layout title="浙江贝凡网络科技 - 全场景 ‧ 产业数字化转型服务商" activeNav="home">
|
||||
<main>
|
||||
<Hero />
|
||||
<DevelopmentHistory />
|
||||
<CompanyIntro />
|
||||
<DevelopmentHistory />
|
||||
<DataVisualization />
|
||||
<Honors />
|
||||
<Contact />
|
||||
</main>
|
||||
|
||||
Reference in New Issue
Block a user