web: 客户角色卡替换SVG占位符为真实小程序码

web/css/style.css

@@ -1239,16 +1239,12 @@ ul { list-style: none; }
   gap: var(--space-xs);
 }
 .role-qr-code {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: 80px;
-  height: 80px;
+  display: block;
+  width: 120px;
+  height: 120px;
   border-radius: var(--radius-md);
-  background: #fff;
-  box-shadow: 0 2px 8px rgba(0,0,0,.08);
+  box-shadow: 0 2px 8px rgba(0,0,0,.10);
   transition: transform .3s ease, box-shadow .3s ease;
-  cursor: pointer;
 }
 .role-qr-code:hover {
   transform: scale(1.08);
@@ -1398,26 +1394,6 @@ ul { list-style: none; }
   font-size: var(--font-size-tiny);
 }
 
-.contact-qr {
-  margin-top: var(--space-xl);
-  text-align: center;
-}
-.contact-qr img {
-  width: 130px;
-  height: 130px;
-  border-radius: var(--radius-md);
-  border: 2px solid var(--color-border-light);
-  transition: transform var(--transition-fast);
-}
-.contact-qr img:hover {
-  transform: scale(1.05);
-}
-.contact-qr p {
-  font-size: var(--font-size-tiny);
-  color: var(--color-text-muted);
-  margin-top: var(--space-xs);
-}
-
 /* ----------------------------------------------------------
     15. Footer
    ---------------------------------------------------------- */
@@ -1713,13 +1689,8 @@ ul { list-style: none; }
   }
 
   .role-qr-code {
-    width: 64px;
-    height: 64px;
-  }
-
-  .role-qr-code svg {
-    width: 56px;
-    height: 56px;
+    width: 100px;
+    height: 100px;
   }
 }
 

web/index.html

@@ -977,69 +977,8 @@
             <li><strong>幸福全景</strong><span class="perm-desc"> — 各成员的成长轨迹各自精彩，又共同汇聚为完整的家庭幸福全景</span></li>
           </ul>
           <div class="role-qr">
