/* 首页 样式重构/定制 - 独立覆盖文件 */

/* 1. 结构外壳：放宽页面的主要容器到 1200px 范围 */
.top-special,
.top-featured,
.top-procedure-container,
.popular-destinations,
.top-special-wrapper,
.popular-destinations-wrapper {
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    overflow: visible !important;
    position: relative !important;
}

/* 2. 内容核心区：统一设为 1200px 并强制裁剪溢出 */
/* 这能解决 Swiper 的露边 bug，并保持全页垂直线对齐 */
.top-popular-routes-container,
.top-notice-box,
.top-special-swiper,
.popular-destinations-swiper,
.top-special-advantages,
.top-cta-content,
.top-hot,
.top-ad-banner,
.top-procedure-steps {
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    overflow: hidden !important;
}

/* 3. 页脚特殊处理 */
/* .footer-license {
    width: 1160px !important;
    max-width: 100% !important;
} */

/* 4. 响应式：小于 1200px 时回退到百分比宽度+内边距 */
@media screen and (max-width: 1199px) {
    /* 给外层容器应用左右安全边距 */
    .top-popular-routes-container,
    .top-notice-box,
    .top-special-advantages,
    .top-cta-content,
    .top-hot,
    .top-ad-banner,
    .top-procedure-container,
    .top-procedure-steps {
        padding-left: 20px !important;
        padding-right: 20px !important;
        max-width: 100% !important;
    }

    /* 轮播图与外层大容器左右无间距，实现通栏铺满效果 */
    .top-special-swiper,
    .popular-destinations-swiper,
    .top-special,
    .popular-destinations {
        padding-left: 0 !important;
        padding-right: 0 !important;
        max-width: 100% !important;
    }
}

/* 5. 分页器居中（填补可能丢失的样式） */
.popular-destinations-pagination {
    display: flex;
    justify-content: center;
    margin-top: 24px;
    width: 100%;
}

/* 5. 热门目的地：随着宽度增加，适当调高行高以维持比例（从250px到290px） */
.popular-destinations-page {
    grid-auto-rows: 290px !important;
}