/* --- 主页: 英雄区域 --- */
.hero-section {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 80px 0;
    gap: 40px;
}

.hero-text {
    flex: 1;
    max-width: 500px;
}

/* .hero-top-info {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 8px;
}

.hero-top-info p {
    margin-bottom: 0;
} */

/* 修改居中文本样式 */
.feature-text-centered {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    max-width: 800px;
}

    .feature-text-centered ul {
        display: flex;
        flex-direction: column;
        align-items: center; /* 使所有列表项居中 */
        padding-left: 0;
        list-style: none;
    }

        .feature-text-centered ul li {
            text-align: center;
            margin-bottom: 0.8em;
            width: 100%; /* 确保每行宽度充满容器 */
            display: flex;
            justify-content: center; /* 使每行文本居中 */
        }

/* 确保在小屏幕上也能正确显示 */
@media (max-width: 768px) {
    .feature-text-centered ul {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

        .feature-text-centered ul li {
            text-align: center;
            display: flex;
            justify-content: center;
        }
}

.download-stats-display {
    /* 确保它与前面的文本有视觉分离，可以是一个空格或者一个小的左外边距 */
    margin-left: 10px; /* 添加一个小左外边距，模拟自然间距 */
    font-size: 1rem; /* 下载统计文本的基础字号 */
    color: var(--text-color);
    white-space: nowrap; /* 防止“总下载量: XXXXX”换行 */
}

.download-stats-number {
    font-size: 1.2em; /* 数字比周围文字稍大 */
    font-weight: 700; /* 数字加粗 */
    color: var(--primary-color); /* 数字使用主蓝色，非渐变 */
}
/* END CHANGES */

.main-headline {
    font-size: 4rem;
    font-weight: 700;
    margin-bottom: 1rem;
}

.sub-headline {
    font-size: 1.2rem;
    max-width: 450px;
    margin-bottom: 2rem;
}

.action-buttons {
    display: flex;
    gap: 15px;
}

.hero-image-wrapper {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* --- 主页: 特性介绍区 --- */
.features-wrapper {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin: 100px 0;
}

.feature-section {
    padding: 60px 0;
    border-top: 1px solid var(--secondary-color);
}

.features-wrapper .feature-section:first-child {
    border-top: none;
}

.feature-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 60px;
}

.feature-text {
    flex: 1;
    max-width: 480px;
}

    .feature-text h2 {
        font-size: 2.5rem;
        font-weight: 700;
        margin-bottom: 1rem;
        color: var(--headline-color);
    }

    .feature-text p {
        font-size: 1.1rem;
        color: var(--text-color);
    }

    .feature-text ul {
        list-style: none;
        padding-left: 0;
        text-align: left;
    }

.feature-text ul li {
    margin-bottom: 0.5em;
    font-size: 1.1rem;
    color: var(--text-color);
}

/* --- **最终修正**: 重写双列清单样式 --- */


/* 直接定义清单布局 */
.feature-checklist {
    display: flex; /* 使用 flex 布局创建双列 */
    gap: 60px; /* 定义两列之间的固定间距 */
    margin-top: 20px;
    /* 作为一个块级元素，它会自动向左与上方的标题对齐 */
}

    /* 定义勾选符号的样式 */
    .feature-checklist .highlight-blue {
        margin-right: 8px;
    }

.feature-image {
    flex: 1;
}

.feature-section-reversed .feature-container {
    flex-direction: row-reverse;
}

/* --- 主页: 响应式设计 --- */
@media (max-width: 768px) {
    .hero-section,
    .feature-container {
        flex-direction: column;
        text-align: center;
    }

    .feature-section-reversed .feature-container {
        flex-direction: column;
    }

    .sub-headline, .feature-text {
        margin-left: auto;
        margin-right: auto;
    }

    .action-buttons {
        justify-content: center;
    }

    .main-headline {
        font-size: 3rem;
    }

    .feature-text h2 {
        font-size: 2.2rem;
    }

    .features-wrapper {
        margin: 60px 0;
    }

    .feature-text {
        max-width: 100%;
        margin-bottom: 30px;
    }

    /* 在小屏幕上，让清单作为一个整体居中，但内部文字保持左对齐 */
    .feature-checklist {
        display: inline-flex; /* 让其可以被父元素的 text-align:center 影响 */
        text-align: left; /* 确保内部文字依然是左对齐的 */
    }

    /* START CHANGES */
    /* 移除了 hero-top-info 的响应式样式，因为它已被移除 */
    /* .hero-top-info {
        flex-direction: column;
        gap: 5px;
        align-items: center;
    } */

    /* 在小屏幕上，如果文字和下载量过长，允许换行，但整体段落居中 */
    .hero-text p {
        text-align: center;
    }

    .download-stats-display {
        margin-left: 0; /* 在小屏幕上，如果换行了就不需要左边距了 */
        display: block; /* 强制换行到下一行，以避免在小屏幕上过于拥挤 */
    }
}

/* --- 主页下载模块的样式 --- */
.home-download-section {
    padding: 80px 0;
    border-top: 1px solid var(--secondary-color);
    margin-top: 100px;
}