diff --git a/.claude/settings.local.json b/.claude/settings.local.json
index d5d6594c..1f58f3d7 100644
--- a/.claude/settings.local.json
+++ b/.claude/settings.local.json
@@ -70,7 +70,9 @@
       "Bash(open index.html)",
       "Bash(git push:*)",
       "Bash(sed:*)",
-      "Bash(/Users/xiaoqi/Documents/Dev/Project/2025-09-08_n8nDEMO演示/n8n-n8n-1.109.2/start.bat)"
+      "Bash(/Users/xiaoqi/Documents/Dev/Project/2025-09-08_n8nDEMO演示/n8n-n8n-1.109.2/start.bat)",
+      "Bash(curl:*)",
+      "Bash(node server.js)"
     ],
     "defaultMode": "acceptEdits",
     "additionalDirectories": [
diff --git a/n8n-n8n-1.109.2/n8n-20250908-141135.log b/n8n-n8n-1.109.2/n8n-20250908-141135.log
index af526187..2464f1b1 100644
--- a/n8n-n8n-1.109.2/n8n-20250908-141135.log
+++ b/n8n-n8n-1.109.2/n8n-20250908-141135.log
@@ -22,3 +22,8 @@ http://localhost:5678
 (node:12101) [DEP0060] DeprecationWarning: The `util._extend` API is deprecated. Please use Object.assign() instead.
 (Use `node --trace-deprecation ...` to show where the warning was created)
 Node does not have any credentials set
+Received SIGINT. Shutting down...
+[Task Runner]: Received SIGINT signal, shutting down...
+[Task Runner]: Task runner stopped
+
+Stopping n8n...
diff --git a/n8n-n8n-1.109.2/n8n-20250908-163158.log b/n8n-n8n-1.109.2/n8n-20250908-163158.log
new file mode 100644
index 00000000..8cf76df7
--- /dev/null
+++ b/n8n-n8n-1.109.2/n8n-20250908-163158.log
@@ -0,0 +1,26 @@
+
+> n8n-monorepo@1.109.2 start /Users/xiaoqi/Documents/Dev/Project/2025-09-08_n8nDEMO演示/n8n-n8n-1.109.2
+> run-script-os
+
+
+> n8n-monorepo@1.109.2 start:default
+> cd packages/cli/bin && ./n8n
+
+Permissions 0644 for n8n settings file /Users/xiaoqi/.n8n/config are too wide. This is ignored for now, but in the future n8n will attempt to change the permissions automatically. To automatically enforce correct permissions now set N8N_ENFORCE_SETTINGS_FILE_PERMISSIONS=true (recommended), or turn this check off set N8N_ENFORCE_SETTINGS_FILE_PERMISSIONS=false.
+Initializing n8n process
+n8n ready on ::, port 5678
+n8n Task Broker ready on 127.0.0.1, port 5679
+Initializing AuthRolesService...
+AuthRolesService initialized successfully.
+[license SDK] Skipping renewal on init: license cert is not initialized
+Registered runner "JS Task Runner" (4cCbV_Z_J_3qoaQmjw7fB) 
+Version: 1.109.2
+Locale: zh-CN
+
+Editor is now accessible via:
+http://localhost:5678
+Received SIGINT. Shutting down...
+[Task Runner]: Received SIGINT signal, shutting down...
+[Task Runner]: Task runner stopped
+
+Stopping n8n...
diff --git a/n8n-n8n-1.109.2/start.bat b/n8n-n8n-1.109.2/start.bat
index 43468aba..90ba46dd 100644
--- a/n8n-n8n-1.109.2/start.bat
+++ b/n8n-n8n-1.109.2/start.bat
@@ -1,8 +1,9 @@
 @echo off
 chcp 65001 >nul 2>&1
-REM n8n 中文版快速启动脚本 (Windows版)
+REM n8n 中文版快速启动脚本 (Windows版 - 增强兼容性)
 REM 作者: 小齐
 REM 最后更新: 2025-09-08
+REM 兼容性: Windows 7/8/10/11, PowerShell/CMD
 
 setlocal enabledelayedexpansion
 
@@ -19,6 +20,8 @@ REM 解析命令行参数
 set "DEV_MODE="
 set "FORCE_BUILD="
 set "CHECK_ONLY="
+set "SKIP_DEPS="
+set "USE_NPM="
 
 :parse_args
 if "%~1"=="" goto main_execution
@@ -54,18 +57,33 @@ if /I "%~1"=="--check" (
     shift
     goto parse_args
 )
+if /I "%~1"=="--skip-deps" (
+    set "SKIP_DEPS=true"
+    shift
+    goto parse_args
+)
+if /I "%~1"=="--npm" (
+    set "USE_NPM=true"
+    shift
+    goto parse_args
+)
 echo [错误] 未知选项: %~1
 goto show_help
 
 :main_execution
+REM 检查操作系统版本
+call :check_os_version
+
 REM 检查并切换到正确目录
 call :check_and_change_directory
 if errorlevel 1 goto error_exit
 
 REM 检查依赖
-echo [信息] 正在检查系统依赖...
-call :check_dependencies
-if errorlevel 1 goto error_exit
+if not defined SKIP_DEPS (
+    echo [信息] 正在检查系统依赖...
+    call :check_dependencies
+    if errorlevel 1 goto error_exit
+)
 
 REM 检查端口占用
 call :check_port
@@ -83,16 +101,22 @@ if defined CHECK_ONLY (
     goto end
 )
 
+REM 安装依赖（如果需要）
+if not exist "node_modules\" (
+    echo [信息] 检测到缺少依赖，正在安装...
+    if defined USE_NPM (
+        call :install_with_npm
+    ) else (
+        call :install_with_pnpm
+    )
+    if errorlevel 1 goto error_exit
+)
+
 REM 强制构建或检查构建状态
 if defined FORCE_BUILD (
     echo [信息] 强制重新构建项目...
-    call pnpm build > build.log 2>&1
-    if errorlevel 1 (
-        echo [错误] 构建失败，请查看 build.log
-        type build.log | more
-        goto error_exit
-    )
-    echo [成功] 构建完成
+    call :build_project
+    if errorlevel 1 goto error_exit
 ) else (
     call :check_build
     if errorlevel 1 goto error_exit
@@ -102,7 +126,11 @@ REM 开发模式或正常启动
 if defined DEV_MODE (
     echo [信息] 正在以开发模式启动 n8n...
     echo [警告] 开发模式启动时间较长，请耐心等待...
-    call pnpm dev
+    if defined USE_NPM (
+        call npm run dev
+    ) else (
+        call pnpm dev
+    )
 ) else (
     call :start_n8n
 )
@@ -110,6 +138,34 @@ goto end
 
 REM ========== 函数定义 ==========
 
+:check_os_version
+REM 检查 Windows 版本兼容性
+ver | findstr /i "5\.1\." >nul
+if not errorlevel 1 (
+    echo [警告] 检测到 Windows XP，可能存在兼容性问题
+)
+ver | findstr /i "6\.0\." >nul
+if not errorlevel 1 (
+    echo [信息] 检测到 Windows Vista
+)
+ver | findstr /i "6\.1\." >nul
+if not errorlevel 1 (
+    echo [信息] 检测到 Windows 7
+)
+ver | findstr /i "6\.2\." >nul
+if not errorlevel 1 (
+    echo [信息] 检测到 Windows 8
+)
+ver | findstr /i "6\.3\." >nul
+if not errorlevel 1 (
+    echo [信息] 检测到 Windows 8.1
+)
+ver | findstr /i "10\.0\." >nul
+if not errorlevel 1 (
+    echo [信息] 检测到 Windows 10/11
+)
+exit /b 0
+
 :check_and_change_directory
 REM 检查当前目录是否为 n8n 项目目录
 if exist "package.json" if exist "packages" (
@@ -117,18 +173,22 @@ if exist "package.json" if exist "packages" (
     exit /b 0
 )
 
-REM 获取脚本所在目录
+REM 获取脚本所在目录（兼容不同 Windows 版本）
 set "SCRIPT_DIR=%~dp0"
-set "SCRIPT_DIR=%SCRIPT_DIR:~0,-1%"
+if "%SCRIPT_DIR:~-1%"=="\" set "SCRIPT_DIR=%SCRIPT_DIR:~0,-1%"
 
 REM 如果脚本在 n8n-n8n-1.109.2 目录内
-echo %SCRIPT_DIR% | findstr /C:"n8n-n8n-1.109.2" >nul
+echo %SCRIPT_DIR% | findstr /I /C:"n8n-n8n-1.109.2" >nul
 if not errorlevel 1 (
-    echo [信息] 切换到脚本所在的 n8n 项目目录: %SCRIPT_DIR%
-    cd /d "%SCRIPT_DIR%"
+    echo [信息] 切换到脚本所在的 n8n 项目目录
+    cd /d "%SCRIPT_DIR%" 2>nul
     if errorlevel 1 (
-        echo [错误] 无法切换到目录: %SCRIPT_DIR%
-        exit /b 1
+        REM 兼容旧版 Windows
+        cd "%SCRIPT_DIR%" 2>nul
+        if errorlevel 1 (
+            echo [错误] 无法切换到目录: %SCRIPT_DIR%
+            exit /b 1
+        )
     )
     echo [成功] 已切换到正确的 n8n 项目目录
     exit /b 0
@@ -162,38 +222,84 @@ exit /b 0
 
 :check_dependencies
 REM 检查 Node.js
-where node >nul 2>nul
+where node >nul 2>&1
 if errorlevel 1 (
-    echo [错误] Node.js 未安装或未在 PATH 中
-    exit /b 1
+    REM 尝试常见的 Node.js 安装路径
+    if exist "C:\Program Files\nodejs\node.exe" (
+        set "PATH=C:\Program Files\nodejs;%PATH%"
+    ) else if exist "C:\Program Files (x86)\nodejs\node.exe" (
+        set "PATH=C:\Program Files (x86)\nodejs;%PATH%"
+    ) else (
+        echo [错误] Node.js 未安装或未在 PATH 中
+        echo [信息] 请访问 https://nodejs.org 下载安装
+        exit /b 1
+    )
 )
 
-REM 检查 pnpm
-where pnpm >nul 2>nul
-if errorlevel 1 (
-    echo [错误] pnpm 未安装或未在 PATH 中
-    echo [信息] 请先安装 pnpm: npm install -g pnpm
-    exit /b 1
+echo [信息] Node.js 版本:
+node --version
+
+REM 检查包管理器
+if not defined USE_NPM (
+    where pnpm >nul 2>&1
+    if errorlevel 1 (
+        echo [警告] pnpm 未安装，尝试使用 npm
+        set "USE_NPM=true"
+    ) else (
+        echo [信息] 使用 pnpm 作为包管理器
+    )
+) else (
+    echo [信息] 使用 npm 作为包管理器
 )
 
 echo [成功] 依赖检查通过
 exit /b 0
 
+:install_with_pnpm
+echo [信息] 使用 pnpm 安装依赖...
+where pnpm >nul 2>&1
+if errorlevel 1 (
+    echo [信息] 正在安装 pnpm...
+    call npm install -g pnpm@8
+    if errorlevel 1 (
+        echo [错误] pnpm 安装失败
+        exit /b 1
+    )
+)
+call pnpm install --no-frozen-lockfile
+exit /b %errorlevel%
+
+:install_with_npm
+echo [警告] 使用 npm 安装（可能不兼容 workspace）
+echo [信息] 建议安装 pnpm: npm install -g pnpm
+call npm install --legacy-peer-deps
+exit /b %errorlevel%
+
 :check_port
 REM 检查端口 5678 是否被占用
-netstat -ano | findstr :5678 >nul 2>nul
+netstat -ano 2>nul | findstr ":5678" >nul 2>&1
 if not errorlevel 1 (
     echo [警告] 端口 5678 已被占用
     echo [信息] 正在查看占用进程...
-    netstat -ano | findstr :5678
+    netstat -ano | findstr ":5678"
+    echo.
     
-    set /p "kill_process=是否杀死占用进程？(y/N): "
+    set /p "kill_process=是否终止占用进程？(y/N): "
     if /I "!kill_process!"=="y" (
         echo [信息] 正在终止占用进程...
-        for /f "tokens=5" %%a in ('netstat -ano ^| findstr :5678') do (
-            taskkill /PID %%a /F >nul 2>nul
+        for /f "tokens=5" %%a in ('netstat -ano ^| findstr ":5678"') do (
+            taskkill /PID %%a /F >nul 2>&1
+            if errorlevel 1 (
+                REM Windows 7 兼容性
+                tskill %%a >nul 2>&1
+            )
         )
         echo [成功] 进程已终止
+        timeout /t 2 /nobreak >nul 2>&1
+        if errorlevel 1 (
+            REM Windows 7 兼容性
+            ping -n 3 127.0.0.1 >nul
+        )
     ) else (
         echo [错误] 无法启动 n8n，端口被占用
         exit /b 1
@@ -205,11 +311,15 @@ exit /b 0
 echo [信息] 正在停止现有的 n8n 进程...
 
 REM 停止可能存在的 n8n 相关进程
-taskkill /F /IM node.exe /FI "WINDOWTITLE eq *n8n*" >nul 2>nul
-taskkill /F /IM node.exe /FI "WINDOWTITLE eq *pnpm*" >nul 2>nul
+taskkill /F /IM node.exe /FI "WINDOWTITLE eq *n8n*" >nul 2>&1
+taskkill /F /IM node.exe /FI "WINDOWTITLE eq *pnpm*" >nul 2>&1
+taskkill /F /IM node.exe /FI "WINDOWTITLE eq *npm*" >nul 2>&1
 
-REM 等待2秒
-timeout /t 2 /nobreak >nul
+REM 等待
+timeout /t 2 /nobreak >nul 2>&1
+if errorlevel 1 (
+    ping -n 3 127.0.0.1 >nul
+)
 
 echo [成功] 已停止现有进程
 exit /b 0
@@ -222,69 +332,78 @@ set "N8N_SECURE_COOKIE=false"
 set "DB_SQLITE_POOL_SIZE=5"
 set "N8N_RUNNERS_ENABLED=true"
 set "N8N_BLOCK_ENV_ACCESS_IN_NODE=false"
+set "NODE_OPTIONS=--max-old-space-size=4096"
 
 echo [成功] 环境变量已设置
 echo   - N8N_DEFAULT_LOCALE=zh-CN
 echo   - N8N_SECURE_COOKIE=false
 echo   - DB_SQLITE_POOL_SIZE=5
+echo   - NODE_OPTIONS=--max-old-space-size=4096
 exit /b 0
 
 :check_build
-if not exist "packages\cli\dist\" (
-    goto need_build
-)
-if not exist "packages\core\dist\" (
-    goto need_build
-)
+if not exist "packages\cli\dist\" goto need_build
+if not exist "packages\core\dist\" goto need_build
+if not exist "packages\workflow\dist\" goto need_build
 exit /b 0
 
 :need_build
 echo [警告] 检测到项目需要构建
 set /p "build_project=是否现在构建项目？这可能需要几分钟时间 (y/N): "
 if /I "!build_project!"=="y" (
-    echo [信息] 正在构建项目...
-    call pnpm build > build.log 2>&1
-    if errorlevel 1 (
-        echo [错误] 构建失败，请查看 build.log
-        type build.log | more
-        exit /b 1
-    )
-    echo [成功] 项目构建完成
+    call :build_project
 )
 exit /b 0
 
+:build_project
+echo [信息] 正在构建项目...
+if defined USE_NPM (
+    call npm run build > build.log 2>&1
+) else (
+    call pnpm build > build.log 2>&1
+)
+if errorlevel 1 (
+    echo [错误] 构建失败，请查看 build.log
+    type build.log | more
+    exit /b 1
+)
+echo [成功] 项目构建完成
+exit /b 0
+
 :start_n8n
 echo [信息] 正在启动 n8n 中文版...
 
-REM 创建日志文件名
-for /f "tokens=2-4 delims=/ " %%a in ('date /t') do (
-    set "today=%%c%%a%%b"
-)
-for /f "tokens=1-2 delims=: " %%a in ('time /t') do (
-    set "now=%%a%%b"
-)
-set "LOG_FILE=n8n-%today%-%now%.log"
-set "LOG_FILE=%LOG_FILE: =%"
+REM 创建日志文件名（兼容不同日期格式）
+set "LOG_FILE=n8n-%date:~0,4%%date:~5,2%%date:~8,2%-%time:~0,2%%time:~3,2%.log"
+set "LOG_FILE=%LOG_FILE: =0%"
 
-echo 正在启动 n8n 服务...
+echo [信息] 正在启动 n8n 服务...
+echo [信息] 日志文件: %LOG_FILE%
 
-REM 启动 n8n 在新窗口
-start "n8n Server" /B cmd /c "pnpm start > %LOG_FILE% 2>&1"
+REM 启动 n8n
+if defined USE_NPM (
+    start "n8n Server" /B cmd /c "npm start > %LOG_FILE% 2>&1"
+) else (
+    start "n8n Server" /B cmd /c "pnpm start > %LOG_FILE% 2>&1"
+)
 
 REM 等待启动
 echo 等待 n8n 启动
 set "count=0"
 :wait_loop
 set /a count+=1
-if %count% gtr 30 goto start_failed
+if %count% gtr 60 goto start_failed
 
 REM 检查端口是否开启
-netstat -an | findstr :5678 | findstr LISTENING >nul 2>nul
+netstat -an 2>nul | findstr ":5678" | findstr "LISTENING" >nul 2>&1
 if not errorlevel 1 goto start_success
 
-REM 显示进度点
-<nul set /p "=."
-timeout /t 1 /nobreak >nul
+REM 显示进度
+set /p "=." <nul
+timeout /t 1 /nobreak >nul 2>&1
+if errorlevel 1 (
+    ping -n 2 127.0.0.1 >nul
+)
 goto wait_loop
 
 :start_success
@@ -292,23 +411,15 @@ echo.
 echo [成功] n8n 启动成功！
 echo.
 echo ========== 启动信息 ==========
-echo 📱 访问地址: http://localhost:5678
-echo 🌏 界面语言: 中文 (zh-CN)
-echo 📝 日志文件: %LOG_FILE%
+echo 访问地址: http://localhost:5678
+echo 界面语言: 中文 (zh-CN)
+echo 日志文件: %LOG_FILE%
 echo =============================
 echo.
 echo [信息] 使用 Ctrl+C 停止服务
+echo [提示] 首次访问需要设置账户
 echo.
-echo [提示] 正在监控日志输出...
-echo.
-
-REM 持续显示日志
-:tail_log
-if exist "%LOG_FILE%" (
-    type "%LOG_FILE%"
-    timeout /t 2 /nobreak >nul
-    goto tail_log
-)
+pause
 exit /b 0
 
 :start_failed
@@ -316,32 +427,49 @@ echo.
 echo [错误] n8n 启动失败
 echo [信息] 查看日志文件: %LOG_FILE%
 if exist "%LOG_FILE%" (
+    echo.
+    echo ===== 错误日志 =====
     type "%LOG_FILE%" | more
 )
+pause
 exit /b 1
 
 :show_help
 echo 用法: %~nx0 [选项]
 echo.
 echo 选项:
-echo   -h, --help     显示此帮助信息
-echo   -d, --dev      使用开发模式启动 (支持热重载)
-echo   -b, --build    强制重新构建项目
-echo   -c, --check    仅检查系统状态，不启动
+echo   -h, --help      显示此帮助信息
+echo   -d, --dev       使用开发模式启动 (支持热重载)
+echo   -b, --build     强制重新构建项目
+echo   -c, --check     仅检查系统状态，不启动
+echo   --skip-deps     跳过依赖检查
+echo   --npm           使用 npm 替代 pnpm
 echo.
 echo 示例:
-echo   %~nx0              # 正常启动
-echo   %~nx0 -d           # 开发模式启动
-echo   %~nx0 -b           # 重新构建并启动
+echo   %~nx0               # 正常启动
+echo   %~nx0 -d            # 开发模式启动
+echo   %~nx0 -b            # 重新构建并启动
+echo   %~nx0 --npm         # 使用 npm 启动
+echo.
+echo 故障排除:
+echo   1. 如果 pnpm 安装失败，使用 --npm 选项
+echo   2. 如果端口被占用，脚本会提示终止进程
+echo   3. 构建失败时查看 build.log 文件
 echo.
 goto end
 
 :error_exit
 echo [错误] 脚本执行失败
+echo.
+echo 常见问题解决:
+echo 1. 确保 Node.js 版本为 18.x 或 20.x
+echo 2. 尝试使用管理员权限运行
+echo 3. 使用 --npm 选项如果 pnpm 有问题
+echo 4. 检查网络连接和代理设置
+echo.
 pause
 exit /b 1
 
 :end
 endlocal
-pause
 exit /b 0
\ No newline at end of file
diff --git a/web_frontend/exhibition-demo/public/web_result/css/animations.css b/web_frontend/exhibition-demo/public/web_result/css/animations.css
new file mode 100644
index 00000000..02841e1d
--- /dev/null
+++ b/web_frontend/exhibition-demo/public/web_result/css/animations.css
@@ -0,0 +1,919 @@
+/* 2024长三角国际新能源汽车与智能交通产业博览会 - 高级动画样式 */
+
+/* ============================================
+   字体图标引入
+   ============================================ */
+@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css');
+
+/* ============================================
+   自定义字体
+   ============================================ */
+@font-face {
+  font-family: 'TechFont';
+  src: url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700;900&display=swap');
+}
+
+/* ============================================
+   核心动画变量
+   ============================================ */
+:root {
+  /* 动画时长 */
+  --anim-fast: 0.2s;
+  --anim-normal: 0.3s;
+  --anim-slow: 0.5s;
+  --anim-slower: 0.8s;
+  --anim-slowest: 1.2s;
+  
+  /* 缓动函数 */
+  --ease-bounce: cubic-bezier(0.68, -0.55, 0.265, 1.55);
+  --ease-elastic: cubic-bezier(0.68, -0.55, 0.265, 1.55);
+  --ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);
+  --ease-sharp: cubic-bezier(0.4, 0, 0.6, 1);
+  
+  /* 渐变色 */
+  --gradient-electric: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  --gradient-ocean: linear-gradient(135deg, #667eea 0%, #42e695 100%);
+  --gradient-sunset: linear-gradient(135deg, #fa709a 0%, #fee140 100%);
+  --gradient-aurora: linear-gradient(135deg, #42e695 0%, #3bb2b8 100%);
+}
+
+/* ============================================
+   基础动画类
+   ============================================ */
+/* 淡入向上动画 */
+.animate-fadeInUp {
+  opacity: 0;
+  transform: translateY(30px);
+  animation: fadeInUp 0.8s ease-out forwards;
+}
+
+@keyframes fadeInUp {
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+/* 淡入向左动画 */
+.animate-fadeInLeft {
+  opacity: 0;
+  transform: translateX(-30px);
+  animation: fadeInLeft 0.8s ease-out forwards;
+}
+
+@keyframes fadeInLeft {
+  to {
+    opacity: 1;
+    transform: translateX(0);
+  }
+}
+
+/* 淡入向右动画 */
+.animate-fadeInRight {
+  opacity: 0;
+  transform: translateX(30px);
+  animation: fadeInRight 0.8s ease-out forwards;
+}
+
+@keyframes fadeInRight {
+  to {
+    opacity: 1;
+    transform: translateX(0);
+  }
+}
+
+/* 动画延迟类 */
+.animation-delay-100 { animation-delay: 0.1s; }
+.animation-delay-200 { animation-delay: 0.2s; }
+.animation-delay-300 { animation-delay: 0.3s; }
+.animation-delay-400 { animation-delay: 0.4s; }
+.animation-delay-500 { animation-delay: 0.5s; }
+.animation-delay-600 { animation-delay: 0.6s; }
+.animation-delay-700 { animation-delay: 0.7s; }
+.animation-delay-800 { animation-delay: 0.8s; }
+.animation-delay-900 { animation-delay: 0.9s; }
+.animation-delay-1000 { animation-delay: 1s; }
+.animation-delay-1100 { animation-delay: 1.1s; }
+.animation-delay-2000 { animation-delay: 2s; }
+.animation-delay-4000 { animation-delay: 4s; }
+
+/* ============================================
+   页面加载动画
+   ============================================ */
+.page-loader {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  z-index: 9999;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  animation: fadeOut 0.5s ease-out 1s forwards;
+}
+
+.loader-content {
+  text-align: center;
+}
+
+.loader-logo {
+  width: 100px;
+  height: 100px;
+  margin: 0 auto 20px;
+  background: white;
+  border-radius: 20px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  animation: pulse 1s infinite;
+}
+
+.loader-text {
+  color: white;
+  font-size: 1.2rem;
+  animation: fadeInUp 0.5s ease-out;
+}
+
+.loader-progress {
+  width: 200px;
+  height: 4px;
+  background: rgba(255, 255, 255, 0.3);
+  border-radius: 2px;
+  margin: 20px auto;
+  overflow: hidden;
+}
+
+.loader-progress-bar {
+  width: 0%;
+  height: 100%;
+  background: white;
+  animation: loading 1s ease-out forwards;
+}
+
+@keyframes loading {
+  to { width: 100%; }
+}
+
+/* ============================================
+   入场动画
+   ============================================ */
+.fade-in {
+  opacity: 0;
+  animation: fadeIn var(--anim-slow) ease-out forwards;
+}
+
+@keyframes fadeIn {
+  to {
+    opacity: 1;
+  }
+}
+
+.fade-in-up {
+  opacity: 0;
+  transform: translateY(30px);
+  animation: fadeInUp var(--anim-slow) ease-out forwards;
+}
+
+@keyframes fadeInUp {
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+.fade-in-down {
+  opacity: 0;
+  transform: translateY(-30px);
+  animation: fadeInDown var(--anim-slow) ease-out forwards;
+}
+
+@keyframes fadeInDown {
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+.fade-in-left {
+  opacity: 0;
+  transform: translateX(-30px);
+  animation: fadeInLeft var(--anim-slow) ease-out forwards;
+}
+
+@keyframes fadeInLeft {
+  to {
+    opacity: 1;
+    transform: translateX(0);
+  }
+}
+
+.fade-in-right {
+  opacity: 0;
+  transform: translateX(30px);
+  animation: fadeInRight var(--anim-slow) ease-out forwards;
+}
+
+@keyframes fadeInRight {
+  to {
+    opacity: 1;
+    transform: translateX(0);
+  }
+}
+
+/* ============================================
+   缩放动画
+   ============================================ */
+.zoom-in {
+  opacity: 0;
+  transform: scale(0.8);
+  animation: zoomIn var(--anim-slow) var(--ease-bounce) forwards;
+}
+
+@keyframes zoomIn {
+  to {
+    opacity: 1;
+    transform: scale(1);
+  }
+}
+
+.zoom-out {
+  opacity: 0;
+  transform: scale(1.2);
+  animation: zoomOut var(--anim-slow) var(--ease-bounce) forwards;
+}
+
+@keyframes zoomOut {
+  to {
+    opacity: 1;
+    transform: scale(1);
+  }
+}
+
+/* ============================================
+   旋转动画
+   ============================================ */
+.rotate-in {
+  opacity: 0;
+  transform: rotate(-180deg) scale(0.8);
+  animation: rotateIn var(--anim-slow) var(--ease-bounce) forwards;
+}
+
+@keyframes rotateIn {
+  to {
+    opacity: 1;
+    transform: rotate(0) scale(1);
+  }
+}
+
+.flip-in-x {
+  opacity: 0;
+  transform: rotateX(-90deg);
+  animation: flipInX var(--anim-slow) ease-out forwards;
+}
+
+@keyframes flipInX {
+  to {
+    opacity: 1;
+    transform: rotateX(0);
+  }
+}
+
+.flip-in-y {
+  opacity: 0;
+  transform: rotateY(-90deg);
+  animation: flipInY var(--anim-slow) ease-out forwards;
+}
+
+@keyframes flipInY {
+  to {
+    opacity: 1;
+    transform: rotateY(0);
+  }
+}
+
+/* ============================================
+   弹跳动画
+   ============================================ */
+.bounce-in {
+  opacity: 0;
+  transform: scale(0.3);
+  animation: bounceIn var(--anim-slower) var(--ease-bounce) forwards;
+}
+
+@keyframes bounceIn {
+  0% {
+    opacity: 0;
+    transform: scale(0.3);
+  }
+  50% {
+    opacity: 1;
+    transform: scale(1.05);
+  }
+  70% {
+    transform: scale(0.9);
+  }
+  100% {
+    opacity: 1;
+    transform: scale(1);
+  }
+}
+
+/* ============================================
+   悬停效果
+   ============================================ */
+.hover-grow {
+  transition: transform var(--anim-normal) var(--ease-smooth);
+}
+
+.hover-grow:hover {
+  transform: scale(1.05);
+}
+
+.hover-shrink {
+  transition: transform var(--anim-normal) var(--ease-smooth);
+}
+
+.hover-shrink:hover {
+  transform: scale(0.95);
+}
+
+.hover-rotate {
+  transition: transform var(--anim-normal) var(--ease-smooth);
+}
+
+.hover-rotate:hover {
+  transform: rotate(5deg);
+}
+
+.hover-lift {
+  transition: all var(--anim-normal) var(--ease-smooth);
+}
+
+.hover-lift:hover {
+  transform: translateY(-8px);
+  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
+}
+
+.hover-sink {
+  transition: all var(--anim-normal) var(--ease-smooth);
+}
+
+.hover-sink:hover {
+  transform: translateY(3px);
+  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
+}
+
+/* ============================================
+   按钮悬停效果
+   ============================================ */
+.btn-hover-fill {
+  position: relative;
+  overflow: hidden;
+  transition: color var(--anim-normal);
+  z-index: 1;
+}
+
+.btn-hover-fill::before {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: -100%;
+  width: 100%;
+  height: 100%;
+  background: var(--gradient-electric);
+  transition: left var(--anim-normal) var(--ease-smooth);
+  z-index: -1;
+}
+
+.btn-hover-fill:hover::before {
+  left: 0;
+}
+
+.btn-hover-fill:hover {
+  color: white;
+}
+
+/* 按钮波纹效果 */
+.btn-ripple {
+  position: relative;
+  overflow: hidden;
+}
+
+.btn-ripple::after {
+  content: '';
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  width: 0;
+  height: 0;
+  border-radius: 50%;
+  background: rgba(255, 255, 255, 0.5);
+  transform: translate(-50%, -50%);
+  transition: width 0.6s, height 0.6s;
+}
+
+.btn-ripple:active::after {
+  width: 300px;
+  height: 300px;
+}
+
+/* 按钮发光效果 */
+.btn-glow {
+  transition: all var(--anim-normal);
+}
+
+.btn-glow:hover {
+  box-shadow: 0 0 20px rgba(102, 126, 234, 0.6),
+              0 0 40px rgba(102, 126, 234, 0.4),
+              0 0 60px rgba(102, 126, 234, 0.2);
+}
+
+/* ============================================
+   图片悬停效果
+   ============================================ */
+.img-hover-zoom {
+  overflow: hidden;
+}
+
+.img-hover-zoom img {
+  transition: transform var(--anim-slow) var(--ease-smooth);
+}
+
+.img-hover-zoom:hover img {
+  transform: scale(1.1);
+}
+
+.img-hover-rotate {
+  overflow: hidden;
+}
+
+.img-hover-rotate img {
+  transition: transform var(--anim-slow) var(--ease-smooth);
+}
+
+.img-hover-rotate:hover img {
+  transform: scale(1.1) rotate(3deg);
+}
+
+.img-hover-blur {
+  overflow: hidden;
+}
+
+.img-hover-blur img {
+  transition: all var(--anim-slow) var(--ease-smooth);
+}
+
+.img-hover-blur:hover img {
+  filter: blur(3px);
+  transform: scale(1.1);
+}
+
+/* 图片叠加效果 */
+.img-overlay {
+  position: relative;
+  overflow: hidden;
+}
+
+.img-overlay::before {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background: linear-gradient(135deg, rgba(102, 126, 234, 0.8), rgba(118, 75, 162, 0.8));
+  opacity: 0;
+  transition: opacity var(--anim-normal);
+  z-index: 1;
+}
+
+.img-overlay:hover::before {
+  opacity: 1;
+}
+
+.img-overlay-content {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  color: white;
+  text-align: center;
+  opacity: 0;
+  transition: opacity var(--anim-normal);
+  z-index: 2;
+}
+
+.img-overlay:hover .img-overlay-content {
+  opacity: 1;
+}
+
+/* ============================================
+   文字动画
+   ============================================ */
+.text-glow {
+  animation: textGlow 2s ease-in-out infinite alternate;
+}
+
+@keyframes textGlow {
+  from {
+    text-shadow: 0 0 10px rgba(102, 126, 234, 0.5),
+                 0 0 20px rgba(102, 126, 234, 0.3);
+  }
+  to {
+    text-shadow: 0 0 20px rgba(102, 126, 234, 0.8),
+                 0 0 30px rgba(102, 126, 234, 0.5);
+  }
+}
+
+.text-typing {
+  overflow: hidden;
+  border-right: 2px solid;
+  white-space: nowrap;
+  animation: typing 3.5s steps(40, end),
+             blink-caret 0.75s step-end infinite;
+}
+
+@keyframes typing {
+  from { width: 0; }
+  to { width: 100%; }
+}
+
+@keyframes blink-caret {
+  from, to { border-color: transparent; }
+  50% { border-color: currentColor; }
+}
+
+.text-gradient-animate {
+  background: linear-gradient(90deg, #667eea, #764ba2, #42e695, #667eea);
+  background-size: 300% 100%;
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  background-clip: text;
+  animation: gradientMove 5s ease infinite;
+}
+
+@keyframes gradientMove {
+  0% { background-position: 0% 50%; }
+  50% { background-position: 100% 50%; }
+  100% { background-position: 0% 50%; }
+}
+
+/* ============================================
+   卡片动画
+   ============================================ */
+.card-3d {
+  transform-style: preserve-3d;
+  transition: transform var(--anim-slow) var(--ease-smooth);
+}
+
+.card-3d:hover {
+  transform: rotateY(10deg) rotateX(10deg) translateZ(20px);
+}
+
+.card-flip {
+  position: relative;
+  transform-style: preserve-3d;
+  transition: transform var(--anim-slow);
+}
+
+.card-flip:hover {
+  transform: rotateY(180deg);
+}
+
+.card-flip-front,
+.card-flip-back {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  backface-visibility: hidden;
+}
+
+.card-flip-back {
+  transform: rotateY(180deg);
+}
+
+/* ============================================
+   滚动动画
+   ============================================ */
+.scroll-reveal {
+  opacity: 0;
+  transform: translateY(50px);
+  transition: all var(--anim-slower) var(--ease-smooth);
+}
+
+.scroll-reveal.revealed {
+  opacity: 1;
+  transform: translateY(0);
+}
+
+.scroll-reveal-left {
+  opacity: 0;
+  transform: translateX(-50px);
+  transition: all var(--anim-slower) var(--ease-smooth);
+}
+
+.scroll-reveal-left.revealed {
+  opacity: 1;
+  transform: translateX(0);
+}
+
+.scroll-reveal-right {
+  opacity: 0;
+  transform: translateX(50px);
+  transition: all var(--anim-slower) var(--ease-smooth);
+}
+
+.scroll-reveal-right.revealed {
+  opacity: 1;
+  transform: translateX(0);
+}
+
+.scroll-reveal-scale {
+  opacity: 0;
+  transform: scale(0.8);
+  transition: all var(--anim-slower) var(--ease-smooth);
+}
+
+.scroll-reveal-scale.revealed {
+  opacity: 1;
+  transform: scale(1);
+}
+
+/* ============================================
+   视差效果
+   ============================================ */
+.parallax {
+  position: relative;
+  transform-style: preserve-3d;
+}
+
+.parallax-layer {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+
+.parallax-layer-back {
+  transform: translateZ(-1px) scale(2);
+}
+
+.parallax-layer-base {
+  transform: translateZ(0);
+}
+
+.parallax-layer-front {
+  transform: translateZ(1px) scale(0.5);
+}
+
+/* ============================================
+   加载动画
+   ============================================ */
+.skeleton {
+  position: relative;
+  overflow: hidden;
+  background: #f0f0f0;
+}
+
+.skeleton::after {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: -100%;
+  width: 100%;
+  height: 100%;
+  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.5), transparent);
+  animation: skeleton-loading 1.5s infinite;
+}
+
+@keyframes skeleton-loading {
+  to {
+    left: 100%;
+  }
+}
+
+/* ============================================
+   脉冲动画
+   ============================================ */
+.pulse {
+  animation: pulse 2s infinite;
+}
+
+@keyframes pulse {
+  0% {
+    transform: scale(1);
+    opacity: 1;
+  }
+  50% {
+    transform: scale(1.05);
+    opacity: 0.8;
+  }
+  100% {
+    transform: scale(1);
+    opacity: 1;
+  }
+}
+
+.pulse-slow {
+  animation: pulse 3s infinite;
+}
+
+.pulse-fast {
+  animation: pulse 1s infinite;
+}
+
+/* ============================================
+   抖动动画
+   ============================================ */
+.shake {
+  animation: shake 0.5s;
+}
+
+@keyframes shake {
+  0%, 100% { transform: translateX(0); }
+  10%, 30%, 50%, 70%, 90% { transform: translateX(-10px); }
+  20%, 40%, 60%, 80% { transform: translateX(10px); }
+}
+
+.shake-horizontal {
+  animation: shakeHorizontal 0.5s;
+}
+
+@keyframes shakeHorizontal {
+  0%, 100% { transform: translateX(0); }
+  25% { transform: translateX(-5px); }
+  75% { transform: translateX(5px); }
+}
+
+/* ============================================
+   浮动动画
+   ============================================ */
+.float {
+  animation: float 3s ease-in-out infinite;
+}
+
+@keyframes float {
+  0%, 100% { transform: translateY(0); }
+  50% { transform: translateY(-20px); }
+}
+
+.float-slow {
+  animation: float 5s ease-in-out infinite;
+}
+
+.float-fast {
+  animation: float 2s ease-in-out infinite;
+}
+
+/* ============================================
+   闪烁动画
+   ============================================ */
+.blink {
+  animation: blink 1s infinite;
+}
+
+@keyframes blink {
+  0%, 100% { opacity: 1; }
+  50% { opacity: 0; }
+}
+
+.flash {
+  animation: flash 0.5s;
+}
+
+@keyframes flash {
+  0%, 50%, 100% { opacity: 1; }
+  25%, 75% { opacity: 0; }
+}
+
+/* ============================================
+   渐变背景动画
+   ============================================ */
+.bg-gradient-animate {
+  background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
+  background-size: 400% 400%;
+  animation: gradientShift 15s ease infinite;
+}
+
+@keyframes gradientShift {
+  0% { background-position: 0% 50%; }
+  50% { background-position: 100% 50%; }
+  100% { background-position: 0% 50%; }
+}
+
+/* ============================================
+   光标跟随效果
+   ============================================ */
+.cursor-follow {
+  position: fixed;
+  width: 20px;
+  height: 20px;
+  border: 2px solid #667eea;
+  border-radius: 50%;
+  pointer-events: none;
+  transition: all 0.1s ease;
+  z-index: 9999;
+}
+
+.cursor-follow.active {
+  transform: scale(2);
+  background: rgba(102, 126, 234, 0.1);
+}
+
+/* ============================================
+   工具提示
+   ============================================ */
+.tooltip {
+  position: relative;
+}
+
+.tooltip::after {
+  content: attr(data-tooltip);
+  position: absolute;
+  bottom: 125%;
+  left: 50%;
+  transform: translateX(-50%) scale(0);
+  background: #333;
+  color: white;
+  padding: 8px 12px;
+  border-radius: 6px;
+  font-size: 14px;
+  white-space: nowrap;
+  opacity: 0;
+  transition: all var(--anim-normal) var(--ease-smooth);
+  pointer-events: none;
+}
+
+.tooltip::before {
+  content: '';
+  position: absolute;
+  bottom: 115%;
+  left: 50%;
+  transform: translateX(-50%) scale(0);
+  border: 6px solid transparent;
+  border-top-color: #333;
+  opacity: 0;
+  transition: all var(--anim-normal) var(--ease-smooth);
+}
+
+.tooltip:hover::after,
+.tooltip:hover::before {
+  transform: translateX(-50%) scale(1);
+  opacity: 1;
+}
+
+/* ============================================
+   交错动画
+   ============================================ */
+.stagger-children > * {
+  opacity: 0;
+  transform: translateY(20px);
+  animation: staggerIn var(--anim-slow) var(--ease-smooth) forwards;
+}
+
+.stagger-children > *:nth-child(1) { animation-delay: 0.1s; }
+.stagger-children > *:nth-child(2) { animation-delay: 0.2s; }
+.stagger-children > *:nth-child(3) { animation-delay: 0.3s; }
+.stagger-children > *:nth-child(4) { animation-delay: 0.4s; }
+.stagger-children > *:nth-child(5) { animation-delay: 0.5s; }
+.stagger-children > *:nth-child(6) { animation-delay: 0.6s; }
+.stagger-children > *:nth-child(7) { animation-delay: 0.7s; }
+.stagger-children > *:nth-child(8) { animation-delay: 0.8s; }
+
+@keyframes staggerIn {
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+/* ============================================
+   模糊背景
+   ============================================ */
+.blur-background {
+  backdrop-filter: blur(10px);
+  background: rgba(255, 255, 255, 0.8);
+}
+
+.glass-morphism {
+  background: rgba(255, 255, 255, 0.1);
+  backdrop-filter: blur(10px);
+  border: 1px solid rgba(255, 255, 255, 0.2);
+  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
+}
+
+/* ============================================
+   响应式动画
+   ============================================ */
+@media (prefers-reduced-motion: reduce) {
+  *,
+  *::before,
+  *::after {
+    animation-duration: 0.01ms !important;
+    animation-iteration-count: 1 !important;
+    transition-duration: 0.01ms !important;
+  }
+}
\ No newline at end of file
diff --git a/web_frontend/exhibition-demo/public/web_result/css/styles.css b/web_frontend/exhibition-demo/public/web_result/css/styles.css
new file mode 100644
index 00000000..5837176f
--- /dev/null
+++ b/web_frontend/exhibition-demo/public/web_result/css/styles.css
@@ -0,0 +1,454 @@
+/* 2024长三角国际新能源汽车与智能交通产业博览会 - 全局样式 */
+
+/* 根变量定义 */
+:root {
+  /* 主题色彩系统 */
+  --primary-gradient-start: #10b981;
+  --primary-gradient-end: #3b82f6;
+  --secondary-gradient-start: #8b5cf6;
+  --secondary-gradient-end: #ec4899;
+  --accent-gradient-start: #f59e0b;
+  --accent-gradient-end: #ef4444;
+  
+  /* 中性色 */
+  --gray-50: #f9fafb;
+  --gray-100: #f3f4f6;
+  --gray-200: #e5e7eb;
+  --gray-300: #d1d5db;
+  --gray-400: #9ca3af;
+  --gray-500: #6b7280;
+  --gray-600: #4b5563;
+  --gray-700: #374151;
+  --gray-800: #1f2937;
+  --gray-900: #111827;
+  
+  /* 间距系统 */
+  --spacing-xs: 0.5rem;
+  --spacing-sm: 1rem;
+  --spacing-md: 1.5rem;
+  --spacing-lg: 2rem;
+  --spacing-xl: 3rem;
+  --spacing-2xl: 4rem;
+  
+  /* 动画时长 */
+  --transition-fast: 150ms;
+  --transition-base: 300ms;
+  --transition-slow: 500ms;
+  --transition-slower: 700ms;
+  
+  /* 阴影 */
+  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
+  --shadow-base: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
+  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
+  --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
+  
+  /* 圆角 */
+  --radius-sm: 0.375rem;
+  --radius-base: 0.5rem;
+  --radius-lg: 0.75rem;
+  --radius-xl: 1rem;
+  --radius-full: 9999px;
+}
+
+/* 全局重置和基础样式 */
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+html {
+  scroll-behavior: smooth;
+  font-size: 16px;
+}
+
+body {
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Noto Sans SC', 'Microsoft YaHei', sans-serif;
+  line-height: 1.6;
+  color: var(--gray-800);
+  background-color: var(--gray-50);
+}
+
+/* 渐变背景动画 */
+@keyframes gradientShift {
+  0% { background-position: 0% 50%; }
+  50% { background-position: 100% 50%; }
+  100% { background-position: 0% 50%; }
+}
+
+.gradient-bg {
+  background: linear-gradient(-45deg, 
+    var(--primary-gradient-start), 
+    var(--primary-gradient-end), 
+    var(--secondary-gradient-start), 
+    var(--secondary-gradient-end));
+  background-size: 400% 400%;
+  animation: gradientShift 15s ease infinite;
+}
+
+.gradient-primary {
+  background: linear-gradient(135deg, var(--primary-gradient-start), var(--primary-gradient-end));
+}
+
+.gradient-secondary {
+  background: linear-gradient(135deg, var(--secondary-gradient-start), var(--secondary-gradient-end));
+}
+
+.gradient-accent {
+  background: linear-gradient(135deg, var(--accent-gradient-start), var(--accent-gradient-end));
+}
+
+/* 导航栏样式 */
+.navbar {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  z-index: 1000;
+  background: rgba(255, 255, 255, 0.95);
+  backdrop-filter: blur(10px);
+  box-shadow: var(--shadow-base);
+  transition: all var(--transition-base) ease;
+}
+
+.navbar.scrolled {
+  background: rgba(255, 255, 255, 0.98);
+  box-shadow: var(--shadow-lg);
+}
+
+.nav-link {
+  position: relative;
+  padding: var(--spacing-xs) var(--spacing-sm);
+  color: var(--gray-700);
+  text-decoration: none;
+  transition: color var(--transition-fast) ease;
+  overflow: hidden;
+}
+
+.nav-link::after {
+  content: '';
+  position: absolute;
+  bottom: 0;
+  left: 50%;
+  width: 0;
+  height: 2px;
+  background: linear-gradient(90deg, var(--primary-gradient-start), var(--primary-gradient-end));
+  transform: translateX(-50%);
+  transition: width var(--transition-base) ease;
+}
+
+.nav-link:hover::after,
+.nav-link.active::after {
+  width: 100%;
+}
+
+/* 卡片动画效果 */
+@keyframes cardFloat {
+  0%, 100% { transform: translateY(0); }
+  50% { transform: translateY(-10px); }
+}
+
+.card {
+  background: white;
+  border-radius: var(--radius-lg);
+  padding: var(--spacing-lg);
+  box-shadow: var(--shadow-base);
+  transition: all var(--transition-base) ease;
+  position: relative;
+  overflow: hidden;
+}
+
+.card::before {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  height: 4px;
+  background: linear-gradient(90deg, var(--primary-gradient-start), var(--primary-gradient-end));
+  transform: scaleX(0);
+  transform-origin: left;
+  transition: transform var(--transition-base) ease;
+}
+
+.card:hover {
+  transform: translateY(-5px);
+  box-shadow: var(--shadow-xl);
+}
+
+.card:hover::before {
+  transform: scaleX(1);
+}
+
+/* 按钮样式 */
+.btn {
+  display: inline-block;
+  padding: var(--spacing-sm) var(--spacing-lg);
+  border-radius: var(--radius-full);
+  font-weight: 600;
+  text-decoration: none;
+  transition: all var(--transition-base) ease;
+  position: relative;
+  overflow: hidden;
+  cursor: pointer;
+  border: none;
+  outline: none;
+}
+
+.btn-primary {
+  background: linear-gradient(135deg, var(--primary-gradient-start), var(--primary-gradient-end));
+  color: white;
+  box-shadow: 0 4px 15px rgba(16, 185, 129, 0.3);
+}
+
+.btn-primary:hover {
+  transform: translateY(-2px);
+  box-shadow: 0 6px 20px rgba(16, 185, 129, 0.4);
+}
+
+.btn-secondary {
+  background: white;
+  color: var(--gray-700);
+  border: 2px solid var(--gray-200);
+}
+
+.btn-secondary:hover {
+  background: var(--gray-50);
+  border-color: var(--primary-gradient-start);
+  color: var(--primary-gradient-start);
+}
+
+/* 波纹效果 */
+@keyframes ripple {
+  0% {
+    transform: scale(0);
+    opacity: 1;
+  }
+  100% {
+    transform: scale(4);
+    opacity: 0;
+  }
+}
+
+.ripple {
+  position: absolute;
+  border-radius: 50%;
+  background: rgba(255, 255, 255, 0.5);
+  animation: ripple 0.6s ease-out;
+  pointer-events: none;
+}
+
+/* 加载动画 */
+@keyframes spin {
+  0% { transform: rotate(0deg); }
+  100% { transform: rotate(360deg); }
+}
+
+.spinner {
+  display: inline-block;
+  width: 40px;
+  height: 40px;
+  border: 4px solid var(--gray-200);
+  border-top-color: var(--primary-gradient-start);
+  border-radius: 50%;
+  animation: spin 1s linear infinite;
+}
+
+/* 数字滚动动画 */
+@keyframes countUp {
+  from { opacity: 0; transform: translateY(20px); }
+  to { opacity: 1; transform: translateY(0); }
+}
+
+.count-up {
+  animation: countUp var(--transition-slow) ease-out;
+}
+
+/* 淡入动画 */
+@keyframes fadeIn {
+  from { opacity: 0; transform: translateY(20px); }
+  to { opacity: 1; transform: translateY(0); }
+}
+
+.fade-in {
+  animation: fadeIn var(--transition-slower) ease-out;
+}
+
+/* 滑入动画 */
+@keyframes slideInLeft {
+  from { opacity: 0; transform: translateX(-50px); }
+  to { opacity: 1; transform: translateX(0); }
+}
+
+@keyframes slideInRight {
+  from { opacity: 0; transform: translateX(50px); }
+  to { opacity: 1; transform: translateX(0); }
+}
+
+.slide-in-left {
+  animation: slideInLeft var(--transition-slow) ease-out;
+}
+
+.slide-in-right {
+  animation: slideInRight var(--transition-slow) ease-out;
+}
+
+/* 脉冲动画 */
+@keyframes pulse {
+  0%, 100% { transform: scale(1); opacity: 1; }
+  50% { transform: scale(1.05); opacity: 0.9; }
+}
+
+.pulse {
+  animation: pulse 2s ease-in-out infinite;
+}
+
+/* 光晕效果 */
+@keyframes glow {
+  0%, 100% { box-shadow: 0 0 20px rgba(16, 185, 129, 0.5); }
+  50% { box-shadow: 0 0 40px rgba(16, 185, 129, 0.8); }
+}
+
+.glow {
+  animation: glow 2s ease-in-out infinite;
+}
+
+/* 时间线样式 */
+.timeline {
+  position: relative;
+  padding-left: var(--spacing-xl);
+}
+
+.timeline::before {
+  content: '';
+  position: absolute;
+  left: 15px;
+  top: 0;
+  bottom: 0;
+  width: 2px;
+  background: linear-gradient(180deg, var(--primary-gradient-start), var(--primary-gradient-end));
+}
+
+.timeline-item {
+  position: relative;
+  padding-bottom: var(--spacing-xl);
+}
+
+.timeline-item::before {
+  content: '';
+  position: absolute;
+  left: -25px;
+  top: 5px;
+  width: 12px;
+  height: 12px;
+  border-radius: 50%;
+  background: var(--primary-gradient-start);
+  border: 3px solid white;
+  box-shadow: var(--shadow-base);
+}
+
+/* 网格布局动画 */
+.grid-item {
+  opacity: 0;
+  transform: scale(0.9);
+  animation: gridFadeIn var(--transition-slow) ease-out forwards;
+}
+
+@keyframes gridFadeIn {
+  to {
+    opacity: 1;
+    transform: scale(1);
+  }
+}
+
+.grid-item:nth-child(1) { animation-delay: 0.1s; }
+.grid-item:nth-child(2) { animation-delay: 0.2s; }
+.grid-item:nth-child(3) { animation-delay: 0.3s; }
+.grid-item:nth-child(4) { animation-delay: 0.4s; }
+.grid-item:nth-child(5) { animation-delay: 0.5s; }
+.grid-item:nth-child(6) { animation-delay: 0.6s; }
+
+/* 响应式设计 */
+@media (max-width: 768px) {
+  :root {
+    font-size: 14px;
+  }
+  
+  .card {
+    padding: var(--spacing-md);
+  }
+  
+  .timeline {
+    padding-left: var(--spacing-lg);
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  *,
+  *::before,
+  *::after {
+    animation-duration: 0.01ms !important;
+    animation-iteration-count: 1 !important;
+    transition-duration: 0.01ms !important;
+  }
+}
+
+/* 打印样式 */
+@media print {
+  .navbar,
+  .btn,
+  .no-print {
+    display: none !important;
+  }
+  
+  body {
+    font-size: 12pt;
+    color: black;
+    background: white;
+  }
+  
+  .card {
+    box-shadow: none;
+    border: 1px solid #ddd;
+    page-break-inside: avoid;
+  }
+}
+
+/* 辅助类 */
+.text-gradient {
+  background: linear-gradient(135deg, var(--primary-gradient-start), var(--primary-gradient-end));
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  background-clip: text;
+}
+
+.hover-scale {
+  transition: transform var(--transition-base) ease;
+}
+
+.hover-scale:hover {
+  transform: scale(1.05);
+}
+
+.hover-lift {
+  transition: transform var(--transition-base) ease;
+}
+
+.hover-lift:hover {
+  transform: translateY(-5px);
+}
+
+.overlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.7));
+}
+
+.container {
+  max-width: 1200px;
+  margin: 0 auto;
+  padding: 0 var(--spacing-md);
+}
\ No newline at end of file
diff --git a/web_frontend/exhibition-demo/public/web_result/index.html b/web_frontend/exhibition-demo/public/web_result/index.html
new file mode 100644
index 00000000..7e7e5375
--- /dev/null
+++ b/web_frontend/exhibition-demo/public/web_result/index.html
@@ -0,0 +1,604 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>2024长三角国际新能源汽车与智能交通产业博览会</title>
+    
+    <!-- 预加载关键资源 -->
+    <link rel="preload" href="css/styles.css" as="style">
+    <link rel="preload" href="css/animations.css" as="style">
+    
+    <!-- 样式表 -->
+    <link rel="stylesheet" href="css/styles.css">
+    <link rel="stylesheet" href="css/animations.css">
+    
+    <!-- Tailwind CSS -->
+    <link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
+    
+    <!-- 字体 -->
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Noto+Sans+SC:wght@300;400;500;700;900&family=Orbitron:wght@400;700;900&display=swap" rel="stylesheet">
+    
+    <!-- Font Awesome 图标 -->
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
+    <style>
+        * {
+            font-family: 'Inter', 'Noto Sans SC', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+        }
+        
+        .hero-gradient {
+            background: linear-gradient(135deg, 
+                rgba(16, 185, 129, 0.1) 0%, 
+                rgba(59, 130, 246, 0.1) 50%, 
+                rgba(139, 92, 246, 0.1) 100%);
+        }
+        
+        .image-shine {
+            position: relative;
+            overflow: hidden;
+        }
+        
+        .image-shine::before {
+            content: '';
+            position: absolute;
+            top: -50%;
+            left: -50%;
+            width: 200%;
+            height: 200%;
+            background: linear-gradient(
+                45deg,
+                transparent 30%,
+                rgba(255, 255, 255, 0.3) 50%,
+                transparent 70%
+            );
+            transform: rotate(45deg);
+            transition: all 0.6s;
+            opacity: 0;
+        }
+        
+        .image-shine:hover::before {
+            animation: shine 0.6s ease-in-out;
+        }
+        
+        @keyframes shine {
+            0% { transform: translateX(-100%) translateY(-100%) rotate(45deg); opacity: 0; }
+            50% { opacity: 1; }
+            100% { transform: translateX(100%) translateY(100%) rotate(45deg); opacity: 0; }
+        }
+        
+        .floating {
+            animation: floating 3s ease-in-out infinite;
+        }
+        
+        @keyframes floating {
+            0%, 100% { transform: translateY(0px); }
+            50% { transform: translateY(-20px); }
+        }
+        
+        /* 确保页面加载时body不能滚动 */
+        body.loading {
+            overflow: hidden;
+        }
+        
+        /* 图片加载优化 */
+        img {
+            background-color: #f3f4f6;
+            transition: opacity 0.3s ease;
+        }
+        
+        img.image-loaded {
+            opacity: 1;
+            animation: fadeIn 0.5s ease;
+        }
+        
+        img.image-error {
+            opacity: 0.5;
+            filter: grayscale(100%);
+        }
+        
+        @keyframes fadeIn {
+            from { opacity: 0; }
+            to { opacity: 1; }
+        }
+    </style>
+</head>
+<body class="bg-gray-50 loading">
+    <!-- 页面加载器 -->
+    <div class="page-loader" id="pageLoader">
+        <div class="loader-content">
+            <div class="loader-logo">
+                <i class="fas fa-car text-4xl text-emerald-500"></i>
+            </div>
+            <div class="loader-text">加载中...</div>
+            <div class="loader-progress">
+                <div class="loader-progress-bar"></div>
+            </div>
+        </div>
+    </div>
+
+    <!-- Navigation -->
+    <nav class="fixed top-0 w-full glass-morphism shadow-md z-50 transition-all duration-300" id="navbar">
+        <div class="container mx-auto px-6 py-4">
+            <div class="flex items-center justify-between">
+                <div class="flex items-center fade-in-left">
+                    <div class="w-10 h-10 bg-gradient-to-br from-emerald-400 to-blue-500 rounded-lg flex items-center justify-center mr-3">
+                        <i class="fas fa-charging-station text-white"></i>
+                    </div>
+                    <div>
+                        <h1 class="text-lg font-bold">NEVIT 2024</h1>
+                        <p class="text-xs text-gray-500">新能源汽车产业博览会</p>
+                    </div>
+                </div>
+                <div class="hidden md:flex space-x-8">
+                    <a href="index.html" class="nav-link active text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-home mr-2"></i>首页
+                    </a>
+                    <a href="pages/overview.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-info-circle mr-2"></i>展会概览
+                    </a>
+                    <a href="pages/exhibition.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-th-large mr-2"></i>展览内容
+                    </a>
+                    <a href="pages/marketing.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-bullhorn mr-2"></i>营销推广
+                    </a>
+                    <a href="pages/operation.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-cogs mr-2"></i>运营服务
+                    </a>
+                    <a href="pages/budget.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-chart-pie mr-2"></i>预算分析
+                    </a>
+                    <a href="pages/risk.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-shield-alt mr-2"></i>风险评估
+                    </a>
+                </div>
+                <div class="flex items-center space-x-4">
+                    <button class="md:hidden p-2" id="mobileMenuBtn">
+                        <i class="fas fa-bars text-xl"></i>
+                    </button>
+                </div>
+            </div>
+        </div>
+    </nav>
+
+    <!-- Hero Section -->
+    <section class="relative min-h-screen flex items-center justify-center overflow-hidden hero-gradient py-32">
+        <!-- 背景图片 -->
+        <div class="absolute inset-0 z-0">
+            <div class="absolute inset-0 bg-gradient-to-br from-purple-100 via-blue-50 to-emerald-50"></div>
+            <div class="absolute inset-0 opacity-10" style="background-image: url('../data/会展策划/image/博览会.jpg'); background-size: cover; background-position: center;"></div>
+            <div class="absolute inset-0 bg-gradient-to-b from-transparent via-white/60 to-white/90"></div>
+        </div>
+        
+        <!-- 浮动装饰元素 -->
+        <div class="absolute top-20 left-10 w-20 h-20 bg-emerald-400 rounded-full opacity-20 floating"></div>
+        <div class="absolute bottom-20 right-10 w-32 h-32 bg-blue-400 rounded-full opacity-20 floating" style="animation-delay: 1s;"></div>
+        <div class="absolute top-1/2 left-20 w-16 h-16 bg-purple-400 rounded-full opacity-20 floating" style="animation-delay: 2s;"></div>
+        
+        <div class="relative z-10 container mx-auto px-6 text-center py-12">
+            <div class="fade-in-up">
+                <!-- 标签 -->
+                <div class="inline-flex items-center px-4 py-2 bg-white/80 backdrop-blur-sm rounded-full mb-6 shadow-lg">
+                    <span class="animate-pulse w-2 h-2 bg-emerald-500 rounded-full mr-2"></span>
+                    <span class="text-sm font-semibold text-gray-700">2024年6月15-17日 · 苏州国际博览中心</span>
+                </div>
+                
+                <h1 class="text-5xl md:text-7xl font-black mb-6">
+                    <span class="block text-gradient-animate">2024 长三角国际</span>
+                    <span class="block text-gray-800 mt-2">新能源汽车与智能交通</span>
+                    <span class="block text-4xl md:text-5xl text-gray-600 mt-2">产业博览会</span>
+                </h1>
+                
+                <p class="text-xl md:text-2xl text-gray-600 mb-8 max-w-3xl mx-auto">
+                    <i class="fas fa-quote-left text-emerald-500 mr-2"></i>
+                    引领绿色出行新时代 · 共创智能交通新未来
+                    <i class="fas fa-quote-right text-emerald-500 ml-2"></i>
+                </p>
+                <!-- 核心信息展示 -->
+                <div class="grid grid-cols-1 md:grid-cols-3 gap-6 mb-12 max-w-5xl mx-auto">
+                    <div class="bg-white/95 backdrop-blur-md rounded-2xl p-6 border-2 border-purple-200 hover:border-purple-400 transition-all duration-300 transform hover:scale-105 animate-fadeInUp animation-delay-200 shadow-2xl">
+                        <div class="flex flex-col items-center">
+                            <div class="w-16 h-16 bg-gradient-to-br from-purple-500 to-purple-600 rounded-full flex items-center justify-center mb-3 shadow-lg">
+                                <i class="fas fa-calendar-alt text-3xl text-white"></i>
+                            </div>
+                            <p class="text-gray-600 text-sm font-medium mb-2">展会时间</p>
+                            <p class="text-gray-900 font-bold text-2xl text-center">2024年9月</p>
+                            <p class="text-gray-800 font-bold text-xl">12-15日</p>
+                        </div>
+                    </div>
+                    
+                    <div class="bg-white/95 backdrop-blur-md rounded-2xl p-6 border-2 border-blue-200 hover:border-blue-400 transition-all duration-300 transform hover:scale-105 animate-fadeInUp animation-delay-400 shadow-2xl">
+                        <div class="flex flex-col items-center">
+                            <div class="w-16 h-16 bg-gradient-to-br from-blue-500 to-blue-600 rounded-full flex items-center justify-center mb-3 shadow-lg">
+                                <i class="fas fa-map-marked-alt text-3xl text-white"></i>
+                            </div>
+                            <p class="text-gray-600 text-sm font-medium mb-2">展会地点</p>
+                            <p class="text-gray-900 font-bold text-2xl text-center">国家会展中心</p>
+                            <p class="text-gray-800 font-bold text-xl">上海</p>
+                        </div>
+                    </div>
+                    
+                    <div class="bg-white/95 backdrop-blur-md rounded-2xl p-6 border-2 border-green-200 hover:border-green-400 transition-all duration-300 transform hover:scale-105 animate-fadeInUp animation-delay-600 shadow-2xl">
+                        <div class="flex flex-col items-center">
+                            <div class="w-16 h-16 bg-gradient-to-br from-green-500 to-green-600 rounded-full flex items-center justify-center mb-3 shadow-lg">
+                                <i class="fas fa-expand-arrows-alt text-3xl text-white"></i>
+                            </div>
+                            <p class="text-gray-600 text-sm font-medium mb-2">展览规模</p>
+                            <p class="text-gray-900 font-bold text-3xl">50,000</p>
+                            <p class="text-gray-800 font-bold text-lg">平方米</p>
+                        </div>
+                    </div>
+                </div>
+                
+                <!-- CTA按钮组 -->
+                <div class="flex flex-col md:flex-row gap-6 justify-center items-center animate-fadeInUp animation-delay-800">
+                    <a href="pages/overview.html" class="group relative overflow-hidden bg-white text-purple-700 px-12 py-5 rounded-full font-bold text-xl shadow-2xl hover:shadow-white/30 transition-all duration-300 transform hover:scale-110">
+                        <span class="absolute inset-0 bg-gradient-to-r from-purple-600 to-pink-600 opacity-0 group-hover:opacity-100 transition-opacity duration-300"></span>
+                        <span class="relative z-10 flex items-center group-hover:text-white">
+                            <i class="fas fa-sparkles mr-3 text-2xl animate-pulse"></i>
+                            了解详情
+                            <i class="fas fa-arrow-right ml-3 group-hover:translate-x-2 transition-transform"></i>
+                        </span>
+                    </a>
+                    <a href="#highlights" class="group relative overflow-hidden bg-gradient-to-r from-purple-600 to-pink-600 text-white px-12 py-5 rounded-full font-bold text-xl hover:from-purple-700 hover:to-pink-700 transition-all duration-300 transform hover:scale-110 shadow-2xl">
+                        <span class="relative z-10 flex items-center">
+                            <i class="fas fa-star mr-3 text-2xl text-yellow-300"></i>
+                            展会亮点
+                            <i class="fas fa-chevron-down ml-3 animate-bounce"></i>
+                        </span>
+                    </a>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Key Stats Section -->
+    <section class="py-20 -mt-20 relative z-20 bg-gradient-to-br from-white via-gray-50 to-white">
+        <!-- 背景装饰 -->
+        <div class="absolute inset-0 opacity-5" style="background-image: url('../data/会展策划/image/Whisk_9e8c1f44ac.jpg'); background-size: cover; background-position: center;"></div>
+        
+        <div class="container mx-auto px-6 relative z-10" title="核心数据展示区">
+            <div class="grid grid-cols-2 md:grid-cols-4 gap-8 md:gap-12">
+                <div class="text-center group animate-fadeInUp animation-delay-200 transform hover:scale-105 transition-all duration-300">
+                    <div class="w-24 h-24 mx-auto mb-4 bg-white rounded-2xl flex items-center justify-center shadow-lg group-hover:shadow-xl border-2 border-purple-200 group-hover:border-purple-400 group-hover:rotate-3 transition-all">
+                        <i class="fas fa-building text-4xl text-purple-600"></i>
+                    </div>
+                    <div class="text-5xl font-bold text-gray-800 mb-2">
+                        <span class="counter" data-target="350">0</span>+
+                    </div>
+                    <div class="text-gray-700 font-semibold text-lg">参展企业</div>
+                </div>
+                <div class="text-center group animate-fadeInUp animation-delay-400 transform hover:scale-105 transition-all duration-300">
+                    <div class="w-24 h-24 mx-auto mb-4 bg-white rounded-2xl flex items-center justify-center shadow-lg group-hover:shadow-xl border-2 border-blue-200 group-hover:border-blue-400 group-hover:-rotate-3 transition-all">
+                        <i class="fas fa-users text-4xl text-blue-600"></i>
+                    </div>
+                    <div class="text-5xl font-bold text-gray-800 mb-2">
+                        <span class="counter" data-target="50000">0</span>+
+                    </div>
+                    <div class="text-gray-700 font-semibold text-lg">预计观众</div>
+                </div>
+                <div class="text-center group animate-fadeInUp animation-delay-600 transform hover:scale-105 transition-all duration-300">
+                    <div class="w-24 h-24 mx-auto mb-4 bg-white rounded-2xl flex items-center justify-center shadow-lg group-hover:shadow-xl border-2 border-green-200 group-hover:border-green-400 group-hover:rotate-3 transition-all">
+                        <i class="fas fa-hand-holding-usd text-4xl text-green-600"></i>
+                    </div>
+                    <div class="text-5xl font-bold text-gray-800 mb-2">
+                        <span class="counter" data-target="10">0</span>亿+
+                    </div>
+                    <div class="text-gray-700 font-semibold text-lg">预计成交额</div>
+                </div>
+                <div class="text-center group animate-fadeInUp animation-delay-800 transform hover:scale-105 transition-all duration-300">
+                    <div class="w-24 h-24 mx-auto mb-4 bg-white rounded-2xl flex items-center justify-center shadow-lg group-hover:shadow-xl border-2 border-orange-200 group-hover:border-orange-400 group-hover:-rotate-3 transition-all">
+                        <i class="fas fa-microphone-alt text-4xl text-orange-600"></i>
+                    </div>
+                    <div class="text-5xl font-bold text-gray-800 mb-2">
+                        <span class="counter" data-target="20">0</span>+
+                    </div>
+                    <div class="text-gray-700 font-semibold text-lg">专业论坛</div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Highlights Section -->
+    <section id="highlights" class="py-20 relative overflow-hidden">
+        <!-- 背景图片层 - 降低透明度 -->
+        <div class="absolute inset-0 opacity-20" style="background-image: url('../data/会展策划/image/Whisk_27184afa6e.jpg'); background-size: cover; background-position: center; background-attachment: fixed;"></div>
+        
+        <!-- 强化遮罩层 - 确保主体内容清晰 -->
+        <div class="absolute inset-0 bg-white/85"></div>
+        <div class="absolute inset-0 bg-gradient-to-br from-gray-50/95 to-purple-50/95"></div>
+        <div class="absolute inset-0 opacity-10">
+            <div class="absolute top-20 left-20 w-72 h-72 bg-purple-300 rounded-full mix-blend-multiply filter blur-xl animate-blob"></div>
+            <div class="absolute top-40 right-20 w-72 h-72 bg-yellow-300 rounded-full mix-blend-multiply filter blur-xl animate-blob animation-delay-2000"></div>
+            <div class="absolute -bottom-8 left-40 w-72 h-72 bg-pink-300 rounded-full mix-blend-multiply filter blur-xl animate-blob animation-delay-4000"></div>
+        </div>
+        <div class="container mx-auto px-6 relative z-10" title="展会亮点展示区">
+            <h2 class="text-3xl md:text-4xl font-bold text-center text-gray-800 mb-12 animate-fadeInUp">展会亮点</h2>
+            <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
+                <!-- Card 1 -->
+                <div class="bg-white rounded-xl shadow-lg overflow-hidden transform transition-all duration-300 hover:scale-105 hover:shadow-2xl animate-fadeInUp animation-delay-200">
+                    <div class="h-48 relative overflow-hidden">
+                        <img src="../data/会展策划/image/3.小米汽车.jpg" alt="小米汽车" class="w-full h-full object-cover">
+                        <div class="absolute top-4 left-4">
+                            <div class="bg-blue-500 text-white px-3 py-1 rounded-full text-xs font-semibold">热门展区</div>
+                        </div>
+                    </div>
+                    <div class="p-6">
+                        <h3 class="text-xl font-bold mb-3 text-gray-800">全产业链展示</h3>
+                        <p class="text-gray-600 mb-4">
+                            涵盖整车制造、核心零部件、充电设施、智能网联等全产业链环节，打造一站式采购平台。
+                        </p>
+                        <a href="pages/exhibition.html" class="text-purple-600 font-semibold hover:text-purple-800 flex items-center group">
+                            了解更多 <i class="fas fa-arrow-right ml-2 transform transition-transform group-hover:translate-x-2"></i>
+                        </a>
+                    </div>
+                </div>
+
+                <!-- Card 2 -->
+                <div class="bg-white rounded-xl shadow-lg overflow-hidden transform transition-all duration-300 hover:scale-105 hover:shadow-2xl animate-fadeInUp animation-delay-400">
+                    <div class="h-48 relative overflow-hidden">
+                        <img src="../data/会展策划/image/2.试驾小景.jpg" alt="试驾体验" class="w-full h-full object-cover">
+                        <div class="absolute top-4 left-4">
+                            <div class="bg-emerald-500 text-white px-3 py-1 rounded-full text-xs font-semibold">互动体验</div>
+                        </div>
+                    </div>
+                    <div class="p-6">
+                        <h3 class="text-xl font-bold mb-3 text-gray-800">创新技术体验</h3>
+                        <p class="text-gray-600 mb-4">
+                            设置自动驾驶体验区、智能交通演示区，让观众亲身体验最新科技成果。
+                        </p>
+                        <a href="pages/operation.html" class="text-emerald-600 font-semibold hover:text-emerald-800 flex items-center group">
+                            了解更多 <i class="fas fa-arrow-right ml-2 transform transition-transform group-hover:translate-x-2"></i>
+                        </a>
+                    </div>
+                </div>
+
+                <!-- Card 3 -->
+                <div class="bg-white rounded-xl shadow-lg overflow-hidden transform transition-all duration-300 hover:scale-105 hover:shadow-2xl animate-fadeInUp animation-delay-600">
+                    <div class="h-48 relative overflow-hidden">
+                        <img src="../data/会展策划/image/展会内部参观.jpg" alt="论坛峰会" class="w-full h-full object-cover">
+                        <div class="absolute top-4 left-4">
+                            <div class="bg-purple-500 text-white px-3 py-1 rounded-full text-xs font-semibold">主题论坛</div>
+                        </div>
+                    </div>
+                    <div class="p-6">
+                        <h3 class="text-xl font-bold mb-3 text-gray-800">高端论坛峰会</h3>
+                        <p class="text-gray-600 mb-4">
+                            汇聚行业领袖、专家学者，探讨产业发展趋势，发布权威研究报告。
+                        </p>
+                        <a href="pages/marketing.html" class="text-purple-600 font-semibold hover:text-purple-800 flex items-center group">
+                            了解更多 <i class="fas fa-arrow-right ml-2 transform transition-transform group-hover:translate-x-2"></i>
+                        </a>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Exhibition Areas -->
+    <section class="py-20 bg-gradient-to-br from-white via-indigo-50 to-purple-50">
+        <div class="container mx-auto px-6">
+            <h2 class="text-3xl md:text-4xl font-bold text-center text-gray-800 mb-4 animate-fadeInUp">展区规划</h2>
+            <p class="text-center text-gray-600 mb-12 animate-fadeInUp animation-delay-200">50,000平方米超大展览空间，打造沉浸式体验</p>
+            
+            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
+                <div class="group text-center p-6 bg-white/80 backdrop-blur border-2 border-purple-200 rounded-2xl hover:border-purple-500 hover:shadow-2xl transform transition-all duration-300 hover:-translate-y-2 animate-fadeInUp animation-delay-300">
+                    <div class="w-20 h-20 bg-gradient-to-br from-blue-400 to-purple-600 rounded-2xl flex items-center justify-center mx-auto mb-4 group-hover:rotate-6 transition-transform duration-300">
+                        <i class="fas fa-car text-white text-2xl"></i>
+                    </div>
+                    <h3 class="text-lg font-bold mb-2 text-gray-800">整车展示区</h3>
+                    <p class="text-purple-600 font-bold text-xl mb-1">20,000m²</p>
+                    <p class="text-gray-500 text-sm">100+品牌车型</p>
+                    <div class="mt-3 opacity-0 group-hover:opacity-100 transition-opacity duration-300">
+                        <span class="inline-block bg-purple-100 text-purple-700 px-3 py-1 rounded-full text-xs">核心展区</span>
+                    </div>
+                </div>
+                
+                <div class="group text-center p-6 bg-white/80 backdrop-blur border-2 border-emerald-200 rounded-2xl hover:border-emerald-500 hover:shadow-2xl transform transition-all duration-300 hover:-translate-y-2 animate-fadeInUp animation-delay-400">
+                    <div class="w-20 h-20 bg-gradient-to-br from-emerald-400 to-teal-600 rounded-2xl flex items-center justify-center mx-auto mb-4 group-hover:rotate-6 transition-transform duration-300">
+                        <i class="fas fa-microchip text-white text-2xl"></i>
+                    </div>
+                    <h3 class="text-lg font-bold mb-2 text-gray-800">核心零部件区</h3>
+                    <p class="text-emerald-600 font-bold text-xl mb-1">15,000m²</p>
+                    <p class="text-gray-500 text-sm">500+供应商</p>
+                    <div class="mt-3 opacity-0 group-hover:opacity-100 transition-opacity duration-300">
+                        <span class="inline-block bg-emerald-100 text-emerald-700 px-3 py-1 rounded-full text-xs">技术展示</span>
+                    </div>
+                </div>
+                
+                <div class="group text-center p-6 bg-white/80 backdrop-blur border-2 border-indigo-200 rounded-2xl hover:border-indigo-500 hover:shadow-2xl transform transition-all duration-300 hover:-translate-y-2 animate-fadeInUp animation-delay-500">
+                    <div class="w-20 h-20 bg-gradient-to-br from-indigo-400 to-blue-600 rounded-2xl flex items-center justify-center mx-auto mb-4 group-hover:rotate-6 transition-transform duration-300">
+                        <i class="fas fa-network-wired text-white text-2xl"></i>
+                    </div>
+                    <h3 class="text-lg font-bold mb-2 text-gray-800">智能交通区</h3>
+                    <p class="text-indigo-600 font-bold text-xl mb-1">10,000m²</p>
+                    <p class="text-gray-500 text-sm">50+解决方案</p>
+                    <div class="mt-3 opacity-0 group-hover:opacity-100 transition-opacity duration-300">
+                        <span class="inline-block bg-indigo-100 text-indigo-700 px-3 py-1 rounded-full text-xs">创新科技</span>
+                    </div>
+                </div>
+                
+                <div class="group text-center p-6 bg-white/80 backdrop-blur border-2 border-pink-200 rounded-2xl hover:border-pink-500 hover:shadow-2xl transform transition-all duration-300 hover:-translate-y-2 animate-fadeInUp animation-delay-600">
+                    <div class="w-20 h-20 bg-gradient-to-br from-pink-400 to-rose-600 rounded-2xl flex items-center justify-center mx-auto mb-4 group-hover:rotate-6 transition-transform duration-300">
+                        <i class="fas fa-gamepad text-white text-2xl"></i>
+                    </div>
+                    <h3 class="text-lg font-bold mb-2 text-gray-800">体验互动区</h3>
+                    <p class="text-pink-600 font-bold text-xl mb-1">5,000m²</p>
+                    <p class="text-gray-500 text-sm">20+互动项目</p>
+                    <div class="mt-3 opacity-0 group-hover:opacity-100 transition-opacity duration-300">
+                        <span class="inline-block bg-pink-100 text-pink-700 px-3 py-1 rounded-full text-xs">沉浸体验</span>
+                    </div>
+                </div>
+            </div>
+            
+            <!-- 展馆布置图 -->
+            <div class="mt-12 animate-fadeInUp animation-delay-700">
+                <div class="bg-white/90 backdrop-blur rounded-2xl shadow-xl overflow-hidden">
+                    <img src="../data/会展策划/image/展馆布置图.jpeg" alt="展馆布置图" class="w-full h-auto hover:scale-105 transition-transform duration-700">
+                    <div class="p-4 bg-gradient-to-r from-purple-600 to-indigo-600 text-white">
+                        <p class="text-center font-semibold"><i class="fas fa-map-marked-alt mr-2"></i>展馆3D全景布置图 - 点击查看详情</p>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Gallery Section -->
+    <section class="py-20 bg-gradient-to-br from-gray-900 to-purple-900 relative overflow-hidden">
+        <div class="absolute inset-0 opacity-10">
+            <div class="absolute top-0 left-0 w-full h-full bg-[url('../data/会展策划/image/展会内部参观.jpg')] bg-cover bg-center bg-fixed"></div>
+        </div>
+        <div class="container mx-auto px-6 relative z-10" title="精彩瞬间展示区">
+            <h2 class="text-3xl md:text-4xl font-bold text-center text-white mb-12 animate-fadeInUp">精彩瞬间</h2>
+            <div class="grid md:grid-cols-3 gap-6 mb-8">
+                <div class="group relative overflow-hidden rounded-2xl shadow-2xl animate-fadeInUp animation-delay-200">
+                    <img src="../data/会展策划/image/展会内部参观.jpg" alt="展会内部" class="w-full h-64 object-cover transform transition-transform duration-700 group-hover:scale-110">
+                    <div class="absolute inset-0 bg-gradient-to-t from-black/70 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex items-end">
+                        <div class="p-6 text-white transform translate-y-20 group-hover:translate-y-0 transition-transform duration-300">
+                            <h3 class="text-xl font-bold mb-2">展馆内部参观</h3>
+                            <p class="text-sm">宽敞明亮的展示空间，科技感十足</p>
+                        </div>
+                    </div>
+                </div>
+                
+                <div class="group relative overflow-hidden rounded-2xl shadow-2xl animate-fadeInUp animation-delay-400">
+                    <img src="../data/会展策划/image/签到.jpg" alt="签到处" class="w-full h-64 object-cover transform transition-transform duration-700 group-hover:scale-110">
+                    <div class="absolute inset-0 bg-gradient-to-t from-black/70 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex items-end">
+                        <div class="p-6 text-white transform translate-y-20 group-hover:translate-y-0 transition-transform duration-300">
+                            <h3 class="text-xl font-bold mb-2">智能签到系统</h3>
+                            <p class="text-sm">快速便捷的入场体验</p>
+                        </div>
+                    </div>
+                </div>
+                
+                <div class="group relative overflow-hidden rounded-2xl shadow-2xl animate-fadeInUp animation-delay-600">
+                    <img src="../data/会展策划/image/3.小米汽车.jpg" alt="展品展示" class="w-full h-64 object-cover transform transition-transform duration-700 group-hover:scale-110">
+                    <div class="absolute inset-0 bg-gradient-to-t from-black/70 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex items-end">
+                        <div class="p-6 text-white transform translate-y-20 group-hover:translate-y-0 transition-transform duration-300">
+                            <h3 class="text-xl font-bold mb-2">明星展品</h3>
+                            <p class="text-sm">最新款新能源汽车亮相</p>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            
+            <!-- 更多图片展示 -->
+            <div class="grid md:grid-cols-4 gap-4">
+                <div class="group relative overflow-hidden rounded-xl shadow-xl animate-fadeInUp animation-delay-800">
+                    <img src="../data/会展策划/image/Whisk_03282ab7e5.jpg" alt="展品1" class="w-full h-48 object-cover transform transition-all duration-500 group-hover:scale-110 group-hover:rotate-1">
+                    <div class="absolute inset-0 bg-gradient-to-t from-purple-600/70 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex items-end">
+                        <div class="p-4 text-white transform translate-y-10 group-hover:translate-y-0 transition-transform duration-300">
+                            <h4 class="text-sm font-bold">智能驾驶展示</h4>
+                        </div>
+                    </div>
+                </div>
+                <div class="group relative overflow-hidden rounded-xl shadow-xl animate-fadeInUp animation-delay-900">
+                    <img src="../data/会展策划/image/Whisk_15f65339bb.jpg" alt="展品2" class="w-full h-48 object-cover transform transition-all duration-500 group-hover:scale-110 group-hover:rotate-1">
+                    <div class="absolute inset-0 bg-gradient-to-t from-indigo-600/70 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex items-end">
+                        <div class="p-4 text-white transform translate-y-10 group-hover:translate-y-0 transition-transform duration-300">
+                            <h4 class="text-sm font-bold">充电技术革新</h4>
+                        </div>
+                    </div>
+                </div>
+                <div class="group relative overflow-hidden rounded-xl shadow-xl animate-fadeInUp animation-delay-1000">
+                    <img src="../data/会展策划/image/Whisk_192cdc54bc.jpg" alt="展品3" class="w-full h-48 object-cover transform transition-all duration-500 group-hover:scale-110 group-hover:rotate-1">
+                    <div class="absolute inset-0 bg-gradient-to-t from-blue-600/70 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex items-end">
+                        <div class="p-4 text-white transform translate-y-10 group-hover:translate-y-0 transition-transform duration-300">
+                            <h4 class="text-sm font-bold">电池技术展览</h4>
+                        </div>
+                    </div>
+                </div>
+                <div class="group relative overflow-hidden rounded-xl shadow-xl animate-fadeInUp animation-delay-1100">
+                    <img src="../data/会展策划/image/Whisk_1c05424f7f.jpg" alt="展品4" class="w-full h-48 object-cover transform transition-all duration-500 group-hover:scale-110 group-hover:rotate-1">
+                    <div class="absolute inset-0 bg-gradient-to-t from-cyan-600/70 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex items-end">
+                        <div class="p-4 text-white transform translate-y-10 group-hover:translate-y-0 transition-transform duration-300">
+                            <h4 class="text-sm font-bold">智慧交通系统</h4>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Footer -->
+    <footer class="bg-gradient-to-b from-gray-900 to-black text-white py-16 relative overflow-hidden">
+        <!-- 背景装饰 -->
+        <div class="absolute inset-0 opacity-10">
+            <div class="absolute bottom-0 left-0 w-96 h-96 bg-purple-500 rounded-full filter blur-3xl"></div>
+            <div class="absolute top-0 right-0 w-96 h-96 bg-blue-500 rounded-full filter blur-3xl"></div>
+        </div>
+        
+        <div class="container mx-auto px-6 relative z-10" title="页脚信息区">
+            <div class="grid grid-cols-1 md:grid-cols-4 gap-8">
+                <div class="animate-fadeInUp">
+                    <div class="flex items-center mb-4">
+                        <i class="fas fa-car-side text-2xl text-purple-400 mr-2"></i>
+                        <h3 class="text-lg font-semibold">关于展会</h3>
+                    </div>
+                    <p class="text-gray-400 text-sm leading-relaxed">
+                        长三角地区最具影响力的新能源汽车与智能交通产业盛会，汇聚全球顶尖企业与技术
+                    </p>
+                    <div class="mt-4 flex space-x-3">
+                        <a href="#" class="w-8 h-8 bg-gray-800 rounded-full flex items-center justify-center hover:bg-purple-600 transition">
+                            <i class="fab fa-weixin text-sm"></i>
+                        </a>
+                        <a href="#" class="w-8 h-8 bg-gray-800 rounded-full flex items-center justify-center hover:bg-blue-600 transition">
+                            <i class="fab fa-weibo text-sm"></i>
+                        </a>
+                        <a href="#" class="w-8 h-8 bg-gray-800 rounded-full flex items-center justify-center hover:bg-red-600 transition">
+                            <i class="fab fa-linkedin text-sm"></i>
+                        </a>
+                    </div>
+                </div>
+                <div class="animate-fadeInUp animation-delay-200">
+                    <h3 class="text-lg font-semibold mb-4">
+                        <i class="fas fa-link text-purple-400 mr-2"></i>快速链接
+                    </h3>
+                    <ul class="space-y-2 text-sm text-gray-400">
+                        <li><a href="pages/overview.html" class="hover:text-purple-400 transition">
+                            <i class="fas fa-chevron-right text-xs mr-1"></i>策划概述
+                        </a></li>
+                        <li><a href="pages/exhibition.html" class="hover:text-purple-400 transition">
+                            <i class="fas fa-chevron-right text-xs mr-1"></i>展会介绍
+                        </a></li>
+                        <li><a href="pages/marketing.html" class="hover:text-purple-400 transition">
+                            <i class="fas fa-chevron-right text-xs mr-1"></i>营销方案
+                        </a></li>
+                        <li><a href="pages/operation.html" class="hover:text-purple-400 transition">
+                            <i class="fas fa-chevron-right text-xs mr-1"></i>现场运营
+                        </a></li>
+                    </ul>
+                </div>
+                <div class="animate-fadeInUp animation-delay-400">
+                    <h3 class="text-lg font-semibold mb-4">
+                        <i class="fas fa-phone-alt text-purple-400 mr-2"></i>联系方式
+                    </h3>
+                    <ul class="space-y-2 text-sm text-gray-400">
+                        <li><i class="fas fa-map-marker-alt text-purple-400 mr-2"></i>上海市青浦区崧泽大道333号</li>
+                        <li><i class="fas fa-phone text-purple-400 mr-2"></i>021-12345678</li>
+                        <li><i class="fas fa-envelope text-purple-400 mr-2"></i>info@greenmobility2024.com</li>
+                    </ul>
+                </div>
+                <div class="animate-fadeInUp animation-delay-600">
+                    <h3 class="text-lg font-semibold mb-4">
+                        <i class="fas fa-qrcode text-purple-400 mr-2"></i>关注我们
+                    </h3>
+                    <div class="flex space-x-4">
+                        <a href="#" class="w-10 h-10 bg-gray-800 rounded-full flex items-center justify-center hover:bg-gray-700">
+                            <span>微信</span>
+                        </a>
+                        <a href="#" class="w-10 h-10 bg-gray-800 rounded-full flex items-center justify-center hover:bg-gray-700">
+                            <span>微博</span>
+                        </a>
+                    </div>
+                </div>
+            </div>
+            <div class="border-t border-gray-800 mt-8 pt-8 text-center text-sm text-gray-400">
+                <p>&copy; 2024 长三角国际新能源汽车与智能交通产业博览会. All rights reserved.</p>
+            </div>
+        </div>
+    </footer>
+
+    <script src="js/main.js"></script>
+</body>
+</html>
\ No newline at end of file
diff --git a/web_frontend/exhibition-demo/public/web_result/js/main.js b/web_frontend/exhibition-demo/public/web_result/js/main.js
new file mode 100644
index 00000000..62b624a0
--- /dev/null
+++ b/web_frontend/exhibition-demo/public/web_result/js/main.js
@@ -0,0 +1,709 @@
+// 2024长三角国际新能源汽车与智能交通产业博览会 - 交互脚本
+
+// 页面加载完成后初始化
+document.addEventListener('DOMContentLoaded', function() {
+    // 隐藏页面加载器
+    hidePageLoader();
+    
+    initNavbar();
+    initAnimations();
+    initCounters();
+    initScrollEffects();
+    initRippleEffect();
+    initLazyLoading();
+    initFormValidation();
+    initCharts();
+    initTimeline();
+    initInteractiveElements();
+    handleImageErrors();
+});
+
+// 隐藏页面加载器
+function hidePageLoader() {
+    const loader = document.getElementById('pageLoader');
+    if (loader) {
+        // 添加淡出动画
+        loader.style.opacity = '0';
+        loader.style.transition = 'opacity 0.5s ease-out';
+        
+        // 500ms后完全移除
+        setTimeout(() => {
+            loader.style.display = 'none';
+            // 恢复body滚动
+            document.body.style.overflow = 'auto';
+            document.body.classList.remove('loading');
+        }, 500);
+    } else {
+        // 如果没有找到加载器，也要确保恢复滚动
+        document.body.style.overflow = 'auto';
+        document.body.classList.remove('loading');
+    }
+}
+
+// 如果页面加载超过3秒，强制隐藏加载器
+window.addEventListener('load', function() {
+    setTimeout(() => {
+        hidePageLoader();
+    }, 3000);
+});
+
+// 导航栏交互
+function initNavbar() {
+    const navbar = document.querySelector('.navbar');
+    const navLinks = document.querySelectorAll('.nav-link');
+    const mobileMenuBtn = document.querySelector('.mobile-menu-btn');
+    const mobileMenu = document.querySelector('.mobile-menu');
+    
+    // 滚动时改变导航栏样式
+    window.addEventListener('scroll', () => {
+        if (window.scrollY > 100) {
+            navbar?.classList.add('scrolled');
+        } else {
+            navbar?.classList.remove('scrolled');
+        }
+    });
+    
+    // 高亮当前页面链接
+    const currentPath = window.location.pathname;
+    navLinks.forEach(link => {
+        if (link.getAttribute('href') === currentPath) {
+            link.classList.add('active');
+        }
+    });
+    
+    // 移动端菜单切换
+    mobileMenuBtn?.addEventListener('click', () => {
+        mobileMenu?.classList.toggle('open');
+        mobileMenuBtn.classList.toggle('active');
+    });
+    
+    // 平滑滚动到锚点
+    document.querySelectorAll('a[href^="#"]').forEach(anchor => {
+        anchor.addEventListener('click', function(e) {
+            e.preventDefault();
+            const target = document.querySelector(this.getAttribute('href'));
+            if (target) {
+                target.scrollIntoView({
+                    behavior: 'smooth',
+                    block: 'start'
+                });
+            }
+        });
+    });
+}
+
+// 动画初始化
+function initAnimations() {
+    // Intersection Observer for fade-in animations
+    const observerOptions = {
+        threshold: 0.1,
+        rootMargin: '0px 0px -50px 0px'
+    };
+    
+    const observer = new IntersectionObserver((entries) => {
+        entries.forEach(entry => {
+            if (entry.isIntersecting) {
+                entry.target.classList.add('animate-in');
+                observer.unobserve(entry.target);
+            }
+        });
+    }, observerOptions);
+    
+    // 观察所有需要动画的元素
+    document.querySelectorAll('.fade-in, .slide-in-left, .slide-in-right, .grid-item').forEach(el => {
+        observer.observe(el);
+    });
+}
+
+// 数字计数器动画
+function initCounters() {
+    const counters = document.querySelectorAll('.counter');
+    const speed = 200; // 动画速度
+    
+    const countUp = (counter) => {
+        const target = +counter.getAttribute('data-target');
+        const increment = target / speed;
+        
+        const updateCount = () => {
+            const count = +counter.innerText.replace(/[^0-9]/g, '');
+            
+            if (count < target) {
+                counter.innerText = Math.ceil(count + increment).toLocaleString();
+                setTimeout(updateCount, 1);
+            } else {
+                counter.innerText = target.toLocaleString();
+                
+                // 添加单位
+                const unit = counter.getAttribute('data-unit');
+                if (unit) {
+                    counter.innerText += unit;
+                }
+            }
+        };
+        
+        updateCount();
+    };
+    
+    // 使用 Intersection Observer 触发计数
+    const counterObserver = new IntersectionObserver((entries) => {
+        entries.forEach(entry => {
+            if (entry.isIntersecting) {
+                countUp(entry.target);
+                counterObserver.unobserve(entry.target);
+            }
+        });
+    }, { threshold: 0.5 });
+    
+    counters.forEach(counter => {
+        counter.innerText = '0';
+        counterObserver.observe(counter);
+    });
+}
+
+// 滚动效果
+function initScrollEffects() {
+    let lastScrollTop = 0;
+    const header = document.querySelector('header');
+    
+    window.addEventListener('scroll', () => {
+        const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
+        
+        // 隐藏/显示导航栏
+        if (scrollTop > lastScrollTop && scrollTop > 300) {
+            header?.classList.add('hide');
+        } else {
+            header?.classList.remove('hide');
+        }
+        
+        lastScrollTop = scrollTop <= 0 ? 0 : scrollTop;
+        
+        // 视差效果
+        const parallaxElements = document.querySelectorAll('.parallax');
+        parallaxElements.forEach(el => {
+            const speed = el.getAttribute('data-speed') || 0.5;
+            const yPos = -(scrollTop * speed);
+            el.style.transform = `translateY(${yPos}px)`;
+        });
+        
+        // 进度条
+        const progressBar = document.querySelector('.progress-bar');
+        if (progressBar) {
+            const winScroll = document.body.scrollTop || document.documentElement.scrollTop;
+            const height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
+            const scrolled = (winScroll / height) * 100;
+            progressBar.style.width = scrolled + '%';
+        }
+    });
+}
+
+// 波纹效果
+function initRippleEffect() {
+    document.querySelectorAll('.btn, .card').forEach(element => {
+        element.addEventListener('click', function(e) {
+            const ripple = document.createElement('span');
+            ripple.classList.add('ripple');
+            
+            const rect = this.getBoundingClientRect();
+            const size = Math.max(rect.width, rect.height);
+            const x = e.clientX - rect.left - size / 2;
+            const y = e.clientY - rect.top - size / 2;
+            
+            ripple.style.width = ripple.style.height = size + 'px';
+            ripple.style.left = x + 'px';
+            ripple.style.top = y + 'px';
+            
+            this.appendChild(ripple);
+            
+            setTimeout(() => {
+                ripple.remove();
+            }, 600);
+        });
+    });
+}
+
+// 懒加载
+function initLazyLoading() {
+    const images = document.querySelectorAll('img[data-src]');
+    
+    const imageObserver = new IntersectionObserver((entries) => {
+        entries.forEach(entry => {
+            if (entry.isIntersecting) {
+                const img = entry.target;
+                img.src = img.dataset.src;
+                img.removeAttribute('data-src');
+                imageObserver.unobserve(img);
+                
+                // 添加加载完成动画
+                img.addEventListener('load', () => {
+                    img.classList.add('loaded');
+                });
+            }
+        });
+    }, {
+        rootMargin: '50px 0px'
+    });
+    
+    images.forEach(img => imageObserver.observe(img));
+}
+
+// 表单验证
+function initFormValidation() {
+    const forms = document.querySelectorAll('form');
+    
+    forms.forEach(form => {
+        form.addEventListener('submit', function(e) {
+            e.preventDefault();
+            
+            let isValid = true;
+            const inputs = form.querySelectorAll('input[required], textarea[required]');
+            
+            inputs.forEach(input => {
+                if (!input.value.trim()) {
+                    isValid = false;
+                    input.classList.add('error');
+                    showError(input, '此字段为必填项');
+                } else {
+                    input.classList.remove('error');
+                    clearError(input);
+                }
+                
+                // 邮箱验证
+                if (input.type === 'email' && input.value) {
+                    const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+                    if (!emailRegex.test(input.value)) {
+                        isValid = false;
+                        input.classList.add('error');
+                        showError(input, '请输入有效的邮箱地址');
+                    }
+                }
+                
+                // 电话验证
+                if (input.type === 'tel' && input.value) {
+                    const phoneRegex = /^1[3-9]\d{9}$/;
+                    if (!phoneRegex.test(input.value)) {
+                        isValid = false;
+                        input.classList.add('error');
+                        showError(input, '请输入有效的手机号码');
+                    }
+                }
+            });
+            
+            if (isValid) {
+                // 显示成功消息
+                showSuccess('表单提交成功！');
+                form.reset();
+            }
+        });
+        
+        // 实时验证
+        form.querySelectorAll('input, textarea').forEach(input => {
+            input.addEventListener('blur', function() {
+                validateInput(this);
+            });
+            
+            input.addEventListener('input', function() {
+                if (this.classList.contains('error')) {
+                    validateInput(this);
+                }
+            });
+        });
+    });
+}
+
+// 显示错误信息
+function showError(input, message) {
+    const errorEl = input.nextElementSibling;
+    if (errorEl && errorEl.classList.contains('error-message')) {
+        errorEl.textContent = message;
+    } else {
+        const error = document.createElement('span');
+        error.classList.add('error-message');
+        error.textContent = message;
+        input.parentNode.insertBefore(error, input.nextSibling);
+    }
+}
+
+// 清除错误信息
+function clearError(input) {
+    const errorEl = input.nextElementSibling;
+    if (errorEl && errorEl.classList.contains('error-message')) {
+        errorEl.remove();
+    }
+}
+
+// 验证输入
+function validateInput(input) {
+    if (input.hasAttribute('required') && !input.value.trim()) {
+        input.classList.add('error');
+        showError(input, '此字段为必填项');
+        return false;
+    }
+    
+    input.classList.remove('error');
+    clearError(input);
+    return true;
+}
+
+// 显示成功消息
+function showSuccess(message) {
+    const toast = document.createElement('div');
+    toast.classList.add('toast', 'success');
+    toast.textContent = message;
+    document.body.appendChild(toast);
+    
+    setTimeout(() => {
+        toast.classList.add('show');
+    }, 100);
+    
+    setTimeout(() => {
+        toast.classList.remove('show');
+        setTimeout(() => {
+            toast.remove();
+        }, 300);
+    }, 3000);
+}
+
+// 初始化图表
+function initCharts() {
+    // 预算分配饼图
+    const budgetChart = document.getElementById('budgetChart');
+    if (budgetChart) {
+        const data = [
+            { label: '场地租赁', value: 35, color: '#10b981' },
+            { label: '营销推广', value: 25, color: '#3b82f6' },
+            { label: '运营服务', value: 20, color: '#8b5cf6' },
+            { label: '人员成本', value: 15, color: '#f59e0b' },
+            { label: '其他费用', value: 5, color: '#ef4444' }
+        ];
+        
+        drawPieChart(budgetChart, data);
+    }
+    
+    // 参展商类别分布
+    const exhibitorChart = document.getElementById('exhibitorChart');
+    if (exhibitorChart) {
+        const data = [
+            { label: '整车制造', value: 40 },
+            { label: '零部件', value: 30 },
+            { label: '充电设施', value: 15 },
+            { label: '智能驾驶', value: 10 },
+            { label: '其他', value: 5 }
+        ];
+        
+        drawBarChart(exhibitorChart, data);
+    }
+}
+
+// 绘制饼图
+function drawPieChart(canvas, data) {
+    const ctx = canvas.getContext('2d');
+    const centerX = canvas.width / 2;
+    const centerY = canvas.height / 2;
+    const radius = Math.min(centerX, centerY) - 20;
+    
+    let currentAngle = -Math.PI / 2;
+    const total = data.reduce((sum, item) => sum + item.value, 0);
+    
+    data.forEach(item => {
+        const sliceAngle = (item.value / total) * 2 * Math.PI;
+        
+        // 绘制扇形
+        ctx.beginPath();
+        ctx.arc(centerX, centerY, radius, currentAngle, currentAngle + sliceAngle);
+        ctx.lineTo(centerX, centerY);
+        ctx.fillStyle = item.color;
+        ctx.fill();
+        
+        // 绘制标签
+        const labelX = centerX + Math.cos(currentAngle + sliceAngle / 2) * (radius * 0.7);
+        const labelY = centerY + Math.sin(currentAngle + sliceAngle / 2) * (radius * 0.7);
+        
+        ctx.fillStyle = '#fff';
+        ctx.font = '14px sans-serif';
+        ctx.textAlign = 'center';
+        ctx.fillText(item.value + '%', labelX, labelY);
+        
+        currentAngle += sliceAngle;
+    });
+}
+
+// 绘制柱状图
+function drawBarChart(canvas, data) {
+    const ctx = canvas.getContext('2d');
+    const barWidth = canvas.width / (data.length * 2);
+    const maxValue = Math.max(...data.map(item => item.value));
+    const chartHeight = canvas.height - 40;
+    
+    data.forEach((item, index) => {
+        const barHeight = (item.value / maxValue) * chartHeight;
+        const x = (index * 2 + 0.5) * barWidth;
+        const y = canvas.height - barHeight - 20;
+        
+        // 绘制柱子
+        const gradient = ctx.createLinearGradient(x, y, x, y + barHeight);
+        gradient.addColorStop(0, '#10b981');
+        gradient.addColorStop(1, '#3b82f6');
+        
+        ctx.fillStyle = gradient;
+        ctx.fillRect(x, y, barWidth, barHeight);
+        
+        // 绘制数值
+        ctx.fillStyle = '#333';
+        ctx.font = '12px sans-serif';
+        ctx.textAlign = 'center';
+        ctx.fillText(item.value + '%', x + barWidth / 2, y - 5);
+    });
+}
+
+// 初始化时间线
+function initTimeline() {
+    const timelineItems = document.querySelectorAll('.timeline-item');
+    
+    const timelineObserver = new IntersectionObserver((entries) => {
+        entries.forEach(entry => {
+            if (entry.isIntersecting) {
+                entry.target.classList.add('active');
+            }
+        });
+    }, { threshold: 0.5 });
+    
+    timelineItems.forEach(item => {
+        timelineObserver.observe(item);
+    });
+}
+
+// 交互元素初始化
+function initInteractiveElements() {
+    // 标签页切换
+    const tabs = document.querySelectorAll('.tab');
+    const tabContents = document.querySelectorAll('.tab-content');
+    
+    tabs.forEach(tab => {
+        tab.addEventListener('click', () => {
+            const target = tab.dataset.tab;
+            
+            // 切换标签状态
+            tabs.forEach(t => t.classList.remove('active'));
+            tab.classList.add('active');
+            
+            // 切换内容显示
+            tabContents.forEach(content => {
+                if (content.id === target) {
+                    content.classList.add('active');
+                    content.style.display = 'block';
+                } else {
+                    content.classList.remove('active');
+                    content.style.display = 'none';
+                }
+            });
+        });
+    });
+    
+    // 手风琴效果
+    const accordionHeaders = document.querySelectorAll('.accordion-header');
+    
+    accordionHeaders.forEach(header => {
+        header.addEventListener('click', () => {
+            const content = header.nextElementSibling;
+            const isOpen = header.classList.contains('active');
+            
+            // 关闭其他项
+            accordionHeaders.forEach(h => {
+                h.classList.remove('active');
+                h.nextElementSibling.style.maxHeight = null;
+            });
+            
+            // 切换当前项
+            if (!isOpen) {
+                header.classList.add('active');
+                content.style.maxHeight = content.scrollHeight + 'px';
+            }
+        });
+    });
+    
+    // 模态框
+    const modalTriggers = document.querySelectorAll('[data-modal]');
+    const modals = document.querySelectorAll('.modal');
+    const modalCloses = document.querySelectorAll('.modal-close');
+    
+    modalTriggers.forEach(trigger => {
+        trigger.addEventListener('click', () => {
+            const modalId = trigger.dataset.modal;
+            const modal = document.getElementById(modalId);
+            if (modal) {
+                modal.classList.add('open');
+                document.body.style.overflow = 'hidden';
+            }
+        });
+    });
+    
+    modalCloses.forEach(close => {
+        close.addEventListener('click', () => {
+            const modal = close.closest('.modal');
+            modal.classList.remove('open');
+            document.body.style.overflow = '';
+        });
+    });
+    
+    // 点击背景关闭模态框
+    modals.forEach(modal => {
+        modal.addEventListener('click', (e) => {
+            if (e.target === modal) {
+                modal.classList.remove('open');
+                document.body.style.overflow = '';
+            }
+        });
+    });
+    
+    // 工具提示
+    const tooltips = document.querySelectorAll('[data-tooltip]');
+    
+    tooltips.forEach(element => {
+        const tooltip = document.createElement('div');
+        tooltip.classList.add('tooltip');
+        tooltip.textContent = element.dataset.tooltip;
+        
+        element.addEventListener('mouseenter', () => {
+            document.body.appendChild(tooltip);
+            const rect = element.getBoundingClientRect();
+            tooltip.style.left = rect.left + rect.width / 2 - tooltip.offsetWidth / 2 + 'px';
+            tooltip.style.top = rect.top - tooltip.offsetHeight - 10 + 'px';
+            tooltip.classList.add('show');
+        });
+        
+        element.addEventListener('mouseleave', () => {
+            tooltip.classList.remove('show');
+            setTimeout(() => {
+                tooltip.remove();
+            }, 300);
+        });
+    });
+}
+
+// 复制到剪贴板
+function copyToClipboard(text) {
+    const textarea = document.createElement('textarea');
+    textarea.value = text;
+    document.body.appendChild(textarea);
+    textarea.select();
+    document.execCommand('copy');
+    document.body.removeChild(textarea);
+    showSuccess('已复制到剪贴板');
+}
+
+// 分享功能
+function shareContent(platform) {
+    const url = encodeURIComponent(window.location.href);
+    const title = encodeURIComponent(document.title);
+    let shareUrl = '';
+    
+    switch(platform) {
+        case 'wechat':
+            // 生成微信分享二维码
+            generateQRCode(window.location.href);
+            break;
+        case 'weibo':
+            shareUrl = `https://service.weibo.com/share/share.php?url=${url}&title=${title}`;
+            break;
+        case 'linkedin':
+            shareUrl = `https://www.linkedin.com/sharing/share-offsite/?url=${url}`;
+            break;
+        case 'twitter':
+            shareUrl = `https://twitter.com/intent/tweet?url=${url}&text=${title}`;
+            break;
+    }
+    
+    if (shareUrl) {
+        window.open(shareUrl, '_blank', 'width=600,height=400');
+    }
+}
+
+// 生成二维码
+function generateQRCode(text) {
+    const modal = document.createElement('div');
+    modal.classList.add('qr-modal');
+    modal.innerHTML = `
+        <div class="qr-content">
+            <h3>微信扫码分享</h3>
+            <div id="qrcode"></div>
+            <button class="btn btn-secondary" onclick="this.parentElement.parentElement.remove()">关闭</button>
+        </div>
+    `;
+    document.body.appendChild(modal);
+    
+    // 这里可以集成实际的二维码生成库
+    document.getElementById('qrcode').innerHTML = '二维码生成区域';
+}
+
+// 主题切换
+function initThemeToggle() {
+    const themeToggle = document.getElementById('themeToggle');
+    const currentTheme = localStorage.getItem('theme') || 'light';
+    
+    document.documentElement.setAttribute('data-theme', currentTheme);
+    
+    themeToggle?.addEventListener('click', () => {
+        const theme = document.documentElement.getAttribute('data-theme') === 'light' ? 'dark' : 'light';
+        document.documentElement.setAttribute('data-theme', theme);
+        localStorage.setItem('theme', theme);
+    });
+}
+
+// 导出为 PDF
+function exportToPDF() {
+    window.print();
+}
+
+// 性能监控
+function initPerformanceMonitoring() {
+    // 页面加载时间
+    window.addEventListener('load', () => {
+        const loadTime = performance.timing.loadEventEnd - performance.timing.navigationStart;
+        console.log(`页面加载时间: ${loadTime}ms`);
+        
+        // 发送到分析服务
+        if (window.gtag) {
+            gtag('event', 'page_load_time', {
+                value: loadTime,
+                page_path: window.location.pathname
+            });
+        }
+    });
+    
+    // 监控长任务
+    if ('PerformanceObserver' in window) {
+        const observer = new PerformanceObserver((list) => {
+            for (const entry of list.getEntries()) {
+                console.log('Long Task detected:', entry);
+            }
+        });
+        
+        observer.observe({ entryTypes: ['longtask'] });
+    }
+}
+
+// 处理图片加载错误
+function handleImageErrors() {
+    const images = document.querySelectorAll('img');
+    const defaultImage = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDAwIiBoZWlnaHQ9IjMwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cmVjdCB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSIjZTJlOGYwIi8+PHRleHQgeD0iNTAlIiB5PSI1MCUiIGZvbnQtZmFtaWx5PSJBcmlhbCIgZm9udC1zaXplPSIxOCIgZmlsbD0iIzk0YTNiOCIgdGV4dC1hbmNob3I9Im1pZGRsZSIgZHk9Ii4zZW0iPuWbvueJh+WKoOi9veS4rTwvdGV4dD48L3N2Zz4=';
+    
+    images.forEach(img => {
+        // 添加错误处理
+        img.addEventListener('error', function() {
+            console.warn('图片加载失败:', this.src);
+            // 设置默认占位图
+            this.src = defaultImage;
+            this.alt = '图片加载失败';
+            this.classList.add('image-error');
+        });
+        
+        // 添加加载成功处理
+        img.addEventListener('load', function() {
+            this.classList.add('image-loaded');
+        });
+    });
+}
+
+// 初始化性能监控
+initPerformanceMonitoring();
+initThemeToggle();
\ No newline at end of file
diff --git a/web_frontend/exhibition-demo/public/web_result/pages/budget.html b/web_frontend/exhibition-demo/public/web_result/pages/budget.html
new file mode 100644
index 00000000..be474237
--- /dev/null
+++ b/web_frontend/exhibition-demo/public/web_result/pages/budget.html
@@ -0,0 +1,1121 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>预算分析 - 2024长三角国际新能源汽车展</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
+    <style>
+        * {
+            font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+        }
+        
+        /* Glass morphism effect */
+        .glass-morphism {
+            background: rgba(255, 255, 255, 0.9);
+            backdrop-filter: blur(10px);
+            -webkit-backdrop-filter: blur(10px);
+        }
+        
+        /* Background animation */
+        .animated-bg {
+            background: linear-gradient(135deg, #667eea 0%, #764ba2 25%, #667eea 50%, #764ba2 75%, #667eea 100%);
+            background-size: 400% 400%;
+            animation: gradientShift 20s ease infinite;
+        }
+        
+        @keyframes gradientShift {
+            0% { background-position: 0% 50%; }
+            50% { background-position: 100% 50%; }
+            100% { background-position: 0% 50%; }
+        }
+        
+        /* Counter animation */
+        .counter-animation {
+            animation: countUp 2s ease-out forwards;
+        }
+        
+        @keyframes countUp {
+            from { 
+                opacity: 0; 
+                transform: translateY(30px) scale(0.8);
+            }
+            to { 
+                opacity: 1; 
+                transform: translateY(0) scale(1);
+            }
+        }
+        
+        /* Floating animation */
+        .float-animation {
+            animation: float 3s ease-in-out infinite;
+        }
+        
+        @keyframes float {
+            0%, 100% { transform: translateY(0px); }
+            50% { transform: translateY(-20px); }
+        }
+        
+        /* Chart animations */
+        .chart-bar {
+            animation: growBar 1.5s ease-out forwards;
+            transform-origin: left center;
+        }
+        
+        @keyframes growBar {
+            from { 
+                transform: scaleX(0);
+                opacity: 0;
+            }
+            to { 
+                transform: scaleX(1);
+                opacity: 1;
+            }
+        }
+        
+        /* Pie chart animation */
+        .pie-rotate {
+            animation: pieRotate 2s ease-out forwards;
+        }
+        
+        @keyframes pieRotate {
+            from { transform: rotate(-90deg) scale(0); }
+            to { transform: rotate(0deg) scale(1); }
+        }
+        
+        /* Pulse animation */
+        .pulse-animation {
+            animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
+        }
+        
+        @keyframes pulse {
+            0%, 100% { 
+                opacity: 1;
+                transform: scale(1);
+            }
+            50% { 
+                opacity: 0.8;
+                transform: scale(1.05);
+            }
+        }
+        
+        /* Glow effect */
+        .glow-effect {
+            box-shadow: 0 0 30px rgba(16, 185, 129, 0.3);
+            animation: glow 2s ease-in-out infinite alternate;
+        }
+        
+        @keyframes glow {
+            from { box-shadow: 0 0 30px rgba(16, 185, 129, 0.3); }
+            to { box-shadow: 0 0 50px rgba(16, 185, 129, 0.5), 0 0 70px rgba(16, 185, 129, 0.3); }
+        }
+        
+        /* Progress ring */
+        .progress-ring {
+            transform: rotate(-90deg);
+            transform-origin: 50% 50%;
+        }
+        
+        .progress-ring-circle {
+            stroke-dasharray: 440;
+            stroke-dashoffset: 440;
+            animation: progressRing 2s ease-out forwards;
+        }
+        
+        @keyframes progressRing {
+            to { stroke-dashoffset: 0; }
+        }
+        
+        /* 3D card effect */
+        .card-3d {
+            transform-style: preserve-3d;
+            transition: transform 0.6s;
+        }
+        
+        .card-3d:hover {
+            transform: rotateY(5deg) rotateX(5deg);
+        }
+        
+        /* Gradient text */
+        .gradient-text {
+            background: linear-gradient(135deg, #667eea 0%, #10b981 100%);
+            -webkit-background-clip: text;
+            -webkit-text-fill-color: transparent;
+            background-clip: text;
+        }
+        
+        /* Money flow animation */
+        .money-flow {
+            position: relative;
+            overflow: hidden;
+        }
+        
+        .money-flow::before {
+            content: '';
+            position: absolute;
+            top: -100%;
+            left: -100%;
+            width: 300%;
+            height: 300%;
+            background: linear-gradient(45deg, transparent, rgba(16, 185, 129, 0.3), transparent);
+            animation: moneyFlow 3s linear infinite;
+        }
+        
+        @keyframes moneyFlow {
+            0% { transform: translateX(-100%) translateY(100%); }
+            100% { transform: translateX(100%) translateY(-100%); }
+        }
+        
+        /* Fade animations */
+        .fade-in-up {
+            animation: fadeInUp 0.8s ease-out forwards;
+        }
+        
+        @keyframes fadeInUp {
+            from {
+                opacity: 0;
+                transform: translateY(30px);
+            }
+            to {
+                opacity: 1;
+                transform: translateY(0);
+            }
+        }
+        
+        /* Nav link effect */
+        .nav-link {
+            position: relative;
+            transition: color 0.3s ease;
+        }
+        
+        .nav-link::after {
+            content: '';
+            position: absolute;
+            bottom: -2px;
+            left: 0;
+            width: 0;
+            height: 2px;
+            background: linear-gradient(90deg, #10b981, #3b82f6);
+            transition: width 0.3s ease;
+        }
+        
+        .nav-link:hover::after,
+        .nav-link.active::after {
+            width: 100%;
+        }
+        
+        /* Parallax background */
+        .parallax-bg {
+            background-attachment: fixed;
+            background-position: center;
+            background-repeat: no-repeat;
+            background-size: cover;
+        }
+        
+        /* Chart animation delays */
+        .delay-100 { animation-delay: 0.1s; }
+        .delay-200 { animation-delay: 0.2s; }
+        .delay-300 { animation-delay: 0.3s; }
+        .delay-400 { animation-delay: 0.4s; }
+        .delay-500 { animation-delay: 0.5s; }
+        .delay-600 { animation-delay: 0.6s; }
+    </style>
+</head>
+<body class="bg-gray-50">
+    <!-- Navigation -->
+    <nav class="fixed top-0 w-full glass-morphism shadow-lg z-50 transition-all duration-300">
+        <div class="container mx-auto px-6 py-4">
+            <div class="flex items-center justify-between">
+                <div class="flex items-center">
+                    <h1 class="text-2xl font-bold gradient-text">NEVIT 2024</h1>
+                    <span class="ml-3 text-sm text-gray-500">新能源汽车产业博览会</span>
+                </div>
+                <div class="hidden md:flex space-x-8">
+                    <a href="../index.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-home mr-2"></i>首页
+                    </a>
+                    <a href="overview.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-info-circle mr-2"></i>展会概览
+                    </a>
+                    <a href="exhibition.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-th-large mr-2"></i>展览内容
+                    </a>
+                    <a href="marketing.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-bullhorn mr-2"></i>营销推广
+                    </a>
+                    <a href="operation.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-cogs mr-2"></i>运营服务
+                    </a>
+                    <a href="budget.html" class="nav-link active text-emerald-500">
+                        <i class="fas fa-chart-pie mr-2"></i>预算分析
+                    </a>
+                    <a href="risk.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-shield-alt mr-2"></i>风险评估
+                    </a>
+                </div>
+            </div>
+        </div>
+    </nav>
+
+    <!-- Hero Section with Parallax -->
+    <section class="relative min-h-[500px] pt-20 parallax-bg animated-bg flex items-center justify-center overflow-hidden">
+        <div class="absolute inset-0 bg-black/40"></div>
+        <div class="relative z-10 container mx-auto px-6 text-center text-white">
+            <h1 class="text-5xl md:text-6xl font-bold mb-6 fade-in-up">
+                智能预算管理系统
+            </h1>
+            <p class="text-xl md:text-2xl mb-8 fade-in-up delay-200">
+                科学规划 · 精准投资 · 价值最大化
+            </p>
+            <div class="flex justify-center space-x-6 fade-in-up delay-400">
+                <div class="bg-white/20 backdrop-blur-md rounded-xl p-4">
+                    <i class="fas fa-chart-line text-3xl mb-2"></i>
+                    <p class="text-sm">ROI 33.3%</p>
+                </div>
+                <div class="bg-white/20 backdrop-blur-md rounded-xl p-4">
+                    <i class="fas fa-wallet text-3xl mb-2"></i>
+                    <p class="text-sm">总预算 900万</p>
+                </div>
+                <div class="bg-white/20 backdrop-blur-md rounded-xl p-4">
+                    <i class="fas fa-coins text-3xl mb-2"></i>
+                    <p class="text-sm">预期收入 1200万</p>
+                </div>
+            </div>
+        </div>
+        
+        <!-- Floating money icons -->
+        <div class="absolute top-20 left-10 text-white/20 float-animation">
+            <i class="fas fa-dollar-sign text-6xl"></i>
+        </div>
+        <div class="absolute bottom-20 right-10 text-white/20 float-animation delay-300">
+            <i class="fas fa-euro-sign text-6xl"></i>
+        </div>
+        <div class="absolute top-40 right-20 text-white/20 float-animation delay-600">
+            <i class="fas fa-yen-sign text-5xl"></i>
+        </div>
+    </section>
+
+    <!-- Budget Overview Dashboard -->
+    <section class="py-20 bg-white">
+        <div class="container mx-auto px-6">
+            <div class="text-center mb-12">
+                <h2 class="text-4xl font-bold gradient-text mb-4">预算总控仪表盘</h2>
+                <p class="text-gray-600 text-lg">实时监控 · 动态调整 · 风险预警</p>
+            </div>
+            
+            <!-- Key Metrics Grid -->
+            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-12">
+                <!-- Total Budget Card -->
+                <div class="card-3d bg-gradient-to-br from-blue-500 to-blue-600 rounded-2xl p-6 text-white shadow-2xl">
+                    <div class="flex justify-between items-start mb-4">
+                        <div class="bg-white/20 p-3 rounded-lg">
+                            <i class="fas fa-money-bill-wave text-2xl"></i>
+                        </div>
+                        <span class="bg-white/20 px-3 py-1 rounded-full text-xs">-5.3%</span>
+                    </div>
+                    <div class="counter-animation">
+                        <h3 class="text-3xl font-bold mb-1">¥900万</h3>
+                        <p class="text-blue-100 text-sm">总支出预算</p>
+                    </div>
+                    <div class="mt-4 bg-white/20 rounded-lg p-2">
+                        <div class="flex justify-between text-xs mb-1">
+                            <span>执行率</span>
+                            <span>75%</span>
+                        </div>
+                        <div class="bg-white/30 rounded-full h-2">
+                            <div class="bg-white rounded-full h-2 chart-bar" style="width: 75%"></div>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Expected Revenue Card -->
+                <div class="card-3d bg-gradient-to-br from-green-500 to-green-600 rounded-2xl p-6 text-white shadow-2xl">
+                    <div class="flex justify-between items-start mb-4">
+                        <div class="bg-white/20 p-3 rounded-lg">
+                            <i class="fas fa-chart-line text-2xl"></i>
+                        </div>
+                        <span class="bg-white/20 px-3 py-1 rounded-full text-xs">+20%</span>
+                    </div>
+                    <div class="counter-animation delay-200">
+                        <h3 class="text-3xl font-bold mb-1">¥1200万</h3>
+                        <p class="text-green-100 text-sm">预期总收入</p>
+                    </div>
+                    <div class="mt-4 bg-white/20 rounded-lg p-2">
+                        <div class="flex justify-between text-xs mb-1">
+                            <span>完成度</span>
+                            <span>85%</span>
+                        </div>
+                        <div class="bg-white/30 rounded-full h-2">
+                            <div class="bg-white rounded-full h-2 chart-bar delay-200" style="width: 85%"></div>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Net Profit Card -->
+                <div class="card-3d bg-gradient-to-br from-purple-500 to-purple-600 rounded-2xl p-6 text-white shadow-2xl">
+                    <div class="flex justify-between items-start mb-4">
+                        <div class="bg-white/20 p-3 rounded-lg">
+                            <i class="fas fa-hand-holding-usd text-2xl"></i>
+                        </div>
+                        <span class="bg-white/20 px-3 py-1 rounded-full text-xs">+15%</span>
+                    </div>
+                    <div class="counter-animation delay-400">
+                        <h3 class="text-3xl font-bold mb-1">¥300万</h3>
+                        <p class="text-purple-100 text-sm">预期净利润</p>
+                    </div>
+                    <div class="mt-4 bg-white/20 rounded-lg p-2">
+                        <div class="flex justify-between text-xs mb-1">
+                            <span>利润率</span>
+                            <span>25%</span>
+                        </div>
+                        <div class="bg-white/30 rounded-full h-2">
+                            <div class="bg-white rounded-full h-2 chart-bar delay-400" style="width: 25%"></div>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- ROI Card with Glow -->
+                <div class="card-3d bg-gradient-to-br from-orange-500 to-orange-600 rounded-2xl p-6 text-white shadow-2xl glow-effect">
+                    <div class="flex justify-between items-start mb-4">
+                        <div class="bg-white/20 p-3 rounded-lg pulse-animation">
+                            <i class="fas fa-percentage text-2xl"></i>
+                        </div>
+                        <span class="bg-green-400 px-3 py-1 rounded-full text-xs text-green-900">优秀</span>
+                    </div>
+                    <div class="counter-animation delay-600">
+                        <h3 class="text-3xl font-bold mb-1">33.3%</h3>
+                        <p class="text-orange-100 text-sm">投资回报率</p>
+                    </div>
+                    <div class="mt-4 bg-white/20 rounded-lg p-2">
+                        <div class="flex justify-between text-xs mb-1">
+                            <span>行业均值</span>
+                            <span>20%</span>
+                        </div>
+                        <div class="bg-white/30 rounded-full h-2">
+                            <div class="bg-white rounded-full h-2 chart-bar delay-600" style="width: 100%"></div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <!-- Real-time Monitoring -->
+            <div class="bg-gray-50 rounded-2xl p-8 money-flow">
+                <h3 class="text-2xl font-bold mb-6">实时财务监控</h3>
+                <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
+                    <div class="bg-white rounded-xl p-6 shadow-lg">
+                        <div class="flex items-center justify-between mb-4">
+                            <h4 class="font-semibold text-gray-700">今日支出</h4>
+                            <i class="fas fa-arrow-down text-red-500"></i>
+                        </div>
+                        <p class="text-3xl font-bold text-red-600">¥5.8万</p>
+                        <p class="text-sm text-gray-500 mt-2">较昨日 -12%</p>
+                    </div>
+                    <div class="bg-white rounded-xl p-6 shadow-lg">
+                        <div class="flex items-center justify-between mb-4">
+                            <h4 class="font-semibold text-gray-700">今日收入</h4>
+                            <i class="fas fa-arrow-up text-green-500"></i>
+                        </div>
+                        <p class="text-3xl font-bold text-green-600">¥12.3万</p>
+                        <p class="text-sm text-gray-500 mt-2">较昨日 +28%</p>
+                    </div>
+                    <div class="bg-white rounded-xl p-6 shadow-lg">
+                        <div class="flex items-center justify-between mb-4">
+                            <h4 class="font-semibold text-gray-700">现金流</h4>
+                            <i class="fas fa-water text-blue-500"></i>
+                        </div>
+                        <p class="text-3xl font-bold text-blue-600">¥238万</p>
+                        <p class="text-sm text-gray-500 mt-2">流动性充足</p>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Detailed Budget Breakdown -->
+    <section class="py-20 bg-gray-50" style="background-image: url('../../data/会展策划/image/财务分析.jpg'); background-size: cover; background-position: center;">
+        <div class="bg-gray-50/95 backdrop-blur-sm">
+            <div class="container mx-auto px-6">
+                <h2 class="text-4xl font-bold text-center mb-12 gradient-text">支出预算明细分析</h2>
+                
+                <div class="grid grid-cols-1 lg:grid-cols-2 gap-8">
+                    <!-- Interactive Pie Chart -->
+                    <div class="bg-white rounded-2xl shadow-xl p-8">
+                        <h3 class="text-2xl font-bold mb-6">预算分配结构</h3>
+                        <div class="relative">
+                            <!-- SVG Pie Chart -->
+                            <svg class="w-full h-80 pie-rotate" viewBox="0 0 400 400">
+                                <defs>
+                                    <filter id="shadow">
+                                        <feDropShadow dx="2" dy="2" stdDeviation="3" flood-opacity="0.3"/>
+                                    </filter>
+                                </defs>
+                                
+                                <!-- Venue costs - 33.3% -->
+                                <path d="M 200 200 L 200 50 A 150 150 0 0 1 350 200 Z" 
+                                      fill="#8b5cf6" filter="url(#shadow)" class="hover:opacity-80 transition-opacity cursor-pointer">
+                                    <title>场地费用: ¥300万 (33.3%)</title>
+                                </path>
+                                
+                                <!-- Marketing - 22.2% -->
+                                <path d="M 200 200 L 350 200 A 150 150 0 0 1 280 330 Z" 
+                                      fill="#10b981" filter="url(#shadow)" class="hover:opacity-80 transition-opacity cursor-pointer">
+                                    <title>营销推广: ¥200万 (22.2%)</title>
+                                </path>
+                                
+                                <!-- Personnel - 16.7% -->
+                                <path d="M 200 200 L 280 330 A 150 150 0 0 1 120 330 Z" 
+                                      fill="#f59e0b" filter="url(#shadow)" class="hover:opacity-80 transition-opacity cursor-pointer">
+                                    <title>人员成本: ¥150万 (16.7%)</title>
+                                </path>
+                                
+                                <!-- Activities - 11.1% -->
+                                <path d="M 200 200 L 120 330 A 150 150 0 0 1 50 200 Z" 
+                                      fill="#ef4444" filter="url(#shadow)" class="hover:opacity-80 transition-opacity cursor-pointer">
+                                    <title>活动执行: ¥100万 (11.1%)</title>
+                                </path>
+                                
+                                <!-- Operations - 8.9% -->
+                                <path d="M 200 200 L 50 200 A 150 150 0 0 1 120 70 Z" 
+                                      fill="#3b82f6" filter="url(#shadow)" class="hover:opacity-80 transition-opacity cursor-pointer">
+                                    <title>运营保障: ¥80万 (8.9%)</title>
+                                </path>
+                                
+                                <!-- Reserve - 7.8% -->
+                                <path d="M 200 200 L 120 70 A 150 150 0 0 1 200 50 Z" 
+                                      fill="#ec4899" filter="url(#shadow)" class="hover:opacity-80 transition-opacity cursor-pointer">
+                                    <title>应急储备: ¥70万 (7.8%)</title>
+                                </path>
+                                
+                                <!-- Center circle -->
+                                <circle cx="200" cy="200" r="80" fill="white" filter="url(#shadow)"/>
+                                <text x="200" y="190" text-anchor="middle" class="text-3xl font-bold fill-gray-800">¥900万</text>
+                                <text x="200" y="220" text-anchor="middle" class="text-sm fill-gray-500">总预算</text>
+                            </svg>
+                        </div>
+                        
+                        <!-- Legend -->
+                        <div class="grid grid-cols-2 gap-3 mt-6">
+                            <div class="flex items-center">
+                                <div class="w-4 h-4 bg-purple-600 rounded mr-2"></div>
+                                <span class="text-sm">场地费用 33.3%</span>
+                            </div>
+                            <div class="flex items-center">
+                                <div class="w-4 h-4 bg-green-500 rounded mr-2"></div>
+                                <span class="text-sm">营销推广 22.2%</span>
+                            </div>
+                            <div class="flex items-center">
+                                <div class="w-4 h-4 bg-yellow-500 rounded mr-2"></div>
+                                <span class="text-sm">人员成本 16.7%</span>
+                            </div>
+                            <div class="flex items-center">
+                                <div class="w-4 h-4 bg-red-500 rounded mr-2"></div>
+                                <span class="text-sm">活动执行 11.1%</span>
+                            </div>
+                            <div class="flex items-center">
+                                <div class="w-4 h-4 bg-blue-500 rounded mr-2"></div>
+                                <span class="text-sm">运营保障 8.9%</span>
+                            </div>
+                            <div class="flex items-center">
+                                <div class="w-4 h-4 bg-pink-500 rounded mr-2"></div>
+                                <span class="text-sm">应急储备 7.8%</span>
+                            </div>
+                        </div>
+                    </div>
+
+                    <!-- Detailed Budget List -->
+                    <div class="bg-white rounded-2xl shadow-xl p-8">
+                        <h3 class="text-2xl font-bold mb-6">分项预算执行</h3>
+                        <div class="space-y-6">
+                            <!-- Venue Costs -->
+                            <div class="border-l-4 border-purple-600 pl-4">
+                                <div class="flex justify-between items-center mb-2">
+                                    <h4 class="font-bold text-purple-600 flex items-center">
+                                        <i class="fas fa-building mr-2"></i>场地费用
+                                    </h4>
+                                    <span class="text-xl font-bold">¥300万</span>
+                                </div>
+                                <div class="space-y-2">
+                                    <div class="flex justify-between text-sm">
+                                        <span class="text-gray-600">展馆租赁</span>
+                                        <span>¥180万</span>
+                                    </div>
+                                    <div class="flex justify-between text-sm">
+                                        <span class="text-gray-600">搭建装修</span>
+                                        <span>¥80万</span>
+                                    </div>
+                                    <div class="flex justify-between text-sm">
+                                        <span class="text-gray-600">设备租赁</span>
+                                        <span>¥40万</span>
+                                    </div>
+                                </div>
+                                <div class="mt-2 bg-gray-200 rounded-full h-2">
+                                    <div class="bg-purple-600 h-2 rounded-full chart-bar" style="width: 90%"></div>
+                                </div>
+                                <p class="text-xs text-gray-500 mt-1">执行率: 90%</p>
+                            </div>
+
+                            <!-- Marketing Costs -->
+                            <div class="border-l-4 border-green-600 pl-4">
+                                <div class="flex justify-between items-center mb-2">
+                                    <h4 class="font-bold text-green-600 flex items-center">
+                                        <i class="fas fa-bullhorn mr-2"></i>营销推广
+                                    </h4>
+                                    <span class="text-xl font-bold">¥200万</span>
+                                </div>
+                                <div class="space-y-2">
+                                    <div class="flex justify-between text-sm">
+                                        <span class="text-gray-600">数字营销</span>
+                                        <span>¥80万</span>
+                                    </div>
+                                    <div class="flex justify-between text-sm">
+                                        <span class="text-gray-600">线下推广</span>
+                                        <span>¥60万</span>
+                                    </div>
+                                    <div class="flex justify-between text-sm">
+                                        <span class="text-gray-600">媒体合作</span>
+                                        <span>¥40万</span>
+                                    </div>
+                                    <div class="flex justify-between text-sm">
+                                        <span class="text-gray-600">KOL合作</span>
+                                        <span>¥20万</span>
+                                    </div>
+                                </div>
+                                <div class="mt-2 bg-gray-200 rounded-full h-2">
+                                    <div class="bg-green-600 h-2 rounded-full chart-bar delay-200" style="width: 75%"></div>
+                                </div>
+                                <p class="text-xs text-gray-500 mt-1">执行率: 75%</p>
+                            </div>
+
+                            <!-- Personnel Costs -->
+                            <div class="border-l-4 border-yellow-600 pl-4">
+                                <div class="flex justify-between items-center mb-2">
+                                    <h4 class="font-bold text-yellow-600 flex items-center">
+                                        <i class="fas fa-users mr-2"></i>人员成本
+                                    </h4>
+                                    <span class="text-xl font-bold">¥150万</span>
+                                </div>
+                                <div class="space-y-2">
+                                    <div class="flex justify-between text-sm">
+                                        <span class="text-gray-600">项目团队</span>
+                                        <span>¥80万</span>
+                                    </div>
+                                    <div class="flex justify-between text-sm">
+                                        <span class="text-gray-600">临时人员</span>
+                                        <span>¥40万</span>
+                                    </div>
+                                    <div class="flex justify-between text-sm">
+                                        <span class="text-gray-600">专家顾问</span>
+                                        <span>¥30万</span>
+                                    </div>
+                                </div>
+                                <div class="mt-2 bg-gray-200 rounded-full h-2">
+                                    <div class="bg-yellow-600 h-2 rounded-full chart-bar delay-400" style="width: 85%"></div>
+                                </div>
+                                <p class="text-xs text-gray-500 mt-1">执行率: 85%</p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Revenue Analysis Section -->
+    <section class="py-20 bg-white">
+        <div class="container mx-auto px-6">
+            <h2 class="text-4xl font-bold text-center mb-12 gradient-text">收入来源与预测</h2>
+            
+            <!-- Revenue Stream Cards -->
+            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-12">
+                <!-- Exhibition Booth Revenue -->
+                <div class="group relative overflow-hidden rounded-2xl shadow-xl">
+                    <div class="absolute inset-0 bg-gradient-to-br from-blue-600 to-blue-700 transform transition-transform group-hover:scale-110"></div>
+                    <div class="relative p-6 text-white">
+                        <div class="bg-white/20 w-16 h-16 rounded-full flex items-center justify-center mb-4">
+                            <i class="fas fa-store text-2xl"></i>
+                        </div>
+                        <h3 class="text-xl font-bold mb-2">展位收入</h3>
+                        <p class="text-3xl font-bold mb-1">¥700万</p>
+                        <p class="text-blue-100 text-sm">占比 58.3%</p>
+                        <div class="mt-4 space-y-1 text-xs">
+                            <div class="flex justify-between">
+                                <span>标准展位</span>
+                                <span>1200个</span>
+                            </div>
+                            <div class="flex justify-between">
+                                <span>特装展位</span>
+                                <span>20000㎡</span>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Sponsorship Revenue -->
+                <div class="group relative overflow-hidden rounded-2xl shadow-xl">
+                    <div class="absolute inset-0 bg-gradient-to-br from-green-600 to-green-700 transform transition-transform group-hover:scale-110"></div>
+                    <div class="relative p-6 text-white">
+                        <div class="bg-white/20 w-16 h-16 rounded-full flex items-center justify-center mb-4">
+                            <i class="fas fa-handshake text-2xl"></i>
+                        </div>
+                        <h3 class="text-xl font-bold mb-2">赞助收入</h3>
+                        <p class="text-3xl font-bold mb-1">¥300万</p>
+                        <p class="text-green-100 text-sm">占比 25%</p>
+                        <div class="mt-4 space-y-1 text-xs">
+                            <div class="flex justify-between">
+                                <span>冠名赞助</span>
+                                <span>1家</span>
+                            </div>
+                            <div class="flex justify-between">
+                                <span>战略合作</span>
+                                <span>3家</span>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Advertising Revenue -->
+                <div class="group relative overflow-hidden rounded-2xl shadow-xl">
+                    <div class="absolute inset-0 bg-gradient-to-br from-purple-600 to-purple-700 transform transition-transform group-hover:scale-110"></div>
+                    <div class="relative p-6 text-white">
+                        <div class="bg-white/20 w-16 h-16 rounded-full flex items-center justify-center mb-4">
+                            <i class="fas fa-ad text-2xl"></i>
+                        </div>
+                        <h3 class="text-xl font-bold mb-2">广告收入</h3>
+                        <p class="text-3xl font-bold mb-1">¥100万</p>
+                        <p class="text-purple-100 text-sm">占比 8.3%</p>
+                        <div class="mt-4 space-y-1 text-xs">
+                            <div class="flex justify-between">
+                                <span>现场广告</span>
+                                <span>50万</span>
+                            </div>
+                            <div class="flex justify-between">
+                                <span>数字广告</span>
+                                <span>50万</span>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Other Revenue -->
+                <div class="group relative overflow-hidden rounded-2xl shadow-xl">
+                    <div class="absolute inset-0 bg-gradient-to-br from-orange-600 to-orange-700 transform transition-transform group-hover:scale-110"></div>
+                    <div class="relative p-6 text-white">
+                        <div class="bg-white/20 w-16 h-16 rounded-full flex items-center justify-center mb-4">
+                            <i class="fas fa-ellipsis-h text-2xl"></i>
+                        </div>
+                        <h3 class="text-xl font-bold mb-2">其他收入</h3>
+                        <p class="text-3xl font-bold mb-1">¥100万</p>
+                        <p class="text-orange-100 text-sm">占比 8.3%</p>
+                        <div class="mt-4 space-y-1 text-xs">
+                            <div class="flex justify-between">
+                                <span>门票收入</span>
+                                <span>30万</span>
+                            </div>
+                            <div class="flex justify-between">
+                                <span>服务费用</span>
+                                <span>70万</span>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <!-- Revenue Forecast Chart -->
+            <div class="bg-gradient-to-r from-blue-50 to-green-50 rounded-2xl p-8">
+                <h3 class="text-2xl font-bold mb-6">收入增长预测</h3>
+                <div class="grid grid-cols-1 lg:grid-cols-2 gap-8">
+                    <!-- Monthly Forecast -->
+                    <div class="bg-white rounded-xl p-6">
+                        <h4 class="font-bold text-gray-700 mb-4">月度收入趋势</h4>
+                        <div class="space-y-3">
+                            <div class="flex items-center justify-between">
+                                <span class="text-sm text-gray-600">1月</span>
+                                <div class="flex-1 mx-4 bg-gray-200 rounded-full h-6 relative">
+                                    <div class="bg-gradient-to-r from-blue-500 to-green-500 h-6 rounded-full chart-bar" style="width: 30%"></div>
+                                </div>
+                                <span class="text-sm font-bold">¥120万</span>
+                            </div>
+                            <div class="flex items-center justify-between">
+                                <span class="text-sm text-gray-600">2月</span>
+                                <div class="flex-1 mx-4 bg-gray-200 rounded-full h-6 relative">
+                                    <div class="bg-gradient-to-r from-blue-500 to-green-500 h-6 rounded-full chart-bar delay-100" style="width: 45%"></div>
+                                </div>
+                                <span class="text-sm font-bold">¥180万</span>
+                            </div>
+                            <div class="flex items-center justify-between">
+                                <span class="text-sm text-gray-600">3月</span>
+                                <div class="flex-1 mx-4 bg-gray-200 rounded-full h-6 relative">
+                                    <div class="bg-gradient-to-r from-blue-500 to-green-500 h-6 rounded-full chart-bar delay-200" style="width: 70%"></div>
+                                </div>
+                                <span class="text-sm font-bold">¥280万</span>
+                            </div>
+                            <div class="flex items-center justify-between">
+                                <span class="text-sm text-gray-600">4月（展会）</span>
+                                <div class="flex-1 mx-4 bg-gray-200 rounded-full h-6 relative">
+                                    <div class="bg-gradient-to-r from-blue-500 to-green-500 h-6 rounded-full chart-bar delay-300" style="width: 100%"></div>
+                                </div>
+                                <span class="text-sm font-bold">¥620万</span>
+                            </div>
+                        </div>
+                    </div>
+
+                    <!-- Category Growth -->
+                    <div class="bg-white rounded-xl p-6">
+                        <h4 class="font-bold text-gray-700 mb-4">收入类别增长率</h4>
+                        <div class="space-y-4">
+                            <div class="flex items-center justify-between p-3 bg-blue-50 rounded-lg">
+                                <div class="flex items-center">
+                                    <i class="fas fa-store text-blue-600 mr-3"></i>
+                                    <span class="font-semibold">展位收入</span>
+                                </div>
+                                <div class="flex items-center">
+                                    <span class="text-green-600 font-bold">+18%</span>
+                                    <i class="fas fa-arrow-up text-green-600 ml-2"></i>
+                                </div>
+                            </div>
+                            <div class="flex items-center justify-between p-3 bg-green-50 rounded-lg">
+                                <div class="flex items-center">
+                                    <i class="fas fa-handshake text-green-600 mr-3"></i>
+                                    <span class="font-semibold">赞助收入</span>
+                                </div>
+                                <div class="flex items-center">
+                                    <span class="text-green-600 font-bold">+25%</span>
+                                    <i class="fas fa-arrow-up text-green-600 ml-2"></i>
+                                </div>
+                            </div>
+                            <div class="flex items-center justify-between p-3 bg-purple-50 rounded-lg">
+                                <div class="flex items-center">
+                                    <i class="fas fa-ad text-purple-600 mr-3"></i>
+                                    <span class="font-semibold">广告收入</span>
+                                </div>
+                                <div class="flex items-center">
+                                    <span class="text-green-600 font-bold">+30%</span>
+                                    <i class="fas fa-arrow-up text-green-600 ml-2"></i>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- ROI Analysis with Visual Effects -->
+    <section class="py-20 bg-gray-50">
+        <div class="container mx-auto px-6">
+            <h2 class="text-4xl font-bold text-center mb-12 gradient-text">投资回报率分析</h2>
+            
+            <!-- ROI Dashboard -->
+            <div class="bg-white rounded-2xl shadow-2xl p-8 mb-12">
+                <div class="grid grid-cols-1 lg:grid-cols-3 gap-8">
+                    <!-- ROI Gauge -->
+                    <div class="text-center">
+                        <h3 class="text-xl font-bold mb-4">综合ROI评分</h3>
+                        <div class="relative inline-block">
+                            <svg class="progress-ring" width="200" height="200">
+                                <circle class="text-gray-200" stroke="currentColor" stroke-width="10" fill="transparent" r="70" cx="100" cy="100"/>
+                                <circle class="progress-ring-circle text-green-500" stroke="currentColor" stroke-width="10" fill="transparent" r="70" cx="100" cy="100" stroke-dasharray="440" stroke-dashoffset="293"/>
+                            </svg>
+                            <div class="absolute inset-0 flex items-center justify-center">
+                                <div>
+                                    <p class="text-4xl font-bold text-green-600">33.3%</p>
+                                    <p class="text-sm text-gray-500">优秀水平</p>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <!-- Direct Benefits -->
+                    <div class="bg-gradient-to-br from-green-50 to-green-100 rounded-xl p-6">
+                        <h3 class="text-lg font-bold mb-4 text-green-700">直接收益</h3>
+                        <div class="space-y-3">
+                            <div class="flex justify-between items-center">
+                                <span class="text-gray-600">展会净利润</span>
+                                <span class="font-bold text-green-600">¥300万</span>
+                            </div>
+                            <div class="flex justify-between items-center">
+                                <span class="text-gray-600">现场成交额</span>
+                                <span class="font-bold text-green-600">¥10亿+</span>
+                            </div>
+                            <div class="flex justify-between items-center">
+                                <span class="text-gray-600">合作签约</span>
+                                <span class="font-bold text-green-600">50+项</span>
+                            </div>
+                        </div>
+                    </div>
+
+                    <!-- Indirect Benefits -->
+                    <div class="bg-gradient-to-br from-blue-50 to-blue-100 rounded-xl p-6">
+                        <h3 class="text-lg font-bold mb-4 text-blue-700">间接收益</h3>
+                        <div class="space-y-3">
+                            <div class="flex justify-between items-center">
+                                <span class="text-gray-600">品牌价值</span>
+                                <span class="font-bold text-blue-600">+¥500万</span>
+                            </div>
+                            <div class="flex justify-between items-center">
+                                <span class="text-gray-600">媒体曝光</span>
+                                <span class="font-bold text-blue-600">1亿+次</span>
+                            </div>
+                            <div class="flex justify-between items-center">
+                                <span class="text-gray-600">产业带动</span>
+                                <span class="font-bold text-blue-600">¥30亿</span>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <!-- Investment Efficiency Matrix -->
+            <div class="grid grid-cols-1 md:grid-cols-4 gap-6">
+                <div class="bg-white rounded-xl p-6 text-center shadow-lg hover:shadow-2xl transition-shadow">
+                    <div class="w-20 h-20 bg-gradient-to-br from-green-400 to-green-600 rounded-full flex items-center justify-center mx-auto mb-4">
+                        <i class="fas fa-chart-line text-white text-2xl"></i>
+                    </div>
+                    <h4 class="font-bold mb-2">投入产出比</h4>
+                    <p class="text-3xl font-bold text-green-600">1:1.33</p>
+                    <p class="text-sm text-gray-500 mt-2">高于行业平均</p>
+                </div>
+
+                <div class="bg-white rounded-xl p-6 text-center shadow-lg hover:shadow-2xl transition-shadow">
+                    <div class="w-20 h-20 bg-gradient-to-br from-blue-400 to-blue-600 rounded-full flex items-center justify-center mx-auto mb-4">
+                        <i class="fas fa-clock text-white text-2xl"></i>
+                    </div>
+                    <h4 class="font-bold mb-2">回收周期</h4>
+                    <p class="text-3xl font-bold text-blue-600">6个月</p>
+                    <p class="text-sm text-gray-500 mt-2">快速回本</p>
+                </div>
+
+                <div class="bg-white rounded-xl p-6 text-center shadow-lg hover:shadow-2xl transition-shadow">
+                    <div class="w-20 h-20 bg-gradient-to-br from-purple-400 to-purple-600 rounded-full flex items-center justify-center mx-auto mb-4">
+                        <i class="fas fa-award text-white text-2xl"></i>
+                    </div>
+                    <h4 class="font-bold mb-2">综合价值</h4>
+                    <p class="text-3xl font-bold text-purple-600">¥1500万</p>
+                    <p class="text-sm text-gray-500 mt-2">含品牌价值</p>
+                </div>
+
+                <div class="bg-white rounded-xl p-6 text-center shadow-lg hover:shadow-2xl transition-shadow">
+                    <div class="w-20 h-20 bg-gradient-to-br from-orange-400 to-orange-600 rounded-full flex items-center justify-center mx-auto mb-4">
+                        <i class="fas fa-star text-white text-2xl"></i>
+                    </div>
+                    <h4 class="font-bold mb-2">投资评级</h4>
+                    <p class="text-3xl font-bold text-orange-600">A+</p>
+                    <p class="text-sm text-gray-500 mt-2">推荐投资</p>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Cost Control Strategy -->
+    <section class="py-20 bg-white">
+        <div class="container mx-auto px-6">
+            <h2 class="text-4xl font-bold text-center mb-12 gradient-text">智能成本控制系统</h2>
+            
+            <div class="grid grid-cols-1 lg:grid-cols-3 gap-8">
+                <!-- Budget Control -->
+                <div class="bg-gradient-to-br from-blue-500 to-blue-600 rounded-2xl p-6 text-white">
+                    <div class="flex items-center mb-4">
+                        <div class="bg-white/20 p-3 rounded-lg mr-4">
+                            <i class="fas fa-shield-alt text-2xl"></i>
+                        </div>
+                        <h3 class="text-xl font-bold">预算管控</h3>
+                    </div>
+                    <ul class="space-y-3">
+                        <li class="flex items-start">
+                            <i class="fas fa-check-circle mr-2 mt-1"></i>
+                            <div>
+                                <p class="font-semibold">AI预算监控</p>
+                                <p class="text-xs text-blue-100">实时预警，智能调配</p>
+                            </div>
+                        </li>
+                        <li class="flex items-start">
+                            <i class="fas fa-check-circle mr-2 mt-1"></i>
+                            <div>
+                                <p class="font-semibold">分级审批制</p>
+                                <p class="text-xs text-blue-100">10万以下快速审批</p>
+                            </div>
+                        </li>
+                        <li class="flex items-start">
+                            <i class="fas fa-check-circle mr-2 mt-1"></i>
+                            <div>
+                                <p class="font-semibold">成本责任制</p>
+                                <p class="text-xs text-blue-100">KPI考核，奖惩分明</p>
+                            </div>
+                        </li>
+                    </ul>
+                </div>
+
+                <!-- Optimization Measures -->
+                <div class="bg-gradient-to-br from-green-500 to-green-600 rounded-2xl p-6 text-white">
+                    <div class="flex items-center mb-4">
+                        <div class="bg-white/20 p-3 rounded-lg mr-4">
+                            <i class="fas fa-cog text-2xl"></i>
+                        </div>
+                        <h3 class="text-xl font-bold">优化措施</h3>
+                    </div>
+                    <ul class="space-y-3">
+                        <li class="flex items-start">
+                            <i class="fas fa-check-circle mr-2 mt-1"></i>
+                            <div>
+                                <p class="font-semibold">智能采购</p>
+                                <p class="text-xs text-green-100">3家比价，最优选择</p>
+                            </div>
+                        </li>
+                        <li class="flex items-start">
+                            <i class="fas fa-check-circle mr-2 mt-1"></i>
+                            <div>
+                                <p class="font-semibold">资源共享</p>
+                                <p class="text-xs text-green-100">合作伙伴资源互换</p>
+                            </div>
+                        </li>
+                        <li class="flex items-start">
+                            <i class="fas fa-check-circle mr-2 mt-1"></i>
+                            <div>
+                                <p class="font-semibold">数字化管理</p>
+                                <p class="text-xs text-green-100">减少30%人工成本</p>
+                            </div>
+                        </li>
+                    </ul>
+                </div>
+
+                <!-- Risk Reserve -->
+                <div class="bg-gradient-to-br from-purple-500 to-purple-600 rounded-2xl p-6 text-white">
+                    <div class="flex items-center mb-4">
+                        <div class="bg-white/20 p-3 rounded-lg mr-4">
+                            <i class="fas fa-piggy-bank text-2xl"></i>
+                        </div>
+                        <h3 class="text-xl font-bold">风险储备</h3>
+                    </div>
+                    <ul class="space-y-3">
+                        <li class="flex items-start">
+                            <i class="fas fa-check-circle mr-2 mt-1"></i>
+                            <div>
+                                <p class="font-semibold">应急基金</p>
+                                <p class="text-xs text-purple-100">¥70万专项储备</p>
+                            </div>
+                        </li>
+                        <li class="flex items-start">
+                            <i class="fas fa-check-circle mr-2 mt-1"></i>
+                            <div>
+                                <p class="font-semibold">保险覆盖</p>
+                                <p class="text-xs text-purple-100">全面风险保障</p>
+                            </div>
+                        </li>
+                        <li class="flex items-start">
+                            <i class="fas fa-check-circle mr-2 mt-1"></i>
+                            <div>
+                                <p class="font-semibold">备用方案</p>
+                                <p class="text-xs text-purple-100">成本可控替代方案</p>
+                            </div>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+
+            <!-- Budget Alert System -->
+            <div class="mt-12 bg-gradient-to-r from-red-50 to-orange-50 rounded-2xl p-8">
+                <h3 class="text-2xl font-bold mb-6">预算预警系统</h3>
+                <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
+                    <div class="bg-white rounded-xl p-4 border-l-4 border-green-500">
+                        <div class="flex items-center justify-between mb-2">
+                            <span class="font-semibold">场地费用</span>
+                            <span class="bg-green-100 text-green-800 px-2 py-1 rounded text-xs">正常</span>
+                        </div>
+                        <div class="text-sm text-gray-600">执行率: 90% | 剩余: ¥30万</div>
+                    </div>
+                    <div class="bg-white rounded-xl p-4 border-l-4 border-yellow-500">
+                        <div class="flex items-center justify-between mb-2">
+                            <span class="font-semibold">营销推广</span>
+                            <span class="bg-yellow-100 text-yellow-800 px-2 py-1 rounded text-xs">注意</span>
+                        </div>
+                        <div class="text-sm text-gray-600">执行率: 75% | 剩余: ¥50万</div>
+                    </div>
+                    <div class="bg-white rounded-xl p-4 border-l-4 border-red-500">
+                        <div class="flex items-center justify-between mb-2">
+                            <span class="font-semibold">人员成本</span>
+                            <span class="bg-red-100 text-red-800 px-2 py-1 rounded text-xs">预警</span>
+                        </div>
+                        <div class="text-sm text-gray-600">执行率: 95% | 剩余: ¥7.5万</div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- CTA Section -->
+    <section class="py-16 bg-gradient-to-r from-emerald-600 to-blue-600 text-white">
+        <div class="container mx-auto px-6 text-center">
+            <h2 class="text-3xl font-bold mb-6">科学预算，确保展会成功</h2>
+            <p class="text-xl mb-8 opacity-90">了解风险管控，保障展会顺利进行</p>
+            <a href="risk.html" class="inline-block bg-white text-emerald-600 px-8 py-3 rounded-lg font-semibold hover:bg-gray-100 transition transform hover:scale-105">
+                查看风险评估 <i class="fas fa-arrow-right ml-2"></i>
+            </a>
+        </div>
+    </section>
+
+    <!-- Footer -->
+    <footer class="bg-gray-900 text-white py-12">
+        <div class="container mx-auto px-6">
+            <div class="text-center">
+                <p class="text-gray-400">© 2024 长三角国际新能源汽车与智能交通产业博览会. All rights reserved.</p>
+                <p class="text-gray-500 text-sm mt-2">Powered by AI Exhibition Planning System</p>
+            </div>
+        </div>
+    </footer>
+
+    <script>
+        // Add scroll animations
+        const observerOptions = {
+            threshold: 0.1,
+            rootMargin: '0px 0px -50px 0px'
+        };
+
+        const observer = new IntersectionObserver((entries) => {
+            entries.forEach(entry => {
+                if (entry.isIntersecting) {
+                    entry.target.style.opacity = '1';
+                    entry.target.style.transform = 'translateY(0)';
+                }
+            });
+        }, observerOptions);
+
+        document.querySelectorAll('.fade-in-up').forEach(el => {
+            el.style.opacity = '0';
+            el.style.transform = 'translateY(30px)';
+            el.style.transition = 'all 0.8s ease-out';
+            observer.observe(el);
+        });
+
+        // Counter animation
+        function animateValue(element, start, end, duration) {
+            const range = end - start;
+            const increment = range / (duration / 16);
+            let current = start;
+            const timer = setInterval(() => {
+                current += increment;
+                if (current >= end) {
+                    current = end;
+                    clearInterval(timer);
+                }
+                element.textContent = Math.floor(current).toLocaleString();
+            }, 16);
+        }
+
+        // Trigger counter animations when visible
+        const counterObserver = new IntersectionObserver((entries) => {
+            entries.forEach(entry => {
+                if (entry.isIntersecting && !entry.target.animated) {
+                    entry.target.animated = true;
+                    const value = parseInt(entry.target.textContent.replace(/[^0-9]/g, ''));
+                    animateValue(entry.target, 0, value, 2000);
+                }
+            });
+        }, observerOptions);
+
+        document.querySelectorAll('.counter-animation h3').forEach(el => {
+            counterObserver.observe(el);
+        });
+    </script>
+</body>
+</html>
\ No newline at end of file
diff --git a/web_frontend/exhibition-demo/public/web_result/pages/exhibition.html b/web_frontend/exhibition-demo/public/web_result/pages/exhibition.html
new file mode 100644
index 00000000..c0f50ee7
--- /dev/null
+++ b/web_frontend/exhibition-demo/public/web_result/pages/exhibition.html
@@ -0,0 +1,835 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>展会介绍 - 2024长三角国际新能源汽车展</title>
+    
+    <!-- 样式表 -->
+    <link rel="stylesheet" href="../css/animations.css">
+    <link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
+    
+    <!-- 字体 -->
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Noto+Sans+SC:wght@300;400;500;700;900&display=swap" rel="stylesheet">
+    
+    <!-- Font Awesome 图标 -->
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
+    <style>
+        * {
+            font-family: 'Inter', 'Noto Sans SC', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+        }
+        
+        /* Glass morphism effect */
+        .glass-morphism {
+            background: rgba(255, 255, 255, 0.9);
+            backdrop-filter: blur(10px);
+            -webkit-backdrop-filter: blur(10px);
+        }
+        
+        /* 页面加载动画 */
+        .page-enter {
+            animation: pageEnter 0.8s ease-out;
+        }
+        
+        @keyframes pageEnter {
+            from { 
+                opacity: 0;
+                transform: translateY(30px);
+            }
+            to { 
+                opacity: 1;
+                transform: translateY(0);
+            }
+        }
+        
+        /* 玻璃态效果 */
+        .glass-card {
+            background: rgba(255, 255, 255, 0.85);
+            backdrop-filter: blur(10px);
+            -webkit-backdrop-filter: blur(10px);
+            border: 1px solid rgba(255, 255, 255, 0.3);
+            transition: all 0.3s ease;
+        }
+        
+        .glass-card:hover {
+            background: rgba(255, 255, 255, 0.95);
+            transform: translateY(-5px);
+            box-shadow: 0 20px 40px rgba(0,0,0,0.15);
+        }
+        .nav-link {
+            position: relative;
+            transition: color 0.3s ease;
+        }
+        .nav-link::after {
+            content: '';
+            position: absolute;
+            bottom: -2px;
+            left: 0;
+            width: 0;
+            height: 2px;
+            background: #667eea;
+            transition: width 0.3s ease;
+        }
+        .nav-link:hover::after,
+        .nav-link.active::after {
+            width: 100%;
+        }
+        .exhibition-card {
+            transition: all 0.3s ease;
+            border: 2px solid transparent;
+        }
+        .exhibition-card:hover {
+            border-color: #667eea;
+            transform: translateY(-5px);
+            box-shadow: 0 20px 40px rgba(0,0,0,0.1);
+        }
+        .scale-in {
+            animation: scaleIn 0.5s ease-out;
+        }
+        @keyframes scaleIn {
+            from { transform: scale(0.9); opacity: 0; }
+            to { transform: scale(1); opacity: 1; }
+        }
+        .map-container {
+            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+            position: relative;
+            overflow: hidden;
+        }
+        .map-container::before {
+            content: '';
+            position: absolute;
+            top: -50%;
+            right: -50%;
+            width: 200%;
+            height: 200%;
+            background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 70%);
+            animation: rotate 20s linear infinite;
+        }
+        @keyframes rotate {
+            from { transform: rotate(0deg); }
+            to { transform: rotate(360deg); }
+        }
+    </style>
+</head>
+<body class="bg-gray-50">
+    <!-- Navigation -->
+    <nav class="fixed top-0 w-full glass-morphism shadow-md z-50 transition-all duration-300">
+        <div class="container mx-auto px-6 py-4">
+            <div class="flex items-center justify-between">
+                <div class="flex items-center">
+                    <div class="w-10 h-10 bg-gradient-to-br from-emerald-400 to-blue-500 rounded-lg flex items-center justify-center mr-3">
+                        <i class="fas fa-charging-station text-white"></i>
+                    </div>
+                    <div>
+                        <h1 class="text-lg font-bold">NEVIT 2024</h1>
+                        <p class="text-xs text-gray-500">新能源汽车产业博览会</p>
+                    </div>
+                </div>
+                <div class="hidden md:flex space-x-8">
+                    <a href="../index.html" class="text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-home mr-2"></i>首页
+                    </a>
+                    <a href="overview.html" class="text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-info-circle mr-2"></i>展会概览
+                    </a>
+                    <a href="exhibition.html" class="nav-link active text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-th-large mr-2"></i>展览内容
+                    </a>
+                    <a href="marketing.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-bullhorn mr-2"></i>营销推广
+                    </a>
+                    <a href="operation.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-cogs mr-2"></i>运营服务
+                    </a>
+                    <a href="budget.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-chart-pie mr-2"></i>预算分析
+                    </a>
+                    <a href="risk.html" class="text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-shield-alt mr-2"></i>风险评估
+                    </a>
+                </div>
+                <button class="md:hidden text-gray-700">
+                    <i class="fas fa-bars text-2xl"></i>
+                </button>
+            </div>
+        </div>
+    </nav>
+
+    <!-- Page Header -->
+    <section class="relative pt-24 pb-16 overflow-hidden" style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);">
+        <!-- 背景装饰 -->
+        <div class="absolute inset-0">
+            <div class="absolute top-0 left-0 w-96 h-96 bg-white/10 rounded-full filter blur-3xl animate-pulse"></div>
+            <div class="absolute bottom-0 right-0 w-96 h-96 bg-purple-300/20 rounded-full filter blur-3xl animate-pulse animation-delay-2000"></div>
+        </div>
+        
+        <div class="container mx-auto px-6 relative z-10 page-enter">
+            <div class="flex items-center text-white/80 mb-4">
+                <a href="../index.html" class="hover:text-white transition">首页</a>
+                <i class="fas fa-chevron-right mx-2 text-xs"></i>
+                <span>展会介绍</span>
+            </div>
+            <h1 class="text-4xl md:text-6xl font-bold text-white mb-4 animate-fadeInUp">
+                展会介绍与预期效果
+            </h1>
+            <p class="text-xl text-white/90 animate-fadeInUp animation-delay-200">
+                <i class="fas fa-chart-line mr-2"></i>
+                深入了解展会规模、展品范围、参展商与观众构成
+            </p>
+            <div class="mt-8 flex flex-wrap gap-4 animate-fadeInUp animation-delay-400">
+                <div class="bg-white/20 backdrop-blur px-4 py-2 rounded-full text-sm">
+                    <i class="fas fa-calendar mr-2"></i>2024年9月12-15日
+                </div>
+                <div class="bg-white/20 backdrop-blur px-4 py-2 rounded-full text-sm">
+                    <i class="fas fa-map-marker-alt mr-2"></i>国家会展中心（上海）
+                </div>
+                <div class="bg-white/20 backdrop-blur px-4 py-2 rounded-full text-sm">
+                    <i class="fas fa-users mr-2"></i>预计10万+参观者
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Exhibition Theme -->
+    <section class="py-16 bg-white">
+        <div class="container mx-auto px-6">
+            <div class="text-center mb-12">
+                <h2 class="text-4xl font-bold text-gray-800 mb-4">智行未来，绿动长三角</h2>
+                <p class="text-xl text-gray-600 max-w-3xl mx-auto">
+                    2024长三角国际新能源汽车与智能交通产业博览会，致力于打造全球新能源汽车产业交流合作的重要平台
+                </p>
+            </div>
+            
+            <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
+                <div class="text-center group animate-fadeInUp animation-delay-200">
+                    <div class="w-20 h-20 bg-gradient-to-br from-blue-100 to-blue-200 rounded-full flex items-center justify-center mx-auto mb-4 group-hover:scale-110 transition-transform shadow-lg">
+                        <i class="fas fa-award text-3xl text-blue-600"></i>
+                    </div>
+                    <h3 class="text-xl font-bold mb-2">专业化</h3>
+                    <p class="text-gray-600">聚焦新能源汽车全产业链，提供专业展示交流平台</p>
+                </div>
+                <div class="text-center group animate-fadeInUp animation-delay-400">
+                    <div class="w-20 h-20 bg-gradient-to-br from-green-100 to-green-200 rounded-full flex items-center justify-center mx-auto mb-4 group-hover:scale-110 transition-transform shadow-lg">
+                        <i class="fas fa-globe-asia text-3xl text-green-600"></i>
+                    </div>
+                    <h3 class="text-xl font-bold mb-2">国际化</h3>
+                    <p class="text-gray-600">汇聚全球领先企业，促进国际技术交流与合作</p>
+                </div>
+                <div class="text-center group animate-fadeInUp animation-delay-600">
+                    <div class="w-20 h-20 bg-gradient-to-br from-purple-100 to-purple-200 rounded-full flex items-center justify-center mx-auto mb-4 group-hover:scale-110 transition-transform shadow-lg">
+                        <i class="fas fa-star text-3xl text-purple-600"></i>
+                    </div>
+                    <h3 class="text-xl font-bold mb-2">品质化</h3>
+                    <p class="text-gray-600">高端展会服务，打造行业标杆展会品牌</p>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Venue Information -->
+    <section class="py-16 bg-gray-50 relative overflow-hidden">
+        <!-- 背景图片 -->
+        <div class="absolute inset-0 opacity-5" style="background-image: url('../../data/会展策划/image/博览会.jpg'); background-size: cover; background-position: center;"></div>
+        
+        <div class="container mx-auto px-6 relative z-10">
+            <h2 class="text-3xl font-bold text-center text-gray-800 mb-12 animate-fadeInUp">
+                <i class="fas fa-map-marked-alt mr-2 text-purple-600"></i>
+                展会场地
+            </h2>
+            <div class="grid grid-cols-1 lg:grid-cols-2 gap-12">
+                <div class="map-container rounded-2xl p-8 text-white relative glass-card hover:scale-[1.02] transition-all duration-300">
+                    <h3 class="text-2xl font-bold mb-4 animate-fadeInLeft">
+                        <i class="fas fa-building mr-2"></i>
+                        国家会展中心（上海）
+                    </h3>
+                    <div class="space-y-3 relative z-10">
+                        <div class="flex items-start animate-fadeInLeft animation-delay-200">
+                            <i class="fas fa-map-marker-alt text-xl mr-3 flex-shrink-0 mt-1 animate-pulse"></i>
+                            <div>
+                                <p class="font-semibold">详细地址</p>
+                                <p class="opacity-90">上海市青浦区崧泽大道333号</p>
+                            </div>
+                        </div>
+                        <div class="flex items-start animate-fadeInLeft animation-delay-400">
+                            <i class="fas fa-subway text-xl mr-3 flex-shrink-0 mt-1"></i>
+                            <div>
+                                <p class="font-semibold">交通便利</p>
+                                <p class="opacity-90">地铁2号线直达，多条公交线路，充足停车位</p>
+                            </div>
+                        </div>
+                        <div class="flex items-start animate-fadeInLeft animation-delay-600">
+                            <i class="fas fa-expand-arrows-alt text-xl mr-3 flex-shrink-0 mt-1"></i>
+                            <div>
+                                <p class="font-semibold">场馆规模</p>
+                                <p class="opacity-90">展览面积50万平方米，亚洲最大会展综合体</p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                
+                <div class="bg-white rounded-2xl shadow-lg p-8 glass-card hover:scale-[1.02] transition-all duration-300">
+                    <h3 class="text-2xl font-bold text-gray-800 mb-6 animate-fadeInRight">
+                        <i class="fas fa-trophy mr-2 text-yellow-500"></i>
+                        场馆优势
+                    </h3>
+                    <div class="space-y-4">
+                        <div class="flex items-center p-4 bg-blue-50 rounded-lg hover:bg-blue-100 transition-colors animate-fadeInRight animation-delay-200">
+                            <div class="w-12 h-12 bg-gradient-to-br from-blue-500 to-blue-600 text-white rounded-lg flex items-center justify-center mr-4 shadow-lg">
+                                <i class="fas fa-medal text-xl"></i>
+                            </div>
+                            <div>
+                                <h4 class="font-semibold">世界级展馆设施</h4>
+                                <p class="text-sm text-gray-600">配备先进的展览设施和智能化管理系统</p>
+                            </div>
+                        </div>
+                        <div class="flex items-center p-4 bg-green-50 rounded-lg hover:bg-green-100 transition-colors animate-fadeInRight animation-delay-400">
+                            <div class="w-12 h-12 bg-gradient-to-br from-green-500 to-green-600 text-white rounded-lg flex items-center justify-center mr-4 shadow-lg">
+                                <i class="fas fa-concierge-bell text-xl"></i>
+                            </div>
+                            <div>
+                                <h4 class="font-semibold">完善的配套服务</h4>
+                                <p class="text-sm text-gray-600">酒店、餐饮、商务中心一应俱全</p>
+                            </div>
+                        </div>
+                        <div class="flex items-center p-4 bg-purple-50 rounded-lg hover:bg-purple-100 transition-colors animate-fadeInRight animation-delay-600">
+                            <div class="w-12 h-12 bg-gradient-to-br from-purple-500 to-purple-600 text-white rounded-lg flex items-center justify-center mr-4 shadow-lg">
+                                <i class="fas fa-hand-holding-heart text-xl"></i>
+                            </div>
+                            <div>
+                                <h4 class="font-semibold">丰富的办展经验</h4>
+                                <p class="text-sm text-gray-600">成功举办进博会等大型国际展会</p>
+                            </div>
+                        </div>
+                        <div class="flex items-center p-4 bg-orange-50 rounded-lg hover:bg-orange-100 transition-colors animate-fadeInRight animation-delay-800">
+                            <div class="w-12 h-12 bg-gradient-to-br from-orange-500 to-orange-600 text-white rounded-lg flex items-center justify-center mr-4 shadow-lg">
+                                <i class="fas fa-leaf text-xl"></i>
+                            </div>
+                            <div>
+                                <h4 class="font-semibold">绿色环保理念</h4>
+                                <p class="text-sm text-gray-600">全馆采用节能环保设计，获得绿色建筑认证</p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Exhibition Areas Detail -->
+    <section class="py-16 bg-white relative">
+        <div class="container mx-auto px-6">
+            <h2 class="text-3xl font-bold text-center text-gray-800 mb-12 animate-fadeInUp">
+                <i class="fas fa-th-large mr-2 text-blue-600"></i>
+                展品范围
+            </h2>
+            <div class="grid grid-cols-1 md:grid-cols-2 gap-8">
+                <!-- 整车展区 -->
+                <div class="exhibition-card bg-gradient-to-br from-blue-50 to-blue-100 rounded-xl p-6 animate-fadeInUp animation-delay-200">
+                    <div class="relative overflow-hidden rounded-xl mb-4 h-32 bg-gradient-to-r from-blue-400 to-blue-600">
+                        <img src="../../data/会展策划/image/3.小米汽车.jpg" alt="整车展示" class="w-full h-full object-cover opacity-60">
+                        <div class="absolute inset-0 flex items-center justify-center">
+                            <i class="fas fa-car-side text-5xl text-white"></i>
+                        </div>
+                    </div>
+                    <div class="flex items-center mb-4">
+                        <div class="w-12 h-12 bg-gradient-to-br from-blue-500 to-blue-600 text-white rounded-lg flex items-center justify-center mr-4 shadow-lg">
+                            <i class="fas fa-car text-xl"></i>
+                        </div>
+                        <h3 class="text-xl font-bold">整车展区</h3>
+                    </div>
+                    <ul class="space-y-2 text-gray-700">
+                        <li class="flex items-start">
+                            <span class="text-blue-600 mr-2">▸</span>
+                            <span>纯电动汽车：轿车、SUV、MPV、商用车</span>
+                        </li>
+                        <li class="flex items-start">
+                            <span class="text-blue-600 mr-2">▸</span>
+                            <span>插电式混合动力汽车：增程式、并联式、混联式</span>
+                        </li>
+                        <li class="flex items-start">
+                            <span class="text-blue-600 mr-2">▸</span>
+                            <span>氢燃料电池汽车：乘用车、商用车、专用车</span>
+                        </li>
+                        <li class="flex items-start">
+                            <span class="text-blue-600 mr-2">▸</span>
+                            <span>智能网联汽车：L2-L4级自动驾驶展示车</span>
+                        </li>
+                    </ul>
+                    <div class="mt-4 pt-4 border-t border-blue-200">
+                        <p class="text-sm text-gray-600">展览面积：20,000平方米 | 预计展商：120家</p>
+                    </div>
+                </div>
+
+                <!-- 核心零部件展区 -->
+                <div class="exhibition-card bg-gradient-to-br from-green-50 to-green-100 rounded-xl p-6 animate-fadeInUp animation-delay-400">
+                    <div class="relative overflow-hidden rounded-xl mb-4 h-32 bg-gradient-to-r from-green-400 to-green-600">
+                        <img src="../../data/会展策划/image/Whisk_8236005bb2.jpg" alt="核心零部件" class="w-full h-full object-cover opacity-60">
+                        <div class="absolute inset-0 flex items-center justify-center">
+                            <i class="fas fa-battery-full text-5xl text-white"></i>
+                        </div>
+                    </div>
+                    <div class="flex items-center mb-4">
+                        <div class="w-12 h-12 bg-gradient-to-br from-green-500 to-green-600 text-white rounded-lg flex items-center justify-center mr-4 shadow-lg">
+                            <i class="fas fa-bolt text-xl"></i>
+                        </div>
+                        <h3 class="text-xl font-bold">核心零部件展区</h3>
+                    </div>
+                    <ul class="space-y-2 text-gray-700">
+                        <li class="flex items-start">
+                            <span class="text-green-600 mr-2">▸</span>
+                            <span>动力电池：锂电池、固态电池、钠离子电池</span>
+                        </li>
+                        <li class="flex items-start">
+                            <span class="text-green-600 mr-2">▸</span>
+                            <span>驱动电机：永磁同步、交流异步、轮毂电机</span>
+                        </li>
+                        <li class="flex items-start">
+                            <span class="text-green-600 mr-2">▸</span>
+                            <span>电控系统：BMS、VCU、MCU、DC/DC转换器</span>
+                        </li>
+                        <li class="flex items-start">
+                            <span class="text-green-600 mr-2">▸</span>
+                            <span>智能驾驶：激光雷达、毫米波雷达、摄像头、芯片</span>
+                        </li>
+                    </ul>
+                    <div class="mt-4 pt-4 border-t border-green-200">
+                        <p class="text-sm text-gray-600">展览面积：15,000平方米 | 预计展商：150家</p>
+                    </div>
+                </div>
+
+                <!-- 智能交通展区 -->
+                <div class="exhibition-card bg-gradient-to-br from-purple-50 to-purple-100 rounded-xl p-6 animate-fadeInUp animation-delay-600">
+                    <div class="relative overflow-hidden rounded-xl mb-4 h-32 bg-gradient-to-r from-purple-400 to-purple-600">
+                        <img src="../../data/会展策划/image/Whisk_5c4b912ea7.jpg" alt="智能交通" class="w-full h-full object-cover opacity-60">
+                        <div class="absolute inset-0 flex items-center justify-center">
+                            <i class="fas fa-network-wired text-5xl text-white"></i>
+                        </div>
+                    </div>
+                    <div class="flex items-center mb-4">
+                        <div class="w-12 h-12 bg-gradient-to-br from-purple-500 to-purple-600 text-white rounded-lg flex items-center justify-center mr-4 shadow-lg">
+                            <i class="fas fa-microchip text-xl"></i>
+                        </div>
+                        <h3 class="text-xl font-bold">智能交通展区</h3>
+                    </div>
+                    <ul class="space-y-2 text-gray-700">
+                        <li class="flex items-start">
+                            <span class="text-purple-600 mr-2">▸</span>
+                            <span>智慧路网：智能交通信号、车路协同系统</span>
+                        </li>
+                        <li class="flex items-start">
+                            <span class="text-purple-600 mr-2">▸</span>
+                            <span>V2X通信：5G-V2X设备、路侧单元RSU</span>
+                        </li>
+                        <li class="flex items-start">
+                            <span class="text-purple-600 mr-2">▸</span>
+                            <span>智能停车：自动泊车系统、智慧停车场解决方案</span>
+                        </li>
+                        <li class="flex items-start">
+                            <span class="text-purple-600 mr-2">▸</span>
+                            <span>出行服务：MaaS平台、共享出行、智能调度</span>
+                        </li>
+                    </ul>
+                    <div class="mt-4 pt-4 border-t border-purple-200">
+                        <p class="text-sm text-gray-600">展览面积：10,000平方米 | 预计展商：60家</p>
+                    </div>
+                </div>
+
+                <!-- 配套服务展区 -->
+                <div class="exhibition-card bg-gradient-to-br from-orange-50 to-orange-100 rounded-xl p-6 animate-fadeInUp animation-delay-800">
+                    <div class="relative overflow-hidden rounded-xl mb-4 h-32 bg-gradient-to-r from-orange-400 to-orange-600">
+                        <img src="../../data/会展策划/image/Whisk_2a9b622636.jpg" alt="配套服务" class="w-full h-full object-cover opacity-60">
+                        <div class="absolute inset-0 flex items-center justify-center">
+                            <i class="fas fa-charging-station text-5xl text-white"></i>
+                        </div>
+                    </div>
+                    <div class="flex items-center mb-4">
+                        <div class="w-12 h-12 bg-gradient-to-br from-orange-500 to-orange-600 text-white rounded-lg flex items-center justify-center mr-4 shadow-lg">
+                            <i class="fas fa-tools text-xl"></i>
+                        </div>
+                        <h3 class="text-xl font-bold">配套服务展区</h3>
+                    </div>
+                    <ul class="space-y-2 text-gray-700">
+                        <li class="flex items-start">
+                            <span class="text-orange-600 mr-2">▸</span>
+                            <span>充电设施：充电桩、换电站、无线充电</span>
+                        </li>
+                        <li class="flex items-start">
+                            <span class="text-orange-600 mr-2">▸</span>
+                            <span>金融服务：汽车金融、保险、融资租赁</span>
+                        </li>
+                        <li class="flex items-start">
+                            <span class="text-orange-600 mr-2">▸</span>
+                            <span>检测认证：第三方检测、认证机构、标准制定</span>
+                        </li>
+                        <li class="flex items-start">
+                            <span class="text-orange-600 mr-2">▸</span>
+                            <span>后市场服务：维修保养、二手车、汽车改装</span>
+                        </li>
+                    </ul>
+                    <div class="mt-4 pt-4 border-t border-orange-200">
+                        <p class="text-sm text-gray-600">展览面积：5,000平方米 | 预计展商：20家</p>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Exhibition Schedule -->
+    <section class="py-16 bg-gray-50">
+        <div class="container mx-auto px-6">
+            <h2 class="text-3xl font-bold text-center text-gray-800 mb-12">展会日程</h2>
+            <div class="max-w-4xl mx-auto">
+                <div class="bg-white rounded-2xl shadow-lg overflow-hidden">
+                    <div class="bg-gradient-to-r from-purple-600 to-blue-600 text-white p-6">
+                        <h3 class="text-2xl font-bold">2024年9月12日 - 15日</h3>
+                        <p class="opacity-90">为期4天的行业盛会</p>
+                    </div>
+                    <div class="p-6">
+                        <!-- Day 1 -->
+                        <div class="mb-6 pb-6 border-b">
+                            <div class="flex items-center mb-3">
+                                <div class="w-24 text-sm font-bold text-purple-600">第一天</div>
+                                <div class="text-lg font-semibold">9月12日（周四）</div>
+                            </div>
+                            <div class="ml-24 space-y-2">
+                                <div class="flex items-center text-gray-700">
+                                    <span class="text-sm w-20">09:00</span>
+                                    <span>开幕典礼 & 领导致辞</span>
+                                </div>
+                                <div class="flex items-center text-gray-700">
+                                    <span class="text-sm w-20">10:00</span>
+                                    <span>主题论坛：新能源汽车产业发展高峰论坛</span>
+                                </div>
+                                <div class="flex items-center text-gray-700">
+                                    <span class="text-sm w-20">14:00</span>
+                                    <span>专业观众参观 & 商务洽谈</span>
+                                </div>
+                                <div class="flex items-center text-gray-700">
+                                    <span class="text-sm w-20">16:00</span>
+                                    <span>新产品发布会（特斯拉、蔚来等）</span>
+                                </div>
+                            </div>
+                        </div>
+
+                        <!-- Day 2 -->
+                        <div class="mb-6 pb-6 border-b">
+                            <div class="flex items-center mb-3">
+                                <div class="w-24 text-sm font-bold text-green-600">第二天</div>
+                                <div class="text-lg font-semibold">9月13日（周五）</div>
+                            </div>
+                            <div class="ml-24 space-y-2">
+                                <div class="flex items-center text-gray-700">
+                                    <span class="text-sm w-20">09:30</span>
+                                    <span>智能网联汽车技术创新峰会</span>
+                                </div>
+                                <div class="flex items-center text-gray-700">
+                                    <span class="text-sm w-20">10:30</span>
+                                    <span>自动驾驶体验区开放</span>
+                                </div>
+                                <div class="flex items-center text-gray-700">
+                                    <span class="text-sm w-20">14:00</span>
+                                    <span>充电基础设施建设研讨会</span>
+                                </div>
+                                <div class="flex items-center text-gray-700">
+                                    <span class="text-sm w-20">15:30</span>
+                                    <span>供需对接会 & 采购洽谈</span>
+                                </div>
+                            </div>
+                        </div>
+
+                        <!-- Day 3 -->
+                        <div class="mb-6 pb-6 border-b">
+                            <div class="flex items-center mb-3">
+                                <div class="w-24 text-sm font-bold text-blue-600">第三天</div>
+                                <div class="text-lg font-semibold">9月14日（周六）</div>
+                            </div>
+                            <div class="ml-24 space-y-2">
+                                <div class="flex items-center text-gray-700">
+                                    <span class="text-sm w-20">09:00</span>
+                                    <span>公众开放日 - 市民参观体验</span>
+                                </div>
+                                <div class="flex items-center text-gray-700">
+                                    <span class="text-sm w-20">10:00</span>
+                                    <span>新能源汽车试乘试驾活动</span>
+                                </div>
+                                <div class="flex items-center text-gray-700">
+                                    <span class="text-sm w-20">14:00</span>
+                                    <span>青少年科技创新大赛</span>
+                                </div>
+                                <div class="flex items-center text-gray-700">
+                                    <span class="text-sm w-20">16:00</span>
+                                    <span>绿色出行主题活动</span>
+                                </div>
+                            </div>
+                        </div>
+
+                        <!-- Day 4 -->
+                        <div class="mb-0">
+                            <div class="flex items-center mb-3">
+                                <div class="w-24 text-sm font-bold text-orange-600">第四天</div>
+                                <div class="text-lg font-semibold">9月15日（周日）</div>
+                            </div>
+                            <div class="ml-24 space-y-2">
+                                <div class="flex items-center text-gray-700">
+                                    <span class="text-sm w-20">09:00</span>
+                                    <span>产业投资论坛</span>
+                                </div>
+                                <div class="flex items-center text-gray-700">
+                                    <span class="text-sm w-20">11:00</span>
+                                    <span>项目签约仪式</span>
+                                </div>
+                                <div class="flex items-center text-gray-700">
+                                    <span class="text-sm w-20">14:00</span>
+                                    <span>行业白皮书发布</span>
+                                </div>
+                                <div class="flex items-center text-gray-700">
+                                    <span class="text-sm w-20">16:00</span>
+                                    <span>闭幕式 & 成果发布</span>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Target Participants -->
+    <section class="py-16 bg-white">
+        <div class="container mx-auto px-6">
+            <h2 class="text-3xl font-bold text-center text-gray-800 mb-12">目标参与者</h2>
+            <div class="grid grid-cols-1 lg:grid-cols-2 gap-12">
+                <!-- Target Exhibitors -->
+                <div>
+                    <h3 class="text-2xl font-bold mb-6 text-purple-600">目标参展商</h3>
+                    <div class="space-y-4">
+                        <div class="bg-gray-50 rounded-lg p-4">
+                            <h4 class="font-semibold mb-2">整车制造企业（30%）</h4>
+                            <p class="text-sm text-gray-600">特斯拉、比亚迪、上汽、蔚来、理想、小鹏、吉利、长城、广汽等</p>
+                        </div>
+                        <div class="bg-gray-50 rounded-lg p-4">
+                            <h4 class="font-semibold mb-2">核心零部件企业（35%）</h4>
+                            <p class="text-sm text-gray-600">宁德时代、比亚迪电池、华为智能汽车、百度Apollo、博世、大陆等</p>
+                        </div>
+                        <div class="bg-gray-50 rounded-lg p-4">
+                            <h4 class="font-semibold mb-2">科技企业（25%）</h4>
+                            <p class="text-sm text-gray-600">阿里巴巴、腾讯、美团、滴滴、科大讯飞、商汤科技等</p>
+                        </div>
+                        <div class="bg-gray-50 rounded-lg p-4">
+                            <h4 class="font-semibold mb-2">服务企业（10%）</h4>
+                            <p class="text-sm text-gray-600">国家电网、特来电、星星充电、平安保险、建设银行等</p>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Target Audience -->
+                <div>
+                    <h3 class="text-2xl font-bold mb-6 text-blue-600">目标观众</h3>
+                    <div class="bg-gradient-to-br from-blue-50 to-purple-50 rounded-2xl p-6">
+                        <div class="mb-6">
+                            <h4 class="font-semibold mb-3">专业观众（70%）</h4>
+                            <ul class="space-y-2 text-sm text-gray-700">
+                                <li class="flex items-start">
+                                    <span class="text-blue-600 mr-2">•</span>
+                                    汽车制造商采购及技术人员
+                                </li>
+                                <li class="flex items-start">
+                                    <span class="text-blue-600 mr-2">•</span>
+                                    经销商和4S店负责人
+                                </li>
+                                <li class="flex items-start">
+                                    <span class="text-blue-600 mr-2">•</span>
+                                    政府部门和行业组织代表
+                                </li>
+                                <li class="flex items-start">
+                                    <span class="text-blue-600 mr-2">•</span>
+                                    投资机构和行业分析师
+                                </li>
+                                <li class="flex items-start">
+                                    <span class="text-blue-600 mr-2">•</span>
+                                    科研院所和高校研究人员
+                                </li>
+                            </ul>
+                        </div>
+                        <div>
+                            <h4 class="font-semibold mb-3">普通观众（30%）</h4>
+                            <ul class="space-y-2 text-sm text-gray-700">
+                                <li class="flex items-start">
+                                    <span class="text-purple-600 mr-2">•</span>
+                                    新能源汽车潜在消费者
+                                </li>
+                                <li class="flex items-start">
+                                    <span class="text-purple-600 mr-2">•</span>
+                                    科技爱好者和车迷
+                                </li>
+                                <li class="flex items-start">
+                                    <span class="text-purple-600 mr-2">•</span>
+                                    大学生和青少年群体
+                                </li>
+                                <li class="flex items-start">
+                                    <span class="text-purple-600 mr-2">•</span>
+                                    媒体记者和自媒体博主
+                                </li>
+                            </ul>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Expected Results -->
+    <section class="py-16 bg-gray-50">
+        <div class="container mx-auto px-6">
+            <h2 class="text-3xl font-bold text-center text-gray-800 mb-12">预期效果</h2>
+            <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
+                <div class="bg-white rounded-xl shadow-lg p-6 text-center">
+                    <div class="w-16 h-16 bg-green-100 rounded-full flex items-center justify-center mx-auto mb-4">
+                        <svg class="w-8 h-8 text-green-600" fill="currentColor" viewBox="0 0 20 20">
+                            <path d="M8.433 7.418c.155-.103.346-.196.567-.267v1.698a2.305 2.305 0 01-.567-.267C8.07 8.34 8 8.114 8 8c0-.114.07-.34.433-.582zM11 12.849v-1.698c.22.071.412.164.567.267.364.243.433.468.433.582 0 .114-.07.34-.433.582a2.305 2.305 0 01-.567.267z"/>
+                            <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm1-13a1 1 0 10-2 0v.092a4.535 4.535 0 00-1.676.662C6.602 6.234 6 7.009 6 8c0 .99.602 1.765 1.324 2.246.48.32 1.054.545 1.676.662v1.941c-.391-.127-.68-.317-.843-.504a1 1 0 10-1.51 1.31c.562.649 1.413 1.076 2.353 1.253V15a1 1 0 102 0v-.092a4.535 4.535 0 001.676-.662C13.398 13.766 14 12.991 14 12c0-.99-.602-1.765-1.324-2.246A4.535 4.535 0 0011 9.092V7.151c.391.127.68.317.843.504a1 1 0 101.511-1.31c-.563-.649-1.413-1.076-2.354-1.253V5z" clip-rule="evenodd"/>
+                        </svg>
+                    </div>
+                    <h3 class="text-xl font-bold mb-3">经济效益</h3>
+                    <div class="space-y-2 text-gray-600">
+                        <p>现场成交额：<span class="font-bold text-green-600">10亿+</span></p>
+                        <p>意向订单：<span class="font-bold text-green-600">8亿+</span></p>
+                        <p>带动产业收入：<span class="font-bold text-green-600">30亿+</span></p>
+                    </div>
+                </div>
+
+                <div class="bg-white rounded-xl shadow-lg p-6 text-center">
+                    <div class="w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center mx-auto mb-4">
+                        <svg class="w-8 h-8 text-blue-600" fill="currentColor" viewBox="0 0 20 20">
+                            <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM4.332 8.027a6.012 6.012 0 011.912-2.706C6.512 5.73 6.974 6 7.5 6A1.5 1.5 0 019 7.5V8a2 2 0 004 0 2 2 0 011.523-1.943A5.977 5.977 0 0116 10c0 .34-.028.675-.083 1H15a2 2 0 00-2 2v2.197A5.973 5.973 0 0110 16v-2a2 2 0 00-2-2 2 2 0 01-2-2 2 2 0 00-1.668-1.973z" clip-rule="evenodd"/>
+                        </svg>
+                    </div>
+                    <h3 class="text-xl font-bold mb-3">社会效益</h3>
+                    <div class="space-y-2 text-gray-600">
+                        <p>媒体曝光：<span class="font-bold text-blue-600">1亿+次</span></p>
+                        <p>专业论坛：<span class="font-bold text-blue-600">20场</span></p>
+                        <p>发布白皮书：<span class="font-bold text-blue-600">2份</span></p>
+                    </div>
+                </div>
+
+                <div class="bg-white rounded-xl shadow-lg p-6 text-center">
+                    <div class="w-16 h-16 bg-purple-100 rounded-full flex items-center justify-center mx-auto mb-4">
+                        <svg class="w-8 h-8 text-purple-600" fill="currentColor" viewBox="0 0 20 20">
+                            <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"/>
+                        </svg>
+                    </div>
+                    <h3 class="text-xl font-bold mb-3">品牌效益</h3>
+                    <div class="space-y-2 text-gray-600">
+                        <p>参展商满意度：<span class="font-bold text-purple-600">90%+</span></p>
+                        <p>观众回访率：<span class="font-bold text-purple-600">85%+</span></p>
+                        <p>行业影响力：<span class="font-bold text-purple-600">TOP 3</span></p>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- CTA Section -->
+    <section class="py-16 bg-gradient-to-r from-blue-600 to-green-600 text-white">
+        <div class="container mx-auto px-6 text-center">
+            <h2 class="text-3xl font-bold mb-6">加入我们，共创绿色未来</h2>
+            <p class="text-xl mb-8 opacity-90">立即申请参展，抢占优质展位</p>
+            <div class="flex justify-center gap-4">
+                <a href="marketing.html" class="bg-white text-blue-600 px-8 py-3 rounded-lg font-semibold hover:bg-gray-100 transition">
+                    了解营销方案 →
+                </a>
+                <a href="operation.html" class="border-2 border-white text-white px-8 py-3 rounded-lg font-semibold hover:bg-white hover:text-blue-600 transition">
+                    查看现场运营 →
+                </a>
+            </div>
+        </div>
+    </section>
+
+    <!-- Footer -->
+    <footer class="bg-gray-900 text-white py-12">
+        <div class="container mx-auto px-6">
+            <div class="text-center text-sm text-gray-400">
+                <p>&copy; 2024 长三角国际新能源汽车与智能交通产业博览会. All rights reserved.</p>
+            </div>
+        </div>
+    </footer>
+
+    <!-- JavaScript -->
+    <script src="../js/main.js"></script>
+    <script>
+        // 页面加载动画
+        document.addEventListener('DOMContentLoaded', function() {
+            // 添加页面进入动画
+            document.body.classList.add('page-enter');
+            
+            // 图片懒加载
+            const images = document.querySelectorAll('img');
+            images.forEach(img => {
+                img.addEventListener('load', function() {
+                    this.classList.add('image-loaded');
+                });
+                img.addEventListener('error', function() {
+                    this.classList.add('image-error');
+                    this.src = '../data/会展策划/image/博览会.jpg'; // 备用图片
+                });
+            });
+            
+            // 滚动动画触发
+            const observerOptions = {
+                threshold: 0.1,
+                rootMargin: '0px 0px -100px 0px'
+            };
+            
+            const observer = new IntersectionObserver(function(entries) {
+                entries.forEach(entry => {
+                    if (entry.isIntersecting) {
+                        entry.target.style.opacity = '1';
+                        entry.target.style.transform = 'translateY(0)';
+                    }
+                });
+            }, observerOptions);
+            
+            // 观察所有带动画的元素
+            document.querySelectorAll('.animate-fadeInUp, .animate-fadeInLeft, .animate-fadeInRight').forEach(el => {
+                observer.observe(el);
+            });
+            
+            // 数字动画
+            function animateNumbers() {
+                const numbers = [
+                    { el: document.querySelector('.economic-number'), target: 10, suffix: '亿+' },
+                    { el: document.querySelector('.social-number'), target: 1, suffix: '亿+次' },
+                    { el: document.querySelector('.brand-number'), target: 90, suffix: '%+' }
+                ];
+                
+                numbers.forEach(item => {
+                    if (item.el) {
+                        let current = 0;
+                        const increment = item.target / 50;
+                        const timer = setInterval(() => {
+                            current += increment;
+                            if (current >= item.target) {
+                                current = item.target;
+                                clearInterval(timer);
+                            }
+                            item.el.textContent = Math.floor(current) + item.suffix;
+                        }, 30);
+                    }
+                });
+            }
+            
+            // 触发数字动画
+            const resultsSection = document.querySelector('#expected-results');
+            if (resultsSection) {
+                const resultsObserver = new IntersectionObserver(function(entries) {
+                    if (entries[0].isIntersecting) {
+                        animateNumbers();
+                        resultsObserver.disconnect();
+                    }
+                });
+                resultsObserver.observe(resultsSection);
+            }
+        });
+    </script>
+</body>
+</html>
\ No newline at end of file
diff --git a/web_frontend/exhibition-demo/public/web_result/pages/marketing.html b/web_frontend/exhibition-demo/public/web_result/pages/marketing.html
new file mode 100644
index 00000000..62b6dc65
--- /dev/null
+++ b/web_frontend/exhibition-demo/public/web_result/pages/marketing.html
@@ -0,0 +1,817 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>营销方案 - 2024长三角国际新能源汽车展</title>
+    
+    <!-- 样式表 -->
+    <link rel="stylesheet" href="../css/animations.css">
+    <link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
+    
+    <!-- 字体 -->
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Noto+Sans+SC:wght@300;400;500;700;900&display=swap" rel="stylesheet">
+    
+    <!-- Font Awesome 图标 -->
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
+    <style>
+        * {
+            font-family: 'Inter', 'Noto Sans SC', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+        }
+        
+        /* Glass morphism effect */
+        .glass-morphism {
+            background: rgba(255, 255, 255, 0.9);
+            backdrop-filter: blur(10px);
+            -webkit-backdrop-filter: blur(10px);
+        }
+        
+        /* 玻璃态效果 */
+        .glass-card {
+            background: rgba(255, 255, 255, 0.9);
+            backdrop-filter: blur(10px);
+            -webkit-backdrop-filter: blur(10px);
+            border: 1px solid rgba(255, 255, 255, 0.3);
+        }
+        
+        /* 3D翻转卡片 */
+        .flip-card {
+            perspective: 1000px;
+        }
+        
+        .flip-card-inner {
+            transition: transform 0.6s;
+            transform-style: preserve-3d;
+        }
+        
+        .flip-card:hover .flip-card-inner {
+            transform: rotateY(180deg);
+        }
+        
+        .flip-card-front, .flip-card-back {
+            position: absolute;
+            width: 100%;
+            height: 100%;
+            -webkit-backface-visibility: hidden;
+            backface-visibility: hidden;
+        }
+        
+        .flip-card-back {
+            transform: rotateY(180deg);
+        }
+        .nav-link {
+            position: relative;
+            transition: color 0.3s ease;
+        }
+        .nav-link::after {
+            content: '';
+            position: absolute;
+            bottom: -2px;
+            left: 0;
+            width: 0;
+            height: 2px;
+            background: #667eea;
+            transition: width 0.3s ease;
+        }
+        .nav-link:hover::after,
+        .nav-link.active::after {
+            width: 100%;
+        }
+        .strategy-card {
+            transition: all 0.3s ease;
+            position: relative;
+            overflow: hidden;
+        }
+        .strategy-card::before {
+            content: '';
+            position: absolute;
+            top: 0;
+            left: -100%;
+            width: 100%;
+            height: 100%;
+            background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
+            transition: left 0.6s ease;
+        }
+        .strategy-card:hover::before {
+            left: 100%;
+        }
+        .strategy-card:hover {
+            transform: translateY(-5px);
+            box-shadow: 0 20px 40px rgba(0,0,0,0.15);
+        }
+        .progress-bar {
+            animation: progressFill 2s ease-out forwards;
+        }
+        @keyframes progressFill {
+            from { width: 0%; }
+        }
+        .pulse-dot {
+            animation: pulse 2s infinite;
+        }
+        @keyframes pulse {
+            0%, 100% { transform: scale(1); opacity: 1; }
+            50% { transform: scale(1.2); opacity: 0.7; }
+        }
+    </style>
+</head>
+<body class="bg-gray-50">
+    <!-- Navigation -->
+    <nav class="fixed top-0 w-full glass-morphism shadow-md z-50 transition-all duration-300">
+        <div class="container mx-auto px-6 py-4">
+            <div class="flex items-center justify-between">
+                <div class="flex items-center">
+                    <div class="w-10 h-10 bg-gradient-to-br from-emerald-400 to-blue-500 rounded-lg flex items-center justify-center mr-3">
+                        <i class="fas fa-charging-station text-white"></i>
+                    </div>
+                    <div>
+                        <h1 class="text-lg font-bold">NEVIT 2024</h1>
+                        <p class="text-xs text-gray-500">新能源汽车产业博览会</p>
+                    </div>
+                </div>
+                <div class="hidden md:flex space-x-8">
+                    <a href="../index.html" class="text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-home mr-2"></i>首页
+                    </a>
+                    <a href="overview.html" class="text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-info-circle mr-2"></i>展会概览
+                    </a>
+                    <a href="exhibition.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-th-large mr-2"></i>展览内容
+                    </a>
+                    <a href="marketing.html" class="nav-link active text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-bullhorn mr-2"></i>营销推广
+                    </a>
+                    <a href="operation.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-cogs mr-2"></i>运营服务
+                    </a>
+                    <a href="budget.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-chart-pie mr-2"></i>预算分析
+                    </a>
+                    <a href="risk.html" class="text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-shield-alt mr-2"></i>风险评估
+                    </a>
+                </div>
+                <button class="md:hidden text-gray-700">
+                    <i class="fas fa-bars text-2xl"></i>
+                </button>
+            </div>
+        </div>
+    </nav>
+
+    <!-- Page Header -->
+    <section class="relative pt-24 pb-16 overflow-hidden" style="background: linear-gradient(135deg, #ec4899 0%, #8b5cf6 100%);">
+        <!-- 背景装饰 -->
+        <div class="absolute inset-0">
+            <div class="absolute top-0 left-0 w-96 h-96 bg-white/10 rounded-full filter blur-3xl animate-pulse"></div>
+            <div class="absolute bottom-0 right-0 w-96 h-96 bg-pink-300/20 rounded-full filter blur-3xl animate-pulse animation-delay-2000"></div>
+            <!-- 背景图片 -->
+            <div class="absolute inset-0 opacity-10" style="background-image: url('../../data/会展策划/image/Whisk_1c05424f7f.jpg'); background-size: cover; background-position: center;"></div>
+        </div>
+        
+        <div class="container mx-auto px-6 relative z-10">
+            <div class="flex items-center text-white/80 mb-4 animate-fadeInUp">
+                <a href="../index.html" class="hover:text-white transition">首页</a>
+                <i class="fas fa-chevron-right mx-2 text-xs"></i>
+                <span>营销方案</span>
+            </div>
+            <h1 class="text-4xl md:text-6xl font-bold text-white mb-4 animate-fadeInUp animation-delay-200">
+                <i class="fas fa-rocket mr-3"></i>
+                营销推广方案
+            </h1>
+            <p class="text-xl text-white/90 animate-fadeInUp animation-delay-400">
+                全方位、多渠道、精准化的营销策略
+            </p>
+            <div class="mt-8 flex flex-wrap gap-4 animate-fadeInUp animation-delay-600">
+                <div class="bg-white/20 backdrop-blur px-4 py-2 rounded-full text-sm">
+                    <i class="fas fa-users mr-2"></i>目标观众: 10万+
+                </div>
+                <div class="bg-white/20 backdrop-blur px-4 py-2 rounded-full text-sm">
+                    <i class="fas fa-chart-line mr-2"></i>预期转化: 30%
+                </div>
+                <div class="bg-white/20 backdrop-blur px-4 py-2 rounded-full text-sm">
+                    <i class="fas fa-globe mr-2"></i>覆盖范围: 全国
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Marketing Strategy Timeline -->
+    <section class="py-16 bg-white relative overflow-hidden">
+        <!-- 背景装饰 -->
+        <div class="absolute inset-0 opacity-5" style="background-image: url('../../data/会展策划/image/Whisk_4aabd94ef3.jpg'); background-size: cover; background-position: center;"></div>
+        
+        <div class="container mx-auto px-6 relative z-10">
+            <h2 class="text-3xl font-bold text-center text-gray-800 mb-12 animate-fadeInUp">
+                <i class="fas fa-calendar-alt mr-2 text-purple-600"></i>
+                整体推广策略
+            </h2>
+            <div class="max-w-5xl mx-auto">
+                <div class="relative">
+                    <!-- Timeline Line -->
+                    <div class="absolute left-1/2 transform -translate-x-1/2 h-full w-1 bg-gradient-to-b from-purple-600 to-pink-600"></div>
+                    
+                    <!-- Timeline Items -->
+                    <div class="space-y-12">
+                        <!-- Phase 1 -->
+                        <div class="flex items-center">
+                            <div class="w-1/2 pr-8 text-right animate-fadeInLeft">
+                                <h3 class="text-xl font-bold text-purple-600">
+                                    <i class="fas fa-fire mr-1"></i>预热期
+                                </h3>
+                                <p class="text-gray-600 mt-1">展前6个月</p>
+                                <div class="mt-3 bg-gradient-to-br from-purple-50 to-purple-100 rounded-lg p-4 text-left glass-card hover:scale-105 transition-transform">
+                                    <ul class="text-sm text-gray-700 space-y-1">
+                                        <li><i class="fas fa-check-circle text-purple-500 mr-1"></i> 品牌造势，建立认知</li>
+                                        <li><i class="fas fa-check-circle text-purple-500 mr-1"></i> 话题营销，引发关注</li>
+                                        <li><i class="fas fa-check-circle text-purple-500 mr-1"></i> KOL合作，扩大影响</li>
+                                    </ul>
+                                </div>
+                            </div>
+                            <div class="relative flex items-center justify-center">
+                                <div class="w-12 h-12 bg-gradient-to-br from-purple-500 to-purple-600 text-white rounded-full flex items-center justify-center z-10 shadow-lg pulse-dot">
+                                    <i class="fas fa-flag text-lg"></i>
+                                </div>
+                            </div>
+                            <div class="w-1/2 pl-8"></div>
+                        </div>
+
+                        <!-- Phase 2 -->
+                        <div class="flex items-center">
+                            <div class="w-1/2 pr-8"></div>
+                            <div class="relative flex items-center justify-center">
+                                <div class="w-12 h-12 bg-white border-4 border-pink-600 rounded-full flex items-center justify-center z-10">
+                                    <span class="text-pink-600 font-bold">2</span>
+                                </div>
+                            </div>
+                            <div class="w-1/2 pl-8">
+                                <h3 class="text-xl font-bold text-pink-600">推广期</h3>
+                                <p class="text-gray-600 mt-1">展前3个月</p>
+                                <div class="mt-3 bg-pink-50 rounded-lg p-4">
+                                    <ul class="text-sm text-gray-700 space-y-1">
+                                        <li>• 精准投放，定向推广</li>
+                                        <li>• 观众组织，团体邀请</li>
+                                        <li>• 媒体合作，深度报道</li>
+                                    </ul>
+                                </div>
+                            </div>
+                        </div>
+
+                        <!-- Phase 3 -->
+                        <div class="flex items-center">
+                            <div class="w-1/2 pr-8 text-right">
+                                <h3 class="text-xl font-bold text-blue-600">冲刺期</h3>
+                                <p class="text-gray-600 mt-1">展前1个月</p>
+                                <div class="mt-3 bg-blue-50 rounded-lg p-4 text-left">
+                                    <ul class="text-sm text-gray-700 space-y-1">
+                                        <li>• 密集宣传，全面覆盖</li>
+                                        <li>• 氛围营造，期待感拉满</li>
+                                        <li>• 最后召集，确保参与</li>
+                                    </ul>
+                                </div>
+                            </div>
+                            <div class="relative flex items-center justify-center">
+                                <div class="w-12 h-12 bg-white border-4 border-blue-600 rounded-full flex items-center justify-center z-10">
+                                    <span class="text-blue-600 font-bold">3</span>
+                                </div>
+                            </div>
+                            <div class="w-1/2 pl-8"></div>
+                        </div>
+
+                        <!-- Phase 4 -->
+                        <div class="flex items-center">
+                            <div class="w-1/2 pr-8"></div>
+                            <div class="relative flex items-center justify-center">
+                                <div class="w-12 h-12 bg-white border-4 border-green-600 rounded-full flex items-center justify-center z-10">
+                                    <span class="text-green-600 font-bold">4</span>
+                                </div>
+                            </div>
+                            <div class="w-1/2 pl-8">
+                                <h3 class="text-xl font-bold text-green-600">展期</h3>
+                                <p class="text-gray-600 mt-1">9月12-15日</p>
+                                <div class="mt-3 bg-green-50 rounded-lg p-4">
+                                    <ul class="text-sm text-gray-700 space-y-1">
+                                        <li>• 现场互动，实时传播</li>
+                                        <li>• 媒体报道，扩大影响</li>
+                                        <li>• 直播分享，线上参与</li>
+                                    </ul>
+                                </div>
+                            </div>
+                        </div>
+
+                        <!-- Phase 5 -->
+                        <div class="flex items-center">
+                            <div class="w-1/2 pr-8 text-right">
+                                <h3 class="text-xl font-bold text-orange-600">展后</h3>
+                                <p class="text-gray-600 mt-1">展后1个月</p>
+                                <div class="mt-3 bg-orange-50 rounded-lg p-4 text-left">
+                                    <ul class="text-sm text-gray-700 space-y-1">
+                                        <li>• 持续发酵，延长热度</li>
+                                        <li>• 成果展示，价值传递</li>
+                                        <li>• 下届预热，维系关系</li>
+                                    </ul>
+                                </div>
+                            </div>
+                            <div class="relative flex items-center justify-center">
+                                <div class="w-12 h-12 bg-white border-4 border-orange-600 rounded-full flex items-center justify-center z-10">
+                                    <span class="text-orange-600 font-bold">5</span>
+                                </div>
+                            </div>
+                            <div class="w-1/2 pl-8"></div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Online Marketing -->
+    <section class="py-16 bg-gray-50">
+        <div class="container mx-auto px-6">
+            <h2 class="text-3xl font-bold text-center text-gray-800 mb-12">线上推广方案</h2>
+            
+            <!-- Digital Channels Grid -->
+            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8 mb-12">
+                <!-- Official Website -->
+                <div class="strategy-card bg-white rounded-xl shadow-lg p-6">
+                    <div class="flex items-center mb-4">
+                        <div class="w-12 h-12 bg-blue-100 rounded-lg flex items-center justify-center mr-4">
+                            <svg class="w-6 h-6 text-blue-600" fill="currentColor" viewBox="0 0 20 20">
+                                <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM4.332 8.027a6.012 6.012 0 011.912-2.706C6.512 5.73 6.974 6 7.5 6A1.5 1.5 0 019 7.5V8a2 2 0 004 0 2 2 0 011.523-1.943A5.977 5.977 0 0116 10c0 .34-.028.675-.083 1H15a2 2 0 00-2 2v2.197A5.973 5.973 0 0110 16v-2a2 2 0 00-2-2 2 2 0 01-2-2 2 2 0 00-1.668-1.973z" clip-rule="evenodd"/>
+                            </svg>
+                        </div>
+                        <h3 class="text-xl font-bold">官方网站</h3>
+                    </div>
+                    <ul class="space-y-2 text-gray-600 text-sm">
+                        <li>✓ 在线注册系统</li>
+                        <li>✓ 3D展馆导航</li>
+                        <li>✓ VR预览体验</li>
+                        <li>✓ 展商数据库</li>
+                        <li>✓ 活动预约系统</li>
+                    </ul>
+                    <div class="mt-4 pt-4 border-t">
+                        <div class="flex justify-between text-sm">
+                            <span class="text-gray-500">预计访问量</span>
+                            <span class="font-bold text-blue-600">100万+</span>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Social Media -->
+                <div class="strategy-card bg-white rounded-xl shadow-lg p-6">
+                    <div class="flex items-center mb-4">
+                        <div class="w-12 h-12 bg-green-100 rounded-lg flex items-center justify-center mr-4">
+                            <svg class="w-6 h-6 text-green-600" fill="currentColor" viewBox="0 0 20 20">
+                                <path d="M2 5a2 2 0 012-2h7a2 2 0 012 2v4a2 2 0 01-2 2H9l-3 3v-3H4a2 2 0 01-2-2V5z"/>
+                                <path d="M15 7v2a4 4 0 01-4 4H9.828l-1.766 1.767c.28.149.599.233.938.233h2l3 3v-3h2a2 2 0 002-2V9a2 2 0 00-2-2h-1z"/>
+                            </svg>
+                        </div>
+                        <h3 class="text-xl font-bold">社交媒体</h3>
+                    </div>
+                    <div class="space-y-3">
+                        <div class="bg-gray-50 rounded-lg p-3">
+                            <div class="flex items-center justify-between mb-1">
+                                <span class="text-sm font-semibold">微信</span>
+                                <span class="text-xs text-gray-500">50万粉丝</span>
+                            </div>
+                            <div class="text-xs text-gray-600">公众号推送、朋友圈广告</div>
+                        </div>
+                        <div class="bg-gray-50 rounded-lg p-3">
+                            <div class="flex items-center justify-between mb-1">
+                                <span class="text-sm font-semibold">微博</span>
+                                <span class="text-xs text-gray-500">30万粉丝</span>
+                            </div>
+                            <div class="text-xs text-gray-600">#绿色出行看长三角#</div>
+                        </div>
+                        <div class="bg-gray-50 rounded-lg p-3">
+                            <div class="flex items-center justify-between mb-1">
+                                <span class="text-sm font-semibold">抖音/快手</span>
+                                <span class="text-xs text-gray-500">80万粉丝</span>
+                            </div>
+                            <div class="text-xs text-gray-600">短视频、直播互动</div>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Digital Advertising -->
+                <div class="strategy-card bg-white rounded-xl shadow-lg p-6">
+                    <div class="flex items-center mb-4">
+                        <div class="w-12 h-12 bg-purple-100 rounded-lg flex items-center justify-center mr-4">
+                            <svg class="w-6 h-6 text-purple-600" fill="currentColor" viewBox="0 0 20 20">
+                                <path fill-rule="evenodd" d="M3 3a1 1 0 000 2v8a2 2 0 002 2h2.586l-1.293 1.293a1 1 0 101.414 1.414L10 15.414l2.293 2.293a1 1 0 001.414-1.414L12.414 15H15a2 2 0 002-2V5a1 1 0 100-2H3zm11.707 4.293a1 1 0 00-1.414 1.414L14.586 10l-1.293 1.293a1 1 0 101.414 1.414L16 11.414l1.293 1.293a1 1 0 001.414-1.414L17.414 10l1.293-1.293a1 1 0 00-1.414-1.414L16 8.586l-1.293-1.293z" clip-rule="evenodd"/>
+                            </svg>
+                        </div>
+                        <h3 class="text-xl font-bold">数字广告</h3>
+                    </div>
+                    <div class="space-y-2 text-sm">
+                        <div class="flex items-center justify-between py-2 border-b">
+                            <span class="text-gray-600">搜索引擎SEM</span>
+                            <span class="font-semibold">200万预算</span>
+                        </div>
+                        <div class="flex items-center justify-between py-2 border-b">
+                            <span class="text-gray-600">信息流广告</span>
+                            <span class="font-semibold">150万预算</span>
+                        </div>
+                        <div class="flex items-center justify-between py-2">
+                            <span class="text-gray-600">垂直媒体</span>
+                            <span class="font-semibold">100万预算</span>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Email Marketing -->
+                <div class="strategy-card bg-white rounded-xl shadow-lg p-6">
+                    <div class="flex items-center mb-4">
+                        <div class="w-12 h-12 bg-orange-100 rounded-lg flex items-center justify-center mr-4">
+                            <svg class="w-6 h-6 text-orange-600" fill="currentColor" viewBox="0 0 20 20">
+                                <path d="M2.003 5.884L10 9.882l7.997-3.998A2 2 0 0016 4H4a2 2 0 00-1.997 1.884z"/>
+                                <path d="M18 8.118l-8 4-8-4V14a2 2 0 002 2h12a2 2 0 002-2V8.118z"/>
+                            </svg>
+                        </div>
+                        <h3 class="text-xl font-bold">邮件营销</h3>
+                    </div>
+                    <div class="bg-gradient-to-r from-orange-50 to-yellow-50 rounded-lg p-4">
+                        <div class="grid grid-cols-2 gap-4 text-center">
+                            <div>
+                                <div class="text-2xl font-bold text-orange-600">10万+</div>
+                                <div class="text-xs text-gray-600">数据库联系人</div>
+                            </div>
+                            <div>
+                                <div class="text-2xl font-bold text-orange-600">2期/月</div>
+                                <div class="text-xs text-gray-600">发送频次</div>
+                            </div>
+                        </div>
+                    </div>
+                    <ul class="mt-4 space-y-1 text-xs text-gray-600">
+                        <li>• 展商推介</li>
+                        <li>• 活动预告</li>
+                        <li>• 行业资讯</li>
+                    </ul>
+                </div>
+
+                <!-- Live Streaming -->
+                <div class="strategy-card bg-white rounded-xl shadow-lg p-6">
+                    <div class="flex items-center mb-4">
+                        <div class="w-12 h-12 bg-red-100 rounded-lg flex items-center justify-center mr-4">
+                            <svg class="w-6 h-6 text-red-600" fill="currentColor" viewBox="0 0 20 20">
+                                <path d="M2 6a2 2 0 012-2h6a2 2 0 012 2v8a2 2 0 01-2 2H4a2 2 0 01-2-2V6zM14.553 7.106A1 1 0 0014 8v4a1 1 0 00.553.894l2 1A1 1 0 0018 13V7a1 1 0 00-1.447-.894l-2 1z"/>
+                            </svg>
+                        </div>
+                        <h3 class="text-xl font-bold">直播营销</h3>
+                    </div>
+                    <div class="space-y-3">
+                        <div class="flex items-center">
+                            <div class="w-2 h-2 bg-red-600 rounded-full pulse-dot mr-2"></div>
+                            <span class="text-sm">展前预热直播：5场</span>
+                        </div>
+                        <div class="flex items-center">
+                            <div class="w-2 h-2 bg-red-600 rounded-full pulse-dot mr-2"></div>
+                            <span class="text-sm">展期现场直播：全程</span>
+                        </div>
+                        <div class="flex items-center">
+                            <div class="w-2 h-2 bg-red-600 rounded-full pulse-dot mr-2"></div>
+                            <span class="text-sm">专家访谈：20场</span>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- KOL Cooperation -->
+                <div class="strategy-card bg-white rounded-xl shadow-lg p-6">
+                    <div class="flex items-center mb-4">
+                        <div class="w-12 h-12 bg-pink-100 rounded-lg flex items-center justify-center mr-4">
+                            <svg class="w-6 h-6 text-pink-600" fill="currentColor" viewBox="0 0 20 20">
+                                <path fill-rule="evenodd" d="M10 9a3 3 0 100-6 3 3 0 000 6zm-7 9a7 7 0 1114 0H3z" clip-rule="evenodd"/>
+                            </svg>
+                        </div>
+                        <h3 class="text-xl font-bold">KOL合作</h3>
+                    </div>
+                    <div class="space-y-2">
+                        <div class="bg-pink-50 rounded-lg p-2 text-center">
+                            <div class="text-lg font-bold text-pink-600">50+</div>
+                            <div class="text-xs text-gray-600">汽车领域KOL</div>
+                        </div>
+                        <div class="grid grid-cols-2 gap-2 text-xs">
+                            <div class="bg-gray-50 rounded p-2 text-center">
+                                <div class="font-semibold">探店视频</div>
+                                <div class="text-gray-500">30个</div>
+                            </div>
+                            <div class="bg-gray-50 rounded p-2 text-center">
+                                <div class="font-semibold">测评内容</div>
+                                <div class="text-gray-500">50篇</div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <!-- Online Campaign Performance -->
+            <div class="bg-gradient-to-r from-blue-600 to-purple-600 rounded-2xl p-8 text-white">
+                <h3 class="text-2xl font-bold mb-6">线上推广预期效果</h3>
+                <div class="grid grid-cols-1 md:grid-cols-4 gap-6">
+                    <div class="text-center">
+                        <div class="text-3xl font-bold mb-2">1亿+</div>
+                        <div class="text-blue-100">总曝光量</div>
+                    </div>
+                    <div class="text-center">
+                        <div class="text-3xl font-bold mb-2">500万+</div>
+                        <div class="text-blue-100">互动量</div>
+                    </div>
+                    <div class="text-center">
+                        <div class="text-3xl font-bold mb-2">10万+</div>
+                        <div class="text-blue-100">注册用户</div>
+                    </div>
+                    <div class="text-center">
+                        <div class="text-3xl font-bold mb-2">85%</div>
+                        <div class="text-blue-100">转化率</div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Offline Marketing -->
+    <section class="py-16 bg-white">
+        <div class="container mx-auto px-6">
+            <h2 class="text-3xl font-bold text-center text-gray-800 mb-12">线下推广方案</h2>
+            
+            <div class="grid grid-cols-1 lg:grid-cols-2 gap-12">
+                <!-- Traditional Media -->
+                <div>
+                    <h3 class="text-2xl font-bold mb-6 text-purple-600">传统媒体投放</h3>
+                    <div class="space-y-4">
+                        <div class="bg-gray-50 rounded-lg p-5">
+                            <div class="flex items-center mb-3">
+                                <div class="w-10 h-10 bg-blue-600 text-white rounded-lg flex items-center justify-center mr-3">
+                                    <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
+                                        <path fill-rule="evenodd" d="M4 3a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V5a2 2 0 00-2-2H4zm12 12H4l4-8 3 6 2-4 3 6z" clip-rule="evenodd"/>
+                                    </svg>
+                                </div>
+                                <div>
+                                    <h4 class="font-semibold">平面媒体</h4>
+                                    <p class="text-sm text-gray-600">行业杂志、报纸广告</p>
+                                </div>
+                            </div>
+                            <ul class="text-sm text-gray-700 space-y-1 ml-13">
+                                <li>• 《中国汽车报》整版广告 x 3期</li>
+                                <li>• 《汽车之家》杂志封面广告</li>
+                                <li>• 《新能源汽车》专题报道</li>
+                            </ul>
+                        </div>
+
+                        <div class="bg-gray-50 rounded-lg p-5">
+                            <div class="flex items-center mb-3">
+                                <div class="w-10 h-10 bg-green-600 text-white rounded-lg flex items-center justify-center mr-3">
+                                    <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
+                                        <path fill-rule="evenodd" d="M9.383 3.076A1 1 0 0110 4v12a1 1 0 01-1.707.707L4.586 13H2a1 1 0 01-1-1V8a1 1 0 011-1h2.586l3.707-3.707a1 1 0 011.09-.217zM14.657 2.929a1 1 0 011.414 0A9.972 9.972 0 0119 10a9.972 9.972 0 01-2.929 7.071 1 1 0 01-1.414-1.414A7.971 7.971 0 0017 10c0-2.21-.894-4.208-2.343-5.657a1 1 0 010-1.414zm-2.829 2.828a1 1 0 011.415 0A5.983 5.983 0 0115 10a5.984 5.984 0 01-1.757 4.243 1 1 0 01-1.415-1.415A3.984 3.984 0 0013 10a3.983 3.983 0 00-1.172-2.828 1 1 0 010-1.415z" clip-rule="evenodd"/>
+                                    </svg>
+                                </div>
+                                <div>
+                                    <h4 class="font-semibold">广播电台</h4>
+                                    <p class="text-sm text-gray-600">交通广播黄金时段</p>
+                                </div>
+                            </div>
+                            <ul class="text-sm text-gray-700 space-y-1 ml-13">
+                                <li>• 上海交通广播早晚高峰广告</li>
+                                <li>• 专题访谈节目3期</li>
+                                <li>• 路况播报植入</li>
+                            </ul>
+                        </div>
+
+                        <div class="bg-gray-50 rounded-lg p-5">
+                            <div class="flex items-center mb-3">
+                                <div class="w-10 h-10 bg-purple-600 text-white rounded-lg flex items-center justify-center mr-3">
+                                    <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
+                                        <path d="M2 6a2 2 0 012-2h12a2 2 0 012 2v2a2 2 0 100 4v2a2 2 0 01-2 2H4a2 2 0 01-2-2v-2a2 2 0 100-4V6z"/>
+                                    </svg>
+                                </div>
+                                <div>
+                                    <h4 class="font-semibold">行业活动</h4>
+                                    <p class="text-sm text-gray-600">参展推广、论坛宣传</p>
+                                </div>
+                            </div>
+                            <ul class="text-sm text-gray-700 space-y-1 ml-13">
+                                <li>• 北京车展展位推广</li>
+                                <li>• 广州车展路演活动</li>
+                                <li>• 行业峰会主题演讲</li>
+                            </ul>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Outdoor Advertising -->
+                <div>
+                    <h3 class="text-2xl font-bold mb-6 text-blue-600">户外广告投放</h3>
+                    <div class="bg-gradient-to-br from-blue-50 to-purple-50 rounded-2xl p-6">
+                        <div class="grid grid-cols-2 gap-4 mb-6">
+                            <div class="bg-white rounded-lg p-4 text-center">
+                                <div class="text-2xl font-bold text-blue-600 mb-1">50块</div>
+                                <div class="text-sm text-gray-600">LED大屏广告</div>
+                                <div class="text-xs text-gray-500 mt-1">核心商圈覆盖</div>
+                            </div>
+                            <div class="bg-white rounded-lg p-4 text-center">
+                                <div class="text-2xl font-bold text-purple-600 mb-1">200个</div>
+                                <div class="text-sm text-gray-600">地铁灯箱</div>
+                                <div class="text-xs text-gray-500 mt-1">2/10/17号线</div>
+                            </div>
+                            <div class="bg-white rounded-lg p-4 text-center">
+                                <div class="text-2xl font-bold text-green-600 mb-1">30块</div>
+                                <div class="text-sm text-gray-600">高速广告牌</div>
+                                <div class="text-xs text-gray-500 mt-1">沪宁、沪杭高速</div>
+                            </div>
+                            <div class="bg-white rounded-lg p-4 text-center">
+                                <div class="text-2xl font-bold text-orange-600 mb-1">100辆</div>
+                                <div class="text-sm text-gray-600">公交车身</div>
+                                <div class="text-xs text-gray-500 mt-1">主要线路</div>
+                            </div>
+                        </div>
+                        
+                        <div class="bg-white rounded-lg p-4">
+                            <h4 class="font-semibold mb-3">投放策略</h4>
+                            <div class="space-y-2 text-sm">
+                                <div class="flex items-center">
+                                    <div class="w-4 h-4 bg-blue-600 rounded-full mr-2"></div>
+                                    <span>展前3个月开始投放</span>
+                                </div>
+                                <div class="flex items-center">
+                                    <div class="w-4 h-4 bg-purple-600 rounded-full mr-2"></div>
+                                    <span>重点覆盖长三角核心城市</span>
+                                </div>
+                                <div class="flex items-center">
+                                    <div class="w-4 h-4 bg-green-600 rounded-full mr-2"></div>
+                                    <span>高频次、多触点接触</span>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Precision Invitation -->
+    <section class="py-16 bg-gray-50">
+        <div class="container mx-auto px-6">
+            <h2 class="text-3xl font-bold text-center text-gray-800 mb-12">精准邀请方案</h2>
+            
+            <div class="max-w-4xl mx-auto">
+                <!-- Invitation Process -->
+                <div class="bg-white rounded-2xl shadow-lg overflow-hidden mb-8">
+                    <div class="bg-gradient-to-r from-green-600 to-teal-600 text-white p-6">
+                        <h3 class="text-2xl font-bold">专业观众邀请体系</h3>
+                    </div>
+                    <div class="p-6">
+                        <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
+                            <div class="text-center">
+                                <div class="w-20 h-20 bg-green-100 rounded-full flex items-center justify-center mx-auto mb-4">
+                                    <svg class="w-10 h-10 text-green-600" fill="currentColor" viewBox="0 0 20 20">
+                                        <path d="M2 3a1 1 0 011-1h2.153a1 1 0 01.986.836l.74 4.435a1 1 0 01-.54 1.06l-1.548.773a11.037 11.037 0 006.105 6.105l.774-1.548a1 1 0 011.059-.54l4.435.74a1 1 0 01.836.986V17a1 1 0 01-1 1h-2C7.82 18 2 12.18 2 5V3z"/>
+                                    </svg>
+                                </div>
+                                <h4 class="font-semibold mb-2">呼叫中心</h4>
+                                <p class="text-sm text-gray-600">20人专业团队</p>
+                                <p class="text-xs text-gray-500 mt-1">日均呼叫1000+</p>
+                            </div>
+                            <div class="text-center">
+                                <div class="w-20 h-20 bg-blue-100 rounded-full flex items-center justify-center mx-auto mb-4">
+                                    <svg class="w-10 h-10 text-blue-600" fill="currentColor" viewBox="0 0 20 20">
+                                        <path fill-rule="evenodd" d="M10 9a3 3 0 100-6 3 3 0 000 6zm-7 9a7 7 0 1114 0H3z" clip-rule="evenodd"/>
+                                    </svg>
+                                </div>
+                                <h4 class="font-semibold mb-2">一对一邀请</h4>
+                                <p class="text-sm text-gray-600">VIP客户定制</p>
+                                <p class="text-xs text-gray-500 mt-1">500+重点客户</p>
+                            </div>
+                            <div class="text-center">
+                                <div class="w-20 h-20 bg-purple-100 rounded-full flex items-center justify-center mx-auto mb-4">
+                                    <svg class="w-10 h-10 text-purple-600" fill="currentColor" viewBox="0 0 20 20">
+                                        <path d="M13 6a3 3 0 11-6 0 3 3 0 016 0zM18 8a2 2 0 11-4 0 2 2 0 014 0zM14 15a4 4 0 00-8 0v3h8v-3zM6 8a2 2 0 11-4 0 2 2 0 014 0zM16 18v-3a5.972 5.972 0 00-.75-2.906A3.005 3.005 0 0119 15v3h-3zM4.75 12.094A5.973 5.973 0 004 15v3H1v-3a3 3 0 013.75-2.906z"/>
+                                    </svg>
+                                </div>
+                                <h4 class="font-semibold mb-2">团体邀请</h4>
+                                <p class="text-sm text-gray-600">协会组织参观</p>
+                                <p class="text-xs text-gray-500 mt-1">50+团体</p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Buyer Matching Service -->
+                <div class="bg-gradient-to-r from-purple-600 to-pink-600 rounded-2xl p-8 text-white">
+                    <h3 class="text-2xl font-bold mb-6">买家匹配服务</h3>
+                    <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
+                        <div class="bg-white/10 backdrop-blur rounded-lg p-4">
+                            <h4 class="font-semibold mb-2">会前</h4>
+                            <ul class="text-sm space-y-1 opacity-90">
+                                <li>• 在线预约系统</li>
+                                <li>• AI智能匹配</li>
+                                <li>• 需求精准对接</li>
+                            </ul>
+                        </div>
+                        <div class="bg-white/10 backdrop-blur rounded-lg p-4">
+                            <h4 class="font-semibold mb-2">展中</h4>
+                            <ul class="text-sm space-y-1 opacity-90">
+                                <li>• 商务洽谈区</li>
+                                <li>• 专场对接会</li>
+                                <li>• 现场撮合服务</li>
+                            </ul>
+                        </div>
+                        <div class="bg-white/10 backdrop-blur rounded-lg p-4">
+                            <h4 class="font-semibold mb-2">展后</h4>
+                            <ul class="text-sm space-y-1 opacity-90">
+                                <li>• 持续跟进</li>
+                                <li>• 促成交易</li>
+                                <li>• 效果评估</li>
+                            </ul>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Marketing Budget -->
+    <section class="py-16 bg-white">
+        <div class="container mx-auto px-6">
+            <h2 class="text-3xl font-bold text-center text-gray-800 mb-12">营销预算分配</h2>
+            
+            <div class="max-w-3xl mx-auto">
+                <div class="bg-gray-50 rounded-2xl p-8">
+                    <div class="space-y-4">
+                        <div class="flex items-center">
+                            <div class="flex-1">
+                                <div class="flex justify-between mb-2">
+                                    <span class="font-semibold">线上推广</span>
+                                    <span class="text-purple-600 font-bold">80万</span>
+                                </div>
+                                <div class="bg-gray-200 rounded-full h-4">
+                                    <div class="bg-purple-600 h-4 rounded-full progress-bar" style="width: 40%"></div>
+                                </div>
+                            </div>
+                        </div>
+                        
+                        <div class="flex items-center">
+                            <div class="flex-1">
+                                <div class="flex justify-between mb-2">
+                                    <span class="font-semibold">线下推广</span>
+                                    <span class="text-blue-600 font-bold">60万</span>
+                                </div>
+                                <div class="bg-gray-200 rounded-full h-4">
+                                    <div class="bg-blue-600 h-4 rounded-full progress-bar" style="width: 30%; animation-delay: 0.2s"></div>
+                                </div>
+                            </div>
+                        </div>
+                        
+                        <div class="flex items-center">
+                            <div class="flex-1">
+                                <div class="flex justify-between mb-2">
+                                    <span class="font-semibold">媒体合作</span>
+                                    <span class="text-green-600 font-bold">40万</span>
+                                </div>
+                                <div class="bg-gray-200 rounded-full h-4">
+                                    <div class="bg-green-600 h-4 rounded-full progress-bar" style="width: 20%; animation-delay: 0.4s"></div>
+                                </div>
+                            </div>
+                        </div>
+                        
+                        <div class="flex items-center">
+                            <div class="flex-1">
+                                <div class="flex justify-between mb-2">
+                                    <span class="font-semibold">精准邀请</span>
+                                    <span class="text-orange-600 font-bold">20万</span>
+                                </div>
+                                <div class="bg-gray-200 rounded-full h-4">
+                                    <div class="bg-orange-600 h-4 rounded-full progress-bar" style="width: 10%; animation-delay: 0.6s"></div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    
+                    <div class="mt-6 pt-6 border-t text-center">
+                        <div class="text-3xl font-bold text-gray-800">总预算：200万元</div>
+                        <div class="text-gray-600 mt-2">预期ROI：500%</div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- CTA Section -->
+    <section class="py-16 bg-gradient-to-r from-pink-600 to-purple-600 text-white">
+        <div class="container mx-auto px-6 text-center">
+            <h2 class="text-3xl font-bold mb-6">全方位营销，确保展会成功</h2>
+            <p class="text-xl mb-8 opacity-90">了解现场运营方案，体验展会精彩</p>
+            <a href="operation.html" class="inline-block bg-white text-purple-600 px-8 py-3 rounded-lg font-semibold hover:bg-gray-100 transition">
+                查看现场运营 →
+            </a>
+        </div>
+    </section>
+
+    <!-- Footer -->
+    <footer class="bg-gray-900 text-white py-12">
+        <div class="container mx-auto px-6">
+            <div class="text-center text-sm text-gray-400">
+                <p>&copy; 2024 长三角国际新能源汽车与智能交通产业博览会. All rights reserved.</p>
+            </div>
+        </div>
+    </footer>
+</body>
+</html>
\ No newline at end of file
diff --git a/web_frontend/exhibition-demo/public/web_result/pages/operation.html b/web_frontend/exhibition-demo/public/web_result/pages/operation.html
new file mode 100644
index 00000000..20725b9a
--- /dev/null
+++ b/web_frontend/exhibition-demo/public/web_result/pages/operation.html
@@ -0,0 +1,1417 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>现场运营 - 2024长三角国际新能源汽车展</title>
+    <link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
+    <link rel="stylesheet" href="../css/animations.css">
+    <style>
+        * {
+            font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+        }
+        
+        /* 3D展馆效果 */
+        .hall-3d {
+            perspective: 1000px;
+            transform-style: preserve-3d;
+        }
+        
+        .hall-card {
+            transition: all 0.5s ease;
+            transform-style: preserve-3d;
+        }
+        
+        .hall-card:hover {
+            transform: translateZ(20px) rotateY(5deg);
+            box-shadow: 0 25px 50px rgba(0,0,0,0.2);
+        }
+        
+        /* 流动光效 */
+        .flow-light {
+            position: relative;
+            overflow: hidden;
+        }
+        
+        .flow-light::before {
+            content: '';
+            position: absolute;
+            top: -50%;
+            left: -50%;
+            width: 200%;
+            height: 200%;
+            background: linear-gradient(45deg, transparent, rgba(255,255,255,0.3), transparent);
+            transform: rotate(45deg);
+            animation: flowLight 3s linear infinite;
+        }
+        
+        @keyframes flowLight {
+            0% { transform: translateX(-100%) translateY(-100%) rotate(45deg); }
+            100% { transform: translateX(100%) translateY(100%) rotate(45deg); }
+        }
+        
+        /* 数字滚动效果 */
+        .counter {
+            animation: countUp 2s ease-out forwards;
+        }
+        
+        @keyframes countUp {
+            from { opacity: 0; transform: translateY(20px); }
+            to { opacity: 1; transform: translateY(0); }
+        }
+        
+        /* 时间轴动画 */
+        .timeline-item {
+            opacity: 0;
+            animation: slideInLeft 0.6s ease-out forwards;
+        }
+        
+        .timeline-item:nth-child(1) { animation-delay: 0.1s; }
+        .timeline-item:nth-child(2) { animation-delay: 0.2s; }
+        .timeline-item:nth-child(3) { animation-delay: 0.3s; }
+        .timeline-item:nth-child(4) { animation-delay: 0.4s; }
+        
+        @keyframes slideInLeft {
+            from { 
+                opacity: 0;
+                transform: translateX(-50px);
+            }
+            to { 
+                opacity: 1;
+                transform: translateX(0);
+            }
+        }
+        
+        /* 悬浮图标动画 */
+        .float-icon {
+            animation: float 3s ease-in-out infinite;
+        }
+        
+        .float-icon:nth-child(odd) {
+            animation-delay: 0.5s;
+        }
+        
+        @keyframes float {
+            0%, 100% { transform: translateY(0px); }
+            50% { transform: translateY(-20px); }
+        }
+        
+        /* 脉冲动画 */
+        .pulse-dot {
+            animation: pulse 2s infinite;
+        }
+        
+        @keyframes pulse {
+            0%, 100% { 
+                transform: scale(1);
+                opacity: 1;
+            }
+            50% { 
+                transform: scale(1.2);
+                opacity: 0.7;
+            }
+        }
+        
+        /* 渐变动画背景 */
+        .gradient-animated {
+            background: linear-gradient(270deg, #667eea, #764ba2, #f093fb, #667eea);
+            background-size: 400% 400%;
+            animation: gradientShift 15s ease infinite;
+        }
+        
+        @keyframes gradientShift {
+            0% { background-position: 0% 50%; }
+            50% { background-position: 100% 50%; }
+            100% { background-position: 0% 50%; }
+        }
+        
+        /* 霓虹灯效果 */
+        .neon-glow {
+            text-shadow: 
+                0 0 10px rgba(102, 126, 234, 0.8),
+                0 0 20px rgba(102, 126, 234, 0.6),
+                0 0 30px rgba(102, 126, 234, 0.4);
+        }
+        
+        /* Glass morphism effect */
+        .glass-morphism {
+            background: rgba(255, 255, 255, 0.9);
+            backdrop-filter: blur(10px);
+            -webkit-backdrop-filter: blur(10px);
+        }
+    </style>
+</head>
+<body class="bg-gray-50">
+    <!-- Navigation -->
+    <nav class="fixed top-0 w-full glass-morphism shadow-md z-50 transition-all duration-300">
+        <div class="container mx-auto px-6 py-4">
+            <div class="flex items-center justify-between">
+                <div class="flex items-center">
+                    <div class="w-10 h-10 bg-gradient-to-br from-emerald-400 to-blue-500 rounded-lg flex items-center justify-center mr-3">
+                        <i class="fas fa-charging-station text-white"></i>
+                    </div>
+                    <div>
+                        <h1 class="text-lg font-bold">NEVIT 2024</h1>
+                        <p class="text-xs text-gray-600 font-medium">新能源汽车产业博览会</p>
+                    </div>
+                </div>
+                <div class="hidden md:flex space-x-8">
+                    <a href="../index.html" class="text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-home mr-2"></i>首页
+                    </a>
+                    <a href="overview.html" class="text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-info-circle mr-2"></i>展会概览
+                    </a>
+                    <a href="exhibition.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-th-large mr-2"></i>展览内容
+                    </a>
+                    <a href="marketing.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-bullhorn mr-2"></i>营销推广
+                    </a>
+                    <a href="operation.html" class="nav-link active text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-cogs mr-2"></i>运营服务
+                    </a>
+                    <a href="budget.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-chart-pie mr-2"></i>预算分析
+                    </a>
+                    <a href="risk.html" class="text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-shield-alt mr-2"></i>风险评估
+                    </a>
+                </div>
+                <button class="md:hidden text-gray-700">
+                    <i class="fas fa-bars text-2xl"></i>
+                </button>
+            </div>
+        </div>
+    </nav>
+
+    <!-- Page Header with Background Image -->
+    <section class="relative pt-24 pb-16 overflow-hidden">
+        <!-- 背景图片 -->
+        <div class="absolute inset-0" style="background-image: url('../../data/会展策划/image/博览会.jpg'); background-size: cover; background-position: center;">
+            <div class="absolute inset-0 bg-gradient-to-b from-teal-900/90 via-blue-900/80 to-indigo-900/90"></div>
+        </div>
+        
+        <!-- 动态粒子背景 -->
+        <div class="absolute inset-0">
+            <div class="absolute top-10 left-10 w-32 h-32 bg-white/10 rounded-full filter blur-3xl animate-pulse"></div>
+            <div class="absolute bottom-10 right-10 w-40 h-40 bg-blue-300/20 rounded-full filter blur-3xl animate-pulse animation-delay-2000"></div>
+            <div class="absolute top-1/2 left-1/3 w-24 h-24 bg-emerald-300/10 rounded-full filter blur-2xl animate-pulse animation-delay-4000"></div>
+        </div>
+        
+        <div class="container mx-auto px-6 relative z-10">
+            <div class="text-center text-white animate-fadeInUp">
+                <h1 class="text-5xl md:text-6xl font-bold mb-6 neon-glow">
+                    <i class="fas fa-warehouse mr-4"></i>
+                    现场运营方案
+                </h1>
+                <p class="text-xl md:text-2xl opacity-90 mb-8">
+                    智能化管理 · 专业化服务 · 数字化体验
+                </p>
+                <div class="flex flex-wrap justify-center gap-4">
+                    <div class="glass-morphism px-6 py-3 rounded-full">
+                        <i class="fas fa-users mr-2"></i>
+                        预计接待: <span class="font-bold">10万+</span> 专业观众
+                    </div>
+                    <div class="glass-morphism px-6 py-3 rounded-full">
+                        <i class="fas fa-building mr-2"></i>
+                        展馆面积: <span class="font-bold">50,000㎡</span>
+                    </div>
+                    <div class="glass-morphism px-6 py-3 rounded-full">
+                        <i class="fas fa-user-tie mr-2"></i>
+                        服务团队: <span class="font-bold">500+</span> 专业人员
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- 3D Exhibition Hall Layout -->
+    <section class="py-20 bg-white relative overflow-hidden">
+        <!-- 背景装饰 -->
+        <div class="absolute inset-0 opacity-5" style="background-image: url('../../data/会展策划/image/新能源车.jpg'); background-size: cover;"></div>
+        
+        <div class="container mx-auto px-6 relative z-10">
+            <div class="text-center mb-12 animate-fadeInUp">
+                <h2 class="text-4xl font-bold text-gray-800 mb-4">
+                    <i class="fas fa-map-marked-alt text-teal-600 mr-3"></i>
+                    智能展馆布局规划
+                </h2>
+                <p class="text-xl text-gray-700 font-medium">基于人流动线设计的科学布局</p>
+            </div>
+            
+            <!-- 3D展馆可视化 -->
+            <div class="hall-3d max-w-7xl mx-auto mb-16">
+                <div class="grid grid-cols-1 lg:grid-cols-4 gap-6">
+                    <!-- A馆 - 整车展示 -->
+                    <div class="lg:col-span-2 hall-card">
+                        <div class="bg-gradient-to-br from-blue-600 to-blue-800 rounded-2xl p-8 text-white shadow-2xl flow-light">
+                            <div class="flex items-center justify-between mb-6">
+                                <h3 class="text-2xl font-bold flex items-center">
+                                    <i class="fas fa-car-side mr-3"></i>
+                                    A馆 - 旗舰整车展示区
+                                </h3>
+                                <span class="bg-white/20 backdrop-blur px-4 py-2 rounded-full text-lg font-semibold">
+                                    20,000㎡
+                                </span>
+                            </div>
+                            
+                            <div class="grid grid-cols-2 gap-4 mb-6">
+                                <div class="bg-white/10 backdrop-blur rounded-xl p-4 hover:bg-white/20 transition">
+                                    <h4 class="font-bold mb-2">特斯拉专区</h4>
+                                    <p class="text-sm opacity-90">Model S/3/X/Y全系展示</p>
+                                    <p class="text-xs mt-2 opacity-75">展位: A01-A10</p>
+                                </div>
+                                <div class="bg-white/10 backdrop-blur rounded-xl p-4 hover:bg-white/20 transition">
+                                    <h4 class="font-bold mb-2">比亚迪专区</h4>
+                                    <p class="text-sm opacity-90">王朝/海洋系列</p>
+                                    <p class="text-xs mt-2 opacity-75">展位: A11-A20</p>
+                                </div>
+                                <div class="bg-white/10 backdrop-blur rounded-xl p-4 hover:bg-white/20 transition">
+                                    <h4 class="font-bold mb-2">蔚来专区</h4>
+                                    <p class="text-sm opacity-90">ET7/ES8/EC6展示</p>
+                                    <p class="text-xs mt-2 opacity-75">展位: A21-A30</p>
+                                </div>
+                                <div class="bg-white/10 backdrop-blur rounded-xl p-4 hover:bg-white/20 transition">
+                                    <h4 class="font-bold mb-2">理想专区</h4>
+                                    <p class="text-sm opacity-90">L9/L8/L7全系</p>
+                                    <p class="text-xs mt-2 opacity-75">展位: A31-A40</p>
+                                </div>
+                            </div>
+                            
+                            <div class="flex items-center justify-between text-sm">
+                                <div class="flex items-center">
+                                    <i class="fas fa-users mr-2"></i>
+                                    容纳人数: 5000人
+                                </div>
+                                <div class="flex items-center">
+                                    <i class="fas fa-wifi mr-2"></i>
+                                    5G全覆盖
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    
+                    <!-- B馆 - 核心零部件 -->
+                    <div class="hall-card">
+                        <div class="bg-gradient-to-br from-green-600 to-emerald-700 rounded-2xl p-6 text-white shadow-2xl h-full flow-light">
+                            <h3 class="text-xl font-bold mb-4 flex items-center">
+                                <i class="fas fa-microchip mr-2"></i>
+                                B馆 - 核心零部件
+                            </h3>
+                            <span class="inline-block bg-white/20 backdrop-blur px-3 py-1 rounded-full text-sm mb-4">
+                                15,000㎡
+                            </span>
+                            
+                            <div class="space-y-3">
+                                <div class="bg-white/10 backdrop-blur rounded-lg p-3 hover:bg-white/20 transition">
+                                    <h4 class="font-semibold flex items-center">
+                                        <i class="fas fa-battery-full mr-2 text-yellow-300"></i>
+                                        动力电池展区
+                                    </h4>
+                                    <p class="text-xs mt-1 opacity-90">宁德时代、比亚迪刀片电池</p>
+                                </div>
+                                <div class="bg-white/10 backdrop-blur rounded-lg p-3 hover:bg-white/20 transition">
+                                    <h4 class="font-semibold flex items-center">
+                                        <i class="fas fa-cog mr-2 text-blue-300"></i>
+                                        驱动电机展区
+                                    </h4>
+                                    <p class="text-xs mt-1 opacity-90">精进电动、汇川技术</p>
+                                </div>
+                                <div class="bg-white/10 backdrop-blur rounded-lg p-3 hover:bg-white/20 transition">
+                                    <h4 class="font-semibold flex items-center">
+                                        <i class="fas fa-brain mr-2 text-purple-300"></i>
+                                        电控系统展区
+                                    </h4>
+                                    <p class="text-xs mt-1 opacity-90">华为、英飞凌、比亚迪半导体</p>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    
+                    <!-- C馆 - 智能交通 -->
+                    <div class="hall-card">
+                        <div class="bg-gradient-to-br from-purple-600 to-indigo-700 rounded-2xl p-6 text-white shadow-2xl h-full flow-light">
+                            <h3 class="text-xl font-bold mb-4 flex items-center">
+                                <i class="fas fa-satellite-dish mr-2"></i>
+                                C馆 - 智能交通
+                            </h3>
+                            <span class="inline-block bg-white/20 backdrop-blur px-3 py-1 rounded-full text-sm mb-4">
+                                10,000㎡
+                            </span>
+                            
+                            <div class="space-y-3">
+                                <div class="bg-white/10 backdrop-blur rounded-lg p-3 hover:bg-white/20 transition">
+                                    <h4 class="font-semibold flex items-center">
+                                        <i class="fas fa-broadcast-tower mr-2 text-cyan-300"></i>
+                                        V2X通信展示
+                                    </h4>
+                                    <p class="text-xs mt-1 opacity-90">车路协同解决方案</p>
+                                </div>
+                                <div class="bg-white/10 backdrop-blur rounded-lg p-3 hover:bg-white/20 transition">
+                                    <h4 class="font-semibold flex items-center">
+                                        <i class="fas fa-road mr-2 text-green-300"></i>
+                                        智慧路网系统
+                                    </h4>
+                                    <p class="text-xs mt-1 opacity-90">智能交通管理平台</p>
+                                </div>
+                                <div class="bg-white/10 backdrop-blur rounded-lg p-3 hover:bg-white/20 transition">
+                                    <h4 class="font-semibold flex items-center">
+                                        <i class="fas fa-robot mr-2 text-pink-300"></i>
+                                        自动驾驶技术
+                                    </h4>
+                                    <p class="text-xs mt-1 opacity-90">L4级自动驾驶演示</p>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                
+                <!-- 室外展区 -->
+                <div class="grid grid-cols-1 lg:grid-cols-3 gap-6 mt-6">
+                    <div class="hall-card">
+                        <div class="bg-gradient-to-br from-orange-500 to-red-600 rounded-2xl p-6 text-white shadow-2xl flow-light">
+                            <h3 class="text-lg font-bold mb-3 flex items-center">
+                                <i class="fas fa-route mr-2"></i>
+                                室外体验区
+                            </h3>
+                            <span class="inline-block bg-white/20 backdrop-blur px-3 py-1 rounded-full text-sm mb-3">
+                                5,000㎡
+                            </span>
+                            <div class="space-y-2 text-sm">
+                                <div class="flex items-center">
+                                    <i class="fas fa-car mr-2"></i>
+                                    试乘试驾专业赛道
+                                </div>
+                                <div class="flex items-center">
+                                    <i class="fas fa-parking mr-2"></i>
+                                    自动泊车演示区
+                                </div>
+                                <div class="flex items-center">
+                                    <i class="fas fa-charging-station mr-2"></i>
+                                    超充站体验区
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    
+                    <div class="hall-card">
+                        <div class="bg-gradient-to-br from-pink-500 to-purple-600 rounded-2xl p-6 text-white shadow-2xl flow-light">
+                            <h3 class="text-lg font-bold mb-3 flex items-center">
+                                <i class="fas fa-utensils mr-2"></i>
+                                配套服务区
+                            </h3>
+                            <div class="grid grid-cols-2 gap-2 text-sm">
+                                <div class="bg-white/10 backdrop-blur rounded p-2 text-center hover:bg-white/20 transition">
+                                    <i class="fas fa-coffee text-xl mb-1"></i>
+                                    <p class="text-xs">咖啡厅</p>
+                                </div>
+                                <div class="bg-white/10 backdrop-blur rounded p-2 text-center hover:bg-white/20 transition">
+                                    <i class="fas fa-hamburger text-xl mb-1"></i>
+                                    <p class="text-xs">餐饮区</p>
+                                </div>
+                                <div class="bg-white/10 backdrop-blur rounded p-2 text-center hover:bg-white/20 transition">
+                                    <i class="fas fa-couch text-xl mb-1"></i>
+                                    <p class="text-xs">休息区</p>
+                                </div>
+                                <div class="bg-white/10 backdrop-blur rounded p-2 text-center hover:bg-white/20 transition">
+                                    <i class="fas fa-shopping-bag text-xl mb-1"></i>
+                                    <p class="text-xs">纪念品店</p>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    
+                    <div class="hall-card">
+                        <div class="bg-gradient-to-br from-gray-600 to-gray-800 rounded-2xl p-6 text-white shadow-2xl flow-light">
+                            <h3 class="text-lg font-bold mb-3 flex items-center">
+                                <i class="fas fa-briefcase mr-2"></i>
+                                商务中心
+                            </h3>
+                            <div class="space-y-2 text-sm">
+                                <div class="flex items-center justify-between">
+                                    <span><i class="fas fa-door-open mr-2"></i>VIP会议室</span>
+                                    <span class="text-xs bg-white/20 px-2 py-1 rounded">10间</span>
+                                </div>
+                                <div class="flex items-center justify-between">
+                                    <span><i class="fas fa-handshake mr-2"></i>洽谈区</span>
+                                    <span class="text-xs bg-white/20 px-2 py-1 rounded">50位</span>
+                                </div>
+                                <div class="flex items-center justify-between">
+                                    <span><i class="fas fa-print mr-2"></i>商务服务</span>
+                                    <span class="text-xs bg-white/20 px-2 py-1 rounded">24h</span>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <!-- 智能导览系统 -->
+            <div class="bg-gradient-to-r from-blue-50 to-purple-50 rounded-3xl p-10 mb-16">
+                <h3 class="text-3xl font-bold text-center mb-10 text-gray-800">
+                    <i class="fas fa-compass text-blue-600 mr-3"></i>
+                    智能导览系统
+                </h3>
+                
+                <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
+                    <div class="bg-white rounded-xl p-6 shadow-lg hover:shadow-2xl transition-all duration-300 transform hover:-translate-y-2">
+                        <div class="w-16 h-16 bg-gradient-to-br from-blue-500 to-cyan-500 rounded-2xl flex items-center justify-center mb-4 float-icon">
+                            <i class="fas fa-mobile-alt text-white text-2xl"></i>
+                        </div>
+                        <h4 class="text-lg font-bold mb-2">AR实景导航</h4>
+                        <p class="text-gray-600 text-sm mb-3">手机扫码即可获得增强现实导航</p>
+                        <div class="text-xs text-gray-500">
+                            <div class="flex items-center mb-1">
+                                <i class="fas fa-check text-green-500 mr-2"></i>
+                                精准定位展位
+                            </div>
+                            <div class="flex items-center">
+                                <i class="fas fa-check text-green-500 mr-2"></i>
+                                3D路径指引
+                            </div>
+                        </div>
+                    </div>
+                    
+                    <div class="bg-white rounded-xl p-6 shadow-lg hover:shadow-2xl transition-all duration-300 transform hover:-translate-y-2">
+                        <div class="w-16 h-16 bg-gradient-to-br from-purple-500 to-pink-500 rounded-2xl flex items-center justify-center mb-4 float-icon">
+                            <i class="fas fa-brain text-white text-2xl"></i>
+                        </div>
+                        <h4 class="text-lg font-bold mb-2">AI智能推荐</h4>
+                        <p class="text-gray-600 text-sm mb-3">根据兴趣智能规划参观路线</p>
+                        <div class="text-xs text-gray-500">
+                            <div class="flex items-center mb-1">
+                                <i class="fas fa-check text-green-500 mr-2"></i>
+                                个性化推荐
+                            </div>
+                            <div class="flex items-center">
+                                <i class="fas fa-check text-green-500 mr-2"></i>
+                                最优路径规划
+                            </div>
+                        </div>
+                    </div>
+                    
+                    <div class="bg-white rounded-xl p-6 shadow-lg hover:shadow-2xl transition-all duration-300 transform hover:-translate-y-2">
+                        <div class="w-16 h-16 bg-gradient-to-br from-green-500 to-emerald-500 rounded-2xl flex items-center justify-center mb-4 float-icon">
+                            <i class="fas fa-map-marked-alt text-white text-2xl"></i>
+                        </div>
+                        <h4 class="text-lg font-bold mb-2">实时热力图</h4>
+                        <p class="text-gray-600 text-sm mb-3">显示各展区实时人流密度</p>
+                        <div class="text-xs text-gray-500">
+                            <div class="flex items-center mb-1">
+                                <i class="fas fa-check text-green-500 mr-2"></i>
+                                避开拥挤区域
+                            </div>
+                            <div class="flex items-center">
+                                <i class="fas fa-check text-green-500 mr-2"></i>
+                                预估等待时间
+                            </div>
+                        </div>
+                    </div>
+                    
+                    <div class="bg-white rounded-xl p-6 shadow-lg hover:shadow-2xl transition-all duration-300 transform hover:-translate-y-2">
+                        <div class="w-16 h-16 bg-gradient-to-br from-orange-500 to-red-500 rounded-2xl flex items-center justify-center mb-4 float-icon">
+                            <i class="fas fa-language text-white text-2xl"></i>
+                        </div>
+                        <h4 class="text-lg font-bold mb-2">多语言服务</h4>
+                        <p class="text-gray-600 text-sm mb-3">支持8种语言实时翻译</p>
+                        <div class="text-xs text-gray-500">
+                            <div class="flex items-center mb-1">
+                                <i class="fas fa-check text-green-500 mr-2"></i>
+                                语音导览
+                            </div>
+                            <div class="flex items-center">
+                                <i class="fas fa-check text-green-500 mr-2"></i>
+                                实时翻译
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <!-- 参观动线设计 -->
+            <div class="bg-white rounded-3xl shadow-xl p-10">
+                <h3 class="text-3xl font-bold text-center mb-10 text-gray-800">
+                    <i class="fas fa-route text-emerald-600 mr-3"></i>
+                    科学参观动线设计
+                </h3>
+                
+                <div class="grid grid-cols-1 lg:grid-cols-2 gap-10">
+                    <div>
+                        <h4 class="text-xl font-bold mb-6 text-gray-700">主要参观路线</h4>
+                        <div class="space-y-4">
+                            <div class="flex items-start timeline-item">
+                                <div class="w-12 h-12 bg-gradient-to-br from-blue-500 to-blue-600 text-white rounded-full flex items-center justify-center flex-shrink-0 mr-4 pulse-dot">
+                                    <span class="font-bold">1</span>
+                                </div>
+                                <div class="flex-1">
+                                    <h5 class="font-bold text-lg mb-2">主入口 - 形象展示区</h5>
+                                    <p class="text-gray-600 text-sm mb-2">LED巨幕欢迎墙、展会主题展示</p>
+                                    <div class="bg-blue-50 rounded-lg p-3 text-sm">
+                                        <i class="fas fa-clock text-blue-600 mr-2"></i>
+                                        预计停留: 5-10分钟
+                                    </div>
+                                </div>
+                            </div>
+                            
+                            <div class="flex items-start timeline-item">
+                                <div class="w-12 h-12 bg-gradient-to-br from-green-500 to-green-600 text-white rounded-full flex items-center justify-center flex-shrink-0 mr-4 pulse-dot">
+                                    <span class="font-bold">2</span>
+                                </div>
+                                <div class="flex-1">
+                                    <h5 class="font-bold text-lg mb-2">A馆 - 整车展示</h5>
+                                    <p class="text-gray-600 text-sm mb-2">品牌旗舰车型、新品发布区</p>
+                                    <div class="bg-green-50 rounded-lg p-3 text-sm">
+                                        <i class="fas fa-clock text-green-600 mr-2"></i>
+                                        预计停留: 60-90分钟
+                                    </div>
+                                </div>
+                            </div>
+                            
+                            <div class="flex items-start timeline-item">
+                                <div class="w-12 h-12 bg-gradient-to-br from-purple-500 to-purple-600 text-white rounded-full flex items-center justify-center flex-shrink-0 mr-4 pulse-dot">
+                                    <span class="font-bold">3</span>
+                                </div>
+                                <div class="flex-1">
+                                    <h5 class="font-bold text-lg mb-2">B馆 - 核心技术</h5>
+                                    <p class="text-gray-600 text-sm mb-2">三电系统、智能座舱体验</p>
+                                    <div class="bg-purple-50 rounded-lg p-3 text-sm">
+                                        <i class="fas fa-clock text-purple-600 mr-2"></i>
+                                        预计停留: 45-60分钟
+                                    </div>
+                                </div>
+                            </div>
+                            
+                            <div class="flex items-start timeline-item">
+                                <div class="w-12 h-12 bg-gradient-to-br from-orange-500 to-orange-600 text-white rounded-full flex items-center justify-center flex-shrink-0 mr-4 pulse-dot">
+                                    <span class="font-bold">4</span>
+                                </div>
+                                <div class="flex-1">
+                                    <h5 class="font-bold text-lg mb-2">室外 - 互动体验</h5>
+                                    <p class="text-gray-600 text-sm mb-2">试乘试驾、充电演示</p>
+                                    <div class="bg-orange-50 rounded-lg p-3 text-sm">
+                                        <i class="fas fa-clock text-orange-600 mr-2"></i>
+                                        预计停留: 30-45分钟
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    
+                    <div>
+                        <h4 class="text-xl font-bold mb-6 text-gray-700">专业观众路线</h4>
+                        <div class="bg-gradient-to-br from-gray-50 to-gray-100 rounded-2xl p-6">
+                            <div class="space-y-4">
+                                <div class="bg-white rounded-xl p-4 shadow hover:shadow-lg transition">
+                                    <h5 class="font-bold mb-2 flex items-center">
+                                        <i class="fas fa-user-tie text-blue-600 mr-2"></i>
+                                        VIP快速通道
+                                    </h5>
+                                    <p class="text-sm text-gray-600">专属入口、快速登记、专人接待</p>
+                                </div>
+                                
+                                <div class="bg-white rounded-xl p-4 shadow hover:shadow-lg transition">
+                                    <h5 class="font-bold mb-2 flex items-center">
+                                        <i class="fas fa-handshake text-green-600 mr-2"></i>
+                                        商务洽谈路线
+                                    </h5>
+                                    <p class="text-sm text-gray-600">直达商务中心、预约制参观、一对一对接</p>
+                                </div>
+                                
+                                <div class="bg-white rounded-xl p-4 shadow hover:shadow-lg transition">
+                                    <h5 class="font-bold mb-2 flex items-center">
+                                        <i class="fas fa-microscope text-purple-600 mr-2"></i>
+                                        技术交流路线
+                                    </h5>
+                                    <p class="text-sm text-gray-600">技术论坛、专家讲座、研发展示</p>
+                                </div>
+                                
+                                <div class="bg-white rounded-xl p-4 shadow hover:shadow-lg transition">
+                                    <h5 class="font-bold mb-2 flex items-center">
+                                        <i class="fas fa-newspaper text-orange-600 mr-2"></i>
+                                        媒体采访路线
+                                    </h5>
+                                    <p class="text-sm text-gray-600">新闻中心、采访间、直播区</p>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Duoduo Agent 可视化设计流程 -->
+    <section class="py-20 bg-white relative overflow-hidden">
+        <!-- 背景装饰 -->
+        <div class="absolute inset-0 opacity-5">
+            <div class="absolute top-20 left-20 w-64 h-64 bg-purple-400 rounded-full filter blur-3xl"></div>
+            <div class="absolute bottom-20 right-20 w-64 h-64 bg-blue-400 rounded-full filter blur-3xl"></div>
+        </div>
+        
+        <div class="container mx-auto px-6 relative z-10">
+            <div class="text-center mb-12 animate-fadeInUp">
+                <h2 class="text-4xl font-bold text-gray-800 mb-4">
+                    <i class="fas fa-robot text-purple-600 mr-3"></i>
+                    Duoduo Agent 智能设计系统
+                </h2>
+                <p class="text-xl text-gray-700 font-medium mb-3">从想法到展位概念的完整可视化流程</p>
+                <p class="text-lg text-gray-600">让学生直接体验AI驱动的设计革新，快速实现创意落地</p>
+            </div>
+            
+            <!-- 流程展示 -->
+            <div class="max-w-7xl mx-auto">
+                <!-- 流程时间线 -->
+                <div class="relative mb-12">
+                    <div class="absolute left-0 right-0 top-1/2 h-1 bg-gradient-to-r from-purple-400 via-blue-400 to-emerald-400 transform -translate-y-1/2 rounded-full"></div>
+                    <div class="flex justify-between relative">
+                        <div class="bg-white rounded-full p-3 shadow-lg border-4 border-purple-400 animate-pulse">
+                            <i class="fas fa-lightbulb text-purple-600 text-2xl"></i>
+                        </div>
+                        <div class="bg-white rounded-full p-3 shadow-lg border-4 border-indigo-400">
+                            <i class="fas fa-drafting-compass text-indigo-600 text-2xl"></i>
+                        </div>
+                        <div class="bg-white rounded-full p-3 shadow-lg border-4 border-blue-400">
+                            <i class="fas fa-paint-brush text-blue-600 text-2xl"></i>
+                        </div>
+                        <div class="bg-white rounded-full p-3 shadow-lg border-4 border-cyan-400">
+                            <i class="fas fa-cube text-cyan-600 text-2xl"></i>
+                        </div>
+                        <div class="bg-white rounded-full p-3 shadow-lg border-4 border-teal-400">
+                            <i class="fas fa-palette text-teal-600 text-2xl"></i>
+                        </div>
+                        <div class="bg-white rounded-full p-3 shadow-lg border-4 border-emerald-400 animate-pulse">
+                            <i class="fas fa-store text-emerald-600 text-2xl"></i>
+                        </div>
+                    </div>
+                </div>
+                
+                <!-- 设计阶段展示 - 横向滚动 -->
+                <div class="overflow-x-auto pb-6">
+                    <div class="flex gap-6" style="min-width: 1600px;">
+                        <!-- Stage 1: CAD设计图 -->
+                        <div class="group relative transform hover:scale-105 transition-all duration-500 flex-shrink-0" style="width: 300px;">
+                        <div class="bg-white rounded-2xl shadow-xl overflow-hidden hover:shadow-2xl">
+                            <div class="bg-gradient-to-r from-purple-500 to-purple-600 text-white p-4">
+                                <h3 class="text-lg font-bold flex items-center">
+                                    <span class="bg-white/20 backdrop-blur rounded-full w-8 h-8 flex items-center justify-center mr-3 text-sm">1</span>
+                                    CAD设计图
+                                </h3>
+                                <p class="text-sm opacity-90 mt-1">精确的工程制图</p>
+                            </div>
+                            <div class="p-2">
+                                <div class="relative overflow-hidden rounded-lg">
+                                    <img src="../../data/会展策划/image/Whisk_dcc81c5212.jpg" 
+                                         alt="CAD设计图" 
+                                         class="w-full h-64 object-cover transform group-hover:scale-110 transition-transform duration-700">
+                                    <div class="absolute inset-0 bg-gradient-to-t from-black/50 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-500">
+                                        <div class="absolute bottom-3 left-3 text-white">
+                                            <p class="text-xs">AutoCAD 2024</p>
+                                            <p class="text-xs opacity-75">精度: 0.1mm</p>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="px-4 pb-4 pt-2">
+                                <div class="flex items-center justify-between text-xs text-gray-600">
+                                    <span><i class="fas fa-clock mr-1"></i>2小时</span>
+                                    <span><i class="fas fa-check-circle text-green-500 mr-1"></i>已完成</span>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                        
+                        <!-- Stage 2: 概念设计图 -->
+                        <div class="group relative transform hover:scale-105 transition-all duration-500 flex-shrink-0" style="width: 300px;">
+                        <div class="bg-white rounded-2xl shadow-xl overflow-hidden hover:shadow-2xl">
+                            <div class="bg-gradient-to-r from-indigo-500 to-indigo-600 text-white p-4">
+                                <h3 class="text-lg font-bold flex items-center">
+                                    <span class="bg-white/20 backdrop-blur rounded-full w-8 h-8 flex items-center justify-center mr-3 text-sm">2</span>
+                                    概念设计图
+                                </h3>
+                                <p class="text-sm opacity-90 mt-1">创意概念可视化</p>
+                            </div>
+                            <div class="p-2">
+                                <div class="relative overflow-hidden rounded-lg">
+                                    <img src="../../data/会展策划/image/Whisk_e8f83d1a37.jpg" 
+                                         alt="概念设计图" 
+                                         class="w-full h-64 object-cover transform group-hover:scale-110 transition-transform duration-700">
+                                    <div class="absolute inset-0 bg-gradient-to-t from-black/50 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-500">
+                                        <div class="absolute bottom-3 left-3 text-white">
+                                            <p class="text-xs">Adobe Illustrator</p>
+                                            <p class="text-xs opacity-75">矢量设计</p>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="px-4 pb-4 pt-2">
+                                <div class="flex items-center justify-between text-xs text-gray-600">
+                                    <span><i class="fas fa-clock mr-1"></i>3小时</span>
+                                    <span><i class="fas fa-check-circle text-green-500 mr-1"></i>已完成</span>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                        
+                        <!-- Stage 3: 三维建模白模 -->
+                        <div class="group relative transform hover:scale-105 transition-all duration-500 flex-shrink-0" style="width: 300px;">
+                        <div class="bg-white rounded-2xl shadow-xl overflow-hidden hover:shadow-2xl">
+                            <div class="bg-gradient-to-r from-blue-500 to-blue-600 text-white p-4">
+                                <h3 class="text-lg font-bold flex items-center">
+                                    <span class="bg-white/20 backdrop-blur rounded-full w-8 h-8 flex items-center justify-center mr-3 text-sm">3</span>
+                                    三维建模白模
+                                </h3>
+                                <p class="text-sm opacity-90 mt-1">空间结构展示</p>
+                            </div>
+                            <div class="p-2">
+                                <div class="relative overflow-hidden rounded-lg">
+                                    <img src="../../data/会展策划/image/Whisk_be64a7b61f.jpg" 
+                                         alt="三维建模白模" 
+                                         class="w-full h-64 object-cover transform group-hover:scale-110 transition-transform duration-700">
+                                    <div class="absolute inset-0 bg-gradient-to-t from-black/50 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-500">
+                                        <div class="absolute bottom-3 left-3 text-white">
+                                            <p class="text-xs">SketchUp Pro</p>
+                                            <p class="text-xs opacity-75">多边形: 128K</p>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="px-4 pb-4 pt-2">
+                                <div class="flex items-center justify-between text-xs text-gray-600">
+                                    <span><i class="fas fa-clock mr-1"></i>4小时</span>
+                                    <span><i class="fas fa-check-circle text-green-500 mr-1"></i>已完成</span>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                        
+                        <!-- Stage 4: 三维渲染图 -->
+                        <div class="group relative transform hover:scale-105 transition-all duration-500 flex-shrink-0" style="width: 300px;">
+                        <div class="bg-white rounded-2xl shadow-xl overflow-hidden hover:shadow-2xl">
+                            <div class="bg-gradient-to-r from-cyan-500 to-cyan-600 text-white p-4">
+                                <h3 class="text-lg font-bold flex items-center">
+                                    <span class="bg-white/20 backdrop-blur rounded-full w-8 h-8 flex items-center justify-center mr-3 text-sm">4</span>
+                                    三维渲染图
+                                </h3>
+                                <p class="text-sm opacity-90 mt-1">真实感材质渲染</p>
+                            </div>
+                            <div class="p-2">
+                                <div class="relative overflow-hidden rounded-lg">
+                                    <img src="../../data/会展策划/image/Whisk_192cdc54bc.jpg" 
+                                         alt="三维渲染图" 
+                                         class="w-full h-64 object-cover transform group-hover:scale-110 transition-transform duration-700">
+                                    <div class="absolute inset-0 bg-gradient-to-t from-black/50 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-500">
+                                        <div class="absolute bottom-3 left-3 text-white">
+                                            <p class="text-xs">V-Ray Next</p>
+                                            <p class="text-xs opacity-75">4K渲染</p>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="px-4 pb-4 pt-2">
+                                <div class="flex items-center justify-between text-xs text-gray-600">
+                                    <span><i class="fas fa-clock mr-1"></i>6小时</span>
+                                    <span><i class="fas fa-check-circle text-green-500 mr-1"></i>已完成</span>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                        
+                        <!-- Stage 5: 展位概念设计图 -->
+                        <div class="group relative transform hover:scale-105 transition-all duration-500 flex-shrink-0" style="width: 300px;">
+                        <div class="bg-white rounded-2xl shadow-xl overflow-hidden hover:shadow-2xl ring-4 ring-emerald-400 ring-opacity-50">
+                            <div class="bg-gradient-to-r from-emerald-500 to-emerald-600 text-white p-4">
+                                <h3 class="text-lg font-bold flex items-center">
+                                    <span class="bg-white/20 backdrop-blur rounded-full w-8 h-8 flex items-center justify-center mr-3 text-sm">5</span>
+                                    展位概念设计
+                                </h3>
+                                <p class="text-sm opacity-90 mt-1">最终展示方案</p>
+                            </div>
+                            <div class="p-2">
+                                <div class="relative overflow-hidden rounded-lg">
+                                    <img src="../../data/会展策划/image/Whisk_c478fe089d.jpg" 
+                                         alt="展位概念设计图" 
+                                         class="w-full h-64 object-cover transform group-hover:scale-110 transition-transform duration-700">
+                                    <div class="absolute inset-0 bg-gradient-to-t from-black/50 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-500">
+                                        <div class="absolute bottom-3 left-3 text-white">
+                                            <p class="text-xs">Final Design</p>
+                                            <p class="text-xs opacity-75">Ready to Build</p>
+                                        </div>
+                                    </div>
+                                    <div class="absolute top-3 right-3">
+                                        <span class="bg-emerald-500 text-white text-xs px-2 py-1 rounded-full animate-pulse">
+                                            <i class="fas fa-star mr-1"></i>最终方案
+                                        </span>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="px-4 pb-4 pt-2">
+                                <div class="flex items-center justify-between text-xs text-gray-600">
+                                    <span><i class="fas fa-clock mr-1"></i>总计: 20小时</span>
+                                    <span><i class="fas fa-trophy text-yellow-500 mr-1"></i>已交付</span>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    </div>
+                </div>
+                
+                <!-- AI功能特点 -->
+                <div class="mt-12 grid grid-cols-1 md:grid-cols-3 gap-6">
+                    <div class="bg-white/80 backdrop-blur rounded-2xl p-6 shadow-lg hover:shadow-xl transition-all">
+                        <div class="flex items-center mb-4">
+                            <div class="w-12 h-12 bg-gradient-to-br from-purple-500 to-pink-500 rounded-xl flex items-center justify-center mr-4">
+                                <i class="fas fa-brain text-white text-xl"></i>
+                            </div>
+                            <div>
+                                <h4 class="font-bold text-gray-800">AI智能生成</h4>
+                                <p class="text-sm text-gray-600">基于需求自动设计</p>
+                            </div>
+                        </div>
+                        <ul class="space-y-2 text-sm text-gray-600">
+                            <li class="flex items-center"><i class="fas fa-check text-green-500 mr-2"></i>自动识别设计需求</li>
+                            <li class="flex items-center"><i class="fas fa-check text-green-500 mr-2"></i>智能优化空间布局</li>
+                            <li class="flex items-center"><i class="fas fa-check text-green-500 mr-2"></i>实时渲染预览效果</li>
+                        </ul>
+                    </div>
+                    
+                    <div class="bg-white/80 backdrop-blur rounded-2xl p-6 shadow-lg hover:shadow-xl transition-all">
+                        <div class="flex items-center mb-4">
+                            <div class="w-12 h-12 bg-gradient-to-br from-blue-500 to-cyan-500 rounded-xl flex items-center justify-center mr-4">
+                                <i class="fas fa-tachometer-alt text-white text-xl"></i>
+                            </div>
+                            <div>
+                                <h4 class="font-bold text-gray-800">效率提升90%</h4>
+                                <p class="text-sm text-gray-600">传统流程需要2周</p>
+                            </div>
+                        </div>
+                        <ul class="space-y-2 text-sm text-gray-600">
+                            <li class="flex items-center"><i class="fas fa-check text-green-500 mr-2"></i>20小时完成全流程</li>
+                            <li class="flex items-center"><i class="fas fa-check text-green-500 mr-2"></i>无需专业设计背景</li>
+                            <li class="flex items-center"><i class="fas fa-check text-green-500 mr-2"></i>一键导出施工图纸</li>
+                        </ul>
+                    </div>
+                    
+                    <div class="bg-white/80 backdrop-blur rounded-2xl p-6 shadow-lg hover:shadow-xl transition-all">
+                        <div class="flex items-center mb-4">
+                            <div class="w-12 h-12 bg-gradient-to-br from-emerald-500 to-teal-500 rounded-xl flex items-center justify-center mr-4">
+                                <i class="fas fa-users text-white text-xl"></i>
+                            </div>
+                            <div>
+                                <h4 class="font-bold text-gray-800">学生即可上手</h4>
+                                <p class="text-sm text-gray-600">零基础快速掌握</p>
+                            </div>
+                        </div>
+                        <ul class="space-y-2 text-sm text-gray-600">
+                            <li class="flex items-center"><i class="fas fa-check text-green-500 mr-2"></i>可视化操作界面</li>
+                            <li class="flex items-center"><i class="fas fa-check text-green-500 mr-2"></i>智能设计建议</li>
+                            <li class="flex items-center"><i class="fas fa-check text-green-500 mr-2"></i>实时协作功能</li>
+                        </ul>
+                    </div>
+                </div>
+                
+                <!-- 功能说明 -->
+                <div class="text-center mt-12">
+                    <p class="text-gray-600 text-lg font-medium">
+                        <i class="fas fa-info-circle mr-2 text-blue-500"></i>
+                        支持团队协作 · 云端存储 · 版本管理
+                    </p>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- 数字化服务体系 -->
+    <section class="py-20 bg-gray-50 relative overflow-hidden">
+        <div class="absolute inset-0">
+            <div class="absolute top-20 left-20 w-64 h-64 bg-blue-200/30 rounded-full filter blur-3xl"></div>
+            <div class="absolute bottom-20 right-20 w-80 h-80 bg-purple-200/30 rounded-full filter blur-3xl"></div>
+        </div>
+        
+        <div class="container mx-auto px-6 relative z-10">
+            <div class="text-center mb-12 animate-fadeInUp">
+                <h2 class="text-4xl font-bold text-gray-800 mb-4">
+                    <i class="fas fa-server text-purple-600 mr-3"></i>
+                    数字化服务体系
+                </h2>
+                <p class="text-xl text-gray-600">全方位智能化服务保障</p>
+            </div>
+            
+            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
+                <!-- 智能登记系统 -->
+                <div class="bg-white rounded-2xl shadow-xl p-8 hover:shadow-2xl transition-all duration-300 transform hover:-translate-y-3">
+                    <div class="w-20 h-20 bg-gradient-to-br from-blue-500 to-cyan-500 rounded-2xl flex items-center justify-center mb-6 mx-auto float-icon">
+                        <i class="fas fa-qrcode text-white text-3xl"></i>
+                    </div>
+                    <h3 class="text-xl font-bold text-center mb-4">智能登记系统</h3>
+                    <ul class="space-y-3 text-sm text-gray-600">
+                        <li class="flex items-center">
+                            <i class="fas fa-check-circle text-green-500 mr-2"></i>
+                            人脸识别快速入场
+                        </li>
+                        <li class="flex items-center">
+                            <i class="fas fa-check-circle text-green-500 mr-2"></i>
+                            电子证件一键生成
+                        </li>
+                        <li class="flex items-center">
+                            <i class="fas fa-check-circle text-green-500 mr-2"></i>
+                            实时数据统计分析
+                        </li>
+                        <li class="flex items-center">
+                            <i class="fas fa-check-circle text-green-500 mr-2"></i>
+                            VIP专属快速通道
+                        </li>
+                    </ul>
+                    <div class="mt-6 text-center">
+                        <div class="text-3xl font-bold text-blue-600 counter">< 30秒</div>
+                        <div class="text-sm text-gray-500">平均登记时间</div>
+                    </div>
+                </div>
+                
+                <!-- AI服务机器人 -->
+                <div class="bg-white rounded-2xl shadow-xl p-8 hover:shadow-2xl transition-all duration-300 transform hover:-translate-y-3">
+                    <div class="w-20 h-20 bg-gradient-to-br from-purple-500 to-pink-500 rounded-2xl flex items-center justify-center mb-6 mx-auto float-icon">
+                        <i class="fas fa-robot text-white text-3xl"></i>
+                    </div>
+                    <h3 class="text-xl font-bold text-center mb-4">AI服务机器人</h3>
+                    <ul class="space-y-3 text-sm text-gray-600">
+                        <li class="flex items-center">
+                            <i class="fas fa-check-circle text-green-500 mr-2"></i>
+                            多语言智能问答
+                        </li>
+                        <li class="flex items-center">
+                            <i class="fas fa-check-circle text-green-500 mr-2"></i>
+                            展位导航引领
+                        </li>
+                        <li class="flex items-center">
+                            <i class="fas fa-check-circle text-green-500 mr-2"></i>
+                            活动信息推送
+                        </li>
+                        <li class="flex items-center">
+                            <i class="fas fa-check-circle text-green-500 mr-2"></i>
+                            紧急事件处理
+                        </li>
+                    </ul>
+                    <div class="mt-6 text-center">
+                        <div class="text-3xl font-bold text-purple-600 counter">50+</div>
+                        <div class="text-sm text-gray-500">服务机器人数量</div>
+                    </div>
+                </div>
+                
+                <!-- 云端数据中心 -->
+                <div class="bg-white rounded-2xl shadow-xl p-8 hover:shadow-2xl transition-all duration-300 transform hover:-translate-y-3">
+                    <div class="w-20 h-20 bg-gradient-to-br from-green-500 to-emerald-500 rounded-2xl flex items-center justify-center mb-6 mx-auto float-icon">
+                        <i class="fas fa-cloud text-white text-3xl"></i>
+                    </div>
+                    <h3 class="text-xl font-bold text-center mb-4">云端数据中心</h3>
+                    <ul class="space-y-3 text-sm text-gray-600">
+                        <li class="flex items-center">
+                            <i class="fas fa-check-circle text-green-500 mr-2"></i>
+                            实时客流监控
+                        </li>
+                        <li class="flex items-center">
+                            <i class="fas fa-check-circle text-green-500 mr-2"></i>
+                            大数据分析报告
+                        </li>
+                        <li class="flex items-center">
+                            <i class="fas fa-check-circle text-green-500 mr-2"></i>
+                            智能预警系统
+                        </li>
+                        <li class="flex items-center">
+                            <i class="fas fa-check-circle text-green-500 mr-2"></i>
+                            展商数据服务
+                        </li>
+                    </ul>
+                    <div class="mt-6 text-center">
+                        <div class="text-3xl font-bold text-green-600 counter">24/7</div>
+                        <div class="text-sm text-gray-500">全天候监控</div>
+                    </div>
+                </div>
+                
+                <!-- 智慧安防系统 -->
+                <div class="bg-white rounded-2xl shadow-xl p-8 hover:shadow-2xl transition-all duration-300 transform hover:-translate-y-3">
+                    <div class="w-20 h-20 bg-gradient-to-br from-orange-500 to-red-500 rounded-2xl flex items-center justify-center mb-6 mx-auto float-icon">
+                        <i class="fas fa-shield-alt text-white text-3xl"></i>
+                    </div>
+                    <h3 class="text-xl font-bold text-center mb-4">智慧安防系统</h3>
+                    <ul class="space-y-3 text-sm text-gray-600">
+                        <li class="flex items-center">
+                            <i class="fas fa-check-circle text-green-500 mr-2"></i>
+                            AI视频监控分析
+                        </li>
+                        <li class="flex items-center">
+                            <i class="fas fa-check-circle text-green-500 mr-2"></i>
+                            异常行为识别
+                        </li>
+                        <li class="flex items-center">
+                            <i class="fas fa-check-circle text-green-500 mr-2"></i>
+                            应急响应联动
+                        </li>
+                        <li class="flex items-center">
+                            <i class="fas fa-check-circle text-green-500 mr-2"></i>
+                            密度预警管控
+                        </li>
+                    </ul>
+                    <div class="mt-6 text-center">
+                        <div class="text-3xl font-bold text-orange-600 counter">1000+</div>
+                        <div class="text-sm text-gray-500">监控点位</div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- 特色活动安排 -->
+    <section class="py-20 bg-white relative overflow-hidden">
+        <div class="absolute inset-0 opacity-5" style="background-image: url('../../data/会展策划/image/充电站.jpg'); background-size: cover;"></div>
+        
+        <div class="container mx-auto px-6 relative z-10">
+            <div class="text-center mb-12 animate-fadeInUp">
+                <h2 class="text-4xl font-bold text-gray-800 mb-4">
+                    <i class="fas fa-calendar-alt text-orange-600 mr-3"></i>
+                    精彩活动安排
+                </h2>
+                <p class="text-xl text-gray-600">四天展期，精彩不断</p>
+            </div>
+            
+            <!-- 开幕式 -->
+            <div class="mb-12">
+                <div class="gradient-animated rounded-3xl p-10 text-white shadow-2xl">
+                    <div class="text-center mb-8">
+                        <h3 class="text-3xl font-bold mb-4">
+                            <i class="fas fa-crown mr-3"></i>
+                            盛大开幕典礼
+                        </h3>
+                        <p class="text-xl opacity-90">9月12日 09:00-10:30 | 主会场</p>
+                    </div>
+                    
+                    <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
+                        <div class="glass-morphism rounded-xl p-6">
+                            <h4 class="font-bold text-lg mb-3 flex items-center">
+                                <i class="fas fa-microphone mr-2"></i>
+                                领导致辞
+                            </h4>
+                            <ul class="text-sm space-y-2 opacity-90">
+                                <li>• 工信部领导致辞</li>
+                                <li>• 长三角城市群代表发言</li>
+                                <li>• 行业协会主席讲话</li>
+                            </ul>
+                        </div>
+                        
+                        <div class="glass-morphism rounded-xl p-6">
+                            <h4 class="font-bold text-lg mb-3 flex items-center">
+                                <i class="fas fa-rocket mr-2"></i>
+                                启动仪式
+                            </h4>
+                            <ul class="text-sm space-y-2 opacity-90">
+                                <li>• 展会正式启动</li>
+                                <li>• 战略合作签约</li>
+                                <li>• 新品全球首发</li>
+                            </ul>
+                        </div>
+                        
+                        <div class="glass-morphism rounded-xl p-6">
+                            <h4 class="font-bold text-lg mb-3 flex items-center">
+                                <i class="fas fa-tv mr-2"></i>
+                                媒体直播
+                            </h4>
+                            <ul class="text-sm space-y-2 opacity-90">
+                                <li>• 央视新闻直播</li>
+                                <li>• 50+主流媒体报道</li>
+                                <li>• 全网同步直播</li>
+                            </ul>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            
+            <!-- 论坛日程 -->
+            <div class="bg-gray-50 rounded-3xl p-10">
+                <h3 class="text-3xl font-bold text-center mb-10 text-gray-800">
+                    <i class="fas fa-comments text-blue-600 mr-3"></i>
+                    高峰论坛日程
+                </h3>
+                
+                <div class="grid grid-cols-1 lg:grid-cols-2 gap-8">
+                    <!-- Day 1 -->
+                    <div>
+                        <div class="bg-white rounded-2xl shadow-lg p-6 mb-6">
+                            <div class="flex items-center justify-between mb-4">
+                                <h4 class="text-xl font-bold text-gray-800">第一天 - 9月12日</h4>
+                                <span class="bg-blue-100 text-blue-600 px-3 py-1 rounded-full text-sm font-semibold">
+                                    产业发展日
+                                </span>
+                            </div>
+                            
+                            <div class="space-y-4">
+                                <div class="border-l-4 border-blue-500 pl-4">
+                                    <div class="flex items-center justify-between mb-2">
+                                        <h5 class="font-bold">新能源汽车产业发展论坛</h5>
+                                        <span class="text-sm text-gray-500">10:00-12:00</span>
+                                    </div>
+                                    <p class="text-sm text-gray-600">主题：双碳目标下的产业机遇</p>
+                                    <div class="mt-2 flex items-center text-xs text-gray-500">
+                                        <i class="fas fa-users mr-2"></i>
+                                        预计参会: 500人
+                                    </div>
+                                </div>
+                                
+                                <div class="border-l-4 border-green-500 pl-4">
+                                    <div class="flex items-center justify-between mb-2">
+                                        <h5 class="font-bold">动力电池技术创新峰会</h5>
+                                        <span class="text-sm text-gray-500">14:00-16:00</span>
+                                    </div>
+                                    <p class="text-sm text-gray-600">主题：固态电池商业化进程</p>
+                                    <div class="mt-2 flex items-center text-xs text-gray-500">
+                                        <i class="fas fa-users mr-2"></i>
+                                        预计参会: 300人
+                                    </div>
+                                </div>
+                                
+                                <div class="border-l-4 border-purple-500 pl-4">
+                                    <div class="flex items-center justify-between mb-2">
+                                        <h5 class="font-bold">智能座舱体验设计论坛</h5>
+                                        <span class="text-sm text-gray-500">16:30-18:00</span>
+                                    </div>
+                                    <p class="text-sm text-gray-600">主题：人机交互的未来趋势</p>
+                                    <div class="mt-2 flex items-center text-xs text-gray-500">
+                                        <i class="fas fa-users mr-2"></i>
+                                        预计参会: 200人
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    
+                    <!-- Day 2 -->
+                    <div>
+                        <div class="bg-white rounded-2xl shadow-lg p-6 mb-6">
+                            <div class="flex items-center justify-between mb-4">
+                                <h4 class="text-xl font-bold text-gray-800">第二天 - 9月13日</h4>
+                                <span class="bg-green-100 text-green-600 px-3 py-1 rounded-full text-sm font-semibold">
+                                    技术创新日
+                                </span>
+                            </div>
+                            
+                            <div class="space-y-4">
+                                <div class="border-l-4 border-orange-500 pl-4">
+                                    <div class="flex items-center justify-between mb-2">
+                                        <h5 class="font-bold">自动驾驶技术峰会</h5>
+                                        <span class="text-sm text-gray-500">09:00-11:00</span>
+                                    </div>
+                                    <p class="text-sm text-gray-600">主题：L4级自动驾驶落地实践</p>
+                                    <div class="mt-2 flex items-center text-xs text-gray-500">
+                                        <i class="fas fa-users mr-2"></i>
+                                        预计参会: 400人
+                                    </div>
+                                </div>
+                                
+                                <div class="border-l-4 border-pink-500 pl-4">
+                                    <div class="flex items-center justify-between mb-2">
+                                        <h5 class="font-bold">充换电基础设施研讨会</h5>
+                                        <span class="text-sm text-gray-500">14:00-16:00</span>
+                                    </div>
+                                    <p class="text-sm text-gray-600">主题：超充网络建设与运营</p>
+                                    <div class="mt-2 flex items-center text-xs text-gray-500">
+                                        <i class="fas fa-users mr-2"></i>
+                                        预计参会: 350人
+                                    </div>
+                                </div>
+                                
+                                <div class="border-l-4 border-indigo-500 pl-4">
+                                    <div class="flex items-center justify-between mb-2">
+                                        <h5 class="font-bold">车联网安全技术论坛</h5>
+                                        <span class="text-sm text-gray-500">16:30-18:00</span>
+                                    </div>
+                                    <p class="text-sm text-gray-600">主题：智能汽车信息安全挑战</p>
+                                    <div class="mt-2 flex items-center text-xs text-gray-500">
+                                        <i class="fas fa-users mr-2"></i>
+                                        预计参会: 250人
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- 服务保障体系 -->
+    <section class="py-20 bg-gradient-to-br from-emerald-50 to-blue-50 relative overflow-hidden">
+        <div class="container mx-auto px-6 relative z-10">
+            <div class="text-center mb-12 animate-fadeInUp">
+                <h2 class="text-4xl font-bold text-gray-800 mb-4">
+                    <i class="fas fa-hand-holding-heart text-emerald-600 mr-3"></i>
+                    全方位服务保障
+                </h2>
+                <p class="text-xl text-gray-600">专业团队，贴心服务</p>
+            </div>
+            
+            <!-- 服务承诺 -->
+            <div class="bg-gradient-to-r from-emerald-600 to-blue-600 rounded-3xl p-10 text-white mb-12 shadow-2xl">
+                <h3 class="text-3xl font-bold text-center mb-8">服务承诺标准</h3>
+                
+                <div class="grid grid-cols-2 md:grid-cols-4 gap-6 text-center">
+                    <div class="glass-morphism rounded-xl p-6">
+                        <div class="text-4xl font-bold mb-2 counter">< 3</div>
+                        <div class="text-sm">分钟</div>
+                        <div class="text-xs mt-2 opacity-80">平均排队时间</div>
+                    </div>
+                    
+                    <div class="glass-morphism rounded-xl p-6">
+                        <div class="text-4xl font-bold mb-2 counter">< 5</div>
+                        <div class="text-sm">分钟</div>
+                        <div class="text-xs mt-2 opacity-80">问题响应时间</div>
+                    </div>
+                    
+                    <div class="glass-morphism rounded-xl p-6">
+                        <div class="text-4xl font-bold mb-2 counter">100%</div>
+                        <div class="text-sm">覆盖</div>
+                        <div class="text-xs mt-2 opacity-80">WiFi信号覆盖</div>
+                    </div>
+                    
+                    <div class="glass-morphism rounded-xl p-6">
+                        <div class="text-4xl font-bold mb-2 counter">95%+</div>
+                        <div class="text-sm">满意度</div>
+                        <div class="text-xs mt-2 opacity-80">服务满意目标</div>
+                    </div>
+                </div>
+            </div>
+            
+            <!-- 服务团队 -->
+            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
+                <div class="bg-white rounded-2xl shadow-lg p-8 hover:shadow-2xl transition-all duration-300">
+                    <div class="text-center mb-6">
+                        <div class="w-24 h-24 bg-gradient-to-br from-blue-500 to-cyan-500 rounded-full flex items-center justify-center mx-auto mb-4">
+                            <i class="fas fa-headset text-white text-3xl"></i>
+                        </div>
+                        <h4 class="text-xl font-bold">客服团队</h4>
+                    </div>
+                    <ul class="space-y-3 text-sm text-gray-600">
+                        <li class="flex items-center">
+                            <i class="fas fa-check text-green-500 mr-3"></i>
+                            专业客服人员200+
+                        </li>
+                        <li class="flex items-center">
+                            <i class="fas fa-check text-green-500 mr-3"></i>
+                            8种语言服务支持
+                        </li>
+                        <li class="flex items-center">
+                            <i class="fas fa-check text-green-500 mr-3"></i>
+                            24小时服务热线
+                        </li>
+                        <li class="flex items-center">
+                            <i class="fas fa-check text-green-500 mr-3"></i>
+                            现场问题即时处理
+                        </li>
+                    </ul>
+                </div>
+                
+                <div class="bg-white rounded-2xl shadow-lg p-8 hover:shadow-2xl transition-all duration-300">
+                    <div class="text-center mb-6">
+                        <div class="w-24 h-24 bg-gradient-to-br from-green-500 to-emerald-500 rounded-full flex items-center justify-center mx-auto mb-4">
+                            <i class="fas fa-shield-alt text-white text-3xl"></i>
+                        </div>
+                        <h4 class="text-xl font-bold">安保团队</h4>
+                    </div>
+                    <ul class="space-y-3 text-sm text-gray-600">
+                        <li class="flex items-center">
+                            <i class="fas fa-check text-green-500 mr-3"></i>
+                            专业安保人员300+
+                        </li>
+                        <li class="flex items-center">
+                            <i class="fas fa-check text-green-500 mr-3"></i>
+                            AI智能监控系统
+                        </li>
+                        <li class="flex items-center">
+                            <i class="fas fa-check text-green-500 mr-3"></i>
+                            应急响应3分钟内
+                        </li>
+                        <li class="flex items-center">
+                            <i class="fas fa-check text-green-500 mr-3"></i>
+                            全场无死角覆盖
+                        </li>
+                    </ul>
+                </div>
+                
+                <div class="bg-white rounded-2xl shadow-lg p-8 hover:shadow-2xl transition-all duration-300">
+                    <div class="text-center mb-6">
+                        <div class="w-24 h-24 bg-gradient-to-br from-purple-500 to-pink-500 rounded-full flex items-center justify-center mx-auto mb-4">
+                            <i class="fas fa-medkit text-white text-3xl"></i>
+                        </div>
+                        <h4 class="text-xl font-bold">医疗团队</h4>
+                    </div>
+                    <ul class="space-y-3 text-sm text-gray-600">
+                        <li class="flex items-center">
+                            <i class="fas fa-check text-green-500 mr-3"></i>
+                            医护人员50+
+                        </li>
+                        <li class="flex items-center">
+                            <i class="fas fa-check text-green-500 mr-3"></i>
+                            8个医疗服务点
+                        </li>
+                        <li class="flex items-center">
+                            <i class="fas fa-check text-green-500 mr-3"></i>
+                            救护车现场待命
+                        </li>
+                        <li class="flex items-center">
+                            <i class="fas fa-check text-green-500 mr-3"></i>
+                            AED设备全覆盖
+                        </li>
+                    </ul>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- CTA Section -->
+    <section class="py-16 gradient-animated text-white relative overflow-hidden">
+        <div class="absolute inset-0">
+            <div class="absolute top-10 left-10 w-32 h-32 bg-white/10 rounded-full filter blur-3xl animate-pulse"></div>
+            <div class="absolute bottom-10 right-10 w-40 h-40 bg-white/10 rounded-full filter blur-3xl animate-pulse animation-delay-2000"></div>
+        </div>
+        
+        <div class="container mx-auto px-6 text-center relative z-10">
+            <h2 class="text-4xl font-bold mb-6 neon-glow">专业运营，保障展会成功</h2>
+            <p class="text-xl mb-8 opacity-90">了解展会预算规划与投资回报分析</p>
+            <a href="budget.html" class="inline-block bg-white text-purple-600 px-10 py-4 rounded-full font-bold text-lg hover:bg-gray-100 transform hover:scale-105 transition-all duration-300 shadow-xl">
+                <i class="fas fa-chart-pie mr-2"></i>
+                查看预算分析
+            </a>
+        </div>
+    </section>
+
+    <!-- Footer -->
+    <footer class="bg-gray-900 text-white py-12">
+        <div class="container mx-auto px-6">
+            <div class="text-center">
+                <p class="text-gray-400">&copy; 2024 长三角国际新能源汽车与智能交通产业博览会. All rights reserved.</p>
+            </div>
+        </div>
+    </footer>
+    
+    <!-- JavaScript for animations -->
+    <script>
+        // Counter animation
+        const observerOptions = {
+            threshold: 0.5,
+            rootMargin: '0px'
+        };
+        
+        const observer = new IntersectionObserver(function(entries) {
+            entries.forEach(entry => {
+                if (entry.isIntersecting) {
+                    entry.target.classList.add('animate');
+                }
+            });
+        }, observerOptions);
+        
+        document.querySelectorAll('.counter').forEach(el => {
+            observer.observe(el);
+        });
+    </script>
+</body>
+</html>
\ No newline at end of file
diff --git a/web_frontend/exhibition-demo/public/web_result/pages/overview.html b/web_frontend/exhibition-demo/public/web_result/pages/overview.html
new file mode 100644
index 00000000..039c85fb
--- /dev/null
+++ b/web_frontend/exhibition-demo/public/web_result/pages/overview.html
@@ -0,0 +1,523 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>策划概述 - 2024长三角国际新能源汽车展</title>
+    <link rel="stylesheet" href="../css/styles.css">
+    <link rel="stylesheet" href="../css/animations.css">
+    <link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Noto+Sans+SC:wght@300;400;500;700;900&display=swap" rel="stylesheet">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
+    <style>
+        * {
+            font-family: 'Inter', 'Noto Sans SC', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+        }
+        
+        /* Glass morphism effect */
+        .glass-morphism {
+            background: rgba(255, 255, 255, 0.9);
+            backdrop-filter: blur(10px);
+            -webkit-backdrop-filter: blur(10px);
+        }
+        
+        .timeline-item {
+            position: relative;
+            padding-left: 40px;
+        }
+        .timeline-item::before {
+            content: '';
+            position: absolute;
+            left: 9px;
+            top: 40px;
+            height: calc(100% - 40px);
+            width: 2px;
+            background: linear-gradient(to bottom, #667eea, #a78bfa);
+        }
+        .timeline-item:last-child::before {
+            display: none;
+        }
+        .timeline-dot {
+            position: absolute;
+            left: 0;
+            top: 8px;
+            width: 20px;
+            height: 20px;
+            border-radius: 50%;
+            background: white;
+            border: 3px solid #667eea;
+            box-shadow: 0 0 0 6px rgba(102, 126, 234, 0.1);
+            animation: pulse 2s infinite;
+        }
+        @keyframes pulse {
+            0% { box-shadow: 0 0 0 6px rgba(102, 126, 234, 0.1); }
+            50% { box-shadow: 0 0 0 12px rgba(102, 126, 234, 0); }
+            100% { box-shadow: 0 0 0 6px rgba(102, 126, 234, 0.1); }
+        }
+        .gradient-text {
+            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+            -webkit-background-clip: text;
+            -webkit-text-fill-color: transparent;
+            background-clip: text;
+        }
+        .stat-card {
+            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+            position: relative;
+            overflow: hidden;
+        }
+        .stat-card::before {
+            content: '';
+            position: absolute;
+            top: -50%;
+            right: -50%;
+            width: 200%;
+            height: 200%;
+            background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 70%);
+            animation: rotate 20s linear infinite;
+        }
+        @keyframes rotate {
+            from { transform: rotate(0deg); }
+            to { transform: rotate(360deg); }
+        }
+    </style>
+</head>
+<body class="bg-gray-50">
+    <!-- Navigation -->
+    <nav class="fixed top-0 w-full glass-morphism shadow-md z-50 transition-all duration-300">
+        <div class="container mx-auto px-6 py-4">
+            <div class="flex items-center justify-between">
+                <div class="flex items-center">
+                    <div class="w-10 h-10 bg-gradient-to-br from-emerald-400 to-blue-500 rounded-lg flex items-center justify-center mr-3">
+                        <i class="fas fa-charging-station text-white"></i>
+                    </div>
+                    <div>
+                        <h1 class="text-lg font-bold">NEVIT 2024</h1>
+                        <p class="text-xs text-gray-500">新能源汽车产业博览会</p>
+                    </div>
+                </div>
+                <div class="hidden md:flex space-x-8">
+                    <a href="../index.html" class="text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-home mr-2"></i>首页
+                    </a>
+                    <a href="overview.html" class="nav-link active text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-info-circle mr-2"></i>展会概览
+                    </a>
+                    <a href="exhibition.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-th-large mr-2"></i>展览内容
+                    </a>
+                    <a href="marketing.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-bullhorn mr-2"></i>营销推广
+                    </a>
+                    <a href="operation.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-cogs mr-2"></i>运营服务
+                    </a>
+                    <a href="budget.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-chart-pie mr-2"></i>预算分析
+                    </a>
+                    <a href="risk.html" class="text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-shield-alt mr-2"></i>风险评估
+                    </a>
+                </div>
+                <button class="md:hidden text-gray-700">
+                    <i class="fas fa-bars text-2xl"></i>
+                </button>
+            </div>
+        </div>
+    </nav>
+
+    <!-- Page Header -->
+    <section class="relative bg-gradient-to-br from-purple-600 via-indigo-600 to-blue-600 text-white pt-24 pb-16 overflow-hidden">
+        <div class="absolute inset-0">
+            <img src="../../data/会展策划/image/博览会.jpg" alt="博览会背景" class="w-full h-full object-cover opacity-20">
+            <div class="absolute inset-0 bg-gradient-to-b from-transparent to-purple-900/50"></div>
+        </div>
+        <div class="absolute top-20 left-10 w-32 h-32 bg-white/10 rounded-full blur-3xl animate-float"></div>
+        <div class="absolute bottom-10 right-10 w-40 h-40 bg-blue-400/20 rounded-full blur-3xl animate-float animation-delay-2000"></div>
+        
+        <div class="container mx-auto px-6 relative z-10">
+            <div class="animate-fadeInUp">
+                <div class="inline-flex items-center px-4 py-2 bg-white/20 backdrop-blur rounded-full mb-6">
+                    <span class="animate-pulse w-2 h-2 bg-white rounded-full mr-2"></span>
+                    <span class="text-sm font-semibold">全方位展会规划</span>
+                </div>
+                <h1 class="text-5xl md:text-6xl font-bold mb-4">
+                    <span class="block">策划概述</span>
+                </h1>
+                <p class="text-xl opacity-90 max-w-3xl">
+                    <i class="fas fa-quote-left mr-2"></i>
+                    全面了解展会策划背景、目标与核心价值，打造长三角地区最具影响力的新能源汽车产业盛会
+                    <i class="fas fa-quote-right ml-2"></i>
+                </p>
+            </div>
+        </div>
+    </section>
+
+    <!-- Key Stats -->
+    <section class="py-12 -mt-8 relative z-20">
+        <div class="container mx-auto px-6">
+            <div class="grid grid-cols-1 md:grid-cols-4 gap-6">
+                <div class="stat-card text-white p-6 rounded-2xl shadow-2xl animate-fadeInUp animation-delay-200">
+                    <div class="relative z-10">
+                        <i class="fas fa-industry text-3xl mb-3 opacity-80"></i>
+                        <div class="text-3xl font-bold mb-1">3000+</div>
+                        <div class="text-sm opacity-90">产业链企业</div>
+                    </div>
+                </div>
+                <div class="stat-card text-white p-6 rounded-2xl shadow-2xl animate-fadeInUp animation-delay-400">
+                    <div class="relative z-10">
+                        <i class="fas fa-coins text-3xl mb-3 opacity-80"></i>
+                        <div class="text-3xl font-bold mb-1">8000亿</div>
+                        <div class="text-sm opacity-90">2023年产值</div>
+                    </div>
+                </div>
+                <div class="stat-card text-white p-6 rounded-2xl shadow-2xl animate-fadeInUp animation-delay-600">
+                    <div class="relative z-10">
+                        <i class="fas fa-car text-3xl mb-3 opacity-80"></i>
+                        <div class="text-3xl font-bold mb-1">900万+</div>
+                        <div class="text-sm opacity-90">年产销量</div>
+                    </div>
+                </div>
+                <div class="stat-card text-white p-6 rounded-2xl shadow-2xl animate-fadeInUp animation-delay-800">
+                    <div class="relative z-10">
+                        <i class="fas fa-percentage text-3xl mb-3 opacity-80"></i>
+                        <div class="text-3xl font-bold mb-1">40%</div>
+                        <div class="text-sm opacity-90">全国占比</div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+    
+    <!-- Background Section -->
+    <section class="py-16 bg-white">
+        <div class="container mx-auto px-6">
+            <div class="grid grid-cols-1 lg:grid-cols-2 gap-12 items-center">
+                <div class="animate-fadeInLeft">
+                    <h2 class="text-3xl font-bold text-gray-800 mb-6">
+                        <i class="fas fa-globe-asia mr-3 text-purple-600"></i>策划背景
+                    </h2>
+                    <div class="space-y-4 text-gray-600">
+                        <p>
+                            在全球碳中和目标的大背景下，新能源汽车产业正经历前所未有的发展机遇。中国作为全球最大的新能源汽车市场，2023年产销量均突破900万辆，同比增长超过35%。
+                        </p>
+                        <p>
+                            长三角地区作为中国经济最发达、创新能力最强的区域之一，在新能源汽车产业发展中占据举足轻重的地位。该地区聚集了特斯拉、上汽、蔚来、理想、小鹏等众多知名车企，以及宁德时代、华为等核心零部件供应商。
+                        </p>
+                        <div class="bg-purple-50 border-l-4 border-purple-600 p-4 rounded">
+                            <p class="font-semibold mb-2">核心数据：</p>
+                            <ul class="space-y-2">
+                                <li>• 长三角新能源汽车产量占全国40%以上</li>
+                                <li>• 区域内新能源汽车产业链企业超过3000家</li>
+                                <li>• 2023年产值突破8000亿元</li>
+                                <li>• 智能网联汽车测试里程超过500万公里</li>
+                            </ul>
+                        </div>
+                    </div>
+                </div>
+                <div class="animate-fadeInRight">
+                    <div class="bg-gradient-to-br from-purple-100 to-blue-100 rounded-2xl p-8 relative overflow-hidden">
+                        <div class="absolute top-0 right-0 w-32 h-32 bg-purple-200/30 rounded-full blur-2xl"></div>
+                        <h3 class="text-2xl font-bold text-gray-800 mb-4 relative z-10">
+                            <i class="fas fa-rocket mr-2 text-purple-600"></i>产业发展机遇
+                        </h3>
+                        <div class="space-y-3 relative z-10">
+                            <div class="flex items-start group hover:transform hover:translate-x-2 transition-all duration-300">
+                                <div class="w-8 h-8 bg-gradient-to-br from-purple-500 to-purple-700 text-white rounded-full flex items-center justify-center flex-shrink-0 mt-1 group-hover:scale-110 transition-transform">1</div>
+                                <div class="ml-3">
+                                    <h4 class="font-semibold">政策支持力度空前</h4>
+                                    <p class="text-sm text-gray-600">国家及地方政府出台多项扶持政策，推动产业快速发展</p>
+                                </div>
+                            </div>
+                            <div class="flex items-start group hover:transform hover:translate-x-2 transition-all duration-300">
+                                <div class="w-8 h-8 bg-gradient-to-br from-purple-500 to-purple-700 text-white rounded-full flex items-center justify-center flex-shrink-0 mt-1 group-hover:scale-110 transition-transform">2</div>
+                                <div class="ml-3">
+                                    <h4 class="font-semibold">技术创新加速突破</h4>
+                                    <p class="text-sm text-gray-600">电池技术、自动驾驶、车联网等关键技术不断革新</p>
+                                </div>
+                            </div>
+                            <div class="flex items-start group hover:transform hover:translate-x-2 transition-all duration-300">
+                                <div class="w-8 h-8 bg-gradient-to-br from-purple-500 to-purple-700 text-white rounded-full flex items-center justify-center flex-shrink-0 mt-1 group-hover:scale-110 transition-transform">3</div>
+                                <div class="ml-3">
+                                    <h4 class="font-semibold">市场需求持续增长</h4>
+                                    <p class="text-sm text-gray-600">消费者对新能源汽车接受度不断提高，市场潜力巨大</p>
+                                </div>
+                            </div>
+                            <div class="flex items-start group hover:transform hover:translate-x-2 transition-all duration-300">
+                                <div class="w-8 h-8 bg-gradient-to-br from-purple-500 to-purple-700 text-white rounded-full flex items-center justify-center flex-shrink-0 mt-1 group-hover:scale-110 transition-transform">4</div>
+                                <div class="ml-3">
+                                    <h4 class="font-semibold">产业链日趋完善</h4>
+                                    <p class="text-sm text-gray-600">从研发到制造，从销售到服务，产业生态系统不断成熟</p>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Objectives Section -->
+    <section class="py-16 bg-gradient-to-br from-gray-50 via-purple-50 to-indigo-50 relative overflow-hidden">
+        <div class="absolute inset-0 opacity-5">
+            <img src="../../data/会展策划/image/展馆布置图.jpeg" alt="展馆布置" class="w-full h-full object-cover">
+        </div>
+        <div class="container mx-auto px-6 relative z-10">
+            <h2 class="text-3xl font-bold text-center text-gray-800 mb-4 animate-fadeInUp">
+                <i class="fas fa-bullseye mr-3 text-purple-600"></i>策划目标
+            </h2>
+            <p class="text-center text-gray-600 mb-12 animate-fadeInUp animation-delay-200">明确的目标引领，打造专业高效的展会平台</p>
+            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
+                <div class="bg-white/90 backdrop-blur rounded-xl shadow-xl p-6 hover:shadow-2xl hover:-translate-y-2 transition-all duration-300 group animate-fadeInUp animation-delay-300">
+                    <div class="w-16 h-16 bg-gradient-to-br from-blue-400 to-blue-600 rounded-2xl flex items-center justify-center mb-4 group-hover:rotate-6 transition-transform">
+                        <i class="fas fa-award text-white text-2xl"></i>
+                    </div>
+                    <h3 class="text-xl font-bold mb-2 text-gray-800 group-hover:text-blue-600 transition-colors">品牌建设</h3>
+                    <p class="text-gray-600">打造长三角地区新能源汽车与智能交通领域第一展会品牌，成为行业风向标</p>
+                    <div class="mt-4 pt-4 border-t">
+                        <ul class="text-sm text-gray-500 space-y-1">
+                            <li>• 品牌知名度提升50%</li>
+                            <li>• 媒体曝光量超1亿次</li>
+                            <li>• 行业认可度达90%</li>
+                        </ul>
+                    </div>
+                </div>
+
+                <div class="bg-white/90 backdrop-blur rounded-xl shadow-xl p-6 hover:shadow-2xl hover:-translate-y-2 transition-all duration-300 group animate-fadeInUp animation-delay-400">
+                    <div class="w-16 h-16 bg-gradient-to-br from-emerald-400 to-green-600 rounded-2xl flex items-center justify-center mb-4 group-hover:rotate-6 transition-transform">
+                        <i class="fas fa-chart-line text-white text-2xl"></i>
+                    </div>
+                    <h3 class="text-xl font-bold mb-2 text-gray-800 group-hover:text-emerald-600 transition-colors">商业价值</h3>
+                    <p class="text-gray-600">吸引300家优质展商参展，促进产业链上下游合作，实现商业价值最大化</p>
+                    <div class="mt-4 pt-4 border-t">
+                        <ul class="text-sm text-gray-500 space-y-1">
+                            <li>• 现场成交额超10亿元</li>
+                            <li>• 意向订单8亿元</li>
+                            <li>• 投资回报率33.3%</li>
+                        </ul>
+                    </div>
+                </div>
+
+                <div class="bg-white/90 backdrop-blur rounded-xl shadow-xl p-6 hover:shadow-2xl hover:-translate-y-2 transition-all duration-300 group animate-fadeInUp animation-delay-500">
+                    <div class="w-16 h-16 bg-gradient-to-br from-purple-400 to-purple-600 rounded-2xl flex items-center justify-center mb-4 group-hover:rotate-6 transition-transform">
+                        <i class="fas fa-users text-white text-2xl"></i>
+                    </div>
+                    <h3 class="text-xl font-bold mb-2 text-gray-800 group-hover:text-purple-600 transition-colors">行业推动</h3>
+                    <p class="text-gray-600">促进技术创新和产业升级，推动新能源汽车产业高质量发展</p>
+                    <div class="mt-4 pt-4 border-t">
+                        <ul class="text-sm text-gray-500 space-y-1">
+                            <li>• 发布行业白皮书2份</li>
+                            <li>• 专业论坛20场</li>
+                            <li>• 技术成果发布50项</li>
+                        </ul>
+                    </div>
+                </div>
+
+                <div class="bg-white/90 backdrop-blur rounded-xl shadow-xl p-6 hover:shadow-2xl hover:-translate-y-2 transition-all duration-300 group animate-fadeInUp animation-delay-600">
+                    <div class="w-16 h-16 bg-gradient-to-br from-orange-400 to-pink-600 rounded-2xl flex items-center justify-center mb-4 group-hover:rotate-6 transition-transform">
+                        <i class="fas fa-leaf text-white text-2xl"></i>
+                    </div>
+                    <h3 class="text-xl font-bold mb-2 text-gray-800 group-hover:text-orange-600 transition-colors">社会责任</h3>
+                    <p class="text-gray-600">推广绿色出行理念，助力碳中和目标实现，促进可持续发展</p>
+                    <div class="mt-4 pt-4 border-t">
+                        <ul class="text-sm text-gray-500 space-y-1">
+                            <li>• 碳减排宣传覆盖10万人</li>
+                            <li>• 绿色出行体验5万人次</li>
+                            <li>• 环保倡议签名3万人</li>
+                        </ul>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Policy Support Section -->
+    <section class="py-16 bg-white">
+        <div class="container mx-auto px-6">
+            <h2 class="text-3xl font-bold text-center text-gray-800 mb-12">政策依据</h2>
+            <div class="max-w-4xl mx-auto">
+                <div class="space-y-6">
+                    <div class="timeline-item">
+                        <div class="timeline-dot"></div>
+                        <div class="bg-gray-50 rounded-lg p-6">
+                            <h3 class="text-xl font-bold mb-2">《新能源汽车产业发展规划（2021-2035年）》</h3>
+                            <p class="text-gray-600 mb-3">国务院办公厅发布，明确了新能源汽车产业发展的指导思想、基本原则和发展愿景。</p>
+                            <div class="bg-white rounded p-3">
+                                <p class="text-sm text-gray-500">
+                                    <strong>核心目标：</strong>到2025年，新能源汽车新车销售量达到汽车新车销售总量的20%左右；到2035年，纯电动汽车成为新销售车辆的主流。
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="timeline-item">
+                        <div class="timeline-dot"></div>
+                        <div class="bg-gray-50 rounded-lg p-6">
+                            <h3 class="text-xl font-bold mb-2">《上海市加快新能源汽车产业发展实施计划》</h3>
+                            <p class="text-gray-600 mb-3">上海市人民政府印发，提出打造国际新能源汽车发展高地的具体措施。</p>
+                            <div class="bg-white rounded p-3">
+                                <p class="text-sm text-gray-500">
+                                    <strong>发展目标：</strong>到2025年，上海新能源汽车年产量超过120万辆，产值突破3500亿元，打造3-5家具有国际竞争力的整车企业。
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="timeline-item">
+                        <div class="timeline-dot"></div>
+                        <div class="bg-gray-50 rounded-lg p-6">
+                            <h3 class="text-xl font-bold mb-2">《长三角地区新能源汽车产业链协同发展规划》</h3>
+                            <p class="text-gray-600 mb-3">长三角一体化示范区执委会发布，推动区域产业协同发展。</p>
+                            <div class="bg-white rounded p-3">
+                                <p class="text-sm text-gray-500">
+                                    <strong>协同重点：</strong>建立跨区域产业协作机制，共建新能源汽车产业创新平台，推动充电基础设施互联互通。
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="timeline-item">
+                        <div class="timeline-dot"></div>
+                        <div class="bg-gray-50 rounded-lg p-6">
+                            <h3 class="text-xl font-bold mb-2">《智能网联汽车道路测试与示范应用管理规范》</h3>
+                            <p class="text-gray-600 mb-3">工业和信息化部、公安部、交通运输部联合发布，规范智能网联汽车测试与应用。</p>
+                            <div class="bg-white rounded p-3">
+                                <p class="text-sm text-gray-500">
+                                    <strong>示范应用：</strong>在长三角地区建设5个国家级智能网联汽车测试示范区，累计开放测试道路超过1000公里。
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Market Analysis -->
+    <section class="py-16 bg-gradient-to-br from-gray-50 to-white relative overflow-hidden">
+        <div class="absolute top-0 right-0 w-96 h-96 bg-purple-200/20 rounded-full blur-3xl"></div>
+        <div class="absolute bottom-0 left-0 w-96 h-96 bg-blue-200/20 rounded-full blur-3xl"></div>
+        <div class="container mx-auto px-6 relative z-10">
+            <h2 class="text-3xl font-bold text-center text-gray-800 mb-4 animate-fadeInUp">
+                <i class="fas fa-chart-bar mr-3 text-purple-600"></i>市场分析
+            </h2>
+            <p class="text-center text-gray-600 mb-12 animate-fadeInUp animation-delay-200">深入洞察产业发展趋势，精准把握市场机遇</p>
+            <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
+                <div class="bg-white/90 backdrop-blur rounded-xl shadow-xl p-6 hover:shadow-2xl hover:-translate-y-2 transition-all duration-300 animate-fadeInUp animation-delay-300">
+                    <h3 class="text-xl font-bold mb-4 text-purple-600">
+                        <i class="fas fa-expand-arrows-alt mr-2"></i>市场规模
+                    </h3>
+                    <div class="space-y-3">
+                        <div class="flex justify-between items-center py-2 border-b">
+                            <span class="text-gray-600">2023年销量</span>
+                            <span class="font-bold">949.5万辆</span>
+                        </div>
+                        <div class="flex justify-between items-center py-2 border-b">
+                            <span class="text-gray-600">同比增长</span>
+                            <span class="font-bold text-green-600">+37.9%</span>
+                        </div>
+                        <div class="flex justify-between items-center py-2 border-b">
+                            <span class="text-gray-600">市场渗透率</span>
+                            <span class="font-bold">31.6%</span>
+                        </div>
+                        <div class="flex justify-between items-center py-2">
+                            <span class="text-gray-600">2025年预测</span>
+                            <span class="font-bold">1500万辆</span>
+                        </div>
+                    </div>
+                </div>
+
+                <div class="bg-white/90 backdrop-blur rounded-xl shadow-xl p-6 hover:shadow-2xl hover:-translate-y-2 transition-all duration-300 animate-fadeInUp animation-delay-400">
+                    <h3 class="text-xl font-bold mb-4 text-indigo-600">
+                        <i class="fas fa-sitemap mr-2"></i>产业链分布
+                    </h3>
+                    <div class="space-y-3">
+                        <div class="flex items-center">
+                            <div class="w-24 text-sm text-gray-600">整车制造</div>
+                            <div class="flex-1 bg-gray-200 rounded-full h-4 ml-3">
+                                <div class="bg-purple-600 h-4 rounded-full" style="width: 85%"></div>
+                            </div>
+                            <span class="ml-2 text-sm font-bold">85家</span>
+                        </div>
+                        <div class="flex items-center">
+                            <div class="w-24 text-sm text-gray-600">电池电机</div>
+                            <div class="flex-1 bg-gray-200 rounded-full h-4 ml-3">
+                                <div class="bg-purple-600 h-4 rounded-full" style="width: 70%"></div>
+                            </div>
+                            <span class="ml-2 text-sm font-bold">156家</span>
+                        </div>
+                        <div class="flex items-center">
+                            <div class="w-24 text-sm text-gray-600">智能网联</div>
+                            <div class="flex-1 bg-gray-200 rounded-full h-4 ml-3">
+                                <div class="bg-purple-600 h-4 rounded-full" style="width: 60%"></div>
+                            </div>
+                            <span class="ml-2 text-sm font-bold">234家</span>
+                        </div>
+                        <div class="flex items-center">
+                            <div class="w-24 text-sm text-gray-600">充电设施</div>
+                            <div class="flex-1 bg-gray-200 rounded-full h-4 ml-3">
+                                <div class="bg-purple-600 h-4 rounded-full" style="width: 50%"></div>
+                            </div>
+                            <span class="ml-2 text-sm font-bold">189家</span>
+                        </div>
+                    </div>
+                </div>
+
+                <div class="bg-white/90 backdrop-blur rounded-xl shadow-xl p-6 hover:shadow-2xl hover:-translate-y-2 transition-all duration-300 animate-fadeInUp animation-delay-500">
+                    <h3 class="text-xl font-bold mb-4 text-emerald-600">
+                        <i class="fas fa-poll mr-2"></i>展会需求调研
+                    </h3>
+                    <div class="space-y-3">
+                        <div class="bg-green-50 rounded-lg p-3">
+                            <div class="flex items-center justify-between mb-1">
+                                <span class="text-sm text-gray-600">有参展意向</span>
+                                <span class="font-bold text-green-600">89%</span>
+                            </div>
+                            <div class="bg-gray-200 rounded-full h-2">
+                                <div class="bg-green-600 h-2 rounded-full" style="width: 89%"></div>
+                            </div>
+                        </div>
+                        <div class="bg-blue-50 rounded-lg p-3">
+                            <div class="flex items-center justify-between mb-1">
+                                <span class="text-sm text-gray-600">需要B2B对接</span>
+                                <span class="font-bold text-blue-600">76%</span>
+                            </div>
+                            <div class="bg-gray-200 rounded-full h-2">
+                                <div class="bg-blue-600 h-2 rounded-full" style="width: 76%"></div>
+                            </div>
+                        </div>
+                        <div class="bg-purple-50 rounded-lg p-3">
+                            <div class="flex items-center justify-between mb-1">
+                                <span class="text-sm text-gray-600">关注技术交流</span>
+                                <span class="font-bold text-purple-600">82%</span>
+                            </div>
+                            <div class="bg-gray-200 rounded-full h-2">
+                                <div class="bg-purple-600 h-2 rounded-full" style="width: 82%"></div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- CTA Section -->
+    <section class="py-16 bg-gradient-to-r from-purple-600 to-blue-600 text-white">
+        <div class="container mx-auto px-6 text-center">
+            <h2 class="text-3xl font-bold mb-6">了解更多展会详情</h2>
+            <p class="text-xl mb-8 opacity-90">深入了解展会规划、参展范围和预期效果</p>
+            <a href="exhibition.html" class="inline-block bg-white text-purple-600 px-8 py-3 rounded-lg font-semibold hover:bg-gray-100 transition">
+                查看展会介绍 →
+            </a>
+        </div>
+    </section>
+
+    <!-- Footer -->
+    <footer class="bg-gray-900 text-white py-12">
+        <div class="container mx-auto px-6">
+            <div class="text-center text-sm text-gray-400">
+                <p>&copy; 2024 长三角国际新能源汽车与智能交通产业博览会. All rights reserved.</p>
+            </div>
+        </div>
+    </footer>
+</body>
+</html>
\ No newline at end of file
diff --git a/web_frontend/exhibition-demo/public/web_result/pages/risk.html b/web_frontend/exhibition-demo/public/web_result/pages/risk.html
new file mode 100644
index 00000000..1e032acf
--- /dev/null
+++ b/web_frontend/exhibition-demo/public/web_result/pages/risk.html
@@ -0,0 +1,1076 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>风险评估 - 2024长三角国际新能源汽车展</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
+    <style>
+        * {
+            font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+        }
+        
+        /* Glass morphism effect */
+        .glass-morphism {
+            background: rgba(255, 255, 255, 0.9);
+            backdrop-filter: blur(10px);
+            -webkit-backdrop-filter: blur(10px);
+        }
+        
+        /* Risk level animations */
+        @keyframes riskPulse {
+            0%, 100% { 
+                transform: scale(1);
+                box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.7);
+            }
+            50% { 
+                transform: scale(1.05);
+                box-shadow: 0 0 20px 10px rgba(239, 68, 68, 0);
+            }
+        }
+        
+        .risk-pulse-high {
+            animation: riskPulse 2s infinite;
+        }
+        
+        /* Radar chart animation */
+        .radar-rotate {
+            animation: radarRotate 20s linear infinite;
+        }
+        
+        @keyframes radarRotate {
+            from { transform: rotate(0deg); }
+            to { transform: rotate(360deg); }
+        }
+        
+        /* Progress bar animations */
+        .progress-fill {
+            animation: progressFill 2s ease-out forwards;
+        }
+        
+        @keyframes progressFill {
+            from { width: 0%; }
+        }
+        
+        /* Alert animation */
+        .alert-blink {
+            animation: alertBlink 1s ease-in-out infinite;
+        }
+        
+        @keyframes alertBlink {
+            0%, 100% { opacity: 1; }
+            50% { opacity: 0.3; }
+        }
+        
+        /* Shield animation */
+        .shield-float {
+            animation: shieldFloat 3s ease-in-out infinite;
+        }
+        
+        @keyframes shieldFloat {
+            0%, 100% { transform: translateY(0px); }
+            50% { transform: translateY(-10px); }
+        }
+        
+        /* Risk card hover effect */
+        .risk-card {
+            transition: all 0.3s ease;
+            transform-style: preserve-3d;
+        }
+        
+        .risk-card:hover {
+            transform: translateY(-5px) rotateX(5deg);
+            box-shadow: 0 20px 40px rgba(0,0,0,0.2);
+        }
+        
+        /* Gradient backgrounds */
+        .gradient-bg-red {
+            background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
+        }
+        
+        .gradient-bg-yellow {
+            background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
+        }
+        
+        .gradient-bg-green {
+            background: linear-gradient(135deg, #10b981 0%, #059669 100%);
+        }
+        
+        .gradient-bg-blue {
+            background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
+        }
+        
+        /* Animated gradient background */
+        .animated-gradient {
+            background: linear-gradient(270deg, #667eea, #764ba2, #f093fb, #667eea);
+            background-size: 400% 400%;
+            animation: gradientShift 15s ease infinite;
+        }
+        
+        @keyframes gradientShift {
+            0% { background-position: 0% 50%; }
+            50% { background-position: 100% 50%; }
+            100% { background-position: 0% 50%; }
+        }
+        
+        /* Matrix grid effect */
+        .matrix-grid {
+            background-image: 
+                linear-gradient(rgba(16, 185, 129, 0.1) 1px, transparent 1px),
+                linear-gradient(90deg, rgba(16, 185, 129, 0.1) 1px, transparent 1px);
+            background-size: 50px 50px;
+            animation: matrixMove 10s linear infinite;
+        }
+        
+        @keyframes matrixMove {
+            0% { background-position: 0 0; }
+            100% { background-position: 50px 50px; }
+        }
+        
+        /* Fade in animations */
+        .fade-in-up {
+            animation: fadeInUp 0.8s ease-out forwards;
+            opacity: 0;
+        }
+        
+        @keyframes fadeInUp {
+            from {
+                opacity: 0;
+                transform: translateY(30px);
+            }
+            to {
+                opacity: 1;
+                transform: translateY(0);
+            }
+        }
+        
+        /* Nav link effect */
+        .nav-link {
+            position: relative;
+            transition: color 0.3s ease;
+        }
+        
+        .nav-link::after {
+            content: '';
+            position: absolute;
+            bottom: -2px;
+            left: 0;
+            width: 0;
+            height: 2px;
+            background: linear-gradient(90deg, #10b981, #3b82f6);
+            transition: width 0.3s ease;
+        }
+        
+        .nav-link:hover::after,
+        .nav-link.active::after {
+            width: 100%;
+        }
+        
+        /* Risk meter animation */
+        .risk-meter {
+            transform-origin: center bottom;
+            animation: meterSwing 2s ease-in-out infinite;
+        }
+        
+        @keyframes meterSwing {
+            0%, 100% { transform: rotate(-30deg); }
+            50% { transform: rotate(30deg); }
+        }
+        
+        /* Glow effect */
+        .glow-red {
+            box-shadow: 0 0 20px rgba(239, 68, 68, 0.5);
+        }
+        
+        .glow-yellow {
+            box-shadow: 0 0 20px rgba(245, 158, 11, 0.5);
+        }
+        
+        .glow-green {
+            box-shadow: 0 0 20px rgba(16, 185, 129, 0.5);
+        }
+        
+        /* Scan line effect */
+        .scan-line {
+            position: absolute;
+            width: 100%;
+            height: 2px;
+            background: linear-gradient(90deg, transparent, rgba(16, 185, 129, 0.8), transparent);
+            animation: scan 3s linear infinite;
+        }
+        
+        @keyframes scan {
+            0% { top: 0%; }
+            100% { top: 100%; }
+        }
+        
+        /* Chart animation delays */
+        .delay-100 { animation-delay: 0.1s; }
+        .delay-200 { animation-delay: 0.2s; }
+        .delay-300 { animation-delay: 0.3s; }
+        .delay-400 { animation-delay: 0.4s; }
+        .delay-500 { animation-delay: 0.5s; }
+        .delay-600 { animation-delay: 0.6s; }
+    </style>
+</head>
+<body class="bg-gray-50">
+    <!-- Navigation -->
+    <nav class="fixed top-0 w-full glass-morphism shadow-lg z-50 transition-all duration-300">
+        <div class="container mx-auto px-6 py-4">
+            <div class="flex items-center justify-between">
+                <div class="flex items-center">
+                    <h1 class="text-2xl font-bold bg-gradient-to-r from-emerald-500 to-blue-500 bg-clip-text text-transparent">
+                        NEVIT 2024
+                    </h1>
+                    <span class="ml-3 text-sm text-gray-500">新能源汽车产业博览会</span>
+                </div>
+                <div class="hidden md:flex space-x-8">
+                    <a href="../index.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-home mr-2"></i>首页
+                    </a>
+                    <a href="overview.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-info-circle mr-2"></i>展会概览
+                    </a>
+                    <a href="exhibition.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-th-large mr-2"></i>展览内容
+                    </a>
+                    <a href="marketing.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-bullhorn mr-2"></i>营销推广
+                    </a>
+                    <a href="operation.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-cogs mr-2"></i>运营服务
+                    </a>
+                    <a href="budget.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
+                        <i class="fas fa-chart-pie mr-2"></i>预算分析
+                    </a>
+                    <a href="risk.html" class="nav-link active text-emerald-500">
+                        <i class="fas fa-shield-alt mr-2"></i>风险评估
+                    </a>
+                </div>
+            </div>
+        </div>
+    </nav>
+
+    <!-- Hero Section with Matrix Effect -->
+    <section class="relative min-h-[500px] pt-20 animated-gradient overflow-hidden">
+        <div class="absolute inset-0 matrix-grid"></div>
+        <div class="scan-line"></div>
+        <div class="relative z-10 container mx-auto px-6 py-20 text-center text-white">
+            <div class="shield-float inline-block mb-6">
+                <div class="w-24 h-24 bg-white/20 backdrop-blur-md rounded-full flex items-center justify-center mx-auto">
+                    <i class="fas fa-shield-alt text-5xl"></i>
+                </div>
+            </div>
+            <h1 class="text-5xl md:text-6xl font-bold mb-6 fade-in-up">
+                智能风险管控中心
+            </h1>
+            <p class="text-xl md:text-2xl mb-8 fade-in-up delay-200">
+                AI驱动 · 实时监控 · 预警防范 · 应急响应
+            </p>
+            <div class="flex justify-center space-x-6 fade-in-up delay-400">
+                <div class="bg-white/20 backdrop-blur-md rounded-xl p-4">
+                    <div class="text-3xl font-bold">18</div>
+                    <div class="text-sm">风险监测点</div>
+                </div>
+                <div class="bg-white/20 backdrop-blur-md rounded-xl p-4">
+                    <div class="text-3xl font-bold">95%</div>
+                    <div class="text-sm">防控覆盖率</div>
+                </div>
+                <div class="bg-white/20 backdrop-blur-md rounded-xl p-4">
+                    <div class="text-3xl font-bold">24/7</div>
+                    <div class="text-sm">实时监控</div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Risk Overview Dashboard -->
+    <section class="py-20 bg-white">
+        <div class="container mx-auto px-6">
+            <div class="text-center mb-12">
+                <h2 class="text-4xl font-bold mb-4 bg-gradient-to-r from-red-600 to-orange-600 bg-clip-text text-transparent">
+                    风险态势总览
+                </h2>
+                <p class="text-gray-600 text-lg">实时监测 · 动态评估 · 智能预警</p>
+            </div>
+
+            <!-- Risk Level Indicators -->
+            <div class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-12">
+                <!-- High Risk -->
+                <div class="risk-card gradient-bg-red text-white rounded-2xl p-8 relative overflow-hidden">
+                    <div class="absolute top-4 right-4 alert-blink">
+                        <i class="fas fa-exclamation-triangle text-2xl"></i>
+                    </div>
+                    <h3 class="text-2xl font-bold mb-4">高风险事项</h3>
+                    <div class="text-5xl font-bold mb-4">2</div>
+                    <div class="space-y-2">
+                        <div class="bg-white/20 rounded-lg p-2 text-sm">
+                            <i class="fas fa-virus mr-2"></i>疫情防控风险
+                        </div>
+                        <div class="bg-white/20 rounded-lg p-2 text-sm">
+                            <i class="fas fa-cloud-showers-heavy mr-2"></i>极端天气风险
+                        </div>
+                    </div>
+                    <div class="mt-4 bg-white/20 rounded-full h-2">
+                        <div class="bg-white rounded-full h-2 progress-fill" style="width: 30%"></div>
+                    </div>
+                </div>
+
+                <!-- Medium Risk -->
+                <div class="risk-card gradient-bg-yellow text-white rounded-2xl p-8 relative overflow-hidden">
+                    <div class="absolute top-4 right-4">
+                        <i class="fas fa-exclamation-circle text-2xl"></i>
+                    </div>
+                    <h3 class="text-2xl font-bold mb-4">中风险事项</h3>
+                    <div class="text-5xl font-bold mb-4">5</div>
+                    <div class="space-y-2">
+                        <div class="bg-white/20 rounded-lg p-2 text-sm">
+                            <i class="fas fa-users mr-2"></i>人流控制风险
+                        </div>
+                        <div class="bg-white/20 rounded-lg p-2 text-sm">
+                            <i class="fas fa-server mr-2"></i>技术故障风险
+                        </div>
+                        <div class="bg-white/20 rounded-lg p-2 text-sm">
+                            <i class="fas fa-truck mr-2"></i>物流延误风险
+                        </div>
+                    </div>
+                    <div class="mt-4 bg-white/20 rounded-full h-2">
+                        <div class="bg-white rounded-full h-2 progress-fill delay-200" style="width: 50%"></div>
+                    </div>
+                </div>
+
+                <!-- Low Risk -->
+                <div class="risk-card gradient-bg-green text-white rounded-2xl p-8 relative overflow-hidden">
+                    <div class="absolute top-4 right-4">
+                        <i class="fas fa-check-circle text-2xl"></i>
+                    </div>
+                    <h3 class="text-2xl font-bold mb-4">低风险事项</h3>
+                    <div class="text-5xl font-bold mb-4">11</div>
+                    <div class="space-y-2">
+                        <div class="bg-white/20 rounded-lg p-2 text-sm">
+                            <i class="fas fa-parking mr-2"></i>停车管理风险
+                        </div>
+                        <div class="bg-white/20 rounded-lg p-2 text-sm">
+                            <i class="fas fa-utensils mr-2"></i>餐饮服务风险
+                        </div>
+                        <div class="bg-white/20 rounded-lg p-2 text-sm">
+                            <i class="fas fa-wifi mr-2"></i>网络服务风险
+                        </div>
+                    </div>
+                    <div class="mt-4 bg-white/20 rounded-full h-2">
+                        <div class="bg-white rounded-full h-2 progress-fill delay-400" style="width: 85%"></div>
+                    </div>
+                </div>
+            </div>
+
+            <!-- Risk Radar Chart -->
+            <div class="bg-gray-50 rounded-2xl p-8">
+                <h3 class="text-2xl font-bold mb-6 text-center">风险雷达监测</h3>
+                <div class="flex flex-col lg:flex-row items-center justify-around">
+                    <!-- Radar Visualization -->
+                    <div class="relative w-80 h-80">
+                        <svg class="w-full h-full" viewBox="0 0 320 320">
+                            <!-- Background circles -->
+                            <circle cx="160" cy="160" r="140" fill="none" stroke="#e5e7eb" stroke-width="1"/>
+                            <circle cx="160" cy="160" r="105" fill="none" stroke="#e5e7eb" stroke-width="1"/>
+                            <circle cx="160" cy="160" r="70" fill="none" stroke="#e5e7eb" stroke-width="1"/>
+                            <circle cx="160" cy="160" r="35" fill="none" stroke="#e5e7eb" stroke-width="1"/>
+                            
+                            <!-- Radar lines -->
+                            <line x1="160" y1="20" x2="160" y2="300" stroke="#e5e7eb" stroke-width="1"/>
+                            <line x1="20" y1="160" x2="300" y2="160" stroke="#e5e7eb" stroke-width="1"/>
+                            <line x1="60" y1="60" x2="260" y2="260" stroke="#e5e7eb" stroke-width="1"/>
+                            <line x1="260" y1="60" x2="60" y2="260" stroke="#e5e7eb" stroke-width="1"/>
+                            
+                            <!-- Risk areas -->
+                            <polygon points="160,60 220,100 220,180 160,220 100,180 100,100" 
+                                     fill="url(#riskGradient)" opacity="0.6" class="radar-rotate"/>
+                            
+                            <!-- Risk points -->
+                            <circle cx="160" cy="60" r="5" fill="#ef4444" class="risk-pulse-high"/>
+                            <circle cx="220" cy="100" r="5" fill="#f59e0b"/>
+                            <circle cx="220" cy="180" r="5" fill="#10b981"/>
+                            <circle cx="160" cy="220" r="5" fill="#10b981"/>
+                            <circle cx="100" cy="180" r="5" fill="#f59e0b"/>
+                            <circle cx="100" cy="100" r="5" fill="#ef4444" class="risk-pulse-high"/>
+                            
+                            <!-- Gradient definition -->
+                            <defs>
+                                <linearGradient id="riskGradient" x1="0%" y1="0%" x2="100%" y2="100%">
+                                    <stop offset="0%" style="stop-color:#ef4444;stop-opacity:0.8" />
+                                    <stop offset="50%" style="stop-color:#f59e0b;stop-opacity:0.6" />
+                                    <stop offset="100%" style="stop-color:#10b981;stop-opacity:0.4" />
+                                </linearGradient>
+                            </defs>
+                        </svg>
+                        
+                        <!-- Center indicator -->
+                        <div class="absolute inset-0 flex items-center justify-center">
+                            <div class="text-center bg-white rounded-full p-6 shadow-lg">
+                                <div class="text-3xl font-bold text-gray-800">73%</div>
+                                <div class="text-sm text-gray-500">安全指数</div>
+                            </div>
+                        </div>
+                    </div>
+                    
+                    <!-- Risk Categories -->
+                    <div class="mt-8 lg:mt-0 space-y-4">
+                        <div class="flex items-center space-x-4">
+                            <div class="w-12 h-12 gradient-bg-red rounded-lg flex items-center justify-center text-white">
+                                <i class="fas fa-shield-virus"></i>
+                            </div>
+                            <div>
+                                <h4 class="font-bold">安全风险</h4>
+                                <div class="flex items-center mt-1">
+                                    <div class="w-32 bg-gray-200 rounded-full h-2 mr-2">
+                                        <div class="gradient-bg-red rounded-full h-2" style="width: 30%"></div>
+                                    </div>
+                                    <span class="text-sm text-gray-500">30%</span>
+                                </div>
+                            </div>
+                        </div>
+                        
+                        <div class="flex items-center space-x-4">
+                            <div class="w-12 h-12 gradient-bg-yellow rounded-lg flex items-center justify-center text-white">
+                                <i class="fas fa-coins"></i>
+                            </div>
+                            <div>
+                                <h4 class="font-bold">财务风险</h4>
+                                <div class="flex items-center mt-1">
+                                    <div class="w-32 bg-gray-200 rounded-full h-2 mr-2">
+                                        <div class="gradient-bg-yellow rounded-full h-2" style="width: 20%"></div>
+                                    </div>
+                                    <span class="text-sm text-gray-500">20%</span>
+                                </div>
+                            </div>
+                        </div>
+                        
+                        <div class="flex items-center space-x-4">
+                            <div class="w-12 h-12 gradient-bg-blue rounded-lg flex items-center justify-center text-white">
+                                <i class="fas fa-cog"></i>
+                            </div>
+                            <div>
+                                <h4 class="font-bold">运营风险</h4>
+                                <div class="flex items-center mt-1">
+                                    <div class="w-32 bg-gray-200 rounded-full h-2 mr-2">
+                                        <div class="gradient-bg-blue rounded-full h-2" style="width: 25%"></div>
+                                    </div>
+                                    <span class="text-sm text-gray-500">25%</span>
+                                </div>
+                            </div>
+                        </div>
+                        
+                        <div class="flex items-center space-x-4">
+                            <div class="w-12 h-12 gradient-bg-green rounded-lg flex items-center justify-center text-white">
+                                <i class="fas fa-handshake"></i>
+                            </div>
+                            <div>
+                                <h4 class="font-bold">合规风险</h4>
+                                <div class="flex items-center mt-1">
+                                    <div class="w-32 bg-gray-200 rounded-full h-2 mr-2">
+                                        <div class="gradient-bg-green rounded-full h-2" style="width: 10%"></div>
+                                    </div>
+                                    <span class="text-sm text-gray-500">10%</span>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Detailed Risk Analysis -->
+    <section class="py-20 bg-gray-50" style="background-image: url('../../data/会展策划/image/风险管理.jpg'); background-size: cover; background-position: center; background-attachment: fixed;">
+        <div class="bg-gray-50/95 backdrop-blur-sm py-20">
+            <div class="container mx-auto px-6">
+                <h2 class="text-4xl font-bold text-center mb-12">重点风险详细分析</h2>
+                
+                <!-- High Priority Risks -->
+                <div class="mb-12">
+                    <h3 class="text-2xl font-bold mb-6 text-red-600">
+                        <i class="fas fa-exclamation-triangle mr-2"></i>高优先级风险
+                    </h3>
+                    
+                    <div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
+                        <!-- COVID Risk -->
+                        <div class="bg-white rounded-2xl shadow-xl p-6 border-l-4 border-red-500">
+                            <div class="flex items-start justify-between mb-4">
+                                <div>
+                                    <h4 class="text-xl font-bold text-gray-800">疫情防控风险</h4>
+                                    <p class="text-gray-500">发生概率: 中 | 影响程度: 高</p>
+                                </div>
+                                <div class="bg-red-100 text-red-600 px-3 py-1 rounded-full text-sm font-semibold">
+                                    高风险
+                                </div>
+                            </div>
+                            
+                            <div class="mb-4">
+                                <h5 class="font-semibold mb-2">风险描述</h5>
+                                <p class="text-gray-600 text-sm">大规模人员聚集可能导致疫情传播风险，影响展会正常举办</p>
+                            </div>
+                            
+                            <div class="mb-4">
+                                <h5 class="font-semibold mb-2">防控措施</h5>
+                                <ul class="space-y-1 text-sm text-gray-600">
+                                    <li class="flex items-start">
+                                        <i class="fas fa-check-circle text-green-500 mr-2 mt-1"></i>
+                                        <span>实施健康码、行程码、核酸检测三重验证</span>
+                                    </li>
+                                    <li class="flex items-start">
+                                        <i class="fas fa-check-circle text-green-500 mr-2 mt-1"></i>
+                                        <span>配备充足防疫物资，设置临时隔离区</span>
+                                    </li>
+                                    <li class="flex items-start">
+                                        <i class="fas fa-check-circle text-green-500 mr-2 mt-1"></i>
+                                        <span>限流措施，控制场内人数密度</span>
+                                    </li>
+                                    <li class="flex items-start">
+                                        <i class="fas fa-check-circle text-green-500 mr-2 mt-1"></i>
+                                        <span>建立应急响应机制，与卫生部门联动</span>
+                                    </li>
+                                </ul>
+                            </div>
+                            
+                            <div class="flex items-center justify-between pt-4 border-t">
+                                <div class="flex items-center text-sm">
+                                    <i class="fas fa-user-shield text-gray-400 mr-2"></i>
+                                    <span class="text-gray-500">负责人: 安全管理部</span>
+                                </div>
+                                <button class="text-red-600 hover:text-red-700 text-sm font-semibold">
+                                    查看详情 <i class="fas fa-arrow-right ml-1"></i>
+                                </button>
+                            </div>
+                        </div>
+                        
+                        <!-- Weather Risk -->
+                        <div class="bg-white rounded-2xl shadow-xl p-6 border-l-4 border-red-500">
+                            <div class="flex items-start justify-between mb-4">
+                                <div>
+                                    <h4 class="text-xl font-bold text-gray-800">极端天气风险</h4>
+                                    <p class="text-gray-500">发生概率: 低 | 影响程度: 高</p>
+                                </div>
+                                <div class="bg-red-100 text-red-600 px-3 py-1 rounded-full text-sm font-semibold">
+                                    高风险
+                                </div>
+                            </div>
+                            
+                            <div class="mb-4">
+                                <h5 class="font-semibold mb-2">风险描述</h5>
+                                <p class="text-gray-600 text-sm">台风、暴雨等极端天气可能影响展会安全和正常运营</p>
+                            </div>
+                            
+                            <div class="mb-4">
+                                <h5 class="font-semibold mb-2">防控措施</h5>
+                                <ul class="space-y-1 text-sm text-gray-600">
+                                    <li class="flex items-start">
+                                        <i class="fas fa-check-circle text-green-500 mr-2 mt-1"></i>
+                                        <span>建立气象监测预警系统，提前72小时预警</span>
+                                    </li>
+                                    <li class="flex items-start">
+                                        <i class="fas fa-check-circle text-green-500 mr-2 mt-1"></i>
+                                        <span>制定极端天气应急预案和疏散方案</span>
+                                    </li>
+                                    <li class="flex items-start">
+                                        <i class="fas fa-check-circle text-green-500 mr-2 mt-1"></i>
+                                        <span>购买展会取消保险，降低经济损失</span>
+                                    </li>
+                                    <li class="flex items-start">
+                                        <i class="fas fa-check-circle text-green-500 mr-2 mt-1"></i>
+                                        <span>加固室外展区设施，做好防风防雨措施</span>
+                                    </li>
+                                </ul>
+                            </div>
+                            
+                            <div class="flex items-center justify-between pt-4 border-t">
+                                <div class="flex items-center text-sm">
+                                    <i class="fas fa-user-shield text-gray-400 mr-2"></i>
+                                    <span class="text-gray-500">负责人: 应急管理部</span>
+                                </div>
+                                <button class="text-red-600 hover:text-red-700 text-sm font-semibold">
+                                    查看详情 <i class="fas fa-arrow-right ml-1"></i>
+                                </button>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                
+                <!-- Medium Priority Risks -->
+                <div class="mb-12">
+                    <h3 class="text-2xl font-bold mb-6 text-yellow-600">
+                        <i class="fas fa-exclamation-circle mr-2"></i>中优先级风险
+                    </h3>
+                    
+                    <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+                        <!-- Crowd Control -->
+                        <div class="bg-white rounded-xl shadow-lg p-6 border-l-4 border-yellow-500">
+                            <div class="flex items-center mb-3">
+                                <div class="w-10 h-10 bg-yellow-100 rounded-lg flex items-center justify-center mr-3">
+                                    <i class="fas fa-users text-yellow-600"></i>
+                                </div>
+                                <h4 class="font-bold">人流控制风险</h4>
+                            </div>
+                            <p class="text-gray-600 text-sm mb-3">高峰期人流量超出预期，可能造成拥挤踩踏</p>
+                            <div class="space-y-2">
+                                <div class="flex items-center text-sm">
+                                    <i class="fas fa-shield-alt text-green-500 mr-2"></i>
+                                    <span>智能人流监测系统</span>
+                                </div>
+                                <div class="flex items-center text-sm">
+                                    <i class="fas fa-shield-alt text-green-500 mr-2"></i>
+                                    <span>分时预约入场机制</span>
+                                </div>
+                                <div class="flex items-center text-sm">
+                                    <i class="fas fa-shield-alt text-green-500 mr-2"></i>
+                                    <span>应急疏散通道规划</span>
+                                </div>
+                            </div>
+                        </div>
+                        
+                        <!-- Technical Failure -->
+                        <div class="bg-white rounded-xl shadow-lg p-6 border-l-4 border-yellow-500">
+                            <div class="flex items-center mb-3">
+                                <div class="w-10 h-10 bg-yellow-100 rounded-lg flex items-center justify-center mr-3">
+                                    <i class="fas fa-server text-yellow-600"></i>
+                                </div>
+                                <h4 class="font-bold">技术故障风险</h4>
+                            </div>
+                            <p class="text-gray-600 text-sm mb-3">电力、网络、设备故障影响展会正常运行</p>
+                            <div class="space-y-2">
+                                <div class="flex items-center text-sm">
+                                    <i class="fas fa-shield-alt text-green-500 mr-2"></i>
+                                    <span>双路供电保障</span>
+                                </div>
+                                <div class="flex items-center text-sm">
+                                    <i class="fas fa-shield-alt text-green-500 mr-2"></i>
+                                    <span>备用发电机组</span>
+                                </div>
+                                <div class="flex items-center text-sm">
+                                    <i class="fas fa-shield-alt text-green-500 mr-2"></i>
+                                    <span>技术支持7×24小时</span>
+                                </div>
+                            </div>
+                        </div>
+                        
+                        <!-- Logistics Delay -->
+                        <div class="bg-white rounded-xl shadow-lg p-6 border-l-4 border-yellow-500">
+                            <div class="flex items-center mb-3">
+                                <div class="w-10 h-10 bg-yellow-100 rounded-lg flex items-center justify-center mr-3">
+                                    <i class="fas fa-truck text-yellow-600"></i>
+                                </div>
+                                <h4 class="font-bold">物流延误风险</h4>
+                            </div>
+                            <p class="text-gray-600 text-sm mb-3">展品运输延误影响布展进度</p>
+                            <div class="space-y-2">
+                                <div class="flex items-center text-sm">
+                                    <i class="fas fa-shield-alt text-green-500 mr-2"></i>
+                                    <span>提前3天进场布展</span>
+                                </div>
+                                <div class="flex items-center text-sm">
+                                    <i class="fas fa-shield-alt text-green-500 mr-2"></i>
+                                    <span>多家物流商备选</span>
+                                </div>
+                                <div class="flex items-center text-sm">
+                                    <i class="fas fa-shield-alt text-green-500 mr-2"></i>
+                                    <span>实时追踪系统</span>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Emergency Response System -->
+    <section class="py-20 bg-white">
+        <div class="container mx-auto px-6">
+            <h2 class="text-4xl font-bold text-center mb-12">应急响应体系</h2>
+            
+            <!-- Response Levels -->
+            <div class="grid grid-cols-1 md:grid-cols-4 gap-6 mb-12">
+                <div class="text-center">
+                    <div class="w-20 h-20 gradient-bg-green rounded-full flex items-center justify-center mx-auto mb-4 glow-green">
+                        <span class="text-white text-2xl font-bold">IV</span>
+                    </div>
+                    <h4 class="font-bold mb-2">四级响应</h4>
+                    <p class="text-sm text-gray-600">常规事件</p>
+                    <p class="text-xs text-gray-500 mt-2">现场处理</p>
+                </div>
+                
+                <div class="text-center">
+                    <div class="w-20 h-20 gradient-bg-blue rounded-full flex items-center justify-center mx-auto mb-4">
+                        <span class="text-white text-2xl font-bold">III</span>
+                    </div>
+                    <h4 class="font-bold mb-2">三级响应</h4>
+                    <p class="text-sm text-gray-600">一般事件</p>
+                    <p class="text-xs text-gray-500 mt-2">部门协调</p>
+                </div>
+                
+                <div class="text-center">
+                    <div class="w-20 h-20 gradient-bg-yellow rounded-full flex items-center justify-center mx-auto mb-4 glow-yellow">
+                        <span class="text-white text-2xl font-bold">II</span>
+                    </div>
+                    <h4 class="font-bold mb-2">二级响应</h4>
+                    <p class="text-sm text-gray-600">重大事件</p>
+                    <p class="text-xs text-gray-500 mt-2">指挥部介入</p>
+                </div>
+                
+                <div class="text-center">
+                    <div class="w-20 h-20 gradient-bg-red rounded-full flex items-center justify-center mx-auto mb-4 glow-red risk-pulse-high">
+                        <span class="text-white text-2xl font-bold">I</span>
+                    </div>
+                    <h4 class="font-bold mb-2">一级响应</h4>
+                    <p class="text-sm text-gray-600">特大事件</p>
+                    <p class="text-xs text-gray-500 mt-2">全面启动</p>
+                </div>
+            </div>
+            
+            <!-- Emergency Command Center -->
+            <div class="bg-gradient-to-r from-gray-900 to-gray-800 rounded-2xl p-8 text-white">
+                <h3 class="text-2xl font-bold mb-6">
+                    <i class="fas fa-broadcast-tower mr-2"></i>应急指挥中心
+                </h3>
+                
+                <div class="grid grid-cols-1 lg:grid-cols-3 gap-8">
+                    <!-- Command Structure -->
+                    <div>
+                        <h4 class="font-bold mb-4 text-yellow-400">指挥架构</h4>
+                        <div class="space-y-3">
+                            <div class="bg-white/10 rounded-lg p-3">
+                                <div class="font-semibold">总指挥</div>
+                                <div class="text-sm text-gray-300">展会执行总监</div>
+                            </div>
+                            <div class="bg-white/10 rounded-lg p-3">
+                                <div class="font-semibold">副总指挥</div>
+                                <div class="text-sm text-gray-300">安全总监、运营总监</div>
+                            </div>
+                            <div class="bg-white/10 rounded-lg p-3">
+                                <div class="font-semibold">执行小组</div>
+                                <div class="text-sm text-gray-300">各部门负责人</div>
+                            </div>
+                        </div>
+                    </div>
+                    
+                    <!-- Response Time -->
+                    <div>
+                        <h4 class="font-bold mb-4 text-yellow-400">响应时限</h4>
+                        <div class="space-y-3">
+                            <div class="flex items-center justify-between bg-white/10 rounded-lg p-3">
+                                <span>一级响应</span>
+                                <span class="text-red-400 font-bold">5分钟</span>
+                            </div>
+                            <div class="flex items-center justify-between bg-white/10 rounded-lg p-3">
+                                <span>二级响应</span>
+                                <span class="text-yellow-400 font-bold">10分钟</span>
+                            </div>
+                            <div class="flex items-center justify-between bg-white/10 rounded-lg p-3">
+                                <span>三级响应</span>
+                                <span class="text-blue-400 font-bold">30分钟</span>
+                            </div>
+                            <div class="flex items-center justify-between bg-white/10 rounded-lg p-3">
+                                <span>四级响应</span>
+                                <span class="text-green-400 font-bold">60分钟</span>
+                            </div>
+                        </div>
+                    </div>
+                    
+                    <!-- Contact Hotlines -->
+                    <div>
+                        <h4 class="font-bold mb-4 text-yellow-400">应急热线</h4>
+                        <div class="space-y-3">
+                            <div class="bg-white/10 rounded-lg p-3">
+                                <div class="flex items-center">
+                                    <i class="fas fa-phone-alt text-red-400 mr-3"></i>
+                                    <div>
+                                        <div class="font-semibold">紧急救援</div>
+                                        <div class="text-lg">120 / 119</div>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="bg-white/10 rounded-lg p-3">
+                                <div class="flex items-center">
+                                    <i class="fas fa-phone-alt text-blue-400 mr-3"></i>
+                                    <div>
+                                        <div class="font-semibold">安保中心</div>
+                                        <div class="text-lg">400-888-8888</div>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="bg-white/10 rounded-lg p-3">
+                                <div class="flex items-center">
+                                    <i class="fas fa-phone-alt text-green-400 mr-3"></i>
+                                    <div>
+                                        <div class="font-semibold">技术支持</div>
+                                        <div class="text-lg">400-666-6666</div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Risk Control Measures -->
+    <section class="py-20 bg-gray-50">
+        <div class="container mx-auto px-6">
+            <h2 class="text-4xl font-bold text-center mb-12">风险防控措施</h2>
+            
+            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
+                <!-- Prevention -->
+                <div class="bg-white rounded-xl shadow-lg p-6 hover:shadow-2xl transition-shadow">
+                    <div class="w-16 h-16 gradient-bg-blue rounded-full flex items-center justify-center mb-4">
+                        <i class="fas fa-shield-alt text-white text-2xl"></i>
+                    </div>
+                    <h3 class="text-xl font-bold mb-3">事前预防</h3>
+                    <ul class="space-y-2 text-sm text-gray-600">
+                        <li><i class="fas fa-check text-green-500 mr-2"></i>风险识别评估</li>
+                        <li><i class="fas fa-check text-green-500 mr-2"></i>预案制定演练</li>
+                        <li><i class="fas fa-check text-green-500 mr-2"></i>人员培训教育</li>
+                        <li><i class="fas fa-check text-green-500 mr-2"></i>设施安全检查</li>
+                    </ul>
+                </div>
+                
+                <!-- Monitoring -->
+                <div class="bg-white rounded-xl shadow-lg p-6 hover:shadow-2xl transition-shadow">
+                    <div class="w-16 h-16 gradient-bg-green rounded-full flex items-center justify-center mb-4">
+                        <i class="fas fa-satellite-dish text-white text-2xl"></i>
+                    </div>
+                    <h3 class="text-xl font-bold mb-3">事中监控</h3>
+                    <ul class="space-y-2 text-sm text-gray-600">
+                        <li><i class="fas fa-check text-green-500 mr-2"></i>实时监测预警</li>
+                        <li><i class="fas fa-check text-green-500 mr-2"></i>动态风险评估</li>
+                        <li><i class="fas fa-check text-green-500 mr-2"></i>应急快速响应</li>
+                        <li><i class="fas fa-check text-green-500 mr-2"></i>信息及时发布</li>
+                    </ul>
+                </div>
+                
+                <!-- Response -->
+                <div class="bg-white rounded-xl shadow-lg p-6 hover:shadow-2xl transition-shadow">
+                    <div class="w-16 h-16 gradient-bg-yellow rounded-full flex items-center justify-center mb-4">
+                        <i class="fas fa-ambulance text-white text-2xl"></i>
+                    </div>
+                    <h3 class="text-xl font-bold mb-3">应急处置</h3>
+                    <ul class="space-y-2 text-sm text-gray-600">
+                        <li><i class="fas fa-check text-green-500 mr-2"></i>启动应急预案</li>
+                        <li><i class="fas fa-check text-green-500 mr-2"></i>现场紧急处置</li>
+                        <li><i class="fas fa-check text-green-500 mr-2"></i>人员疏散救援</li>
+                        <li><i class="fas fa-check text-green-500 mr-2"></i>舆情管控引导</li>
+                    </ul>
+                </div>
+                
+                <!-- Recovery -->
+                <div class="bg-white rounded-xl shadow-lg p-6 hover:shadow-2xl transition-shadow">
+                    <div class="w-16 h-16 gradient-bg-red rounded-full flex items-center justify-center mb-4">
+                        <i class="fas fa-undo text-white text-2xl"></i>
+                    </div>
+                    <h3 class="text-xl font-bold mb-3">事后恢复</h3>
+                    <ul class="space-y-2 text-sm text-gray-600">
+                        <li><i class="fas fa-check text-green-500 mr-2"></i>损失评估统计</li>
+                        <li><i class="fas fa-check text-green-500 mr-2"></i>保险理赔处理</li>
+                        <li><i class="fas fa-check text-green-500 mr-2"></i>经验总结改进</li>
+                        <li><i class="fas fa-check text-green-500 mr-2"></i>预案优化更新</li>
+                    </ul>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Insurance Coverage -->
+    <section class="py-20 bg-white">
+        <div class="container mx-auto px-6">
+            <h2 class="text-4xl font-bold text-center mb-12">保险保障方案</h2>
+            
+            <div class="bg-gradient-to-r from-blue-50 to-green-50 rounded-2xl p-8">
+                <div class="grid grid-cols-1 lg:grid-cols-2 gap-8">
+                    <!-- Insurance Types -->
+                    <div>
+                        <h3 class="text-2xl font-bold mb-6">投保险种</h3>
+                        <div class="space-y-4">
+                            <div class="bg-white rounded-lg p-4 shadow">
+                                <div class="flex items-center justify-between mb-2">
+                                    <h4 class="font-bold text-blue-600">展会取消险</h4>
+                                    <span class="text-sm bg-blue-100 text-blue-600 px-2 py-1 rounded">核心</span>
+                                </div>
+                                <p class="text-sm text-gray-600 mb-2">覆盖因不可抗力导致的展会取消损失</p>
+                                <div class="flex justify-between text-sm">
+                                    <span class="text-gray-500">保额</span>
+                                    <span class="font-bold">¥500万</span>
+                                </div>
+                            </div>
+                            
+                            <div class="bg-white rounded-lg p-4 shadow">
+                                <div class="flex items-center justify-between mb-2">
+                                    <h4 class="font-bold text-green-600">公众责任险</h4>
+                                    <span class="text-sm bg-green-100 text-green-600 px-2 py-1 rounded">重要</span>
+                                </div>
+                                <p class="text-sm text-gray-600 mb-2">覆盖展会期间第三方人身财产损失</p>
+                                <div class="flex justify-between text-sm">
+                                    <span class="text-gray-500">保额</span>
+                                    <span class="font-bold">¥1000万</span>
+                                </div>
+                            </div>
+                            
+                            <div class="bg-white rounded-lg p-4 shadow">
+                                <div class="flex items-center justify-between mb-2">
+                                    <h4 class="font-bold text-purple-600">财产综合险</h4>
+                                    <span class="text-sm bg-purple-100 text-purple-600 px-2 py-1 rounded">补充</span>
+                                </div>
+                                <p class="text-sm text-gray-600 mb-2">覆盖展品、设备等财产损失</p>
+                                <div class="flex justify-between text-sm">
+                                    <span class="text-gray-500">保额</span>
+                                    <span class="font-bold">¥300万</span>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    
+                    <!-- Coverage Details -->
+                    <div>
+                        <h3 class="text-2xl font-bold mb-6">保障范围</h3>
+                        <div class="bg-white rounded-lg p-6 shadow">
+                            <div class="space-y-4">
+                                <div>
+                                    <h4 class="font-semibold mb-2">
+                                        <i class="fas fa-check-circle text-green-500 mr-2"></i>人员保障
+                                    </h4>
+                                    <ul class="ml-7 space-y-1 text-sm text-gray-600">
+                                        <li>• 参展人员意外伤害</li>
+                                        <li>• 工作人员人身保险</li>
+                                        <li>• 第三方人身损害赔偿</li>
+                                    </ul>
+                                </div>
+                                
+                                <div>
+                                    <h4 class="font-semibold mb-2">
+                                        <i class="fas fa-check-circle text-green-500 mr-2"></i>财产保障
+                                    </h4>
+                                    <ul class="ml-7 space-y-1 text-sm text-gray-600">
+                                        <li>• 展品损失赔偿</li>
+                                        <li>• 设备设施损坏</li>
+                                        <li>• 装修材料损失</li>
+                                    </ul>
+                                </div>
+                                
+                                <div>
+                                    <h4 class="font-semibold mb-2">
+                                        <i class="fas fa-check-circle text-green-500 mr-2"></i>责任保障
+                                    </h4>
+                                    <ul class="ml-7 space-y-1 text-sm text-gray-600">
+                                        <li>• 第三方责任赔偿</li>
+                                        <li>• 法律诉讼费用</li>
+                                        <li>• 紧急救援费用</li>
+                                    </ul>
+                                </div>
+                            </div>
+                            
+                            <div class="mt-6 pt-6 border-t">
+                                <div class="flex items-center justify-between">
+                                    <div>
+                                        <p class="text-sm text-gray-500">总保费</p>
+                                        <p class="text-2xl font-bold text-gray-800">¥15万</p>
+                                    </div>
+                                    <div>
+                                        <p class="text-sm text-gray-500">最高赔付</p>
+                                        <p class="text-2xl font-bold text-green-600">¥1800万</p>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Risk Summary -->
+    <section class="py-20 bg-gradient-to-r from-blue-600 to-purple-600 text-white">
+        <div class="container mx-auto px-6 text-center">
+            <h2 class="text-4xl font-bold mb-8">全方位风险保障</h2>
+            <p class="text-xl mb-12 opacity-90">构建"预防-监控-响应-恢复"四位一体风险管理体系</p>
+            
+            <div class="grid grid-cols-2 md:grid-cols-4 gap-8 max-w-4xl mx-auto">
+                <div>
+                    <div class="text-4xl font-bold mb-2">18个</div>
+                    <div class="text-sm opacity-75">风险监测点</div>
+                </div>
+                <div>
+                    <div class="text-4xl font-bold mb-2">24/7</div>
+                    <div class="text-sm opacity-75">全天候监控</div>
+                </div>
+                <div>
+                    <div class="text-4xl font-bold mb-2">5分钟</div>
+                    <div class="text-sm opacity-75">应急响应</div>
+                </div>
+                <div>
+                    <div class="text-4xl font-bold mb-2">¥1800万</div>
+                    <div class="text-sm opacity-75">保险保障</div>
+                </div>
+            </div>
+            
+            <div class="mt-12">
+                <a href="../index.html" class="inline-block bg-white text-blue-600 px-8 py-3 rounded-lg font-semibold hover:bg-gray-100 transition transform hover:scale-105">
+                    返回首页 <i class="fas fa-home ml-2"></i>
+                </a>
+            </div>
+        </div>
+    </section>
+
+    <!-- Footer -->
+    <footer class="bg-gray-900 text-white py-12">
+        <div class="container mx-auto px-6">
+            <div class="text-center">
+                <p class="text-gray-400">© 2024 长三角国际新能源汽车与智能交通产业博览会. All rights reserved.</p>
+                <p class="text-gray-500 text-sm mt-2">Powered by AI Risk Management System</p>
+            </div>
+        </div>
+    </footer>
+
+    <script>
+        // Add scroll animations
+        const observerOptions = {
+            threshold: 0.1,
+            rootMargin: '0px 0px -50px 0px'
+        };
+
+        const observer = new IntersectionObserver((entries) => {
+            entries.forEach(entry => {
+                if (entry.isIntersecting) {
+                    entry.target.classList.add('animate');
+                }
+            });
+        }, observerOptions);
+
+        document.querySelectorAll('.fade-in-up').forEach(el => {
+            observer.observe(el);
+        });
+
+        // Risk level animation
+        document.querySelectorAll('.risk-card').forEach(card => {
+            card.addEventListener('mouseenter', function() {
+                this.style.transform = 'translateY(-10px) scale(1.02)';
+            });
+            card.addEventListener('mouseleave', function() {
+                this.style.transform = 'translateY(0) scale(1)';
+            });
+        });
+
+        // Progress bar animation on scroll
+        const progressBars = document.querySelectorAll('.progress-fill');
+        const progressObserver = new IntersectionObserver((entries) => {
+            entries.forEach(entry => {
+                if (entry.isIntersecting) {
+                    entry.target.style.animation = 'progressFill 2s ease-out forwards';
+                }
+            });
+        }, observerOptions);
+
+        progressBars.forEach(bar => {
+            progressObserver.observe(bar);
+        });
+    </script>
+</body>
+</html>
\ No newline at end of file
diff --git a/web_frontend/exhibition-demo/src/components/ResultModal.tsx b/web_frontend/exhibition-demo/src/components/ResultModal.tsx
index 34aa24d5..178f6f6c 100644
--- a/web_frontend/exhibition-demo/src/components/ResultModal.tsx
+++ b/web_frontend/exhibition-demo/src/components/ResultModal.tsx
@@ -141,15 +141,13 @@ const ResultModal: React.FC<ResultModalProps> = ({ isOpen, onClose, onViewDetail
 
                 {/* 操作按钮 */}
                 <div className="flex gap-3">
-                  <a
-                    href="../web_result/index.html"
-                    target="_blank"
-                    rel="noopener noreferrer"
+                  <button
+                    onClick={() => window.open('http://localhost:4155', '_blank')}
                     className="flex-1 px-6 py-3 bg-gradient-to-r from-blue-600 to-purple-600 text-white rounded-xl font-medium hover:shadow-lg transform hover:scale-105 transition-all flex items-center justify-center gap-2"
                   >
                     <Eye className="w-5 h-5" />
                     查看详细方案
-                  </a>
+                  </button>
                   <button
                     className="flex-1 px-6 py-3 bg-gray-100 text-gray-700 rounded-xl font-medium hover:bg-gray-200 transition-colors flex items-center justify-center gap-2"
                   >
diff --git a/web_frontend/exhibition-demo/src/pages/WorkflowPageV3.tsx b/web_frontend/exhibition-demo/src/pages/WorkflowPageV3.tsx
index 3f6cba05..12054e13 100644
--- a/web_frontend/exhibition-demo/src/pages/WorkflowPageV3.tsx
+++ b/web_frontend/exhibition-demo/src/pages/WorkflowPageV3.tsx
@@ -14,6 +14,8 @@ interface TerminalLine {
   progress?: number;
 }
 
+type TerminalLineType = TerminalLine['type'];
+
 // 生成随机延迟
 const getRandomDelay = (min: number, max: number) => {
   return Math.floor(Math.random() * (max - min + 1)) + min;
@@ -34,7 +36,6 @@ const WorkflowPageV3 = () => {
   const [isExecuting, setIsExecuting] = useState(false);
   const terminalRef = useRef<HTMLDivElement>(null);
   const intervalRef = useRef<number | null>(null);
-  const executionTimeoutRef = useRef<number | null>(null);
 
   // 启动序列
   const startupSequence = [
@@ -58,7 +59,10 @@ const WorkflowPageV3 = () => {
   ];
 
   // Agent执行序列 - 更丰富的输出
-  const agentSequence = [
+  const agentSequence: Array<{
+    agent: typeof agents[0];
+    outputs: Array<{ type: TerminalLineType; content: string; progress?: number }>
+  }> = [
     {
       agent: agents[0], // 信息检索
       outputs: [
@@ -329,7 +333,7 @@ const WorkflowPageV3 = () => {
     
     setTerminalLines(prev => [...prev, {
       ...line,
-      id: Math.random().toString(36).substr(2, 9),
+      id: Math.random().toString(36).substring(2, 11),
       timestamp
     }]);
 
@@ -561,7 +565,7 @@ const WorkflowPageV3 = () => {
               maxHeight: 'calc(100vh - 200px)'
             }}
           >
-            <style jsx>{`
+            <style>{`
               .custom-scrollbar::-webkit-scrollbar {
                 width: 8px;
               }
diff --git a/web_frontend/web_result/server.js b/web_frontend/web_result/server.js
new file mode 100644
index 00000000..a2e1267d
--- /dev/null
+++ b/web_frontend/web_result/server.js
@@ -0,0 +1,99 @@
+const http = require('http');
+const fs = require('fs');
+const path = require('path');
+const url = require('url');
+
+const PORT = 4155;
+const HOST = '0.0.0.0';
+
+// MIME 类型映射
+const mimeTypes = {
+  '.html': 'text/html; charset=utf-8',
+  '.css': 'text/css',
+  '.js': 'text/javascript',
+  '.json': 'application/json',
+  '.png': 'image/png',
+  '.jpg': 'image/jpeg',
+  '.jpeg': 'image/jpeg',
+  '.gif': 'image/gif',
+  '.svg': 'image/svg+xml',
+  '.ico': 'image/x-icon',
+  '.woff': 'font/woff',
+  '.woff2': 'font/woff2',
+  '.ttf': 'font/ttf',
+  '.eot': 'font/eot'
+};
+
+// 创建服务器
+const server = http.createServer((req, res) => {
+  // 解析 URL
+  const parsedUrl = url.parse(req.url);
+  let pathname = decodeURIComponent(parsedUrl.pathname);
+  
+  // 默认文件
+  if (pathname === '/') {
+    pathname = '/index.html';
+  }
+  
+  // 构建文件路径
+  const filePath = path.join(__dirname, pathname);
+  
+  // 安全检查：确保文件路径在当前目录内
+  if (!filePath.startsWith(__dirname)) {
+    res.writeHead(403);
+    res.end('Forbidden');
+    return;
+  }
+  
+  // 检查文件是否存在
+  fs.stat(filePath, (err, stats) => {
+    if (err) {
+      // 文件不存在
+      res.writeHead(404);
+      res.end('Not Found');
+      return;
+    }
+    
+    if (stats.isDirectory()) {
+      // 如果是目录，尝试加载 index.html
+      const indexPath = path.join(filePath, 'index.html');
+      fs.stat(indexPath, (err, stats) => {
+        if (err) {
+          res.writeHead(404);
+          res.end('Not Found');
+          return;
+        }
+        serveFile(indexPath, res);
+      });
+    } else {
+      // 提供文件
+      serveFile(filePath, res);
+    }
+  });
+});
+
+// 提供文件的函数
+function serveFile(filePath, res) {
+  const ext = path.extname(filePath);
+  const contentType = mimeTypes[ext] || 'application/octet-stream';
+  
+  fs.readFile(filePath, (err, content) => {
+    if (err) {
+      res.writeHead(500);
+      res.end('Internal Server Error');
+      return;
+    }
+    
+    res.writeHead(200, { 'Content-Type': contentType });
+    res.end(content);
+  });
+}
+
+// 启动服务器
+server.listen(PORT, HOST, () => {
+  console.log('======================================');
+  console.log('    Web Result 静态服务器');
+  console.log(`    运行地址: http://localhost:${PORT}`);
+  console.log('    按 Ctrl+C 停止服务器');
+  console.log('======================================');
+});
\ No newline at end of file
diff --git a/web_frontend/web_result/start.bat b/web_frontend/web_result/start.bat
new file mode 100644
index 00000000..fbb9b67a
--- /dev/null
+++ b/web_frontend/web_result/start.bat
@@ -0,0 +1,67 @@
+@echo off
+chcp 65001 >nul 2>&1
+REM Web Result 静态服务器启动脚本 (Node.js版)
+REM 端口: 4155
+
+setlocal enabledelayedexpansion
+
+REM 显示启动横幅
+echo ======================================
+echo     Web Result 静态服务器
+echo     端口: 4155
+echo ======================================
+echo.
+
+REM 获取脚本所在目录
+set "SCRIPT_DIR=%~dp0"
+set "SCRIPT_DIR=%SCRIPT_DIR:~0,-1%"
+
+REM 切换到脚本所在目录
+cd /d "%SCRIPT_DIR%"
+
+REM 检查 Node.js
+where node >nul 2>&1
+if errorlevel 1 (
+    echo [错误] Node.js 未安装
+    echo 请先安装 Node.js: https://nodejs.org
+    pause
+    exit /b 1
+)
+
+echo [信息] Node.js 版本:
+node --version
+echo.
+
+REM 检查端口 4155 是否被占用
+netstat -ano | findstr :4155 >nul 2>&1
+if not errorlevel 1 (
+    echo [警告] 端口 4155 已被占用
+    echo [信息] 正在查看占用进程...
+    netstat -ano | findstr :4155
+    echo.
+    
+    set /p "kill_process=是否终止占用进程？(y/N): "
+    if /I "!kill_process!"=="y" (
+        echo [信息] 正在终止占用进程...
+        for /f "tokens=5" %%a in ('netstat -ano ^| findstr :4155') do (
+            taskkill /PID %%a /F >nul 2>&1
+        )
+        echo [成功] 进程已终止
+        timeout /t 1 /nobreak >nul
+    ) else (
+        echo [错误] 无法启动服务器，端口被占用
+        pause
+        exit /b 1
+    )
+)
+
+REM 启动服务器
+echo [信息] 正在启动服务器...
+echo [信息] 访问地址: http://localhost:4155
+echo [提示] 按 Ctrl+C 停止服务器
+echo.
+
+REM 使用 Node.js 启动服务器
+node server.js
+
+pause
\ No newline at end of file
diff --git a/web_frontend/web_result/start.sh b/web_frontend/web_result/start.sh
new file mode 100755
index 00000000..3ae1d326
--- /dev/null
+++ b/web_frontend/web_result/start.sh
@@ -0,0 +1,59 @@
+#!/bin/bash
+
+# Web Result 静态服务器启动脚本 (Node.js版)
+# 端口: 4155
+
+# 颜色定义
+GREEN='\033[0;32m'
+BLUE='\033[0;34m'
+YELLOW='\033[1;33m'
+RED='\033[0;31m'
+NC='\033[0m'
+
+# 获取脚本所在目录
+SCRIPT_DIR="$( cd "$( dirname "${BASH_SOURCE[0]}" )" && pwd )"
+
+echo -e "${BLUE}======================================${NC}"
+echo -e "${BLUE}    Web Result 静态服务器${NC}"
+echo -e "${BLUE}    端口: 4155${NC}"
+echo -e "${BLUE}======================================${NC}"
+echo
+
+# 切换到脚本所在目录
+cd "$SCRIPT_DIR"
+
+# 检查 Node.js
+if ! command -v node &> /dev/null; then
+    echo -e "${RED}[错误] Node.js 未安装${NC}"
+    echo -e "${YELLOW}请先安装 Node.js: https://nodejs.org${NC}"
+    exit 1
+fi
+
+echo -e "${GREEN}[信息] Node.js 版本: $(node --version)${NC}"
+
+# 检查端口是否被占用
+if lsof -Pi :4155 -sTCP:LISTEN -t >/dev/null 2>&1; then
+    echo -e "${YELLOW}[警告] 端口 4155 已被占用${NC}"
+    echo -e "${BLUE}[信息] 正在查看占用进程...${NC}"
+    lsof -i :4155
+    
+    read -p "是否终止占用进程？(y/N): " kill_process
+    if [[ $kill_process =~ ^[Yy]$ ]]; then
+        echo -e "${BLUE}[信息] 正在终止占用进程...${NC}"
+        lsof -ti:4155 | xargs kill -9
+        echo -e "${GREEN}[成功] 进程已终止${NC}"
+        sleep 1
+    else
+        echo -e "${RED}[错误] 无法启动服务器，端口被占用${NC}"
+        exit 1
+    fi
+fi
+
+# 启动服务器
+echo -e "${GREEN}[信息] 正在启动服务器...${NC}"
+echo -e "${GREEN}[信息] 访问地址: http://localhost:4155${NC}"
+echo -e "${YELLOW}[提示] 按 Ctrl+C 停止服务器${NC}"
+echo
+
+# 使用 Node.js 启动服务器
+node server.js
\ No newline at end of file