介绍：

一、风格匹配

• 主色调：蓝紫色科技风格
• 背景：深色主背景 + 紫色渐变点缀
• 组件：科技感卡片 + 悬浮光效

二、视觉元素

1. 动态粒子背景（营造科技氛围）
2. 卡片悬浮动画 + 边缘光效
3. 渐变色按钮 & 渐变色标题
4. 毛玻璃（Glassmorphism）卡片背景

三、内容结构

• 顶部：协会 Logo + 主标题
• 副标题：协会简介一句话
• 中部：6 个功能导航卡片（可增减）
• 底部：版权信息 & 联系方式

四、交互体验

• 平滑悬停动画
• 响应式布局（PC / 平板 / 手机自动适配）
• 清晰的信息层级

五、使用说明

1. 替换 logo 图片为自己的实际 logo
2. 修改 6 个导航卡片的：
   • 标题
   • 描述
   • 跳转链接
3. 更新页脚中的版权信息与联系方式
4. 如需增减导航项：
   • 复制/删除 .nav-card 区块即可
5. 调整配色：在 :root 变量里修改颜色值即可一键换肤

演示图：

下载地址：