-            <div class="role-qr-code">
-              <svg viewBox="0 0 100 100" fill="none" width="72" height="72">
-                <rect width="100" height="100" rx="6" fill="#fff"/>
-                <rect x="6" y="6" width="22" height="22" rx="3" stroke="#222" stroke-width="2" fill="#fff"/>
-                <rect x="10" y="10" width="14" height="14" rx="2" fill="#222"/>
-                <rect x="14" y="14" width="6" height="6" fill="#fff"/>
-                <rect x="72" y="6" width="22" height="22" rx="3" stroke="#222" stroke-width="2" fill="#fff"/>
-                <rect x="76" y="10" width="14" height="14" rx="2" fill="#222"/>
-                <rect x="80" y="14" width="6" height="6" fill="#fff"/>
-                <rect x="6" y="72" width="22" height="22" rx="3" stroke="#222" stroke-width="2" fill="#fff"/>
-                <rect x="10" y="76" width="14" height="14" rx="2" fill="#222"/>
-                <rect x="14" y="80" width="6" height="6" fill="#fff"/>
-                <rect x="34" y="6" width="6" height="6" rx="1" fill="#4A9BD7" opacity=".7"/>
-                <rect x="44" y="6" width="6" height="6" rx="1" fill="#222"/>
-                <rect x="54" y="6" width="6" height="6" rx="1" fill="#4A9BD7" opacity=".7"/>
-                <rect x="64" y="6" width="4" height="6" rx="1" fill="#222"/>
-                <rect x="6" y="34" width="6" height="6" rx="1" fill="#222"/>
-                <rect x="16" y="34" width="6" height="6" rx="1" fill="#4A9BD7" opacity=".7"/>
-                <rect x="28" y="34" width="6" height="6" rx="1" fill="#222"/>
-                <rect x="38" y="34" width="4" height="6" rx="1" fill="#4A9BD7" opacity=".7"/>
-                <rect x="46" y="34" width="6" height="6" rx="1" fill="#222"/>
-                <rect x="56" y="34" width="6" height="6" rx="1" fill="#222"/>
-                <rect x="66" y="34" width="6" height="6" rx="1" fill="#4A9BD7" opacity=".7"/>
-                <rect x="84" y="34" width="6" height="6" rx="1" fill="#222"/>
-                <rect x="94" y="34" width="4" height="6" rx="1" fill="#4A9BD7" opacity=".7"/>
-                <rect x="6" y="44" width="6" height="6" rx="1" fill="#4A9BD7" opacity=".7"/>
-                <rect x="16" y="44" width="6" height="4" rx="1" fill="#222"/>
-                <rect x="26" y="44" width="6" height="6" rx="1" fill="#222"/>
-                <rect x="36" y="44" width="6" height="6" rx="1" fill="#4A9BD7" opacity=".7"/>
-                <rect x="46" y="46" width="6" height="4" rx="1" fill="#222"/>
-                <rect x="56" y="44" width="6" height="6" rx="1" fill="#4A9BD7" opacity=".7"/>
-                <rect x="76" y="44" width="6" height="6" rx="1" fill="#222"/>
-                <rect x="86" y="44" width="6" height="6" rx="1" fill="#4A9BD7" opacity=".7"/>
-                <rect x="6" y="54" width="6" height="6" rx="1" fill="#222"/>
-                <rect x="16" y="56" width="6" height="4" rx="1" fill="#222"/>
-                <rect x="28" y="54" width="6" height="6" rx="1" fill="#4A9BD7" opacity=".7"/>
-                <rect x="44" y="54" width="6" height="6" rx="1" fill="#4A9BD7" opacity=".7"/>
-                <rect x="54" y="54" width="6" height="6" rx="1" fill="#222"/>
-                <rect x="64" y="54" width="6" height="6" rx="1" fill="#222"/>
-                <rect x="84" y="54" width="6" height="6" rx="1" fill="#4A9BD7" opacity=".7"/>
-                <rect x="34" y="64" width="6" height="6" rx="1" fill="#4A9BD7" opacity=".7"/>
-                <rect x="44" y="64" width="6" height="6" rx="1" fill="#222"/>
-                <rect x="64" y="64" width="6" height="6" rx="1" fill="#4A9BD7" opacity=".7"/>
-                <rect x="74" y="64" width="6" height="6" rx="1" fill="#222"/>
-                <rect x="84" y="64" width="6" height="6" rx="1" fill="#4A9BD7" opacity=".7"/>
-                <rect x="94" y="64" width="4" height="6" rx="1" fill="#222"/>
-                <rect x="36" y="76" width="6" height="6" rx="1" fill="#222"/>
-                <rect x="46" y="76" width="6" height="6" rx="1" fill="#4A9BD7" opacity=".7"/>
-                <rect x="58" y="76" width="6" height="6" rx="1" fill="#222"/>
-                <rect x="68" y="76" width="6" height="6" rx="1" fill="#4A9BD7" opacity=".7"/>
-                <rect x="84" y="76" width="6" height="6" rx="1" fill="#222"/>
-                <rect x="94" y="76" width="4" height="6" rx="1" fill="#4A9BD7" opacity=".7"/>
-                <rect x="6" y="86" width="6" height="6" rx="1" fill="#222"/>
-                <rect x="16" y="86" width="6" height="6" rx="1" fill="#4A9BD7" opacity=".7"/>
-                <rect x="28" y="86" width="6" height="6" rx="1" fill="#222"/>
-                <rect x="44" y="86" width="6" height="6" rx="1" fill="#4A9BD7" opacity=".7"/>
-                <rect x="58" y="86" width="6" height="6" rx="1" fill="#222"/>
-                <rect x="68" y="86" width="6" height="6" rx="1" fill="#222"/>
-                <rect x="78" y="86" width="6" height="6" rx="1" fill="#4A9BD7" opacity=".7"/>
-                <rect x="90" y="86" width="6" height="6" rx="1" fill="#222"/>
-              </svg>
-            </div>
-            <span class="role-qr-label">扫码开启</span>
+            <img src="cf.jpg" alt="浠艾福小程序码" class="role-qr-code">
+            <span class="role-qr-label">微信扫码体验</span>
           </div>
         </div>
 
@@ -1144,10 +1083,6 @@
                 <span class="cta-card-desc">专业服务管理</span>
               </div>
             </div>
-            <div class="contact-qr">
-              <img src="cf.jpg" alt="浠艾福小程序码">
-              <p>微信扫码立即体验</p>
-            </div>
           </div>
       </div>
     </div>