/* 
 * 网站宽度加宽样式
 * 覆盖Bootstrap默认的container限制，实现更宽的布局
 */

/* 加宽主要容器 */
.container {
    max-width: 1400px !important; /* 从默认的1140px增加到1400px */
}

/* 超大屏幕适配 */
@media (min-width: 1400px) {
    .container {
        max-width: 1600px !important; /* 超大屏幕使用1600px */
    }
}

@media (min-width: 1800px) {
    .container {
        max-width: 1800px !important; /* 4K屏幕使用1800px */
    }
}

/* 制造展示区域特别加宽 */
.manufacturing-section .container {
    max-width: 1600px !important;
}

@media (min-width: 1400px) {
    .manufacturing-section .container {
        max-width: 1800px !important;
    }
}

@media (min-width: 1800px) {
    .manufacturing-section .container {
        max-width: 2000px !important;
    }
}

/* 调整内容区域的最大宽度 */
.section-text {
    max-width: 1200px !important; /* 从960px增加到1200px */
}

.sustainability-section .section-subtitle {
    max-width: 1200px !important; /* 从1000px增加到1200px */
}

/* 统计数据行的加宽适配 */
.stats-row {
    padding: 0 100px; /* 减少左右内边距以利用更多空间 */
}

@media (min-width: 1600px) {
    .stats-row {
        padding: 0 200px;
    }
}

@media (min-width: 1800px) {
    .stats-row {
        padding: 0 300px;
    }
}

/* 产品网格的加宽适配 */
@media (min-width: 1400px) {
    .products-section .container {
        max-width: 1600px !important;
    }
    
    .product-grid .row {
        justify-content: space-around;
    }
    
    .product-grid .col-md-3 {
        flex: 0 0 auto;
        width: auto;
        margin: 0 20px;
    }
}

/* 新闻区域的加宽适配 */
@media (min-width: 1400px) {
    .news-section .container {
        max-width: 1600px !important;
    }
    
    .news-grid .row {
        justify-content: space-between;
    }
}

/* 导航栏的加宽适配 */
@media (min-width: 1400px) {
    .main-nav {
        left: 200px;
        width: calc(100% - 400px);
    }
    
    .nav-link {
        padding: 0 20px;
        font-size: 14px;
    }
}

@media (min-width: 1800px) {
    .main-nav {
        left: 300px;
        width: calc(100% - 600px);
    }
    
    .nav-link {
        padding: 0 25px;
        font-size: 16px;
    }
}

/* Hero内容区域加宽 */
@media (min-width: 1600px) {
    .hero-content {
        left: 200px;
    }
}

@media (min-width: 1800px) {
    .hero-content {
        left: 300px;
    }
}

/* 页脚内容加宽 */
@media (min-width: 1400px) {
    .footer-content {
        padding: 70px 100px 30px;
    }
}

@media (min-width: 1800px) {
    .footer-content {
        padding: 70px 200px 30px;
    }
}