/* 统计卡片修复样式 - 确保在一行显示且文字清晰 */

.hero .container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 20px;
}

.hero-stats {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 20px !important;
    margin: 50px auto 0 !important;
    max-width: 1200px !important;
    width: 100% !important;
    clear: both !important;
}

.stat-card {
    background: rgba(255, 255, 255, 0.2) !important;
    padding: 25px 20px !important;
    border-radius: 8px !important;
    backdrop-filter: blur(10px) !important;
    text-align: center !important;
    width: 100% !important;
    box-sizing: border-box !important;
    display: block !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1) !important;
}

.stat-card strong {
    color: #FFFFFF !important;
    font-size: 2.5rem !important;
    font-weight: bold !important;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
}

.stat-card span {
    color: #FFFFFF !important;
    font-size: 1rem !important;
    font-weight: 500 !important;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.2) !important;
}

/* 备用方案：如果grid不工作，使用flexbox */
@media not (display: grid) {
    .hero-stats {
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        gap: 20px !important;
    }

    .stat-card {
        flex: 1 !important;
        min-width: 0 !important;
    }
}

/* 移动端优化 */
@media (max-width: 768px) {
    .hero-stats {
        gap: 8px !important;
        padding: 0 10px !important;
    }

    .stat-card {
        padding: 15px 8px !important;
    }

    .stat-card strong {
        font-size: 1.4rem !important;
    }

    .stat-card span {
        font-size: 0.7rem !important;
    }
}

/* 平板端优化 */
@media (max-width: 1024px) {
    .hero-stats {
        gap: 15px !important;
    }

    .stat-card {
        padding: 20px 15px !important;
    }

    .stat-card strong {
        font-size: 2rem !important;
    }

    .stat-card span {
        font-size: 0.85rem !important;
    }
}