From 201c85b1d983b49b66b6293b5c8459a2f20017e9 Mon Sep 17 00:00:00 2001
From: ltx <1006158920@qq.com>
Date: Mon, 27 Jul 2026 16:44:06 +0800
Subject: [PATCH] =?UTF-8?q?update:=E6=89=93=E5=8C=85=E4=B8=8A=E4=BC=A0&?=
 =?UTF-8?q?=E6=9E=B6=E6=9E=84=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 OSS-DEPLOY.md                           |  32 ++++
 package.json                            |   1 +
 scripts/deploy-oss.ps1                  | 137 +++++++++++++++++
 src/components/PosterGallery.vue        | 190 ++++++++++++++++++++++++
 src/components/PurchaseChannels.vue     |  42 ++++++
 src/components/SiteFooter.vue           |   6 +-
 src/components/SiteHeader.vue           |  74 ++++++++-
 src/components/SportsGroupedSection.vue | 177 ++++++++++++++++++++++
 src/components/VenueAddressSection.vue  |  63 ++++++++
 src/data/page-content.js                | 147 +++++++++++++++++-
 src/data/venue-groups.js                |  82 ++++++++++
 src/router.js                           |  43 +++++-
 src/style.css                           | 130 ++++++++++++++--
 src/views/ContactPage.vue               |  75 +---------
 src/views/ContentDetailPage.vue         |  14 +-
 src/views/ContentPage.vue               |  71 ++++++---
 src/views/HomePage.vue                  |  10 +-
 src/views/ProductDetailPage.vue         |   6 +-
 18 files changed, 1171 insertions(+), 129 deletions(-)
 create mode 100644 OSS-DEPLOY.md
 create mode 100644 scripts/deploy-oss.ps1
 create mode 100644 src/components/PosterGallery.vue
 create mode 100644 src/components/PurchaseChannels.vue
 create mode 100644 src/components/SportsGroupedSection.vue
 create mode 100644 src/components/VenueAddressSection.vue
 create mode 100644 src/data/venue-groups.js

diff --git a/OSS-DEPLOY.md b/OSS-DEPLOY.md
new file mode 100644
index 0000000..18d0c9e
--- /dev/null
+++ b/OSS-DEPLOY.md
@@ -0,0 +1,32 @@
+# 阿里云 OSS 发布
+
+在项目根目录打开 PowerShell，执行：
+
+```powershell
+npm run deploy:oss
+```
+
+脚本会自动完成以下操作：
+
+1. 使用当前时间生成 `static/wwwweb/yyyyMMdd-HHmmss/` 目录。
+2. 执行 Vue/Vite 生产构建。
+3. 改写并检查 OSS 静态资源地址，阻止重复 `https://...https://...` 地址上传。
+4. 上传 JS、CSS、图片等静态资源，并排除 `index.html`。
+5. 验证线上 JS、CSS、Logo 可访问，同时确认 OSS 中不存在 `index.html`。
+
+构建完成后，将终端输出的 `Server index` 文件部署到 `www.yuedongsports.com` 服务器。
+
+## 前置配置
+
+- AccessKey 配置文件：`C:\Users\当前用户\.ossutilconfig`
+- ossutil 默认位置：`.tools\ossutil-2.3.0-windows-amd64\ossutil.exe`
+
+如果路径不同，可以直接调用脚本并传入参数：
+
+```powershell
+powershell -NoProfile -ExecutionPolicy Bypass -File scripts\deploy-oss.ps1 `
+  -ConfigFile "D:\secure\.ossutilconfig" `
+  -OssutilPath "D:\tools\ossutil.exe"
+```
+
+仅在网络环境无法执行公网校验时，可增加 `-SkipRemoteVerify`；上传和本地路径检查仍会正常执行。
diff --git a/package.json b/package.json
index 74103e5..884ef14 100644
--- a/package.json
+++ b/package.json
@@ -7,6 +7,7 @@
     "dev": "vite",
     "build": "vite build",
     "rewrite:oss": "node scripts/rewrite-oss-paths.mjs",
+    "deploy:oss": "powershell -NoProfile -ExecutionPolicy Bypass -File scripts/deploy-oss.ps1",
     "preview": "vite preview"
   },
   "dependencies": {
diff --git a/scripts/deploy-oss.ps1 b/scripts/deploy-oss.ps1
new file mode 100644
index 0000000..994b907
--- /dev/null
+++ b/scripts/deploy-oss.ps1
@@ -0,0 +1,137 @@
+[CmdletBinding()]
+param(
+  [string]$Bucket = 'yuedong-wechatapplet',
+  [string]$Prefix = 'static/wwwweb',
+  [string]$PublicOrigin = 'https://yuedong-wechatapplet.oss-cn-shanghai.aliyuncs.com',
+  [string]$ConfigFile = (Join-Path $HOME '.ossutilconfig'),
+  [string]$OssutilPath = '',
+  [switch]$SkipRemoteVerify
+)
+
+Set-StrictMode -Version Latest
+$ErrorActionPreference = 'Stop'
+
+$ProjectRoot = (Resolve-Path (Join-Path $PSScriptRoot '..')).Path
+$DistDir = Join-Path $ProjectRoot 'dist'
+$DefaultOssutil = Join-Path $ProjectRoot '.tools\ossutil-2.3.0-windows-amd64\ossutil.exe'
+
+if (-not $OssutilPath) {
+  $OssutilPath = $DefaultOssutil
+}
+
+if (-not (Test-Path -LiteralPath $OssutilPath -PathType Leaf)) {
+  throw "ossutil not found: $OssutilPath"
+}
+
+if (-not (Test-Path -LiteralPath $ConfigFile -PathType Leaf)) {
+  throw "OSS config not found: $ConfigFile"
+}
+
+if (-not (Get-Command 'npm.cmd' -ErrorAction SilentlyContinue)) {
+  throw 'npm.cmd was not found. Install Node.js and reopen PowerShell.'
+}
+
+$Timestamp = Get-Date -Format 'yyyyMMdd-HHmmss'
+$CleanOrigin = $PublicOrigin.TrimEnd('/')
+$CleanPrefix = $Prefix.Trim('/')
+$PublicBase = "$CleanOrigin/$CleanPrefix/$Timestamp/"
+$OssTarget = "oss://$Bucket/$CleanPrefix/$Timestamp/"
+
+Push-Location $ProjectRoot
+try {
+  Write-Host "[1/5] Building production files" -ForegroundColor Cyan
+  & npm.cmd run build -- "--base=$PublicBase"
+  if ($LASTEXITCODE -ne 0) {
+    throw "Vite build failed with exit code $LASTEXITCODE"
+  }
+
+  Write-Host "[2/5] Rewriting and validating OSS asset paths" -ForegroundColor Cyan
+  & npm.cmd run rewrite:oss -- $PublicBase
+  if ($LASTEXITCODE -ne 0) {
+    throw "OSS path validation failed with exit code $LASTEXITCODE"
+  }
+
+  $IndexPath = Join-Path $DistDir 'index.html'
+  $IndexContent = [System.IO.File]::ReadAllText($IndexPath)
+  $DuplicatePrefix = $PublicBase.TrimEnd('/') + $PublicBase
+
+  if ($IndexContent.Contains($DuplicatePrefix)) {
+    throw 'The generated index.html contains a duplicated OSS prefix.'
+  }
+
+  if (-not $IndexContent.Contains($PublicBase)) {
+    throw 'The generated index.html does not reference the new OSS directory.'
+  }
+
+  $Files = Get-ChildItem -LiteralPath $DistDir -Recurse -File
+  $UploadFiles = @($Files | Where-Object { $_.Name -ne 'index.html' })
+  $UploadBytes = ($UploadFiles | Measure-Object Length -Sum).Sum
+
+  Write-Host "[3/5] Uploading $($UploadFiles.Count) static files" -ForegroundColor Cyan
+  Write-Host "      Target: $OssTarget"
+  & $OssutilPath -c $ConfigFile cp "$DistDir\" $OssTarget -r --exclude 'index.html' -f -q --no-progress
+  if ($LASTEXITCODE -ne 0) {
+    throw "OSS upload failed with exit code $LASTEXITCODE"
+  }
+
+  Write-Host '[4/5] Confirming index.html was excluded' -ForegroundColor Cyan
+  $RemoteIndexUrl = "${PublicBase}index.html?verify=$Timestamp"
+  try {
+    $RemoteIndexResponse = Invoke-WebRequest -Uri $RemoteIndexUrl -Method Head -UseBasicParsing
+    if ($RemoteIndexResponse.StatusCode -eq 200) {
+      throw 'index.html exists in the new OSS directory, but it must remain on the web server.'
+    }
+  } catch {
+    if (-not $_.Exception.Response) {
+      throw
+    }
+
+    $RemoteIndexStatus = [int]$_.Exception.Response.StatusCode
+    if ($RemoteIndexStatus -ne 404) {
+      throw "Unable to confirm that index.html was excluded. HTTP status: $RemoteIndexStatus"
+    }
+  }
+
+  if (-not $SkipRemoteVerify) {
+    Write-Host '[5/5] Verifying uploaded JS, CSS, and image URLs' -ForegroundColor Cyan
+    $ScriptMatch = [regex]::Match($IndexContent, '<script[^>]+src="([^"]+)"')
+    $StyleMatch = [regex]::Match($IndexContent, '<link[^>]+rel="stylesheet"[^>]+href="([^"]+)"')
+
+    if (-not $ScriptMatch.Success -or -not $StyleMatch.Success) {
+      throw 'Could not locate generated JS or CSS URLs in index.html.'
+    }
+
+    $CacheBuster = "verify=$Timestamp"
+    $ScriptUrl = $ScriptMatch.Groups[1].Value
+    $StyleUrl = $StyleMatch.Groups[1].Value
+    $ScriptResponse = Invoke-WebRequest -Uri "${ScriptUrl}?$CacheBuster" -UseBasicParsing
+    $StyleResponse = Invoke-WebRequest -Uri "${StyleUrl}?$CacheBuster" -Method Head -UseBasicParsing
+
+    if ($ScriptResponse.StatusCode -ne 200 -or $StyleResponse.StatusCode -ne 200) {
+      throw 'The uploaded JS or CSS file is not publicly accessible.'
+    }
+
+    if ($ScriptResponse.Content.Contains($DuplicatePrefix) -or
+        $ScriptResponse.Content -match 'https://[^\s"''`]+https://') {
+      throw 'The uploaded JS contains a duplicated URL.'
+    }
+
+    $SampleImage = "${PublicBase}site/assets/logo.png"
+    $ImageResponse = Invoke-WebRequest -Uri "${SampleImage}?$CacheBuster" -Method Head -UseBasicParsing
+    if ($ImageResponse.StatusCode -ne 200) {
+      throw 'The uploaded sample image is not publicly accessible.'
+    }
+  } else {
+    Write-Host '[5/5] Remote verification skipped by parameter' -ForegroundColor Yellow
+  }
+
+  $SizeMiB = [math]::Round($UploadBytes / 1MB, 2)
+  Write-Host ''
+  Write-Host 'Deployment completed successfully.' -ForegroundColor Green
+  Write-Host "OSS directory : $OssTarget"
+  Write-Host "Public base   : $PublicBase"
+  Write-Host "Uploaded      : $($UploadFiles.Count) files / $SizeMiB MiB"
+  Write-Host "Server index  : $IndexPath"
+} finally {
+  Pop-Location
+}
diff --git a/src/components/PosterGallery.vue b/src/components/PosterGallery.vue
new file mode 100644
index 0000000..07c7f07
--- /dev/null
+++ b/src/components/PosterGallery.vue
@@ -0,0 +1,190 @@
+<template>
+  <div class="poster-gallery">
+    <button
+      v-for="(image, index) in images"
+      :key="image.src"
+      class="poster-gallery__card"
+      type="button"
+      :aria-label="`全屏查看${image.alt || `海报 ${index + 1}`}`"
+      @click="open(index)"
+    >
+      <img :src="image.src" :alt="image.alt" loading="lazy" />
+      <span>全屏查看 <b>↗</b></span>
+    </button>
+  </div>
+
+  <Teleport to="body">
+    <div
+      v-if="activeIndex > -1"
+      ref="lightbox"
+      class="poster-lightbox"
+      role="dialog"
+      aria-modal="true"
+      aria-label="海报全屏查看"
+      tabindex="-1"
+      @keydown.esc="close"
+      @keydown.left="showPrevious"
+      @keydown.right="showNext"
+    >
+      <div class="poster-lightbox__backdrop" @click="close"></div>
+
+      <div class="poster-lightbox__topbar">
+        <div>
+          <strong>{{ currentImage.alt || '跃动运动馆海报' }}</strong>
+          <small>{{ activeIndex + 1 }} / {{ images.length }}</small>
+        </div>
+        <button type="button" aria-label="关闭全屏海报" @click="close">×</button>
+      </div>
+
+      <button
+        v-if="images.length > 1"
+        class="poster-lightbox__arrow poster-lightbox__arrow--previous"
+        type="button"
+        aria-label="查看上一张海报"
+        @click="showPrevious"
+      >‹</button>
+
+      <div
+        ref="viewport"
+        class="poster-lightbox__viewport"
+        :class="{ 'is-draggable': zoom > 1, 'is-dragging': isDragging }"
+        @wheel.prevent="onWheel"
+        @pointerdown="startDrag"
+        @pointermove="drag"
+        @pointerup="endDrag"
+        @pointercancel="endDrag"
+      >
+        <img
+          ref="posterImage"
+          :src="currentImage.src"
+          :alt="currentImage.alt"
+          :style="{
+            width: fittedSize.width ? `${fittedSize.width}px` : 'auto',
+            height: fittedSize.height ? `${fittedSize.height}px` : 'auto',
+            transform: `translate3d(${offset.x}px, ${offset.y}px, 0) scale(${zoom})`
+          }"
+          draggable="false"
+          @load="fitPosterToViewport"
+          @dblclick="toggleZoom"
+        />
+      </div>
+
+      <button
+        v-if="images.length > 1"
+        class="poster-lightbox__arrow poster-lightbox__arrow--next"
+        type="button"
+        aria-label="查看下一张海报"
+        @click="showNext"
+      >›</button>
+
+      <div class="poster-lightbox__controls" aria-label="海报缩放控制">
+        <button type="button" aria-label="缩小海报" :disabled="zoom <= 1" @click="changeZoom(-0.25)">−</button>
+        <button type="button" class="poster-lightbox__scale" aria-label="恢复原始缩放" @click="resetZoom">
+          {{ zoom === 1 ? '适合屏幕' : `${Math.round(zoom * 100)}%` }}
+        </button>
+        <button type="button" aria-label="放大海报" :disabled="zoom >= 4" @click="changeZoom(0.25)">＋</button>
+      </div>
+    </div>
+  </Teleport>
+</template>
+
+<script setup>
+import { computed, nextTick, onBeforeUnmount, onMounted, reactive, ref } from 'vue';
+
+const props = defineProps({
+  images: { type: Array, default: () => [] }
+});
+
+const activeIndex = ref(-1);
+const lightbox = ref(null);
+const viewport = ref(null);
+const posterImage = ref(null);
+const zoom = ref(1);
+const offset = reactive({ x: 0, y: 0 });
+const fittedSize = reactive({ width: 0, height: 0 });
+const isDragging = ref(false);
+let dragOrigin = null;
+
+const currentImage = computed(() => props.images[activeIndex.value] || {});
+
+const resetZoom = () => {
+  zoom.value = 1;
+  offset.x = 0;
+  offset.y = 0;
+};
+
+const fitPosterToViewport = () => {
+  const frame = viewport.value;
+  const image = posterImage.value;
+  if (!frame || !image?.naturalWidth || !image?.naturalHeight) return;
+
+  const scale = Math.min(
+    frame.clientWidth / image.naturalWidth,
+    frame.clientHeight / image.naturalHeight
+  );
+  fittedSize.width = Math.floor(image.naturalWidth * scale);
+  fittedSize.height = Math.floor(image.naturalHeight * scale);
+};
+
+const open = async (index) => {
+  activeIndex.value = index;
+  resetZoom();
+  document.body.classList.add('poster-lightbox-open');
+  await nextTick();
+  fitPosterToViewport();
+  lightbox.value?.focus();
+};
+
+const close = () => {
+  activeIndex.value = -1;
+  resetZoom();
+  document.body.classList.remove('poster-lightbox-open');
+};
+
+const show = (index) => {
+  activeIndex.value = (index + props.images.length) % props.images.length;
+  resetZoom();
+  nextTick(fitPosterToViewport);
+};
+
+const showPrevious = () => show(activeIndex.value - 1);
+const showNext = () => show(activeIndex.value + 1);
+
+const changeZoom = (amount) => {
+  zoom.value = Math.min(4, Math.max(1, Number((zoom.value + amount).toFixed(2))));
+  if (zoom.value === 1) {
+    offset.x = 0;
+    offset.y = 0;
+  }
+};
+
+const onWheel = (event) => changeZoom(event.deltaY < 0 ? 0.25 : -0.25);
+const toggleZoom = () => {
+  if (zoom.value > 1) resetZoom();
+  else zoom.value = 2;
+};
+
+const startDrag = (event) => {
+  if (zoom.value <= 1) return;
+  isDragging.value = true;
+  dragOrigin = { x: event.clientX - offset.x, y: event.clientY - offset.y };
+  event.currentTarget.setPointerCapture?.(event.pointerId);
+};
+
+const drag = (event) => {
+  if (!isDragging.value || !dragOrigin) return;
+  offset.x = event.clientX - dragOrigin.x;
+  offset.y = event.clientY - dragOrigin.y;
+};
+
+const endDrag = () => {
+  isDragging.value = false;
+  dragOrigin = null;
+};
+
+onMounted(() => window.addEventListener('resize', fitPosterToViewport));
+onBeforeUnmount(() => {
+  window.removeEventListener('resize', fitPosterToViewport);
+  document.body.classList.remove('poster-lightbox-open');
+});
+</script>
diff --git a/src/components/PurchaseChannels.vue b/src/components/PurchaseChannels.vue
new file mode 100644
index 0000000..902f680
--- /dev/null
+++ b/src/components/PurchaseChannels.vue
@@ -0,0 +1,42 @@
+<template>
+  <section class="purchase-channels" :class="{ compact }" aria-label="购买渠道">
+    <div class="purchase-channel-copy">
+      <small>OFFICIAL STORES</small>
+      <h2>购买渠道</h2>
+      <p>前往跃动线上店铺，查看在售产品、规格与最新活动。</p>
+    </div>
+    <div class="purchase-channel-links">
+      <a
+        v-for="channel in channels"
+        :key="channel.name"
+        :href="channel.url"
+        target="_blank"
+        rel="noopener noreferrer"
+        :aria-label="`前往跃动${channel.name}店铺（新窗口打开）`"
+      >
+        <span>{{ channel.code }}</span>
+        <div><small>{{ channel.en }}</small><strong>{{ channel.name }}</strong></div>
+        <b>立即购买 ↗</b>
+      </a>
+    </div>
+  </section>
+</template>
+
+<script setup>
+defineProps({ compact: { type: Boolean, default: false } });
+
+const channels = [
+  {
+    name: '京东',
+    en: 'JD.COM',
+    code: 'JD',
+    url: 'https://mall.jd.com/index-43897.html?from=pc&cid=0'
+  },
+  {
+    name: '淘宝',
+    en: 'TAOBAO · TMALL',
+    code: 'TM',
+    url: 'https://yuedongyundong.tmall.com/shop/view_shop.htm?spm=a21xtw.29978516.0.0'
+  }
+];
+</script>
diff --git a/src/components/SiteFooter.vue b/src/components/SiteFooter.vue
index d67584b..7f7eac7 100644
--- a/src/components/SiteFooter.vue
+++ b/src/components/SiteFooter.vue
@@ -4,9 +4,9 @@
     <div class="footer-orbit footer-orbit-two"></div>
     <div class="footer-inner">
       <div class="footer-brand"><img :src="logoUrl" alt="跃动 YUEDONG" /><p>让世界爱上跳绳</p><small>MAKE THE WORLD LOVE ROPE SKIPPING</small></div>
