style(about): 调整卡片标题布局并优化兴趣项结构

- 修改 .card-header 样式，添加弹性布局实现标题与副标题对齐
- 新增 .card-subtitle 类用于副标题样式定义
- 调整兴趣项 HTML 结构，将 emoji 移出文本容器以优化显示效果
- 更新兴趣项描述文本内容，增强语义表达

css/about.css

@@ -665,19 +665,21 @@ body {
     overflow: hidden;
 }
 
-.card-header {
-    padding: 20px 25px;
-    border-bottom: 1px solid rgba(128, 128, 128, 0.1);
+.card-header { 
+    padding: 20px 25px; 
+    border-bottom: 1px solid rgba(128,128,128,0.1); 
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
 }
-
-.card-header h3 {
-    font-size: 1.1rem;
-    color: var(--text-primary);
-    margin: 0;
+.card-header h3 { 
+    font-size: 1.1rem; 
+    color: var(--text-primary); 
+    margin: 0; 
 }
-
-.card-header h3 {
-    background: var(--gradient-2);
+.card-subtitle {
+    font-size: 0.8rem;
+    background: var(--gradient-3);
     -webkit-background-clip: text;
     background-clip: text;
     color: transparent;