依使用者給到的內容做成網頁，網頁風格要求如下：

### 一、視覺風格定位- **藝術化手繪風格**: 採用線條插畫(line art)風格,融合現代數位設計與傳統手繪美學- **配色策略**: 以中性色(米白/淺灰)為基底,搭配深灰色主文,使用橙紅色(accent color)作為視覺焦點色- - ** 品牌調性群體有溫度、精緻、藝術佈局** 。右側： - - 客製化手繪插畫,佔據50%視覺空間- - 插畫風格統一：線條勾勒+局部色彩點綴- - 插畫內容與品牌故事深度契合- - **導航列設計** - - 極化頂部導航,固定定位- - Logo + 2-3個主要選單- - 右側透明圖示, 右側圖集 (22**1) - 微妙內容卡片網格佈局(3-4列響應式) - - 每個卡片包含: - - 標題(Heading 3, 32-40px) - - 描述文案(2-3行,16-18px行高1.6) - - 配套手繪插畫(與主視覺風格一致) - - 淺層背景(#F5F3F12 -p -p000) -p -p-1 - ### 三、配圖系統規格**插畫創作指南** 1. 2. **線條處理**: - - 使用1-2px不規則手繪線條,模擬真實繪畫質感- - 保持線條流暢但帶有人工感,避免過於機械- 3. 4. **色彩運用**: - - 80%灰色背景採用漸變米色(#FDFBF7 → #F5F1EB) - 5. 6. **場景構圖**: - - 城市場景:融合地標建築+日常生活場景- - 俯瞰視角或等距視角(isometric) - - 加入人物小品增加敘事性和親切感- 7. 8. ** 視野密度** -景### 四、字體系統- - **Display Font**(標題): Serif字體,厚重有力(如Freight Display, Tiempos) - - **Body Font**(正文): Sans-serif,易讀性強(如Inter, Manrope) - - **字號比例Regular(400) / Medium(500) / Bold(700) - ### 五、交互細節- - **微動效**: 卡片懸停上浮4-8px,過渡時間300-400ms - - **加載狀態**: 使用骨架屏幕,保持品牌調性- - ** 768-1439px - - Mobile: 375-767px - - ### 六、設計輸出要求每次設計輸出時應包含: 1. 2. 清晰的視覺層級(透過尺寸/顏色/留白實現) 3. 4. prop. 8. 充足的呼吸空間(section間距≥120px) 9. 10. 明確的使用者行動路徑11. --- **設計哲學**: 用藝術化的視覺語言,傳遞品牌的獨特性和溫度感。每一個像素都服務於講述故事,而非單純的功能展示。設計應該讓使用者感受到"這是為懂生活的人準備的",而非冰冷的商業產品。

網頁插圖皆由nano banana pro生成