-      <div><b>探索跃动</b><RouterLink to="/about/brand-story">关于我们</RouterLink><RouterLink to="/products/categories">产品装备</RouterLink></div>
-      <div><b>服务支持</b><RouterLink to="/education/venues">教育培训</RouterLink><RouterLink to="/contact/contact-info">业务合作</RouterLink></div>
-      <div><b>连接我们</b><RouterLink to="/contact/social">社媒矩阵</RouterLink><RouterLink to="/contact/venues">场馆地址</RouterLink></div>
+      <div><b>探索跃动</b><RouterLink to="/about/brand-story">关于跃动</RouterLink><RouterLink to="/sports/competition">跃动体育</RouterLink></div>
+      <div><b>业务版图</b><RouterLink to="/technology">跃动科技</RouterLink><RouterLink to="/health">跃动健康</RouterLink><RouterLink to="/factory/supply-chain">跃动工厂</RouterLink></div>
+      <div><b>连接我们</b><RouterLink to="/ygjrc">YGJRC</RouterLink><RouterLink to="/contact">联系我们</RouterLink></div>
     </div>
     <div class="copyright"><span>© {{ new Date().getFullYear() }} YUEDONG. All rights reserved.</span><span>SHANGHAI · CHINA</span></div>
   </footer>
diff --git a/src/components/SiteHeader.vue b/src/components/SiteHeader.vue
index d20ee07..607a01c 100644
--- a/src/components/SiteHeader.vue
+++ b/src/components/SiteHeader.vue
@@ -4,8 +4,21 @@
       <RouterLink class="brand" to="/" aria-label="跃动首页" @click="closeMenu"><img :src="logoUrl" alt="跃动 YUEDONG" /></RouterLink>
       <nav class="main-nav" aria-label="主导航">
         <div v-for="item in nav" :key="item.label" class="nav-item">
-          <RouterLink :to="item.to" @click="closeMenu"><span>{{ item.label }}</span><i v-if="item.children"></i></RouterLink>
-          <div v-if="item.children" class="dropdown"><span class="dropdown-label">{{ item.label }}</span><RouterLink v-for="child in item.children" :key="child.label" :to="child.to" @click="closeMenu">{{ child.label }}</RouterLink></div>
+          <RouterLink :to="item.to" :class="{ 'section-active': isSectionActive(item) }" @click="closeMenu"><span>{{ item.label }}</span><i v-if="item.children || item.groups"></i></RouterLink>
+          <div v-if="item.children || item.groups" class="dropdown" :class="{ 'dropdown-mega': item.groups }">
+            <span class="dropdown-label">{{ item.label }}</span>
+            <template v-if="item.groups">
+              <div class="dropdown-groups">
+                <section v-for="group in item.groups" :key="group.label" class="dropdown-group">
+                  <RouterLink class="dropdown-group-title" :to="group.to" @click="closeMenu">{{ group.label }}</RouterLink>
+                  <RouterLink v-for="child in group.children" :key="child.label" :to="child.to" @click="closeMenu">{{ child.label }}</RouterLink>
+                </section>
+              </div>
+            </template>
+            <template v-else>
+              <RouterLink v-for="child in item.children" :key="child.label" :to="child.to" @click="closeMenu">{{ child.label }}</RouterLink>
+            </template>
+          </div>
         </div>
       </nav>
       <div class="nav-actions">
@@ -29,6 +42,10 @@ const scrolled = ref(false);
 const headerHidden = ref(false);
 const logoUrl = '/site/assets/logo.png';
 const closeMenu = () => { menuOpen.value = false; };
+const isSectionActive = (item) => {
+  if (item.to === '/') return route.path === '/';
+  return route.path === item.to || route.path.startsWith(`${item.to.split('/').slice(0, 2).join('/')}/`);
+};
 let lastScrollY = 0;
 let scrollFrame = 0;
 
