refactor(components): 优化动画组件代码结构并移除冗余样式

style(pages): 使用实用类替换内联样式
refactor(composables): 简化页面标题模板逻辑
docs(components): 添加详细注释说明动画逻辑

app/pages/index.vue

@@ -64,20 +64,11 @@ watch(() => appStore.isAppLoading, async (isLoading) => {
     <HomeIntro ref="homeIntroRef" />
     <HomeHero ref="homeHeroRef" />
 
-    <section class="next-section">
+    <section class="grid min-h-[100svh] place-items-center">
       <h2>Next Section</h2>
     </section>
-    <section id="work" class="work-section" data-cursor-label="Read more">
+    <section id="work" class="grid min-h-[100svh] place-items-center" data-cursor-label="Read more">
       <p>{{ t('home.welcome') }}</p>
     </section>
   </main>
 </template>
-
-<style scoped>
-.next-section,
-.work-section {
-  min-height: 100svh;
-  display: grid;
-  place-items: center;
-}
-</style>