晨光咖啡品牌官网产品系统Vibe Coding

项目立项是为了解决本地咖啡门店缺乏线上品牌展示渠道的问题，顾客只能通过线下口碑了解门店，产品信息难以触达更多人。结合餐饮零售行业的线上化趋势，用轻量静态页面搭建品牌官网，帮助门店展示品牌故事与招牌产品，提升品牌形象并引流到店。

官网包含四大功能模块：一是顶部导航与首屏横幅，支持锚点跳转，横幅展示品牌口号与核心卖点；二是品牌故事模块，图文结合展示品牌发展历程与理念；三是招牌产品模块，三列卡片展示特色饮品与烘焙产品，支持悬停动效；四是门店数据与联系信息模块，展示品牌成果与地址。全站为静态单页，加载速度快。

我负责项目整体实现，包括页面结构设计、视觉风格定义、编码与多设备适配调试。技术栈为纯HTML5加CSS3，无第三方框架依赖，加载极快。亮点是用Flex与Grid布局实现PC和移动端响应式适配，顶部导航使用sticky定位与毛玻璃效果。难点是两端布局结构统一且视觉一致，通过媒体查询与弹性布局解决。