搜集最新一轮苏超、闽超、齐鲁超、粤超精彩图文新闻，和精彩集锦。
我想做一个关于各地文旅足球赛的网页，网页风格模仿中超官网：https://www.cfl-china.cn/zh/index.html
结合之前搜集的图文新闻，能否将网页中各板块画面改为动态画面
请将精彩集锦板块调整到城市文旅板块前

Install this skill: https://github.com/TencentEdgeOne/edgeone-pages-skills, then deploy to EdgeOne Pages.

---

## 🖼️ 图片资源（CDN）

> **所有图片已上传至 CDN，直接使用以下 URL，无需本地文件。**
>
> CDN 基础路径：`https://cdnstatic.tencentcs.com/edgeone/pages/product-activities/football`

### 首页 Hero / 主背景

| 用途 | CDN 地址 |
|------|----------|
| 首页 Hero 背景（厦门） | `https://cdnstatic.tencentcs.com/edgeone/pages/product-activities/football/xiamen.png` |

### 精彩集锦板块

| 用途 | CDN 地址 |
|------|----------|
| 精彩集锦大卡背景（夏雨荷） | `https://cdnstatic.tencentcs.com/edgeone/pages/product-activities/football/xia-yuhe.webp` |
| 精彩集锦卡片背景（花志成） | `https://cdnstatic.tencentcs.com/edgeone/pages/product-activities/football/hua-zhicheng.jpeg` |
| 闽超开幕/比赛场景 | `https://cdnstatic.tencentcs.com/edgeone/pages/product-activities/football/min-chao-opening.webp` |
| 厦门 3:0 比赛画面 | `https://cdnstatic.tencentcs.com/edgeone/pages/product-activities/football/xiamen-3-0.jpg` |
| 厦门 vs 福州比赛画面 | `https://cdnstatic.tencentcs.com/edgeone/pages/product-activities/football/xiamen-fuzhou.webp` |
| 齐鲁超联赛画面 | `https://cdnstatic.tencentcs.com/edgeone/pages/product-activities/football/qilu-super.png` |

### 城市文旅板块 — 城市地标图

| 城市 | CDN 地址 |
|------|----------|
| 南京 | `https://cdnstatic.tencentcs.com/edgeone/pages/product-activities/football/nanjing.png` |
| 苏州 | `https://cdnstatic.tencentcs.com/edgeone/pages/product-activities/football/suzhou-garden.png` |
| 广州（广州塔） | `https://cdnstatic.tencentcs.com/edgeone/pages/product-activities/football/guangzhou-tower.png` |
| 广州（城市） | `https://cdnstatic.tencentcs.com/edgeone/pages/product-activities/football/guangzhou.webp` |
| 厦门 | `https://cdnstatic.tencentcs.com/edgeone/pages/product-activities/football/xiamen.png` |
| 福州 | `https://cdnstatic.tencentcs.com/edgeone/pages/product-activities/football/fuzhou.jpg` |
| 泉州 | `https://cdnstatic.tencentcs.com/edgeone/pages/product-activities/football/quanzhou.jpg` |
| 济南 | `https://cdnstatic.tencentcs.com/edgeone/pages/product-activities/football/jinan.jpg` |
| 青岛（栈桥） | `https://cdnstatic.tencentcs.com/edgeone/pages/product-activities/football/zhanqiao.png` |
| 深圳 | `https://cdnstatic.tencentcs.com/edgeone/pages/product-activities/football/shenzhen.jpeg` |
| 盐城 | `https://cdnstatic.tencentcs.com/edgeone/pages/product-activities/football/yancheng.jpg` |

---

## 网页板块与资源对应

### 板块顺序（从上到下）

1. **顶部导航栏** — 模仿中超官网风格
2. **Hero 横幅** — 背景使用 `xiamen.png`
3. **图文新闻板块** — 展示苏超/闽超/齐鲁超/粤超最新图文新闻
4. **精彩集锦板块**（调整到城市文旅前面）
   - 大卡背景：`xia-yuhe.webp`
   - 次卡背景：`hua-zhicheng.jpeg`
   - 比赛集锦卡片使用：`xiamen-3-0.jpg`、`xiamen-fuzhou.webp`、`min-chao-opening.webp`、`qilu-super.png`
   - 注意：文字下面深色区域要尽量缩小，不要过大
5. **城市文旅板块**
   - 展示 4 个联赛对应城市的地标：
     - 闽超：福州 `fuzhou.jpg` / 厦门 `xiamen.png` / 泉州 `quanzhou.jpg`
     - 苏超：南京 `nanjing.png` / 苏州 `suzhou-garden.png` / 盐城 `yancheng.jpg`
     - 齐鲁超：济南 `jinan.jpg` / 青岛 `zhanqiao.png`
     - 粤超：广州 `guangzhou-tower.png` / 深圳 `shenzhen.jpeg`
6. **页脚**

### 动态效果要求

各板块画面改为动态画面：
- Hero 区：背景图缓慢缩放动画（scale 1→1.05，循环）
- 精彩集锦：卡片 hover 时图片放大 + 渐变遮罩 + 播放图标浮现
- 城市文旅：城市卡片 hover 时图片微缩放 + 城市名称上浮
- 新闻卡片：进入视口时淡入上浮动画

---

## 精彩集锦板块优化要求

- 背景要有画面感（使用比赛实拍图作为背景）
- 大卡用 `xia-yuhe.webp` 作为背景，展示精彩进球/动作
- 次卡用 `hua-zhicheng.jpeg` 作为背景
- 文字区域底部深色遮罩区域**缩小**，不要占据太大面积
- 保持文字可读性的前提下，让更多的比赛画面露出