feat: 新增常見問答區塊與導覽列連結

[Ckm1020]

🎯 為什麼要這樣做

為了解決使用者對產品的常見疑問，提升服務透明度。透過新增的「常見問答」區塊，使用者能快速獲得關於功能優勢、試用方案、定價與資料安全等資訊，降低客服壓力並提升轉化率。

⚠️ 修改的內容

[常見問答區塊 (FAQ Section)]

• 修改方向：新增功能元件與交互樣式
• 內容：
  • 實作手風琴 (Accordion) 互動元件，支援流暢的展開與收合效果
  • 採用 CSS Grid 技術實現高度自動適應的過渡動畫
  • 整合 FAQ 資料集，收錄 5 筆 CRM 核心業務問答
  • 在首頁主動線中嵌入此區塊，強化內容完整性

[導覽系統增強]

• 修改方向：更新全域導覽項目
• 內容：
  • 在頂部導覽列新增「常見問答」快速連結
  • 支援錨點平滑捲動跳轉功能

🧪 測試步驟

測試案例 1：[常見問答元件 - 展開與收合測試]

1. 下滑頁面至常見問答區塊。
2. 點擊任一問題標題。
3. 預期結果：答案內容平滑展開，右側箭頭圖示旋轉 180 度；再次點擊相同問題，內容應平滑收合。

測試案例 2：[常見問答元件 - 單一展開邏輯測試]

1. 展開第一個問題。
2. 點擊第二個問題。
3. 預期結果：第一個問題自動收合，僅保留第二個問題處於展開狀態，確保畫面整潔。

測試案例 3：[導覽列跳轉測試]

1. 點擊頁面最上方導覽列中的「常見問答」。
2. 預期結果：頁面能平滑且精確地捲動至 FAQ 區塊位置。

測試案例 4：[響應式版面測試]

1. 將視窗切換至手機尺寸。
2. 檢查區塊內邊距與文字排版。
3. 預期結果：文字與間距自動縮減，整體呈現緊湊且無橫向溢位問題。