优化首页联系页与移动端拨号入口

src/components/Layout/MobileStickyCTA.tsx

@@ -1,8 +1,21 @@
 import { Link } from 'react-router-dom'
+import { getCMSConfig, useCMS } from '@/services/cms'
 
 export default function MobileStickyCTA() {
+  const { data: config } = useCMS(getCMSConfig, null)
+  const hotline = String(config?.hotline || '').trim()
+  const phoneLink = hotline.replace(/[^\d+]/g, '')
+
   return (
     <div className="mobile-sticky-cta" aria-label="移动端常驻CTA">
+      {phoneLink && (
+        <a className="btn btn-ghost mobile-call-cta" href={`tel:${phoneLink}`} aria-label={`拨打电话 ${hotline}`} title={`拨打 ${hotline}`}>
+          <svg viewBox="0 0 24 24" aria-hidden="true">
+            <path d="M6.7 2.8 9.4 8l-2.1 1.7c1.2 2.5 3.2 4.5 5.7 5.7l1.7-2.1 5.2 2.7c.5.3.8.8.7 1.4l-.5 3.1c-.1.7-.7 1.2-1.4 1.2C9.6 21.7 2.3 14.4 2.3 5.3c0-.7.5-1.3 1.2-1.4l3.1-.5c.6-.1 1.1.2 1.4.7Z" />
+          </svg>
+          <span>电话</span>
+        </a>
+      )}
       <Link to="/self-check" className="btn btn-ghost">
         看看你的企业
       </Link>

src/components/Layout/Navbar.tsx

@@ -13,7 +13,6 @@ export default function Navbar() {
           <img className="brand-mark" src="/images/logo.png" alt="阿美巴咨询" />
           <span className="brand-text">
             <strong>阿美巴咨询</strong>
-            <small>企业进化陪跑</small>
           </span>
         </Link>
 

src/components/Layout/layout.css

@@ -19,8 +19,8 @@
   object-fit: contain;
   flex: 0 0 auto;
 }
-.brand-text strong { display: block; font-size: 15px; line-height: 1; }
+.brand-text { display: flex; align-items: center; }
-.brand-text small { font-size: 11px; color: var(--text-muted); letter-spacing: 0.06em; }
+.brand-text strong { display: block; font-size: 15px; line-height: 1.2; }
 
 .nav-menu { display: flex; gap: 4px; align-items: center; }
 .nav-link {

src/pages/Contact/contact.css

@@ -0,0 +1,17 @@
+.contact-form-container {
+  max-width: 680px;
+}
+
+.contact-form-card {
+  padding: 32px;
+}
+
+@media (max-width: 768px) {
+  .contact-form-container {
+    max-width: none;
+  }
+
+  .contact-form-card {
+    padding: 24px 20px;
+  }
+}

src/pages/Contact/index.tsx

@@ -1,10 +1,10 @@
 import { useState } from 'react'
 import { Link } from 'react-router-dom'
-import { useCMS, useCMSTexts, getCMSConfig } from '@/services/cms'
+import { useCMSTexts } from '@/services/cms'
+import './contact.css'
 
 export default function Contact() {
   const { data: texts } = useCMSTexts()
-  const { data: config } = useCMS(getCMSConfig, null)
   const [form, setForm] = useState({ name: '', company: '', phone: '', need: '' })
   const [submitted, setSubmitted] = useState(false)
   const [error, setError] = useState('')
@@ -46,9 +46,8 @@ export default function Contact() {
         </div>
       </div>
       <section className="section">
-        <div className="container" style={{ maxWidth: 720 }}>
+        <div className="container contact-form-container">
-          <div className="grid-2">
+            <div className="card contact-form-card">
-            <div className="card">
               <h3>咨询获取方案</h3>
               <p style={{ fontSize: 13, color: '#64748b' }}>提交后将进入顾问线索列表，请填写真实联系方式。</p>
               <form onSubmit={submit} style={{ marginTop: 16, display: 'grid', gap: 12 }}>
@@ -99,24 +98,6 @@ export default function Contact() {
                 <p style={{ fontSize: 11, color: '#94a3b8' }}>{texts['contact.privacy_note'] || '提交即视为同意隐私与合规说明。'}</p>
               </form>
             </div>
-            <div style={{ display: 'grid', gap: 16, alignContent: 'start' }}>
-              <div className="card">
-                <h3>{texts['contact.channels_title'] || '其他通道'}</h3>
-                {config?.hotline && <p><strong>{texts['contact.hotline_label'] || '联系电话'}：</strong>{config.hotline}</p>}
-                {config?.contact_email && <p><strong>{texts['contact.email_label'] || '联系邮箱'}：</strong>{config.contact_email}</p>}
-                {config?.contact_address && <p><strong>{texts['contact.address_label'] || '联系地址'}：</strong>{config.contact_address}</p>}
-                {config?.qr_image_url && <a href={config.qr_target_url || config.qr_image_url} target="_blank" rel="noreferrer" style={{display:'inline-grid',gap:8,marginTop:8,color:'inherit'}}><img src={config.qr_image_url} alt={config.qr_label || '联系二维码'} style={{width:140,height:140,objectFit:'contain',borderRadius:8}}/><span style={{fontSize:13}}>{config.qr_label || texts['contact.qr_default_label'] || '扫码联系我们'}</span></a>}
-              </div>
-              <div className="card">
-                <h3>快速路径</h3>
-                <p style={{ fontSize: 13, color: '#475569' }}>首页 → 看看你的企业（轻量对照）→ 联系我们 → 顾问跟进</p>
-                <p style={{ fontSize: 13, color: '#475569' }}>首页 → 企业进化 → 价值/A/M/B → 联系我们（深度路径）</p>
-                <Link to="/self-check" className="btn btn-ghost" style={{ width: '100%', marginTop: 10 }}>
-                  先看看你的企业 →
-                </Link>
-              </div>
-            </div>
-          </div>
         </div>
       </section>
       <section className="cta-band">

src/pages/Home/home.css

@@ -4,7 +4,7 @@
   padding: 64px 0 56px;
 }
 .hero-home-inner { display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 32px; align-items: center; }
-.hero-copy h1 { font-size: 40px; font-weight: 900; line-height: 1.15; margin: 8px 0 14px; }
+.hero-copy h1 { font-size: 40px; font-weight: 900; line-height: 1.15; margin: 0 0 14px; }
 .hero-desc { color: rgba(255,255,255,0.82); font-size: 15px; line-height: 1.8; max-width: 560px; }
 .hero-actions { display: flex; gap: 12px; margin-top: 20px; flex-wrap: wrap; }
 .hero-actions .btn-ghost { color: #fff; border-color: rgba(255,255,255,0.55); background: rgba(255,255,255,0.08); }

src/pages/Home/index.tsx

@@ -18,7 +18,6 @@ export default function Home() {
       <section className="hero-home">
         <div className="container hero-home-inner">
           <div className="hero-copy">
-            <p className="eyebrow">{text('home.eyebrow', '阿美巴 · 企业进化陪跑')}</p>
             <h1>
               {heroTitle.map((line, i) => <span key={i}>{i > 0 && <br />}{line}</span>)}
             </h1>

src/styles/global.css

@@ -189,7 +189,26 @@ img { max-width: 100%; display: block; }
   box-shadow: 0 -4px 20px rgba(0,0,0,0.06);
 }
 .mobile-sticky-cta .btn { flex: 1; }
+.mobile-sticky-cta .mobile-call-cta {
+  flex: 0 0 58px;
+  padding-inline: 10px;
+  flex-direction: column;
+  gap: 1px;
+  font-size: 10px;
+  line-height: 1.1;
+}
+.mobile-call-cta svg {
+  width: 19px;
+  height: 19px;
+  fill: none;
+  stroke: currentColor;
+  stroke-width: 1.8;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+}
 @media (max-width: 768px) {
-  .mobile-sticky-cta { display: flex; gap: 10px; }
+  .mobile-sticky-cta { display: flex; gap: 8px; }
+  .mobile-sticky-cta .btn { min-height: 46px; padding-inline: 12px; }
+  .mobile-sticky-cta .mobile-call-cta { padding-inline: 8px; }
   body { padding-bottom: 64px; }
 }