/* ── 首页样式 home.css ── */

*{
    box-sizing:border-box;
}

:root{
    --brand-primary:#f39800;
    --brand-primary-dark:#db3710;
    --brand-primary-soft:#fff4df;
    --brand-yellow:#fdd000;
    --brand-gold:#aa8534;
    --brand-gray:#9fa0a0;
    --brand-black:#000;
    --text-main:#1f1f1f;
    --text-muted:#777;
    --line:#eee7dc;
}

html{
    background:#fff;
    color:var(--text-main);
    -webkit-text-size-adjust:100%;
}

body{
    margin:0;
    font-family:"FZLanTingHeiS","Lantinghei SC",-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",Arial,sans-serif;
    background:#fff;
    color:var(--text-main);
}

a{
    color:inherit;
    text-decoration:none;
}

.page{
    width:min(720px,100% - 34px);
    margin:0 auto;
    padding:18px 0 42px;
}

/* ── 顶部导航 ── */
.topbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    padding:6px 0 18px;
    border-bottom:1px solid var(--line);
}

.brand{
    display:flex;
    align-items:center;
    gap:10px;
    min-width:0;
}

.brand-mark{
    width:auto;
    height:72px;
    border-radius:6px;
    display:block;
    object-fit:contain;
}

.nav{
    display:flex;
    align-items:center;
    gap:12px;
    color:#666;
    font-size:13px;
    white-space:nowrap;
}

.nav a:hover{
    color:var(--brand-primary-dark);
}
.nav-mb{
    display:none;
}

.nav-mb option:first-child{
    color:#777;
}

/* ── 简介区 ── */
.intro{
    padding:20px 0 14px;
}

.intro-kicker{
    color:var(--brand-gold);
    font-size:13px;
    line-height:1.4;
}

.intro h1{
    margin:8px 0 0;
    font-size:26px;
    line-height:1.28;
    font-weight:850;
    letter-spacing:-.01em;
}

.intro p{
    margin:8px 0 0;
    color:#777;
    font-size:14px;
    line-height:1.7;
}

/* ── 头条 ── */
.hero{
    padding:0;
    border-bottom:8px solid #f7f7f7;
    border-radius:6px;
    overflow:hidden;
}
.hero a{
    display:block;
    text-decoration:none;
}

.hero-image{
    position:relative;
    width:100%;
    aspect-ratio:16/9;
    background:#eee center / cover no-repeat;
}

.hero-overlay{
    position:absolute;
    bottom:0;
    left:0;
    right:0;
    padding:40px 16px 12px;
    background:linear-gradient(transparent 0%, rgba(0,0,0,.5) 30%, rgba(0,0,0,.8) 60%);
    color:#fff;
    pointer-events:none;
}
.hero-overlay .tag{
    display:inline-block;
    color:var(--brand-yellow);
    font-size:12px;
    font-weight:700;
    margin-bottom:3px;
}
.hero-overlay .hero-title{
    display:block;
    font-size:20px;
    line-height:1.3;
    font-weight:750;
    color:#fff;
    letter-spacing:-.01em;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}
.hero-overlay .summary{
    color:rgba(255,255,255,.75);
    font-size:13px;
    line-height:1.4;
    margin-top:3px;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}
.hero-overlay .meta{
    display:flex;
    gap:8px;
    color:rgba(255,255,255,.6);
    font-size:11px;
    margin-top:4px;
}

