feat(Home): 添加横向滑动提示并优化交互

在法会流程部分添加横向滑动提示，帮助用户发现可滑动功能
添加触摸和滚动事件监听，用户交互后自动隐藏提示
优化样式和动画效果，提升用户体验

@@ -24,17 +24,23 @@
 
       <!-- 法会流程容器 -->
       <div class="ceremony-wrapper">
-        <!-- 法会流程 -->
-        <div class="ceremony-process">
-          <!-- 标题 -->
-          <div class="ceremony-title">
-            <img src="https://cdn.ipadbiz.cn/stdj/images/home/%E6%B3%95%E6%9C%83%E6%B5%81%E7%A8%8B@2x.png" alt="法会流程" />
-          </div>
+      <!-- 法会流程 -->
+      <div class="ceremony-process">
+        <!-- 标题 -->
+        <div class="ceremony-title">
+          <img src="https://cdn.ipadbiz.cn/stdj/images/home/%E6%B3%95%E6%9C%83%E6%B5%81%E7%A8%8B@2x.png" alt="法会流程" />
+        </div>
 
-          <!-- 流程步骤 -->
-          <div class="process-container">
-            <!-- 麻绳背景 -->
-            <div class="rope-background"></div>
+        <!-- 横向滑动提示：放在标题与流程步骤之间，清晰可读 -->
+        <div v-show="showSwipeHint" class="swipe-hint">
+          <span class="swipe-icon">⇆</span>
+          <span class="swipe-text">左右滑动查看更多</span>
+        </div>
+
+        <!-- 流程步骤 -->
+        <div class="process-container">
+          <!-- 麻绳背景 -->
+          <div class="rope-background"></div>
 
             <!-- 流程步骤：每屏最多显示7个，超出可横向滑动 -->
             <div class="process-steps-wrapper" ref="processStepsRef">
@@ -335,6 +341,15 @@ const mastersList = ref([])
 onMounted(async () => {
   // 进入页面时立即回到顶部
   ensurePageScrollTop()
+  // 初次进入展示滑动提示，不再自动隐藏
+  // 用户滑动或滚动后隐藏提示
+  nextTick(() => {
+    const el = processStepsRef.value
+    if (el) {
+      el.addEventListener('touchmove', dismissSwipeHint, { passive: true })
+      el.addEventListener('scroll', dismissSwipeHint, { passive: true })
+    }
+  })
   // 初始化不同屏幕下箭头bottom适配并监听resize
   updateArrowBottomByScreen()
   if (typeof window !== 'undefined') {
@@ -393,6 +408,11 @@ onUnmounted(() => {
   if (typeof window !== 'undefined') {
     window.removeEventListener('resize', handleResize)
   }
+  const el = processStepsRef.value
+  if (el) {
+    el.removeEventListener('touchmove', dismissSwipeHint)
+    el.removeEventListener('scroll', dismissSwipeHint)
+  }
 })
 
 // 监听当前步骤变化，重新计算装饰线位置
@@ -644,6 +664,18 @@ const updateArrowBottomByScreen = () => {
     arrowBottomRem.value = -0.5
   }
 }
+
+// 是否显示横向滑动提示
+const showSwipeHint = ref(true)
+
+/**
+ * 隐藏横向滑动提示
+ * 说明：在用户首次滑动或滚动时隐藏，不再自动隐藏
+ * @returns {void}
+ */
+const dismissSwipeHint = () => {
+  showSwipeHint.value = false
+}
 </script>
 
 <style scoped>
@@ -1078,6 +1110,57 @@ const updateArrowBottomByScreen = () => {
   flex: 0 0 100%;
   scroll-snap-align: start;
 }
+/* 横向滑动提示样式：标题和流程之间的高对比胶囊提示 */
+.swipe-hint {
+    position: relative;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 0.35rem;
+    pointer-events: none;
+    margin: 0 auto 0.5rem;
+    padding: 0;
+    color: #985122;
+    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.08);
+    font-weight: 700;
+    opacity: 1;
+}
+
+.swipe-icon {
+    font-size: 0.875rem;
+    line-height: 1;
+    animation: hint-slide 2.2s ease-in-out infinite;
+    filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.15));
+    color: #985122;
+}
+
+.swipe-text {
+    font-size: 0.875rem;
+    font-weight: 700;
+    line-height: 1;
+    letter-spacing: 0.02rem;
+    color: #985122;
+}
+
+/* 小屏幕适配 */
+@media (max-width: 30rem) {
+    .swipe-hint {
+        margin-bottom: 0.4rem;
+    }
+    .swipe-icon,
+    .swipe-text {
+        font-size: 0.8rem;
+    }
+}
+
+/* 横向滑动动画：左右缓动，暗示可滑动 */
+@keyframes hint-slide {
+    0%   { transform: translateX(0); }
+    25%  { transform: translateX(-0.25rem); }
+    50%  { transform: translateX(0); }
+    75%  { transform: translateX(0.25rem); }
+    100% { transform: translateX(0); }
+}
 
 /* 单个流程步骤 */
 .process-step {