/* 关于页面专用样式 */

/* 技术栈网格布局 */
.tech-stack-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 0.8rem;
    margin: 2rem 0;
}

/* GitHub项目容器样式 */
#github-projects-container {
    margin: 2rem 0;
}

/* 关于页面整体样式 */
.about-page {
    max-width: 800px;
    margin: 0 auto;
    padding: 2rem 1rem;
}

.about-page h1 {
    font-size: 2rem;
    margin-bottom: 1rem;
    text-align: center;
    font-family: "HarmonyOS Sans", "PingFang SC", "Microsoft YaHei";
    color: #1D1D1F;
}

.about-page h2 {
    font-size: 1.5rem;
    margin: 2rem 0 1rem 0;
    border-bottom: 1px solid #eee;
    padding-bottom: 0.5rem;
    font-family: "HarmonyOS Sans", "PingFang SC", "Microsoft YaHei";
    color: #1D1D1F;
}

.about-page ul {
    margin: 1rem 0;
    padding-left: 1.5rem;
    color: #1D1D1F;
}

.about-page li {
    margin-bottom: 0.5rem;
    color: #1D1D1F;
}

/* 夜间模式样式 */
.dark-theme .about-page h1,
.dark-theme .about-page h2 {
    color: #E5E5EA;
}

.dark-theme .about-page h2 {
    border-bottom-color: #333333;
}

.dark-theme .about-page ul,
.dark-theme .about-page li {
    color: #CCCCCC;
}

/* 响应式设计 */
@media (max-width: 768px) {
    .tech-stack-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.6rem;
    }
    
    .about-page {
        padding: 1rem 0.5rem;
    }
}