@@ -75,11 +92,52 @@ onUnmounted(() => {
 
 const nav = [
   { label: '首页', to: '/' },
-  { label: '关于跃动', to: '/about/brand-story', children: [{ label: '品牌故事', to: '/about/brand-story' }, { label: '跃动历程', to: '/about/history' }, { label: '动态公告', to: '/about/notices' }] },
-  { label: '赛事资讯', to: '/events/news', children: [{ label: '赛事新闻', to: '/events/news' }, { label: '赛事发布', to: '/events/releases' }, { label: '活动公告', to: '/events/notices' }] },
-  { label: '产品装备', to: '/products/categories', children: [{ label: '装备分类', to: '/products/categories' }, { label: '供应链', to: '/products/supply-chain' }, { label: '开发定制', to: '/products/custom' }] },
-  { label: '教育培训', to: '/education/venues', children: [{ label: '跃动运动馆', to: '/education/venues' }, { label: '寒暑营', to: '/education/camps' }, { label: '训练营', to: '/education/training' }] },
-  { label: '跃动科技', to: '/technology' }, { label: '跃动健康', to: '/health' }, { label: 'YGJRC', to: '/ygjrc' },
-  { label: '联系我们', to: '/contact/social', children: [{ label: '社媒与合作', to: '/contact/social' }, { label: '场馆地址', to: '/contact/venues' }, { label: '联系方式', to: '/contact/contact-info' }] }
+  { label: '关于跃动', to: '/about/brand-story', children: [{ label: '品牌故事', to: '/about/brand-story' }, { label: '跃动历程', to: '/about/history' }, { label: '集团动态', to: '/about/group-news' }] },
+  {
+    label: '跃动体育',
+    to: '/sports/competition',
+    groups: [
+      {
+        label: '竞赛演艺',
+        to: '/sports/competition',
+        children: [
+          { label: '赛事招募', to: '/sports/competition#event-recruitment' },
+          { label: '赛事新闻', to: '/sports/competition#event-news' },
+          { label: '演艺活动', to: '/sports/competition#performances' }
+        ]
+      },
+      {
+        label: '跃动运动馆',
+        to: '/sports/venues',
+        children: [
+          { label: '运动馆介绍', to: '/sports/venues#venue-intro' },
+          { label: '冠军班', to: '/sports/venues#champion-class' },
+          { label: '特色训练营', to: '/sports/venues#camps' },
+          { label: '运动馆地址', to: '/sports/venues#venue-address' }
+        ]
+      },
+      {
+        label: '跃动装备',
+        to: '/sports/equipment',
+        children: [
+          { label: '1阶 启蒙型', to: '/sports/equipment-stage-1' },
+          { label: '2阶 初学型', to: '/sports/equipment-stage-2' },
+          { label: '3阶 提速型', to: '/sports/equipment-stage-3' },
+          { label: '4阶 考测型', to: '/sports/equipment-stage-4' },
+          { label: '5阶 竞技型', to: '/sports/equipment-stage-5' },
+          { label: '校园跳绳', to: '/sports/equipment-campus' },
+          { label: '健身跳绳', to: '/sports/equipment-fitness' },
+          { label: '跳绳鞋服', to: '/sports/equipment-apparel' },
+          { label: '其它周边', to: '/sports/equipment-accessories' },
+          { label: '购买渠道', to: '/sports/purchase-channels' }
+        ]
+      }
+    ]
+  },
+  { label: '跃动科技', to: '/technology' },
+  { label: '跃动健康', to: '/health' },
+  { label: '跃动工厂', to: '/factory/supply-chain', children: [{ label: '供应链', to: '/factory/supply-chain' }, { label: 'KA定制', to: '/factory/ka-custom' }] },
+  { label: 'YGJRC', to: '/ygjrc' },
+  { label: '联系我们', to: '/contact' }
 ];
 </script>
diff --git a/src/components/SportsGroupedSection.vue b/src/components/SportsGroupedSection.vue
new file mode 100644
index 0000000..9132ca2
--- /dev/null
+++ b/src/components/SportsGroupedSection.vue
@@ -0,0 +1,177 @@
+<template>
+  <div class="sports-grouped-layout">
+    <aside class="sports-side-nav">
+      <small>{{ mode === 'competition' ? 'COMPETITION & PERFORMANCE' : 'YOUTH SPORTS VENUES' }}</small>
+      <nav :aria-label="`${title}页面导航`">
+        <a
+          v-for="(item, index) in navigation"
+          :key="item.id"
+          :href="`#${item.id}`"
+          :class="{ active: activeSection === item.id }"
+          @click.prevent="navigateToSection(item.id)"
+        >
+          <span>{{ String(index + 1).padStart(2, '0') }}</span>{{ item.label }}
+        </a>
+      </nav>
+    </aside>
+
+    <div v-if="mode === 'competition'" class="sports-grouped-content">
+      <section
+        v-for="panel in competitionPanels"
+        :id="panel.id"
+        :key="panel.id"
+        :ref="setSectionRef"
+        class="sports-grouped-section"
+      >
+        <header class="sports-grouped-heading">
+          <small>{{ panel.eyebrow }}</small>
+          <h2>{{ panel.label }}</h2>
+          <p>{{ panel.description }}</p>
+        </header>
+
+        <div v-if="panel.content.articles?.length" class="article-list sports-grouped-articles">
+          <RouterLink
+            v-for="(article, index) in panel.content.articles"
+            :key="`${panel.id}-${article.title}`"
+            :to="`/detail/sports/${panel.id}/${index}`"
+          >
+            <div class="article-no">{{ String(index + 1).padStart(2, '0') }}</div>
+            <div><h3>{{ article.title }}</h3><p v-for="line in article.body.slice(0, 2)" :key="line">{{ line }}</p></div>
+          </RouterLink>
+        </div>
+
+        <div v-else class="sports-performance-block">
+          <div class="prose"><p v-for="line in panel.content.body" :key="line">{{ line }}</p></div>
+          <div class="sports-grouped-gallery">
+            <img
+              v-for="image in panel.content.gallery?.slice(0, 6)"
+              :key="image.src"
+              :src="image.src"
+              :alt="image.alt"
+              loading="lazy"
+            />
+          </div>
+        </div>
+      </section>
+    </div>
+
+    <div v-else class="sports-grouped-content">
+      <section id="venue-intro" :ref="setSectionRef" class="sports-grouped-section">
+        <header class="sports-grouped-heading">
+          <small>VENUE INTRODUCTION</small><h2>运动馆介绍</h2>
+          <p>了解跃动运动馆的品牌体系、课程理念与全国布局。</p>
+        </header>
+        <SportsHallSection />
+      </section>
+
+      <section id="champion-class" :ref="setSectionRef" class="sports-grouped-section">
+        <header class="sports-grouped-heading">
+          <small>CHAMPION CLASS</small><h2>冠军班</h2>
+          <p>由专业教练团队打造的进阶竞技培养课程。</p>
+        </header>
+        <div class="sports-text-gallery">
+          <div class="prose"><p v-for="line in venueSections['champion-class'].body" :key="line">{{ line }}</p></div>
+          <PosterGallery :images="venueSections['champion-class'].gallery" />
+        </div>
+      </section>
+
+      <section id="camps" :ref="setSectionRef" class="sports-grouped-section">
+        <header class="sports-grouped-heading">
+          <small>FEATURED CAMPS</small><h2>特色训练营</h2>
+          <p>围绕假期集训、体测培优和专项突破开展主题课程。</p>
+        </header>
+        <div class="sports-text-gallery">
+          <div class="prose"><p v-for="line in venueSections.camps.body" :key="line">{{ line }}</p></div>
+          <PosterGallery :images="venueSections.camps.gallery" />
+        </div>
+      </section>
+
+      <section id="venue-address" :ref="setSectionRef" class="sports-grouped-section">
+        <header class="sports-grouped-heading">
+          <small>VENUE NETWORK</small><h2>运动馆地址</h2>
+          <p>按城市查找全国跃动运动馆及合作场馆。</p>
+        </header>
+        <VenueAddressSection />
+      </section>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { computed, onBeforeUnmount, onMounted, ref } from 'vue';
+import { useRouter } from 'vue-router';
+import { pages } from '../data/page-content.js';
+import PosterGallery from './PosterGallery.vue';
+import SportsHallSection from './SportsHallSection.vue';
+import VenueAddressSection from './VenueAddressSection.vue';
+
+const props = defineProps({
+  mode: { type: String, required: true }
+});
+
+const router = useRouter();
+const activeSection = ref('');
+const sectionElements = [];
+let observer;
+
+const competitionPanels = computed(() => [
+  {
+    id: 'event-recruitment',
+    label: '赛事招募',
+    eyebrow: 'EVENT REGISTRATION',
+    description: '汇集跃动旗下赛事报名、参赛通知与活动信息。',
+    content: pages.sports.sections['event-recruitment']
+  },
+  {
+    id: 'event-news',
+    label: '赛事新闻',
+    eyebrow: 'EVENT NEWS',
+    description: '关注专业赛事、城市活动与青少年运动员的最新动态。',
+    content: pages.sports.sections['event-news']
+  },
+  {
+    id: 'performances',
+    label: '演艺活动',
+    eyebrow: 'PERFORMANCE',
+    description: '冠军团队、花样跳绳与大型活动演出服务。',
+    content: pages.sports.sections.performances
+  }
+]);
+
+const venueSections = pages.sports.sections;
+const navigation = computed(() => props.mode === 'competition'
+  ? competitionPanels.value.map(({ id, label }) => ({ id, label }))
+  : [
+      { id: 'venue-intro', label: '运动馆介绍' },
+      { id: 'champion-class', label: '冠军班' },
+      { id: 'camps', label: '特色训练营' },
+      { id: 'venue-address', label: '运动馆地址' }
+    ]);
+const title = computed(() => props.mode === 'competition' ? '竞赛演艺' : '跃动运动馆');
+
+const setSectionRef = (element) => {
+  if (element && !sectionElements.includes(element)) sectionElements.push(element);
+};
+
+const navigateToSection = async (sectionId) => {
+  const target = document.getElementById(sectionId);
+  if (!target) return;
+
+  activeSection.value = sectionId;
+  await router.replace({ hash: `#${sectionId}` });
+  target.scrollIntoView({ behavior: 'smooth', block: 'start' });
+};
+
+onMounted(() => {
+  activeSection.value = location.hash.slice(1) || navigation.value[0].id;
+  observer = new IntersectionObserver((entries) => {
+    const visible = entries
+      .filter((entry) => entry.isIntersecting)
+      .sort((a, b) => b.intersectionRatio - a.intersectionRatio)[0];
+    if (visible) activeSection.value = visible.target.id;
+  }, { rootMargin: '-18% 0px -62% 0px', threshold: [0, 0.1, 0.3] });
+  sectionElements.forEach((element) => observer.observe(element));
+});
+
+onBeforeUnmount(() => observer?.disconnect());
+</script>
diff --git a/src/components/VenueAddressSection.vue b/src/components/VenueAddressSection.vue
new file mode 100644
index 0000000..3f2cf4e
--- /dev/null
+++ b/src/components/VenueAddressSection.vue
@@ -0,0 +1,63 @@
+<template>
+  <div class="venue-directory">
+    <p v-reveal class="venue-summary">
+      场馆按城市平铺展示，便于快速查找附近的跃动运动馆。门店信息可能调整，到访前可通过“联系我们”确认。
+    </p>
+    <div v-for="city in venueGroups" :key="city.city" class="venue-city">
+      <div v-reveal class="venue-city-title">
+        <span>{{ city.en }}</span>
+        <h3>{{ city.city }}</h3>
+        <b>{{ city.venues.length }} 家场馆</b>
+      </div>
+      <div class="venue-grid">
+        <a
+          v-for="(venue, index) in city.venues"
+          :key="venue.name"
+          v-reveal
+          :href="mapNavigationUrl(city.city, venue)"
+          :aria-label="`使用高德地图导航到${mapVenueName(venue)}`"
+          target="_blank"
+          rel="noopener noreferrer"
+          :style="{ '--delay': `${(index % 4) * 55}ms` }"
+        >
+          <span class="venue-pin"></span>
+          <div>
+            <h4>{{ mapVenueName(venue) }}</h4>
+            <p>{{ venue.address }}</p>
+            <b class="venue-map-link">地图导航 <span>→</span></b>
+          </div>
+        </a>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { venueGroups } from '../data/venue-groups.js';
+
+const mapVenueName = (venue) => `跃动运动馆（${venue.name}）`;
+
+const mapNavigationUrl = (city, venue) => {
+  const params = new URLSearchParams({
+    keyword: `${mapVenueName(venue)} ${venue.address}`,
+    city,
+    view: 'map',
+    src: 'yuedong-sports',
+    callnative: '1'
+  });
+  return `https://uri.amap.com/search?${params.toString()}`;
+};
+
+const vReveal = {
+  mounted(el) {
+    el.classList.add('reveal');
+    const observer = new IntersectionObserver(([entry]) => {
+      if (entry.isIntersecting) {
+        el.classList.add('is-visible');
+        observer.disconnect();
+      }
+    }, { threshold: 0.1 });
+    observer.observe(el);
+  }
+};
+</script>
diff --git a/src/data/page-content.js b/src/data/page-content.js
index 4a9b289..b67d470 100644
--- a/src/data/page-content.js
+++ b/src/data/page-content.js
@@ -144,7 +144,6 @@ export const pages = {
 };
 
 pages.about.sections['brand-story'].body = brandIntroduction;
-pages.about.sections['brand-story'].timeline = aboutTimeline;
 pages.about.sections.history.body = [];
 pages.about.sections.history.timeline = aboutTimeline;
 
@@ -171,3 +170,149 @@ Object.assign(pages.education.sections.venues, {
     { src: '/sports-hall/competition-collage.png', alt: '学员训练与比赛精彩瞬间' }
   ]
 });
+
+// 官网栏目结构以《跃动官网.xmind》为准。旧的 events / products /
+// education 数据继续作为内容源，新的 sports / factory 页面负责对外呈现。
+pages.about.tabs = [
+  { key: 'brand-story', label: '品牌故事' },
+  { key: 'history', label: '跃动历程' },
+  { key: 'group-news', label: '集团动态' }
+];
+pages.about.sections['group-news'] = {
+  ...pages.about.sections.notices,
+  title: '集团动态'
+};
+
+const eventImages = images('赛事资讯');
+const educationImages = images('教育培训');
+const productHero = materials.products.find((product) => product.image)?.image;
+const productsIn = (...categories) => productDetails.filter((product) => categories.includes(product.category));
+const overviewCard = (title, description, to) => ({ title, body: [description], to });
+
+pages.sports = {
+  eyebrow: 'YUEDONG SPORTS',
+  title: '跃动体育',
+  summary: '连接竞赛演艺、跃动运动馆与专业装备，构建覆盖赛事、培训和运动消费的体育服务体系。',
+  hero: pages.events.hero,
+  tabs: [
+    { key: 'competition', label: '竞赛演艺' },
+    { key: 'venues', label: '跃动运动馆' },
+    { key: 'equipment', label: '跃动装备' }
+  ],
+  sections: {
+    competition: {
+      title: '竞赛演艺',
+      body: ['以专业赛事运营、青少年竞赛和冠军团队演艺为核心，让跳绳运动连接城市、校园与大众舞台。'],
+      gallery: eventImages.slice(0, 5),
+      cards: [
+        overviewCard('赛事招募', '汇集跃动旗下赛事报名、参赛通知与活动信息。', '/sports/competition#event-recruitment'),
+        overviewCard('赛事新闻', '关注专业赛事、城市活动与青少年运动员的最新动态。', '/sports/competition#event-news'),
+        overviewCard('演艺活动', '冠军团队、花样跳绳与大型活动演出服务。', '/sports/competition#performances')
+      ]
+    },
+    'event-recruitment': {
+      ...pages.events.sections.releases,
+      parent: 'competition',
+      title: '赛事招募'
+    },
+    'event-news': {
+      ...pages.events.sections.news,
+      parent: 'competition',
+      title: '赛事新闻'
+    },
+    performances: {
+      parent: 'competition',
+      title: '演艺活动',
+      body: ['跃动冠军团队将竞技实力、花样创意与舞台表达融为一体，为体育赛事、品牌活动、校园庆典和城市文化项目提供专业演艺服务。'],
+      gallery: eventImages.slice(20, 32)
+    },
+    venues: {
+      parent: 'venues',
+      title: '跃动运动馆',
+      body: ['跃动运动馆以跳绳为核心，融合体适能、专项技能和成长训练，为青少年提供科学、系统、可持续的运动课程。'],
+      gallery: educationImages.slice(0, 4),
+      cards: [
+        overviewCard('运动馆介绍', '了解跃动运动馆的品牌体系、课程理念与全国布局。', '/sports/venues#venue-intro'),
+        overviewCard('冠军班', '由专业教练团队打造的进阶竞技培养课程。', '/sports/venues#champion-class'),
+        overviewCard('特色训练营', '围绕假期集训、体测培优和专项突破开展主题课程。', '/sports/venues#camps'),
+        overviewCard('运动馆地址', '查找全国跃动运动馆及合作场馆。', '/sports/venues#venue-address')
+      ]
+    },
+    'venue-intro': {
+      ...pages.education.sections.venues,
+      parent: 'venues',
+      title: '运动馆介绍'
+    },
+    'champion-class': {
+      parent: 'venues',
+      title: '冠军班',
+      body: [
+        '冠军班面向具备专项基础、希望进一步提升竞技能力的学员，围绕速度、耐力、花样与临场表现进行系统训练。',
+        '课程通过阶段测评、训练计划和赛事实践，帮助学员建立稳定技术、竞赛意识和长期成长目标。'
+      ],
+      gallery: educationImages.slice(0, 4)
+    },
+    camps: {
+      ...pages.education.sections.camps,
+      parent: 'venues',
+      title: '特色训练营'
+    },
+    'venue-address': {
+      parent: 'venues',
+      title: '运动馆地址'
+    },
+    equipment: {
+      parent: 'equipment',
+      title: '跃动分阶跳绳',
+      products: productDetails
+    },
+    'equipment-stage-1': { parent: 'equipment', title: '1阶 · 启蒙型', products: productsIn('竹节跳绳') },
+    'equipment-stage-2': { parent: 'equipment', title: '2阶 · 初学型', products: productsIn('分段跳绳') },
+    'equipment-stage-3': { parent: 'equipment', title: '3阶 · 提速型', products: productsIn('胶绳') },
+    'equipment-stage-4': { parent: 'equipment', title: '4阶 · 考测型', products: productsIn('电子计数跳绳') },
+    'equipment-stage-5': { parent: 'equipment', title: '5阶 · 竞技型', products: productsIn('速度跳绳', '交互绳') },
+    'equipment-campus': { parent: 'equipment', title: '校园跳绳', products: productsIn('分段跳绳', '电子计数跳绳') },
+    'equipment-fitness': { parent: 'equipment', title: '健身跳绳', products: productsIn('健身跳绳') },
+    'equipment-apparel': {
+      parent: 'equipment',
+      title: '跳绳鞋服',
+      body: ['围绕日常训练、竞赛和团队形象需求，逐步完善专业跳绳鞋服产品体系。'],
+      gallery: productHero ? [{ src: productHero, alt: '跃动跳绳鞋服与装备' }] : []
+    },
+    'equipment-accessories': {
+      parent: 'equipment',
+      title: '其它周边',
+      body: ['提供与跳绳训练、赛事组织和团队活动配套的周边产品及组合方案。'],
+      gallery: images('产品装备').slice(0, 4)
+    },
+    'purchase-channels': {
+      parent: 'equipment',
+      title: '购买渠道',
+      body: ['跃动产品可通过官方社媒、电商平台、线下运动馆及团体采购渠道了解与购买。'],
+      cards: [overviewCard('联系装备服务', '获取产品选型、团体采购和购买渠道支持。', '/contact/contact-info')]
+    }
+  }
+};
+
+pages.technology.sections.default.title = '1+4+N 智慧体育解决方案';
+
+pages.factory = {
+  eyebrow: 'YUEDONG FACTORY',
+  title: '跃动工厂',
+  summary: '以稳定供应链、研发制造与定制服务，为品牌、赛事、学校和机构提供专业装备解决方案。',
+  hero: images('产品装备')[0] || (productHero ? { src: productHero, alt: '跃动工厂' } : null),
+  tabs: [
+    { key: 'supply-chain', label: '供应链' },
+    { key: 'ka-custom', label: 'KA定制' }
+  ],
+  sections: {
+    'supply-chain': {
+      ...pages.products.sections['supply-chain'],
+      title: '供应链'
+    },
+    'ka-custom': {
+      ...pages.products.sections.custom,
+      title: 'KA定制'
+    }
+  }
+};
diff --git a/src/data/venue-groups.js b/src/data/venue-groups.js
new file mode 100644
index 0000000..7c70080
--- /dev/null
+++ b/src/data/venue-groups.js
@@ -0,0 +1,82 @@
+export const venueGroups = [
+  {
+    city: '上海',
+    en: 'SHANGHAI',
+    venues: [
+      { name: '杨浦翔殷馆', address: '上海市杨浦区翔殷路260号' },
+      { name: '杨浦新江湾运动健康中心馆', address: '上海市杨浦区国浩路701号201室' },
+      { name: '宝山高境三邻桥馆', address: '上海市宝山区江杨南路485号三邻桥体育文化园11号101B室' },
+      { name: '宝山体育中心馆', address: '上海市宝山区永清路700号体育中心内' },
+      { name: '闵行七宝宝龙广场馆', address: '上海市闵行区漕宝路3299弄七宝宝龙广场3楼' },
+      { name: '浦东金桥馆', address: '上海市浦东新区金藏路1296弄151号2楼2027室' },
+      { name: '静安盛源生活广场馆', address: '上海市静安区柳营路777号盛源生活广场2楼' },
+      { name: '静安889GLO广场馆', address: '上海市静安区万航渡路889号889广场3楼' },
+      { name: '闵行力波馆', address: '上海市闵行区虹梅南路379弄27号力波九坊' },
+      { name: '浦东恒生万鹂广场馆', address: '上海市浦东新区芳甸路115弄恒生万鹂广场' },
+      { name: '虹口瑞虹星星堂馆', address: '上海市虹口区天宝路280弄瑞虹天地星星堂' },
+      { name: '普陀曹杨复悦荟馆', address: '上海市普陀区曹杨路1888号复悦荟3楼' },
+      { name: '青浦区跃动青少儿运动健康促进中心', address: '上海市青浦区淀山湖路535号4楼' }
+    ]
+  },
+  {
+    city: '北京',
+    en: 'BEIJING',
+    venues: [
+      { name: '西城官园馆', address: '北京市西城区西直门南小街2号楼B1-103' },
+      { name: '丰台草桥馆', address: '北京市丰台区草桥欣园一区5号楼2楼260室' },
+      { name: '西城马连道馆', address: '北京市西城区马连道街华睦大厦' },
+      { name: '东城崇文门馆', address: '北京市东城区崇文门区域' },
+      { name: '西城西便门馆', address: '北京市西城区西便门区域' },
+      { name: '朝阳大郊亭馆', address: '北京市朝阳区大郊亭华腾新天地运动中心' }
+    ]
+  },
+  {
+    city: '天津',
+    en: 'TIANJIN',
+    venues: [
+      { name: '天津南开馆', address: '天津市南开区宾川道507号' },
+      { name: '天津和平馆', address: '天津市和平区人民体育馆区域' }
+    ]
+  },
+  {
+    city: '广州',
+    en: 'GUANGZHOU',
+    venues: [
+      { name: '天河林和东馆', address: '广州市天河区林和东路218号2楼自编03室' },
+      { name: '海珠广纸天地荟馆', address: '广州市海珠区工业大道广纸天地荟207-208' }
+    ]
+  },
+  {
+    city: '徐州',
+    en: 'XUZHOU',
+    venues: [
+      { name: '经开淮海环球港馆', address: '徐州市经开区淮海环球港L2096' },
+      { name: '鼓楼金地商都馆', address: '徐州市鼓楼区中山北路6号金地商都' }
+    ]
+  },
+  {
+    city: '合肥',
+    en: 'HEFEI',
+    venues: [
+      { name: '庐阳华润橡树湾馆', address: '合肥市庐阳区华润橡树湾商业区' },
+      { name: '包河馆', address: '合肥市包河区安徽省运动健康促进中心2楼' }
+    ]
+  },
+  {
+    city: '成都',
+    en: 'CHENGDU',
+    venues: [
+      { name: '武侯莱蒙都会馆', address: '成都市武侯区二环路南四段51号莱蒙都会商场4楼' }
+    ]
+  },
+  {
+    city: '加盟场馆',
+    en: 'FRANCHISE VENUES',
+    venues: [
+      { name: '松江大学城馆', address: '上海市松江区梅家浜路1501号3楼' },
+      { name: '广西南宁馆', address: '南宁市青秀区星湖路1号' },
+      { name: '江西信丰馆', address: '赣州市信丰县体育中心内' },
+      { name: '江西上饶馆', address: '上饶市广信区旭日街道武夷山大道博华年华北区2栋111-113' }
+    ]
+  }
+];
diff --git a/src/router.js b/src/router.js
index 16b39e3..6bf5224 100644
--- a/src/router.js
+++ b/src/router.js
@@ -1,4 +1,4 @@
-import { createRouter, createWebHashHistory, createWebHistory } from 'vue-router';
+import { createRouter, createWebHashHistory } from 'vue-router';
 import HomePage from './views/HomePage.vue';
 import ContentPage from './views/ContentPage.vue';
 import ContentDetailPage from './views/ContentDetailPage.vue';
@@ -7,27 +7,56 @@ import ContactPage from './views/ContactPage.vue';
 
 const routes = [
   { path: '/', name: 'home', component: HomePage },
+  { path: '/about/notices', redirect: '/about/group-news' },
   { path: '/about/:section?', component: ContentPage, meta: { page: 'about' } },
-  { path: '/events/:section?', component: ContentPage, meta: { page: 'events' } },
-  { path: '/products/:section?', component: ContentPage, meta: { page: 'products' } },
-  { path: '/education/:section?', component: ContentPage, meta: { page: 'education' } },
+  { path: '/sports/equipment/detail/:id', name: 'sports-product-detail', component: ProductDetailPage, meta: { page: 'sports' } },
+  { path: '/sports/event-recruitment', redirect: '/sports/competition#event-recruitment' },
+  { path: '/sports/event-news', redirect: '/sports/competition#event-news' },
+  { path: '/sports/performances', redirect: '/sports/competition#performances' },
+  { path: '/sports/venue-intro', redirect: '/sports/venues#venue-intro' },
+  { path: '/sports/champion-class', redirect: '/sports/venues#champion-class' },
+  { path: '/sports/camps', redirect: '/sports/venues#camps' },
+  { path: '/sports/venue-address', redirect: '/sports/venues#venue-address' },
+  { path: '/sports/:section?', component: ContentPage, meta: { page: 'sports' } },
   { path: '/technology', component: ContentPage, meta: { page: 'technology' } },
   { path: '/health', component: ContentPage, meta: { page: 'health' } },
+  { path: '/factory/:section?', component: ContentPage, meta: { page: 'factory' } },
   { path: '/ygjrc', component: ContentPage, meta: { page: 'ygjrc' } },
+  { path: '/contact/venues', redirect: '/sports/venues#venue-address' },
   { path: '/contact/:section?', component: ContactPage, meta: { page: 'contact' } },
   { path: '/products/detail/:id', name: 'product-detail', component: ProductDetailPage, meta: { page: 'products' } },
+  {
+    path: '/events/:section?',
+    redirect: (to) => ({
+      news: '/sports/competition#event-news',
+      releases: '/sports/competition#event-recruitment',
+      notices: '/sports/competition#performances'
+    })[to.params.section] || '/sports/competition'
+  },
+  {
+    path: '/products/:section?',
+    redirect: (to) => `/sports/${({ categories: 'equipment', 'supply-chain': 'equipment', custom: 'purchase-channels' })[to.params.section] || 'equipment'}`
+  },
+  {
+    path: '/education/:section?',
+    redirect: (to) => ({
+      venues: '/sports/venues#venue-intro',
+      camps: '/sports/venues#camps',
+      training: '/sports/venues#champion-class'
+    })[to.params.section] || '/sports/venues'
+  },
   { path: '/detail/:page/:section/:index?', name: 'content-detail', component: ContentDetailPage },
   { path: '/:pathMatch(.*)*', redirect: '/' }
 ];
 
 export default createRouter({
-  history: import.meta.env.VITE_STATIC_DEPLOY === 'oss'
-    ? createWebHashHistory()
-    : createWebHistory(),
+  history: createWebHashHistory(),
   routes,
   scrollBehavior(to, from, savedPosition) {
     if (savedPosition) return savedPosition;
 
+    if (to.hash) return { el: to.hash, top: 138, behavior: 'smooth' };
+
     if (to.name === 'product-detail' || to.name === 'content-detail') {
       return { top: 0 };
     }
diff --git a/src/style.css b/src/style.css
index c8ff6d3..d0a1af1 100644
--- a/src/style.css
+++ b/src/style.css
@@ -48,8 +48,8 @@ main { min-height: 72vh; }
 .nav-item > a i { width: 5px; height: 5px; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; transform: translateY(-2px) rotate(45deg); transition: transform .25s; }
 .nav-item:hover > a i { transform: translateY(1px) rotate(225deg); }
 .nav-item > a::after { content: ""; position: absolute; left: 50%; right: 50%; bottom: -1px; height: 3px; border-radius: 3px 3px 0 0; background: linear-gradient(90deg, var(--blue-500), var(--blue-700)); transition: left .3s ease, right .3s ease; }
-.nav-item:hover > a, .nav-item > a.router-link-active { color: var(--blue-700); }
-.nav-item:hover > a::after, .nav-item > a.router-link-active::after { left: 14px; right: 14px; }
+.nav-item:hover > a, .nav-item > a.router-link-active, .nav-item > a.section-active { color: var(--blue-700); }
+.nav-item:hover > a::after, .nav-item > a.router-link-active::after, .nav-item > a.section-active::after { left: 14px; right: 14px; }
 .dropdown {
   position: absolute; top: 72px; left: 50%; width: 190px; padding: 12px;
   background: rgba(255,255,255,.97); border: 1px solid rgba(0,144,255,.14); border-radius: 14px;
@@ -63,6 +63,13 @@ main { min-height: 72vh; }
 .dropdown a::before { content: ""; position: absolute; left: 10px; top: 50%; width: 5px; height: 5px; border-radius: 50%; background: var(--blue-300); transform: translateY(-50%); transition: .22s; }
 .dropdown a:hover, .dropdown a.router-link-active { color: var(--blue-700); background: var(--blue-50); transform: translateX(3px); }
 .dropdown a:hover::before { background: var(--blue-600); box-shadow: 0 0 0 4px rgba(0,144,255,.12); }
+.dropdown-mega { width: min(820px,calc(100vw - 48px)); padding: 18px; }
+.dropdown-groups { display: grid; grid-template-columns: .85fr 1fr 1.45fr; gap: 12px; }
+.dropdown-group { min-width: 0; padding: 6px; border-radius: 11px; background: #f8fbff; }
+.dropdown .dropdown-group-title { margin: 0 0 5px; padding: 11px 12px; color: var(--blue-800); background: #eaf6ff; font-size: 14px; font-weight: 800; }
+.dropdown .dropdown-group-title::before { display: none; }
+.dropdown .dropdown-group-title:hover { transform: none; }
+.dropdown-group a:not(.dropdown-group-title) { padding-top: 8px; padding-bottom: 8px; font-size: 13px; }
 .nav-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; }
 .language-switch { height: 38px; display: inline-grid; grid-template-columns: repeat(2,34px); align-items: center; padding: 3px; border: 1px solid rgba(0,144,255,.2); border-radius: 20px; background: var(--blue-50); box-shadow: inset 0 0 0 1px rgba(255,255,255,.7); }
 .language-switch span,.language-switch a { height: 30px; display: grid; place-items: center; border-radius: 16px; font-size: 11px; font-weight: 800; letter-spacing: .4px; transition: color .25s ease, background .25s ease, transform .25s ease, box-shadow .25s ease; }
@@ -288,7 +295,6 @@ main { min-height: 72vh; }
 .hero-orbit-two { right: 105px; top: 110px; width: 190px; height: 190px; opacity: .14; animation-direction: reverse; animation-duration: 11s; }
 @keyframes orbit { to { transform: rotate(360deg); } }
 .hero-copy { position: relative; z-index: 1; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; color: #fff; }
-.hero-index { position: absolute; right: 3%; bottom: -24px; color: rgba(255,255,255,.07); font-size: clamp(100px, 14vw, 185px); font-weight: 900; line-height: 1; letter-spacing: -8px; user-select: none; }
 .hero-copy > span { display: flex; align-items: center; gap: 12px; color: rgba(255,255,255,.72); font-size: 10px; font-weight: 800; letter-spacing: 4px; }
 .hero-copy > span::before { content: ""; width: 38px; height: 2px; background: var(--blue-300); }
 .hero-copy h1 { margin: 11px 0 13px; max-width: 900px; font-size: clamp(40px, 5vw, 68px); line-height: 1.06; letter-spacing: -3px; text-shadow: 0 12px 38px rgba(0,0,0,.2); }
@@ -310,8 +316,7 @@ main { min-height: 72vh; }
 /* Inner content */
 .content-page { background: linear-gradient(180deg,#fff 0,var(--blue-50) 100%); padding-top: 76px; }
 .content { padding: 96px 0 128px; }
-.section-heading { display: grid; grid-template-columns: 62px auto 1fr; align-items: center; gap: 20px; margin-bottom: 52px; }
-.section-heading > span { width: 62px; height: 62px; display: grid; place-items: center; color: #fff; border-radius: 18px 4px 18px 4px; background: linear-gradient(145deg,var(--blue-500),var(--blue-800)); box-shadow: 0 12px 28px rgba(8,120,232,.23); font-size: 18px; font-weight: 900; }
+.section-heading { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 20px; margin-bottom: 52px; }
 .section-heading small { color: var(--blue-600); font-size: 10px; font-weight: 800; letter-spacing: 3px; }
 .section-heading h2 { margin: 7px 0 0; font-size: clamp(30px,4vw,46px); letter-spacing: -2px; }
 .section-heading i { height: 1px; margin-left: 20px; background: linear-gradient(90deg,var(--line),transparent); }
@@ -370,6 +375,81 @@ main { min-height: 72vh; }
 .category-filters button { padding: 10px 16px; color: #587087; border: 0; border-radius: 10px; background: var(--blue-50); cursor: pointer; transition: .25s; }
 .category-filters button:hover, .category-filters button.active { color: #fff; background: linear-gradient(135deg,var(--blue-500),var(--blue-700)); box-shadow: 0 8px 20px rgba(8,120,232,.2); }
 .product-toolbar > span { flex: 0 0 auto; color: var(--muted); font-size: 12px; }
+.product-pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 9px; margin: 48px 0 0; }
+.product-pagination button { min-width: 42px; height: 42px; padding: 0 12px; color: #526b83; border: 1px solid rgba(8,120,232,.14); border-radius: 11px 3px 11px 3px; background: #fff; box-shadow: 0 8px 22px rgba(4,67,128,.06); cursor: pointer; font-weight: 750; transition: .25s ease; }
+.product-pagination button:hover:not(:disabled),.product-pagination button.active { color: #fff; border-color: transparent; background: linear-gradient(145deg,var(--blue-500),var(--blue-800)); box-shadow: 0 10px 25px rgba(8,120,232,.24); transform: translateY(-2px); }
+.product-pagination button:disabled { opacity: .35; cursor: not-allowed; }
+.purchase-channels { display: grid; grid-template-columns: minmax(260px,.7fr) minmax(0,1.3fr); gap: 46px; align-items: center; margin-top: 68px; padding: 42px 46px; overflow: hidden; color: #fff; border-radius: 28px 7px 28px 7px; background: linear-gradient(135deg,#005eae,#0090ff 68%,#42b5ff); box-shadow: 0 26px 65px rgba(0,88,167,.2); }
+.purchase-channel-copy small { color: rgba(255,255,255,.66); font-size: 10px; font-weight: 850; letter-spacing: 3px; }
+.purchase-channel-copy h2 { margin: 9px 0 12px; font-size: clamp(30px,3.5vw,44px); }
+.purchase-channel-copy p { max-width: 420px; margin: 0; color: rgba(255,255,255,.76); font-size: 14px; line-height: 1.8; }
+.purchase-channel-links { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
+.purchase-channel-links a { display: grid; grid-template-columns: 48px minmax(0,1fr); gap: 16px; align-items: center; min-height: 118px; padding: 20px; color: var(--ink); border: 1px solid rgba(255,255,255,.5); border-radius: 18px 5px 18px 5px; background: rgba(255,255,255,.94); box-shadow: 0 14px 34px rgba(0,66,126,.16); transition: transform .3s ease, box-shadow .3s ease, background .3s ease; }
+.purchase-channel-links a:hover { color: var(--ink); background: #fff; box-shadow: 0 22px 44px rgba(0,57,112,.24); transform: translateY(-5px); }
+.purchase-channel-links a > span { width: 48px; height: 48px; display: grid; place-items: center; color: #fff; border-radius: 14px 4px 14px 4px; background: linear-gradient(145deg,var(--blue-500),var(--blue-800)); font-size: 13px; font-weight: 900; }
+.purchase-channel-links small { display: block; color: var(--blue-600); font-size: 9px; font-weight: 800; letter-spacing: 1.5px; }
+.purchase-channel-links strong { display: block; margin-top: 4px; font-size: 20px; }
+.purchase-channel-links b { grid-column: 2; color: var(--blue-700); font-size: 11px; }
+.purchase-channels.compact { display: block; margin: 28px 0 18px; padding: 18px; color: var(--ink); border: 1px solid rgba(8,120,232,.12); border-radius: 16px 4px 16px 4px; background: linear-gradient(145deg,#fff,var(--blue-50)); box-shadow: 0 12px 28px rgba(0,83,155,.07); }
+.purchase-channels.compact .purchase-channel-copy { margin-bottom: 12px; }
+.purchase-channels.compact .purchase-channel-copy > small,.purchase-channels.compact .purchase-channel-copy p { display: none; }
+.purchase-channels.compact .purchase-channel-copy h2 { margin: 0; color: var(--ink); font-size: 17px; }
+.purchase-channels.compact .purchase-channel-links { gap: 9px; }
+.purchase-channels.compact .purchase-channel-links a { grid-template-columns: 36px minmax(0,1fr); gap: 10px; min-height: 76px; padding: 10px 12px; border-color: rgba(8,120,232,.13); box-shadow: none; }
+.purchase-channels.compact .purchase-channel-links a > span { width: 36px; height: 36px; border-radius: 10px 3px 10px 3px; font-size: 10px; }
+.purchase-channels.compact .purchase-channel-links small { display: none; }
+.purchase-channels.compact .purchase-channel-links strong { margin: 0; font-size: 15px; }
+.purchase-channels.compact .purchase-channel-links b { font-size: 9px; }
+
+/* Single-page sports business sections */
+.sports-grouped-layout { display: grid; grid-template-columns: 210px minmax(0,1fr); gap: 54px; align-items: start; }
+.sports-side-nav { position: sticky; top: calc(var(--header-offset) + 92px); z-index: 25; padding: 24px 18px; border: 1px solid rgba(8,120,232,.12); border-radius: 20px 5px 20px 5px; background: rgba(255,255,255,.94); box-shadow: 0 18px 42px rgba(2,62,119,.09); backdrop-filter: blur(16px); }
+.sports-side-nav > small { display: block; margin: 0 8px 14px; color: var(--blue-600); font-size: 9px; font-weight: 850; letter-spacing: 2px; line-height: 1.6; }
+.sports-side-nav nav { display: grid; gap: 7px; }
+.sports-side-nav a { display: grid; grid-template-columns: 28px minmax(0,1fr); gap: 9px; align-items: center; padding: 12px 10px; color: #587087; border-radius: 11px 3px 11px 3px; font-size: 13px; font-weight: 700; transition: .25s ease; }
+.sports-side-nav a span { color: var(--blue-400); font-size: 10px; font-weight: 900; }
+.sports-side-nav a:hover,.sports-side-nav a.active { color: #fff; background: linear-gradient(145deg,var(--blue-500),var(--blue-800)); box-shadow: 0 10px 24px rgba(8,120,232,.22); transform: translateX(3px); }
+.sports-side-nav a:hover span,.sports-side-nav a.active span { color: rgba(255,255,255,.7); }
+.sports-grouped-content { min-width: 0; }
+.sports-grouped-section { scroll-margin-top: calc(var(--header-offset) + 135px); padding: 12px 0 104px; }
+.sports-grouped-section + .sports-grouped-section { padding-top: 92px; border-top: 1px solid var(--line); }
+.sports-grouped-heading { max-width: 820px; margin-bottom: 40px; }
+.sports-grouped-heading small { color: var(--blue-600); font-size: 10px; font-weight: 850; letter-spacing: 3px; }
+.sports-grouped-heading h2 { margin: 10px 0 13px; color: var(--ink); font-size: clamp(32px,4vw,50px); letter-spacing: -2px; }
+.sports-grouped-heading p { max-width: 680px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.85; }
+.sports-grouped-articles { margin-top: 0; }
+.sports-performance-block,.sports-text-gallery { display: grid; gap: 34px; }
+.sports-performance-block > .prose,.sports-text-gallery > .prose { max-width: 860px; padding: 30px 34px; border-left: 4px solid var(--blue-500); border-radius: 0 15px 15px 0; background: #fff; box-shadow: 0 14px 38px rgba(2,62,119,.07); }
+.sports-grouped-gallery { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
+.sports-grouped-gallery img { width: 100%; height: 290px; object-fit: cover; border-radius: 18px 4px 18px 4px; box-shadow: 0 13px 34px rgba(2,62,119,.1); }
+.poster-gallery { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; align-items: stretch; }
+.poster-gallery__card { position: relative; min-width: 0; min-height: 420px; padding: 18px; overflow: hidden; border: 1px solid rgba(8,120,232,.12); border-radius: 20px 5px 20px 5px; background: linear-gradient(145deg,#f7fbff,#eaf5ff); box-shadow: 0 13px 34px rgba(2,62,119,.1); cursor: zoom-in; }
+.poster-gallery__card img { display: block; width: 100%; height: 100%; max-height: 660px; object-fit: contain; transition: transform .35s ease; }
+.poster-gallery__card > span { position: absolute; right: 14px; bottom: 14px; display: inline-flex; align-items: center; gap: 8px; padding: 9px 12px; color: #fff; border-radius: 10px 3px 10px 3px; background: rgba(0,69,134,.82); box-shadow: 0 8px 22px rgba(0,47,91,.22); backdrop-filter: blur(10px); font-size: 11px; font-weight: 750; }
+.poster-gallery__card > span b { font-size: 14px; }
+.poster-gallery__card:hover img { transform: scale(1.018); }
+.poster-lightbox-open { overflow: hidden; }
+.poster-lightbox { position: fixed; inset: 0; z-index: 10000; display: grid; place-items: center; color: #fff; outline: none; }
+.poster-lightbox__backdrop { position: absolute; inset: 0; background: rgba(0,16,31,.96); backdrop-filter: blur(14px); }
+.poster-lightbox__topbar { position: absolute; z-index: 3; top: 0; left: 0; right: 0; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 24px; background: linear-gradient(180deg,rgba(0,14,28,.82),transparent); }
+.poster-lightbox__topbar > div { min-width: 0; display: grid; gap: 3px; }
+.poster-lightbox__topbar strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
+.poster-lightbox__topbar small { color: rgba(255,255,255,.58); font-size: 11px; }
+.poster-lightbox__topbar button,.poster-lightbox__arrow,.poster-lightbox__controls button { display: grid; place-items: center; color: #fff; border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.1); backdrop-filter: blur(12px); cursor: pointer; }
+.poster-lightbox__topbar button { flex: 0 0 auto; width: 42px; height: 42px; border-radius: 50%; font-size: 28px; line-height: 1; }
+.poster-lightbox__viewport { position: absolute; z-index: 1; inset: 72px 86px 76px; display: grid; place-items: center; overflow: hidden; touch-action: none; }
+.poster-lightbox__viewport.is-draggable { cursor: grab; }
+.poster-lightbox__viewport.is-dragging { cursor: grabbing; }
+.poster-lightbox__viewport img { display: block; flex: 0 0 auto; max-width: none; max-height: none; object-fit: fill; user-select: none; transform-origin: center; transition: transform .16s ease; }
+.poster-lightbox__viewport.is-dragging img { transition: none; }
+.poster-lightbox__arrow { position: absolute; z-index: 3; top: 50%; width: 48px; height: 66px; border-radius: 14px 4px 14px 4px; transform: translateY(-50%); font-size: 40px; }
+.poster-lightbox__arrow--previous { left: 20px; }
+.poster-lightbox__arrow--next { right: 20px; }
+.poster-lightbox__controls { position: absolute; z-index: 3; left: 50%; bottom: 20px; display: flex; align-items: center; gap: 7px; padding: 7px; border: 1px solid rgba(255,255,255,.12); border-radius: 14px 4px 14px 4px; background: rgba(0,35,69,.72); transform: translateX(-50%); backdrop-filter: blur(14px); }
+.poster-lightbox__controls button { min-width: 38px; height: 36px; border-radius: 9px 3px 9px 3px; font-size: 18px; }
+.poster-lightbox__controls button:disabled { opacity: .35; cursor: default; }
+.poster-lightbox__controls .poster-lightbox__scale { min-width: 68px; font-size: 11px; font-weight: 800; }
+.poster-lightbox button:hover:not(:disabled) { background: rgba(8,144,255,.65); }
 .card-detail-link { display: block; margin-top: 18px; color: var(--blue-600); font-size: 12px; }
 .content-detail-link { display: inline-flex; align-items: center; gap: 18px; margin-top: 20px; padding: 14px 20px; color: #fff; border-radius: 10px; background: linear-gradient(135deg,var(--blue-500),var(--blue-700)); box-shadow: 0 12px 24px rgba(8,120,232,.2); font-size: 13px; font-weight: 700; }
 .content-detail-link span { transition: transform .25s; }
@@ -570,14 +650,16 @@ main { min-height: 72vh; }
 .venue-city-title h3 { margin: 0; color: var(--ink); font-size: 29px; }
 .venue-city-title b { margin-left: auto; color: var(--muted); font-size: 11px; font-weight: 600; }
 .venue-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
-.venue-grid article { min-height: 128px; display: grid; grid-template-columns: 32px minmax(0,1fr); gap: 14px; align-items: start; padding: 23px 22px; border: 1px solid rgba(0,144,255,.12); border-radius: 15px 3px 15px 3px; background: #fff; box-shadow: 0 9px 28px rgba(0,83,155,.055); transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease; }
-.venue-grid article:hover { transform: translateY(-5px); border-color: rgba(0,144,255,.3); box-shadow: 0 18px 38px rgba(0,83,155,.11); }
+.venue-grid > a { min-height: 150px; display: grid; grid-template-columns: 32px minmax(0,1fr); gap: 14px; align-items: start; padding: 23px 22px; border: 1px solid rgba(0,144,255,.12); border-radius: 15px 3px 15px 3px; background: #fff; box-shadow: 0 9px 28px rgba(0,83,155,.055); transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease; }
+.venue-grid > a:hover { transform: translateY(-5px); border-color: rgba(0,144,255,.3); box-shadow: 0 18px 38px rgba(0,83,155,.11); }
 .venue-pin { position: relative; width: 28px; height: 28px; border: 2px solid var(--blue-600); border-radius: 50% 50% 50% 6px; transform: rotate(-45deg); }
 .venue-pin::after { content: ""; position: absolute; left: 8px; top: 8px; width: 8px; height: 8px; border-radius: 50%; background: var(--blue-600); }
 .venue-grid h4 { margin: 0 0 10px; color: var(--ink); font-size: 16px; }
 .venue-grid p { margin: 0; color: #64788d; font-size: 12px; line-height: 1.75; }
+.venue-map-link { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; color: var(--blue-600); font-size: 11px; font-weight: 800; }
+.venue-map-link span { transition: transform .25s ease; }
+.venue-grid > a:hover .venue-map-link span { transform: translateX(4px); }
 .contact-info-section { color: #fff; background: linear-gradient(135deg,#006fc9,#0090ff 68%,#3facff); }
-.contact-info-section .section-heading > span { color: var(--blue-700); background: #fff; box-shadow: 0 12px 30px rgba(0,73,135,.2); }
 .contact-info-section .section-heading small { color: rgba(255,255,255,.68); }
 .contact-info-section .section-heading h2 { color: #fff; }
 .contact-info-section .section-heading i { background: linear-gradient(90deg,rgba(255,255,255,.3),transparent); }
@@ -676,9 +758,12 @@ main { min-height: 72vh; }
   .dropdown::before, .dropdown-label { display: none; }
   .dropdown a { display: inline-block; margin-right: 18px; padding: 9px 0; font-size: 14px; }
   .dropdown a::before { display: none; }
+  .dropdown-mega { width: 100%; padding-left: 18px; }
+  .dropdown-groups { display: block; }
+  .dropdown-group { margin: 5px 0 10px; padding: 8px 10px; }
+  .dropdown .dropdown-group-title { display: block; margin: 0; padding: 9px 0; background: transparent; }
   .home-original { padding-top: 70px; }
   .page-hero { height: 400px; padding-top: 70px; }
-  .hero-index { right: 5%; font-size: 130px; }
   .scroll-cue { display: none; }
   .subnav { justify-content: flex-start; min-height: 64px; overflow-x: auto; padding: 8px 20px; }
   .subnav a { min-width: 120px; white-space: nowrap; }
@@ -715,6 +800,12 @@ main { min-height: 72vh; }
   .product-summary { position: static; }
   .detail-copy-grid { grid-template-columns: 1fr; gap: 38px; }
   .related-grid { grid-template-columns: repeat(2,1fr); }
+  .purchase-channels { grid-template-columns: 1fr; gap: 28px; }
+  .sports-grouped-layout { grid-template-columns: 1fr; gap: 34px; }
+  .sports-side-nav { top: calc(var(--header-offset) + 64px); padding: 12px; overflow-x: auto; border-radius: 14px 3px 14px 3px; }
+  .sports-side-nav > small { display: none; }
+  .sports-side-nav nav { display: flex; width: max-content; min-width: 100%; gap: 7px; }
+  .sports-side-nav a { flex: 0 0 auto; min-width: 142px; transform: none; }
   .editorial-detail { grid-template-columns: 1fr; gap: 35px; }
   .editorial-detail aside { position: static; }
 }
@@ -727,10 +818,8 @@ main { min-height: 72vh; }
   .hero-orbit-two { display: none; }
   .hero-copy h1 { margin-top: 10px; font-size: 38px; letter-spacing: -2px; }
   .hero-copy p { font-size: 13px; line-height: 1.7; }
-  .hero-index { bottom: -12px; font-size: 92px; letter-spacing: -6px; }
   .content { padding: 68px 0 88px; }
-  .section-heading { grid-template-columns: 48px auto; gap: 14px; margin-bottom: 38px; }
-  .section-heading > span { width: 48px; height: 48px; border-radius: 13px 3px 13px 3px; font-size: 14px; }
+  .section-heading { grid-template-columns: minmax(0,auto) 1fr; gap: 14px; margin-bottom: 38px; }
   .section-heading i { display: none; }
   .section-heading h2 { font-size: 30px; }
   .story-layout { padding: 25px 22px; border-radius: 19px 4px 19px 4px; }
@@ -784,6 +873,23 @@ main { min-height: 72vh; }
   .product-toolbar { align-items: flex-start; flex-direction: column; }
   .category-filters { width: 100%; flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; }
   .category-filters button { flex: 0 0 auto; }
+  .product-pagination { gap: 7px; margin-top: 36px; }
+  .product-pagination button { min-width: 38px; height: 38px; padding: 0 9px; }
+  .purchase-channels { margin-top: 48px; padding: 30px 24px; border-radius: 21px 5px 21px 5px; }
+  .purchase-channel-links { grid-template-columns: 1fr; }
+  .purchase-channels.compact .purchase-channel-links { grid-template-columns: 1fr; }
+  .sports-grouped-section { padding-bottom: 72px; }
+  .sports-grouped-section + .sports-grouped-section { padding-top: 62px; }
+  .sports-grouped-heading { margin-bottom: 30px; }
+  .sports-grouped-gallery { grid-template-columns: 1fr; }
+  .sports-grouped-gallery img { height: 230px; }
+  .poster-gallery { grid-template-columns: 1fr; }
+  .poster-gallery__card { min-height: 390px; padding: 12px; }
+  .poster-lightbox__topbar { padding: 13px 15px; }
+  .poster-lightbox__viewport { inset: 68px 12px 78px; }
+  .poster-lightbox__arrow { top: auto; bottom: 18px; width: 42px; height: 42px; border-radius: 50%; transform: none; font-size: 30px; }
+  .poster-lightbox__arrow--previous { left: 14px; }
+  .poster-lightbox__arrow--next { right: 14px; }
   .detail-hero, .detail-hero-inner { min-height: 430px; }
   .breadcrumbs { top: 24px; left: 0; }
   .detail-hero h1 { font-size: 39px; letter-spacing: -2px; }
diff --git a/src/views/ContactPage.vue b/src/views/ContactPage.vue
index 5e4514e..f112673 100644
--- a/src/views/ContactPage.vue
+++ b/src/views/ContactPage.vue
@@ -4,8 +4,8 @@
       <div class="hero-shade"></div><div class="hero-grid"></div>
       <div class="hero-orbit hero-orbit-one"></div><div class="hero-orbit hero-orbit-two"></div>
       <div class="hero-copy container">
-        <div class="hero-index">08</div><span>CONTACT US</span><h1>联系我们</h1>
-        <p>连接跃动社媒矩阵、业务合作网络与全国线下运动场馆。</p>
+        <span>CONTACT US</span><h1>联系我们</h1>
+        <p>连接跃动社媒矩阵、业务合作网络与品牌服务团队。</p>
         <div class="hero-line"><i></i><b>CONNECT WITH YUEDONG</b></div>
       </div>
     </section>
@@ -17,7 +17,7 @@
     <div class="contact-content">
       <section id="social" class="contact-section contact-social-section">
         <div class="container">
-          <div v-reveal class="section-heading"><span>01</span><div><small>SOCIAL &amp; BUSINESS</small><h2>社媒与业务合作</h2></div><i></i></div>
+          <div v-reveal class="section-heading"><div><small>SOCIAL &amp; BUSINESS</small><h2>社媒与业务合作</h2></div><i></i></div>
           <div class="contact-lead-grid">
             <div v-reveal class="contact-intro">
               <span>跃动全网 · 玩转跳绳</span>
@@ -44,24 +44,9 @@
         </div>
       </section>
 
-      <section id="venues" class="contact-section venue-section">
-        <div class="container">
-          <div v-reveal class="section-heading"><span>02</span><div><small>VENUE NETWORK</small><h2>线下场馆地址</h2></div><i></i></div>
-          <p v-reveal class="venue-summary">场馆按城市平铺展示，便于快速查找附近的跃动运动馆。门店信息可能调整，到访前可通过第三部分联系方式确认。</p>
-          <div v-for="city in venueGroups" :key="city.city" class="venue-city">
-            <div v-reveal class="venue-city-title"><span>{{ city.en }}</span><h3>{{ city.city }}</h3><b>{{ city.venues.length }} 家场馆</b></div>
-            <div class="venue-grid">
-              <article v-for="(venue, index) in city.venues" :key="venue.name" v-reveal :style="{ '--delay': `${(index % 4) * 55}ms` }">
-                <span class="venue-pin"></span><div><h4>{{ venue.name }}</h4><p>{{ venue.address }}</p></div>
-              </article>
-            </div>
-          </div>
-        </div>
-      </section>
-
       <section id="contact-info" class="contact-section contact-info-section">
         <div class="container">
-          <div v-reveal class="section-heading light"><span>03</span><div><small>BUSINESS CONTACT</small><h2>联系方式</h2></div><i></i></div>
+          <div v-reveal class="section-heading light"><div><small>BUSINESS CONTACT</small><h2>联系方式</h2></div><i></i></div>
           <div class="contact-card-grid">
             <a v-for="(contact, index) in contacts" :key="contact.phone" v-reveal :href="`tel:${contact.phone}`" :style="{ '--delay': `${index * 70}ms` }">
               <span>0{{ index + 1 }}</span><small>{{ contact.en }}</small><h3>{{ contact.service }}</h3><p>{{ contact.name }}</p><b>{{ contact.phone }}</b><i>拨打电话 →</i>
@@ -80,7 +65,6 @@ import { useRoute } from 'vue-router';
 const route = useRoute();
 const sectionNav = [
   { key: 'social', label: '社媒与合作' },
-  { key: 'venues', label: '场馆地址' },
   { key: 'contact-info', label: '联系方式' }
 ];
 const activeKey = computed(() => sectionNav.some((item) => item.key === route.params.section) ? route.params.section : 'social');
@@ -100,57 +84,6 @@ const capabilities = [
   { title: '装备服务', en: 'EQUIPMENT', description: '专业跳绳、智能装备及团体采购定制。' }
 ];
 
-const venueGroups = [
-  { city: '上海', en: 'SHANGHAI', venues: [
-    { name: '杨浦翔殷馆', address: '上海市杨浦区翔殷路260号' },
-    { name: '杨浦新江湾运动健康中心馆', address: '上海市杨浦区国浩路701号201室' },
-    { name: '宝山高境三邻桥馆', address: '上海市宝山区江杨南路485号三邻桥体育文化园11号101B室' },
-    { name: '宝山体育中心馆', address: '上海市宝山区永清路700号体育中心内' },
-    { name: '闵行七宝宝龙广场馆', address: '上海市闵行区漕宝路3299弄七宝宝龙广场3楼' },
-    { name: '浦东金桥馆', address: '上海市浦东新区金藏路1296弄151号2楼2027室' },
-    { name: '静安盛源生活广场馆', address: '上海市静安区柳营路777号盛源生活广场2楼' },
-    { name: '静安889GLO广场馆', address: '上海市静安区万航渡路889号889广场3楼' },
-    { name: '闵行力波馆', address: '上海市闵行区虹梅南路379弄27号力波九坊' },
-    { name: '浦东恒生万鹂广场馆', address: '上海市浦东新区芳甸路115弄恒生万鹂广场' },
-    { name: '虹口瑞虹星星堂馆', address: '上海市虹口区天宝路280弄瑞虹天地星星堂' },
-    { name: '普陀曹杨复悦荟馆', address: '上海市普陀区曹杨路1888号复悦荟3楼' },
-    { name: '青浦区跃动青少儿运动健康促进中心', address: '上海市青浦区淀山湖路535号4楼' }
-  ] },
-  { city: '北京', en: 'BEIJING', venues: [
-    { name: '西城官园馆', address: '北京市西城区西直门南小街2号楼B1-103' },
-    { name: '丰台草桥馆', address: '北京市丰台区草桥欣园一区5号楼2楼260室' },
-    { name: '西城马连道馆', address: '北京市西城区马连道街华睦大厦' },
-    { name: '东城崇文门馆', address: '北京市东城区崇文门区域' },
-    { name: '西城西便门馆', address: '北京市西城区西便门区域' },
-    { name: '朝阳大郊亭馆', address: '北京市朝阳区大郊亭华腾新天地运动中心' }
-  ] },
-  { city: '天津', en: 'TIANJIN', venues: [
-    { name: '天津南开馆', address: '天津市南开区宾川道507号' },
-    { name: '天津和平馆', address: '天津市和平区人民体育馆区域' }
-  ] },
-  { city: '广州', en: 'GUANGZHOU', venues: [
-    { name: '天河林和东馆', address: '广州市天河区林和东路218号2楼自编03室' },
-    { name: '海珠广纸天地荟馆', address: '广州市海珠区工业大道广纸天地荟207-208' }
-  ] },
-  { city: '徐州', en: 'XUZHOU', venues: [
-    { name: '经开淮海环球港馆', address: '徐州市经开区淮海环球港L2096' },
-    { name: '鼓楼金地商都馆', address: '徐州市鼓楼区中山北路6号金地商都' }
-  ] },
-  { city: '合肥', en: 'HEFEI', venues: [
-    { name: '庐阳华润橡树湾馆', address: '合肥市庐阳区华润橡树湾商业区' },
-    { name: '包河馆', address: '合肥市包河区安徽省运动健康促进中心2楼' }
-  ] },
-  { city: '成都', en: 'CHENGDU', venues: [
-    { name: '武侯莱蒙都会馆', address: '成都市武侯区二环路南四段51号莱蒙都会商场4楼' }
-  ] },
-  { city: '加盟场馆', en: 'FRANCHISE VENUES', venues: [
-    { name: '松江大学城馆', address: '上海市松江区梅家浜路1501号3楼' },
-    { name: '广西南宁馆', address: '南宁市青秀区星湖路1号' },
-    { name: '江西信丰馆', address: '赣州市信丰县体育中心内' },
-    { name: '江西上饶馆', address: '上饶市广信区旭日街道武夷山大道博华年华北区2栋111-113' }
-  ] }
-];
-
 const contacts = [
   { service: '赛事活动', en: 'EVENTS', name: '郭先生', phone: '16621102107' },
   { service: '演艺服务', en: 'PERFORMANCE', name: '李先生', phone: '15201737732' },
diff --git a/src/views/ContentDetailPage.vue b/src/views/ContentDetailPage.vue
index bd38562..6173bca 100644
--- a/src/views/ContentDetailPage.vue
+++ b/src/views/ContentDetailPage.vue
@@ -33,9 +33,17 @@ const detail = computed(() => {
   if (item) return { title: item.title || item.alt || source.title, body: item.body || source.body || [page.value.summary], gallery: source.gallery || [] };
   return { title: source.title, body: source.body || source.articles?.flatMap((entry) => entry.body) || [page.value.summary], gallery: source.gallery || [] };
 });
-const backPath = computed(() => ['technology', 'health', 'ygjrc'].includes(route.params.page)
-  ? `/${route.params.page}`
-  : `/${route.params.page}/${route.params.section}`);
+const backPath = computed(() => {
+  if (route.params.page === 'sports') {
+    const competitionSections = ['event-recruitment', 'event-news', 'performances'];
+    const venueSections = ['venue-intro', 'champion-class', 'camps', 'venue-address'];
+    if (competitionSections.includes(route.params.section)) return `/sports/competition#${route.params.section}`;
+    if (venueSections.includes(route.params.section)) return `/sports/venues#${route.params.section}`;
+  }
+  return ['technology', 'health', 'ygjrc'].includes(route.params.page)
+    ? `/${route.params.page}`
+    : `/${route.params.page}/${route.params.section}`;
+});
 const heroStyle = computed(() => page.value?.hero?.src ? { backgroundImage: `url("${page.value.hero.src}")` } : {});
 const unreadableImageName = /\uFFFD|锟斤拷|鈥|銆|鈫|馃|鍥剧墖|璺冨姩|鍏充簬|鏂伴椈|浜у搧|绀惧獟|璇︽儏/;
 const genericImageName = /^(?:微信图片|图片|image|img|dsc|screenshot|截图|未命名|幻灯片|slide|photo)[-_（(\s]?\d*/i;
diff --git a/src/views/ContentPage.vue b/src/views/ContentPage.vue
index 5e3ea44..94f0099 100644
--- a/src/views/ContentPage.vue
+++ b/src/views/ContentPage.vue
@@ -6,43 +6,59 @@
       <div class="hero-orbit hero-orbit-one"></div>
       <div class="hero-orbit hero-orbit-two"></div>
       <div class="hero-copy container">
-        <div class="hero-index">{{ String(pageNumber).padStart(2, '0') }}</div>
         <span>{{ page.eyebrow }}</span><h1>{{ page.title }}</h1><p>{{ page.summary }}</p>
         <div class="hero-line"><i></i><b>EXPLORE YUEDONG</b></div>
       </div>
       <div class="scroll-cue"><span></span>SCROLL</div>
     </section>
     <nav v-if="page.tabs" class="subnav" aria-label="栏目导航">
-      <RouterLink v-for="tab in page.tabs" :key="tab.key" :to="basePath + '/' + tab.key" :class="{ active: tab.key === activeKey }">{{ tab.label }}</RouterLink>
+      <RouterLink v-for="tab in page.tabs" :key="tab.key" :to="basePath + '/' + tab.key" :class="{ active: tab.key === activeTabKey }">{{ tab.label }}</RouterLink>
     </nav>
     <section class="content container">
-      <div v-reveal class="section-heading"><span>{{ String(pageNumber).padStart(2, '0') }}</span><div><small>{{ page.eyebrow }}</small><h2>{{ content.title }}</h2></div><i></i></div>
+      <div v-reveal class="section-heading"><div><small>{{ page.eyebrow }}</small><h2>{{ content.title }}</h2></div><i></i></div>
 
       <template v-if="content.products">
         <div class="product-toolbar">
           <div class="category-filters">
             <button v-for="category in productCategories" :key="category" :class="{ active: selectedCategory === category }" @click="selectedCategory = category">{{ category }}</button>
           </div>
-          <span>共 {{ visibleProducts.length }} 款产品</span>
+          <span>共 {{ visibleProducts.length }} 款产品 · 第 {{ currentPage }} / {{ totalPages }} 页</span>
         </div>
         <div class="product-grid">
-          <RouterLink v-for="(product, index) in visibleProducts" :key="product.id" v-reveal class="product-card" :to="`/products/detail/${product.id}`" :style="{ '--delay': `${(index % 9) * 45}ms` }">
-            <div class="card-index">{{ String(index + 1).padStart(2, '0') }}</div>
+          <RouterLink v-for="(product, index) in paginatedProducts" :key="product.id" v-reveal class="product-card" :to="`${productDetailBase}/${product.id}`" :style="{ '--delay': `${index * 45}ms` }">
+            <div class="card-index">{{ String((currentPage - 1) * productsPerPage + index + 1).padStart(2, '0') }}</div>
             <img v-if="product.images?.[0]" :src="product.images[0]" :alt="product.name" loading="lazy" />
             <div class="product-placeholder" v-else>{{ product.category.slice(0, 1) }}</div>
             <div><small>{{ product.category }}</small><h3>{{ product.name || product.category }}</h3><p>{{ product.description }}</p><b class="card-detail-link">查看产品详情 →</b></div>
           </RouterLink>
         </div>
+        <nav v-if="totalPages > 1" class="product-pagination" aria-label="产品分页">
+          <button type="button" :disabled="currentPage === 1" aria-label="上一页" @click="goToProductPage(currentPage - 1)">←</button>
+          <button
+            v-for="pageItem in totalPages"
+            :key="pageItem"
+            type="button"
+            :class="{ active: pageItem === currentPage }"
+            :aria-current="pageItem === currentPage ? 'page' : undefined"
+            :aria-label="`第 ${pageItem} 页`"
+            @click="goToProductPage(pageItem)"
+          >{{ pageItem }}</button>
+          <button type="button" :disabled="currentPage === totalPages" aria-label="下一页" @click="goToProductPage(currentPage + 1)">→</button>
+        </nav>
+        <PurchaseChannels />
       </template>
 
+      <SportsGroupedSection
+        v-else-if="pageKey === 'sports' && ['competition', 'venues'].includes(activeKey)"
+        :mode="activeKey"
+      />
+
       <div v-else-if="content.articles" class="article-list">
         <RouterLink v-for="(article, index) in content.articles" :key="article.title" v-reveal :to="detailPath(index)" :style="{ '--delay': `${index * 90}ms` }">
           <div class="article-no">0{{ index + 1 }}</div><div><h3>{{ article.title }}</h3><p v-for="line in article.body.slice(0, 3)" :key="line">{{ line }}</p></div>
         </RouterLink>
       </div>
 
-      <SportsHallSection v-else-if="pageKey === 'education' && activeKey === 'venues'" />
-
       <div v-else-if="content.timeline?.length" class="timeline-page">
         <div v-if="content.body?.length" v-reveal class="story-layout timeline-intro">
           <div class="prose"><p v-for="line in content.body" :key="line">{{ line }}</p></div>
@@ -89,11 +105,11 @@
         <img v-if="content.gallery?.[0]" :src="content.gallery[0].src" :alt="content.gallery[0].alt" loading="lazy" />
       </div>
 
-      <div v-if="content.cards" class="card-grid">
-        <RouterLink v-for="(card, i) in content.cards" :key="card.title || card.alt" v-reveal :to="detailPath(i)" :style="{ '--delay': `${i * 80}ms` }"><span>0{{ i + 1 }}</span><h3>{{ card.title || card.alt }}</h3><p v-if="card.body">{{ card.body[0] }}</p><b>查看详情 →</b></RouterLink>
+      <div v-if="content.cards && !hideVenueTrailingContent" class="card-grid">
+        <RouterLink v-for="(card, i) in content.cards" :key="card.title || card.alt" v-reveal :to="card.to || detailPath(i)" :style="{ '--delay': `${i * 80}ms` }"><span>0{{ i + 1 }}</span><h3>{{ card.title || card.alt }}</h3><p v-if="card.body">{{ card.body[0] }}</p><b>查看详情 →</b></RouterLink>
       </div>
 
-      <div v-if="content.gallery?.length > 1 && pageKey !== 'ygjrc' && pageKey !== 'health'" class="gallery">
+      <div v-if="content.gallery?.length > 1 && pageKey !== 'ygjrc' && pageKey !== 'health' && !hideVenueTrailingContent" class="gallery">
         <figure v-for="(image, index) in content.gallery.slice(1, 13)" :key="image.src" v-reveal :style="{ '--delay': `${(index % 3) * 80}ms` }"><img :src="image.src" :alt="imageLabel(image)" loading="lazy" /><figcaption v-if="imageLabel(image)"><span>{{ String(index + 1).padStart(2, '0') }}</span>{{ imageLabel(image) }}</figcaption></figure>
       </div>
 
@@ -110,20 +126,37 @@ import { computed, ref, watch } from 'vue';
 import { useRoute } from 'vue-router';
 import { pages } from '../data/page-content.js';
 import { ambassadorsImage, productAmbassadors, ygjrcMembers } from '../data/ygjrc-members.js';
-import SportsHallSection from '../components/SportsHallSection.vue';
 import HealthSection from '../components/HealthSection.vue';
+import PurchaseChannels from '../components/PurchaseChannels.vue';
+import SportsGroupedSection from '../components/SportsGroupedSection.vue';
 
 const route = useRoute();
 const pageKey = computed(() => route.meta.page);
 const page = computed(() => pages[pageKey.value]);
-const activeKey = computed(() => route.params.section || 'default');
+const activeKey = computed(() => route.params.section || page.value?.tabs?.[0]?.key || 'default');
 const content = computed(() => page.value?.sections[activeKey.value] || page.value?.sections.default || Object.values(page.value?.sections || {})[0]);
-const basePath = computed(() => ({ about: '/about', events: '/events', products: '/products', education: '/education', contact: '/contact' })[pageKey.value] || '');
+const hideVenueTrailingContent = computed(() => pageKey.value === 'sports' && activeKey.value === 'venues');
+const activeTabKey = computed(() => content.value?.parent || activeKey.value);
+const basePath = computed(() => ({ about: '/about', sports: '/sports', factory: '/factory', contact: '/contact' })[pageKey.value] || '');
+const productDetailBase = computed(() => pageKey.value === 'sports' ? '/sports/equipment/detail' : '/products/detail');
 const heroStyle = computed(() => page.value?.hero?.src ? { backgroundImage: `url("${page.value.hero.src}")` } : {});
-const pageNumber = computed(() => ({ about: 1, events: 2, products: 3, education: 4, technology: 5, health: 6, ygjrc: 7, contact: 8 })[pageKey.value] || 0);
 const selectedCategory = ref('全部');
+const productsPerPage = 6;
+const currentPage = ref(1);
 const productCategories = computed(() => ['全部', ...new Set((content.value?.products || []).map((product) => product.category))]);
-const visibleProducts = computed(() => selectedCategory.value === '全部' ? content.value.products : content.value.products.filter((product) => product.category === selectedCategory.value));
+const visibleProducts = computed(() => {
+  const products = content.value?.products || [];
+  return selectedCategory.value === '全部' ? products : products.filter((product) => product.category === selectedCategory.value);
+});
+const totalPages = computed(() => Math.max(1, Math.ceil(visibleProducts.value.length / productsPerPage)));
+const paginatedProducts = computed(() => {
+  const start = (currentPage.value - 1) * productsPerPage;
+  return visibleProducts.value.slice(start, start + productsPerPage);
+});
+const goToProductPage = (pageNumber) => {
+  currentPage.value = Math.min(totalPages.value, Math.max(1, pageNumber));
+  document.querySelector('.product-toolbar')?.scrollIntoView({ behavior: 'smooth', block: 'start' });
+};
 const unreadableImageName = /\uFFFD|锟斤拷|鈥|銆|鈫|馃|鍥剧墖|璺冨姩|鍏充簬|鏂伴椈|浜у搧|绀惧獟|璇︽儏/;
 const genericImageName = /^(?:微信图片|图片|image|img|dsc|screenshot|截图|未命名|幻灯片|slide|photo)[-_（(\s]?\d*/i;
 const imageLabel = (image) => {
@@ -131,7 +164,11 @@ const imageLabel = (image) => {
   if (!label || unreadableImageName.test(label) || genericImageName.test(label) || /^[\d\s._()（）-]+$/.test(label)) return '';
   return label;
 };
-watch(activeKey, () => { selectedCategory.value = '全部'; });
+watch(activeKey, () => {
+  selectedCategory.value = '全部';
+  currentPage.value = 1;
+});
+watch(selectedCategory, () => { currentPage.value = 1; });
 const detailPath = (index) => {
   const suffix = Number.isInteger(index) ? `/${index}` : '';
   return `/detail/${pageKey.value}/${activeKey.value}${suffix}`;
diff --git a/src/views/HomePage.vue b/src/views/HomePage.vue
index df1ed02..7c263ea 100644
--- a/src/views/HomePage.vue
+++ b/src/views/HomePage.vue
@@ -12,7 +12,7 @@
         <p>以跳绳为核心，连接专业装备、国际赛事、教育培训、智慧科技与运动健康，让每一次跃起都更有力量。</p>
         <div class="home-hero-actions">
           <RouterLink class="home-primary-button" to="/about/brand-story">探索跃动 <span>→</span></RouterLink>
-          <RouterLink class="home-ghost-button" to="/products/categories">查看产品装备</RouterLink>
+          <RouterLink class="home-ghost-button" to="/sports/equipment">查看跃动装备</RouterLink>
         </div>
         <div class="home-stats">
           <div><strong>2009</strong><span>品牌创立</span></div><div><strong>30+</strong><span>全国运动馆</span></div><div><strong>100+</strong><span>专业教练</span></div><div><strong>GLOBAL</strong><span>全球业务网络</span></div>
@@ -60,9 +60,9 @@
 
 
     <section class="home-products">
-      <div v-reveal class="container home-section-head light"><div><span>FEATURED EQUIPMENT</span><h2>精选产品装备</h2></div><RouterLink to="/products/categories">查看全部 82 款产品 →</RouterLink></div>
+      <div v-reveal class="container home-section-head light"><div><span>FEATURED EQUIPMENT</span><h2>精选跃动装备</h2></div><RouterLink to="/sports/equipment">查看全部 82 款产品 →</RouterLink></div>
       <div class="container home-product-grid">
-        <RouterLink v-for="(product,index) in featuredProducts" :key="product.id" v-reveal :to="`/products/detail/${product.id}`" :style="{ '--delay': `${index * 80}ms` }">
+        <RouterLink v-for="(product,index) in featuredProducts" :key="product.id" v-reveal :to="`/sports/equipment/detail/${product.id}`" :style="{ '--delay': `${index * 80}ms` }">
           <div class="home-product-image"><img :src="product.images[0]" :alt="product.name" /><span>0{{ index + 1 }}</span></div>
           <small>{{ product.category }}</small><h3>{{ product.name }}</h3><b>查看产品详情 ↗</b>
         </RouterLink>
@@ -71,7 +71,7 @@
 
 
     <section class="home-news">
-      <div v-reveal class="container home-section-head"><div><span>EVENTS & NEWS</span><h2>赛事资讯</h2></div><RouterLink to="/events/news">更多赛事动态 →</RouterLink></div>
+      <div v-reveal class="container home-section-head"><div><span>EVENTS & NEWS</span><h2>竞赛演艺</h2></div><RouterLink to="/sports/competition#event-news">更多赛事动态 →</RouterLink></div>
       <div class="container home-news-grid">
         <RouterLink v-for="(article,index) in eventArticles" :key="article.title" v-reveal :to="article.to" :style="{ '--delay': `${index * 90}ms` }">
           <div class="home-news-image"><img :src="article.image" :alt="article.title" /><span>EVENT 0{{ index + 1 }}</span></div>
@@ -110,7 +110,7 @@ const previousHonor = () => { activeHonor.value = (activeHonor.value - 1 + honor
 const nextHonor = () => { activeHonor.value = (activeHonor.value + 1) % honors.length; startHonorRotation(); };
 onMounted(startHonorRotation);
 onBeforeUnmount(stopHonorRotation);
-const eventArticles = pages.events.sections.news.articles.slice(0, 3).map((article, index) => ({ ...article, image: pages.events.sections.news.gallery[index]?.src || pages.events.hero?.src, to: `/detail/events/news/${index}` }));
+const eventArticles = pages.sports.sections['event-news'].articles.slice(0, 3).map((article, index) => ({ ...article, image: pages.sports.sections['event-news'].gallery[index]?.src || pages.sports.hero?.src, to: `/detail/sports/event-news/${index}` }));
 
 const vReveal = {
   mounted(el) {
diff --git a/src/views/ProductDetailPage.vue b/src/views/ProductDetailPage.vue
index 9128ef1..ed9c02f 100644
--- a/src/views/ProductDetailPage.vue
+++ b/src/views/ProductDetailPage.vue
@@ -3,7 +3,7 @@
     <section class="detail-hero">
       <div class="detail-hero-grid"></div>
       <div class="container detail-hero-inner">
-        <nav class="breadcrumbs"><RouterLink to="/">首页</RouterLink><span>/</span><RouterLink to="/products/categories">产品装备</RouterLink><span>/</span><b>{{ product.category }}</b></nav>
+        <nav class="breadcrumbs"><RouterLink to="/">首页</RouterLink><span>/</span><RouterLink to="/sports/equipment">跃动装备</RouterLink><span>/</span><b>{{ product.category }}</b></nav>
         <div class="detail-kicker">PRODUCT DETAIL · {{ product.id.toUpperCase() }}</div>
         <h1>{{ product.name }}</h1>
         <p>{{ product.category }} · 来源于《跳绳产品分类-7类资料》{{ product.sheet }}工作表第 {{ product.row }} 行</p>
@@ -39,6 +39,7 @@
         <h2>{{ product.name }}</h2>
         <div class="model-lines"><span v-for="line in modelLines" :key="line">{{ line }}</span></div>
         <p>{{ descriptionLead }}</p>
+        <PurchaseChannels compact />
         <a href="#specifications" class="detail-primary-action">查看完整规格参数 <span>↓</span></a>
       </div>
     </section>
@@ -61,7 +62,7 @@
       <div class="container">
         <div class="detail-section-title"><small>RELATED PRODUCTS</small><h2>同类产品</h2></div>
         <div class="related-grid">
-          <RouterLink v-for="item in related" :key="item.id" :to="`/products/detail/${item.id}`">
+          <RouterLink v-for="item in related" :key="item.id" :to="`/sports/equipment/detail/${item.id}`">
             <img v-if="item.images[0]" :src="item.images[0]" :alt="item.name" /><div v-else class="related-placeholder">{{ item.category.slice(0, 1) }}</div>
             <span>{{ item.category }}</span><h3>{{ item.name }}</h3><b>查看详情 →</b>
           </RouterLink>
@@ -75,6 +76,7 @@
 import { computed, ref, watch } from 'vue';
 import { useRoute } from 'vue-router';
 import products from '../data/product-details.json';
+import PurchaseChannels from '../components/PurchaseChannels.vue';
 
 const route = useRoute();
 const product = computed(() => products.find((item) => item.id === route.params.id));