/* 移动端适配 (Max Width 768px) */
@media screen and (max-width: 768px) {
    
    /* 1. 调整首屏文字大小 */
    .hero-content h1 {
        font-size: 42px; /* 电脑上是64px，手机上改小 */
        line-height: 1.2;
    }
    
    .hero-content p {
        font-size: 16px;
        padding: 0 20px; /* 防止文字贴边 */
    }

    /* 2. 调整导航栏布局 */
    header {
        padding: 15px 20px;
    }
    
    /* 手机上隐藏中间的导航链接，只保留 Logo 和 下载按钮 */
    /* 或者让它们变小 */
    .nav-links a:not([href*="app"]) {
        display: none; /* 暂时隐藏“功能”、“关于”，只留下载按钮 */
    }
    
    .logo {
        font-size: 20px;
    }

    /* 3. 功能特性区变为单列 */
    .features {
        padding: 60px 20px;
    }
    
    .section-title {
        font-size: 24px;
        margin-bottom: 40px;
    }
    
    .feature-grid {
        grid-template-columns: 1fr; /* 强制变为1列 */
        gap: 30px;
    }

    .feature-item {
        padding: 30px 20px;
    }

    /* 4. 页脚调整 */
    footer {
        padding: 40px 20px;
    }
    
    .footer-links {
        flex-direction: column; /* 垂直排列 */
        gap: 15px;
        margin-bottom: 20px;
    }

    /* 5. 调整文章页面的边距 */
    .article-container {
        margin-top: 80px;
        margin-bottom: 40px;
    }
    
    .article-content h1 {
        font-size: 24px;
    }