From e855d5aa64f13c95eeff6d8eea8e2570ca6ad235 Mon Sep 17 00:00:00 2001
From: Jacky Ser <jacky@MacBook-Pro-5.local>
Date: Tue, 11 Aug 2026 14:46:46 +0800
Subject: [PATCH] Fix start selection navigation

---
 app/globals.css |  1 +
 app/page.tsx    | 13 ++++++++++---
 2 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/app/globals.css b/app/globals.css
index 74ae0e5..a798722 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -92,6 +92,7 @@ a { color: inherit; text-decoration: none; }
 
 .selector-shell {
   min-height: 585px;
+  scroll-margin-top: 94px;
   background: white;
   border: 1px solid rgba(73,98,142,.15);
   border-radius: 22px;
diff --git a/app/page.tsx b/app/page.tsx
index 1aa474b..21f645e 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -358,6 +358,13 @@ export default function Home() {
     Number(requirements.firstOrderQuantity) >= 1000 ||
     requirements.application === "工业设备";
 
+  function startSelection() {
+    setStage(1);
+    requestAnimationFrame(() => {
+      document.getElementById("selector")?.scrollIntoView({ behavior: "smooth", block: "start" });
+    });
+  }
+
   function update<K extends keyof Requirements>(key: K, value: Requirements[K]) {
     setRequirements((current) => ({ ...current, [key]: value }));
   }
@@ -393,7 +400,7 @@ export default function Home() {
           <a href="#products">完整目录</a>
           <a href="#how">服务流程</a>
         </nav>
-        <button className="header-cta" type="button" onClick={() => setStage(1)}>
+        <button className="header-cta" type="button" onClick={startSelection}>
           开始选型 <span>→</span>
         </button>
       </header>
@@ -410,7 +417,7 @@ export default function Home() {
             同步准备样品与替代选型摘要。
           </p>
           <div className="hero-actions">
-            <button className="primary-action" type="button" onClick={() => setStage(1)}>
+            <button className="primary-action" type="button" onClick={startSelection}>
               免费开始选型 <span>→</span>
             </button>
             <a href="#products" className="text-action">查看能力范围</a>
@@ -436,7 +443,7 @@ export default function Home() {
               <p className="assistant-label">高徳乐选型助手</p>
               <h2>你好，我来帮你缩小选型范围。</h2>
               <p>回答3组问题，即可获得推荐型号、匹配理由和样品申请入口。</p>
-              <button className="panel-primary" type="button" onClick={() => setStage(1)}>
+              <button className="panel-primary" type="button" onClick={startSelection}>
                 开始回答 <span>预计3分钟</span>
               </button>
               <div className="privacy-note">✓ 无需注册即可查看选型结果</div>