视觉设计规范 Style Guide v1.0
本规范约束全站视觉一致性，所有新增页面须遵循以下令牌。
1. 品牌色彩
主色 · 深林绿#1E5B3E
强调色 · 翠绿#3FA46A
辅色 · 木棕#A8763E
深色底 · 墨绿#122B1F
浅底 · 灰绿#F4F7F5
语义：主色用于品牌识别、主要按钮与链接强调；木棕仅用于价格与木质感元素；深色底用于数据带/页脚；正文 #1C2320，辅助文字 #4C5A53。
2. 字体与字阶
H1 页面主标题 · clamp(32→58px) · 800
H3 卡片标题 · 19px / 700
正文 · 16px / 行高 1.7 / #4C5A53（辅助信息）
辅助说明 · 13px · 用于标签、说明与页脚
字体栈："Noto Sans SC","PingFang SC","Microsoft YaHei"。数字与英文可搭配 Inter。
3. 按钮
全圆角胶囊形（999px）；每屏仅一个主要按钮组；移动端按钮高度≥40px。
4. 间距与圆角
- 区块垂直间距：
88px（section padding） - 栅格间距：
26px；页面容器宽1200px，左右留白 20px - 卡片圆角：
14px；缩略图/表单控件：10–12px - 阴影：
0 10px 30px rgba(18,43,31,.10)
5. 断点（移动优先）
≥700px：双列网格≥1024px：桌面导航显示，三/四列网格，筛选栏吸附<1024px：汉堡菜单抽屉导航- 覆盖需求文档断点：360 / 768 / ≥1200
6. 图片规范
- 产品主图：1:1，白底或浅灰渐变底，≥1000px
- 场景/Banner 图：16:10 与 3:2，统一暖调、自然光
- 统一
loading="lazy"+object-fit:cover，上传时后台自动生成多尺寸缩略图 - 所有图片须带描述性 alt（SEO/GEO 要求）