/* ── 资讯列表 ── */
.section-title{
    margin:20px 0 0;
    padding-bottom:9px;
    border-bottom:1px solid var(--line);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.section-title strong{
    font-size:17px;
}

.section-title a{
    color:var(--brand-primary-dark);
    font-size:13px;
}

/* 接待站 / 骑士营首页摘要 */
.jdz-home{
    margin:18px 0 0;
}

.jdz-home-stats{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:9px;
    margin:12px 0 4px;
}

.jdz-home-stat{
    display:flex;
    flex-direction:column;
    gap:3px;
    min-width:0;
    padding:12px 10px;
    border:1px solid var(--line);
    border-radius:7px;
    background:#fffaf2;
}

.jdz-home-stat .num{
    color:var(--brand-primary-dark);
    font-size:22px;
    line-height:1.1;
    font-weight:850;
}

.jdz-home-stat .label{
    color:#7a6250;
    font-size:12px;
    line-height:1.35;
}

.jdz-home-list{
    display:flex;
    flex-direction:column;
}

.jdz-home-note{
    margin:12px 0 0;
    color:var(--brand-gold);
    font-size:12px;
    line-height:1.4;
    font-weight:700;
}

.jdz-home-item{
    display:grid;
    grid-template-columns:36px minmax(0, 1fr) auto;
    align-items:center;
    gap:11px;
    padding:14px 0;
    border-bottom:1px solid var(--line);
}

.jdz-home-icon{
    display:grid;
    place-items:center;
    width:36px;
    height:36px;
    border-radius:50%;
    background:var(--brand-primary-soft);
    color:var(--brand-primary-dark);
    font-size:14px;
    font-weight:850;
}

.jdz-home-main{
    min-width:0;
}

.jdz-home-main strong{
    display:block;
    color:#222;
    font-size:16px;
    line-height:1.35;
    font-weight:780;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.jdz-home-main span{
    display:block;
    margin-top:4px;
    color:#888;
    font-size:12px;
    line-height:1.45;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.jdz-home-go{
    color:var(--brand-primary-dark);
    font-size:12px;
    font-weight:700;
}

.feed{
    display:flex;
    flex-direction:column;
}

.feed-item{
    display:grid;
    grid-template-columns:minmax(0,1fr) 112px;
    gap:14px;
    padding:16px 0;
    border-bottom:1px solid var(--line);
}

.feed-title{
    display:block;
    font-size:17px;
    line-height:1.42;
    font-weight:750;
    color:#222;
}

.feed-summary{
    margin-top:7px;
    color:#777;
    font-size:13px;
    line-height:1.55;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}

.feed-meta{
    margin-top:9px;
    color:#aaa;
    font-size:12px;
    line-height:1.4;
}

.feed-image{
    width:112px;
    height:78px;
    border-radius:5px;
    background:#eee center / cover no-repeat;
}

/* 图片新闻轮播 */

.news-carousel{
    position:relative;
    border-radius:8px;
    overflow:hidden;
    background:var(--text-main);
    border-bottom:8px solid var(--line);
}

.carousel-viewport{
    overflow:hidden;
}

.carousel-track{
    display:flex;
    transition:transform .45s ease;
    will-change:transform;
}

.carousel-slide{
    flex:0 0 100%;
    min-width:0;
}

.carousel-slide a{
    position:relative;
    display:block;
    aspect-ratio:16/9;
    color:#fff;
    text-decoration:none;
    overflow:hidden;
}

.slide-image{
    position:absolute;
    inset:0;
    background:#eee center / cover no-repeat;
    transform:scale(1.02);
}

.slide-overlay{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    padding:56px 18px 18px;
    background:linear-gradient(transparent 0%, rgba(0,0,0,.55) 36%, rgba(0,0,0,.86) 100%);
    pointer-events:none;
}

.slide-overlay .tag{
    display:inline-block;
    color:var(--brand-yellow);
    font-size:12px;
    font-weight:800;
    margin-bottom:5px;
}

.slide-title{
    display:block;
    color:#fff;
    font-size:22px;
    line-height:1.3;
    font-weight:850;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}

.slide-summary{
    display:block;
    margin-top:6px;
    color:rgba(255,255,255,.78);
    font-size:13px;
    line-height:1.45;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}

.slide-meta{
    display:block;
    margin-top:7px;
    color:rgba(255,255,255,.62);
    font-size:11px;
}

.carousel-btn{
    position:absolute;
    top:50%;
    width:34px;
    height:44px;
    margin-top:-22px;
    border:0;
    border-radius:8px;
    background:rgba(0,0,0,.36);
    color:#fff;
    font-size:34px;
    line-height:1;
    cursor:pointer;
    display:grid;
    place-items:center;
    transition:background .18s ease, transform .18s ease;
}

.carousel-btn:hover{
    background:rgba(0,0,0,.56);
    transform:translateY(-1px);
}

.carousel-btn.prev{
    left:12px;
}

.carousel-btn.next{
    right:12px;
}

.carousel-dots{
    position:absolute;
    left:0;
    right:0;
    bottom:10px;
    display:flex;
    justify-content:center;
    gap:7px;
    pointer-events:none;
}

.carousel-dots button{
    width:7px;
    height:7px;
    border:0;
    border-radius:999px;
    background:rgba(255,255,255,.48);
    padding:0;
    pointer-events:auto;
    cursor:pointer;
    transition:width .2s ease, background .2s ease;
}

.carousel-dots button.active{
    width:22px;
    background:#fff;
}

.news-carousel.single .carousel-btn,
.news-carousel.single .carousel-dots{
    display:none;
}

.state{
    margin:28px 0;
    padding:28px 18px;
    text-align:center;
    color:#777;
    background:#fafafa;
    border:1px solid #eee;
    border-radius:6px;
}

/* ── 手机版响应式 ── */
@media(max-width:560px){
    .page{
        width:calc(100% - 28px);
        padding-top:12px;
    }

    .topbar{
        align-items:center;
        padding-bottom:14px;
    }

    .brand-mark{
        height:58px;
    }

    .nav{
        flex-shrink:0;
    }
    .nav-dk{
        display:none;
    }
    .nav-mb{
        display:inline-block;
        padding:6px 28px 6px 10px;
        border:1px solid #ddd;
        border-radius:5px;
        font-size:13px;
        color:#555;
        background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23999'/%3E%3C/svg%3E") no-repeat right 8px center;
        -webkit-appearance:none;
        appearance:none;
        cursor:pointer;
        outline:none;
    }

    .intro{
        padding-top:16px;
    }

    .intro h1{
        font-size:23px;
    }

    .hero{
        border-radius:6px;
        overflow:hidden;
    }
    .hero-overlay{
        padding:32px 12px 10px;
    }
    .hero-overlay .hero-title{
        font-size:17px;
    }
    .hero-overlay .summary{
        font-size:12px;
        -webkit-line-clamp:2;
    }
    .hero-overlay .meta{
        font-size:11px;
    }

    .feed-item{
        grid-template-columns:minmax(0,1fr) 96px;
        gap:12px;
        padding:14px 0;
    }

    .feed-title{
        font-size:16px;
        display:-webkit-box;
        -webkit-line-clamp:2;
        -webkit-box-orient:vertical;
        overflow:hidden;
    }

    .feed-summary{
        display:none;
    }

    .feed-image{
        width:96px;
        height:70px;
    }

    .jdz-home-stats{
        gap:7px;
    }

    .jdz-home-stat{
        padding:10px 8px;
        border-radius:6px;
    }

    .jdz-home-stat .num{
        font-size:19px;
    }

    .jdz-home-stat .label{
        font-size:11px;
    }

    .jdz-home-item{
        grid-template-columns:32px minmax(0, 1fr) auto;
        gap:9px;
        padding:13px 0;
    }

    .jdz-home-icon{
        width:32px;
        height:32px;
        font-size:13px;
    }

    .jdz-home-main strong{
        font-size:15px;
    }

    .jdz-home-main span{
        font-size:11px;
    }

    .news-carousel{
        border-radius:7px;
        border-bottom-width:6px;
    }

    .carousel-slide a{
        aspect-ratio:4/3;
    }

    .slide-overlay{
        padding:42px 12px 26px;
    }

    .slide-overlay .tag{
        font-size:11px;
        margin-bottom:4px;
    }

    .slide-title{
        font-size:17px;
        line-height:1.32;
    }

    .slide-summary{
        display:none;
    }

    .slide-meta{
        margin-top:5px;
        font-size:10px;
    }

    .carousel-btn{
        display:none;
    }

    .carousel-dots{
        bottom:9px;
        gap:5px;
    }

    .carousel-dots button{
        width:6px;
        height:6px;
    }

    .carousel-dots button.active{
        width:18px;
    }
}

/* ── 免责声明弹窗 ── */
.modal-overlay{
    position:fixed;
    top:0;left:0;right:0;bottom:0;
    background:rgba(0,0,0,.5);
    z-index:1000;
    display:flex;
    align-items:center;
    justify-content:center;
    opacity:0;
    pointer-events:none;
    transition:opacity .2s;
}
.modal-overlay.active{
    opacity:1;
    pointer-events:auto;
}
.modal-box{
    background:#fff;
    border-radius:10px;
    width:min(420px,calc(100vw - 40px));
    max-height:80vh;
    overflow-y:auto;
    padding:24px;
}
.modal-box .modal-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:16px;
}
.modal-box .modal-title{
    font-size:16px;
    font-weight:700;
    color:#222;
}
.modal-box .modal-close{
    background:none;
    border:none;
    font-size:20px;
    cursor:pointer;
    color:#999;
    padding:0;
    line-height:1;
}
.modal-box .modal-body{
    font-size:14px;
    line-height:1.7;
    color:#555;
}
.modal-box .modal-body p{
    margin:0 0 12px;
}
.modal-box .modal-footer{
    margin-top:16px;
    text-align:center;
}
.modal-box .modal-confirm{
    padding:10px 32px;
    background:#222;
    color:#fff;
    border:none;
    border-radius:6px;
    font-size:14px;
    cursor:pointer;
}
.modal-box .modal-confirm:hover{
    background:#444;
}
