:root{--font-sans:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Helvetica,Arial,"PingFang SC","Microsoft YaHei",sans-serif;--text:#262626;--text-muted:#666;--line:#e5e5e5;--img-product-ratio:3 / 4;--img-product-max-h:520px}
*{box-sizing:border-box}
html{font-size:16px}
body{margin:0;color:var(--text);font-family:var(--font-sans);font-size:14px;font-weight:400;line-height:1.5;letter-spacing:0.01em;background:#fff;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:none}
.site{max-width:1280px;margin:0 auto;background:#fff}

/* 主导航栏（已去掉顶部登录那一行） */
.header{position:sticky;top:0;z-index:900;background:#fff;border-bottom:1px solid var(--line)}
.head-main{height:64px;position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px}
.logo{background:#d31334;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:18px;font-weight:600;flex-shrink:0;background: none;}
.logo img {width:40px;height:40px;border-radius:50%;}
.main-nav{display:flex;align-items:center;justify-content:center;flex:1;min-width:0}
.main-nav .nav-link{line-height:64px;padding:0 18px;font-size:15px;font-weight:400;color:#1a1a1a;position:relative;white-space:nowrap}
.main-nav .nav-link.active::after,.main-nav .nav-link:hover::after{content:"";position:absolute;left:18px;right:18px;bottom:0;height:2px;background:#000}
.btn-search-open{border:none;background:transparent;padding:8px 10px;font-size:15px;color:#333;cursor:pointer;white-space:nowrap;flex-shrink:0}
.btn-search-open:hover{color:#000}
.nav-mega-trigger{position:static}
.mega-dropdown{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;border-top:1px solid #ebebeb;box-shadow:0 12px 24px rgba(0,0,0,0.06);padding:20px 0 22px;z-index:901}
.nav-mega-trigger:hover .mega-dropdown{display:block}
.mega-dropdown h6{font-size:14px;font-weight:600;margin-bottom:10px;color:#111}
.mega-dropdown a{display:block;font-size:13px;color:#555;margin-bottom:8px;font-weight:400}
.mega-dropdown a:hover{color:#111}

/* 全屏搜索浮层 */
.search-overlay{position:fixed;inset:0;z-index:2000;background:rgba(0,0,0,0.45);display:none;align-items:flex-start;justify-content:center;padding:80px 16px 16px}
.search-overlay.is-open{display:flex}
.search-panel{width:min(560px,100%);background:#fff;padding:24px;box-shadow:0 8px 32px rgba(0,0,0,0.12)}
.search-panel h2{font-size:16px;font-weight:600;margin:0 0 16px;color:#111}
.search-row{display:flex;gap:10px;flex-wrap:wrap}
.search-input{flex:1;min-width:160px;border:1px solid #ccc;padding:12px 14px;font-size:15px;font-family:var(--font-sans)}
.search-input:focus{outline:none;border-color:#333}
.search-submit{border:none;background:#111;color:#fff;padding:12px 22px;font-size:15px;cursor:pointer;font-family:var(--font-sans)}
.search-submit:hover{background:#000}
.search-close{margin-top:14px;background:none;border:none;color:#666;font-size:14px;cursor:pointer;padding:0}
.search-close:hover{color:#111}
.hero{position:relative;overflow:hidden}
.hero-track{display:flex;transition:transform 0.45s ease}
.hero-slide{min-width:100%;min-height:480px;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;background-position:center;background-size:cover}
.hero-title{font-size:42px;font-weight:500;margin-bottom:8px;letter-spacing:0.02em;text-shadow:0 2px 12px rgba(0,0,0,0.2)}
.hero-sub{font-size:18px;font-weight:400;margin-bottom:20px;opacity:0.95;text-shadow:0 2px 8px rgba(0,0,0,0.18)}
.hero-btn{display:inline-block;border:1px solid rgba(255,255,255,0.6);border-radius:999px;color:#fff;padding:10px 28px;font-size:15px;font-weight:400;background:rgba(255,255,255,0.12);transition:background 0.2s,border-color 0.2s}
.hero-btn:hover{color:#fff;background:rgba(0,0,0,0.35);border-color:#fff}
.hero-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:40px;height:40px;border:1px solid rgba(255,255,255,0.5);border-radius:50%;background:rgba(255,255,255,0.9);color:#444;display:flex;align-items:center;justify-content:center;cursor:pointer}
.hero-prev{left:12px}
.hero-next{right:12px}
.hero-dots{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);display:flex;gap:8px;z-index:2}
.hero-dot{width:32px;height:3px;border:0;background:rgba(255,255,255,0.4);padding:0;cursor:pointer}
.hero-dot.active{background:rgba(255,255,255,0.95)}
.section{padding:40px 0 12px;border-top:1px solid #eee}
.section-title{text-align:center;font-size:32px;font-weight:400;margin-bottom:14px;color:#111;letter-spacing:0.04em}
.section-sub{text-align:center;font-size:14px;color:var(--text-muted);margin-bottom:18px;font-weight:400}
.module-menu{display:flex;justify-content:center;gap:28px;flex-wrap:wrap;border-bottom:1px solid #eee;margin-bottom:20px;padding-bottom:10px}
.module-menu-item{font-size:14px;color:#666;cursor:pointer;position:relative;padding:4px 0;font-weight:400}
.module-menu-item.active{color:#111}
.module-menu-item.active::after{content:"";position:absolute;left:0;right:0;bottom:-11px;height:2px;background:#000}

/* 商品图：与官网相近的竖版比例与可视高度 */
.good-card{text-align:left;margin-bottom:8px}
.good-card .img-wrap{width:100%;aspect-ratio:var(--img-product-ratio);max-height:var(--img-product-max-h);margin:0 auto;overflow:hidden;background:#f4f4f4}
.good-card .img-wrap img{width:100%;height:100%;object-fit:cover;display:block}
.good-name{margin:12px 0 4px;font-size:15px;font-weight:500;color:#111}
.good-desc{margin:0 0 6px;font-size:13px;color:#444;min-height:40px;line-height:1.45;font-weight:400}
.good-price{margin:0 0 4px;font-size:14px;font-weight:400;color:#111}
.buy-link{font-size:13px;color:#111;border-bottom:1px solid transparent;font-weight:400}
.buy-link:hover{border-bottom-color:#111}

/* 女士专区：横向滚动商品带 */
.women-scroll-wrap{position:relative;margin-top:8px}
.women-scroll-viewport{overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:thin;padding-bottom:6px}
.women-scroll-track{display:flex;gap:16px;width:max-content;padding:0 2px}
.women-scroll-item{flex:0 0 auto;width:clamp(200px,24vw,290px)}
@media (max-width:575.98px){.women-scroll-item{width:min(320px,calc(100vw - 40px))}
}.women-scroll-btn{position:absolute;top:42%;transform:translateY(-50%);z-index:2;width:36px;height:36px;border:1px solid #ddd;border-radius:50%;background:rgba(255,255,255,0.95);color:#555;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:14px}
.women-scroll-btn:hover{background:#fff;color:#111}
.women-scroll-btn.prev{left:-4px}
.women-scroll-btn.next{right:-4px}
@media (max-width:767.98px){.women-scroll-btn{display:none}
}

/* 男士、新季热卖：栅格列内同样图片比例 */
.men-scroll-wrap{position:relative;margin-top:8px}
.men-scroll-viewport{overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:thin;padding-bottom:6px}
.men-scroll-track{display:flex;gap:16px;width:max-content;padding:0 2px}
.men-scroll-item{flex:0 0 auto;width:clamp(200px,24vw,290px)}
@media (max-width:575.98px){.men-scroll-item{width:min(320px,calc(100vw - 40px))}
}.men-scroll-btn{position:absolute;top:42%;transform:translateY(-50%);z-index:2;width:36px;height:36px;border:1px solid #ddd;border-radius:50%;background:rgba(255,255,255,0.95);color:#555;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:14px}
.men-scroll-btn:hover{background:#fff;color:#111}
.men-scroll-btn.prev{left:-4px}
.men-scroll-btn.next{right:-4px}
@media (max-width:767.98px){.men-scroll-btn{display:none}
}

/*热卖榜单*/
.goods{margin-top:8px}
.hot-wrap{position:relative;overflow:hidden}
.hot-track{display:flex;transition:transform 0.35s ease}
.hot-slide{min-width:100%;display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.hot-item{border:1px solid #ededed;display:grid;grid-template-columns:1fr 1fr;min-height:280px}
.hot-item .img-wrap{aspect-ratio:1;max-height:420px;min-height:0;background:#f4f4f4;overflow:hidden}
.hot-item .img-wrap img{width:100%;height:100%;object-fit:cover;display:block}
.hot-body{padding:18px;text-align:left;display:flex;flex-direction:column;justify-content:center}
.solid-btn{width:fit-content;background:#111;color:#fff;border:0;padding:8px 16px;font-size:13px;font-family:var(--font-sans);cursor:pointer}
.solid-btn:hover{background:#000;color:#fff}
.hot-arrow{position:absolute;top:50%;transform:translateY(-50%);width:36px;height:36px;border:1px solid #dbdbdb;border-radius:50%;background:rgba(255,255,255,0.94);color:#666;display:flex;align-items:center;justify-content:center;cursor:pointer}
.hot-prev{left:6px}
.hot-next{right:6px}
.hot-prev, .hot-next{ position: absolute !important; z-index: 1 !important;}

.hot-dots{display:flex;justify-content:center;gap:8px;margin-top:12px}
.hot-dot{width:36px;height:3px;border:0;background:#d8d8d8;cursor:pointer;padding:0}
.hot-dot.active{background:#888}
.entry{padding:24px 0 40px}
.entry-card{position:relative;overflow:hidden;min-height:280px}
.entry-card .img-wrap{width:100%;aspect-ratio:16 / 10;max-height:400px;overflow:hidden;background:#eee}
.entry-card .img-wrap img{width:100%;height:100%;object-fit:cover;display:block}
.entry-btn{position:absolute;left:50%;transform:translateX(-50%);bottom:16px;background:#111;color:#fff;padding:10px 20px;font-size:14px;font-weight:400;white-space:nowrap}
.entry-btn:hover{background:#000;color:#fff}
.footer{background:#000;color:#fff;padding:36px 0 14px;font-size:13px}
.footer h6{font-size:15px;font-weight:500;margin-bottom:10px}
.footer a{color:#fff;opacity:0.88;display:block;margin-bottom:6px;font-size:13px;font-weight:400}
.footer-note{margin-top:16px;border-top:1px solid rgba(255,255,255,0.2);padding-top:10px;font-size:12px;text-align:center;color:#c8c8c8;font-weight:400;line-height:1.6}
.search-hit{outline:2px solid #111;outline-offset:2px}
.good-card.is-dim{opacity:0.25}
@media (max-width:991.98px){:root{--img-product-max-h:440px}
    .main-nav .nav-link{padding:0 10px;font-size:14px}
    .hero-slide{min-height:400px}
    .hero-title{font-size:34px}
    .hero-sub{font-size:16px}
    .section-title{font-size:28px}
    .hot-slide{grid-template-columns:1fr}
}@media (max-width:767.98px){.head-main{height:auto;flex-wrap:wrap;padding:10px 0}
    .main-nav{order:3;width:100%;justify-content:flex-start;overflow-x:auto;-webkit-overflow-scrolling:touch}
    .main-nav .nav-link{line-height:44px}
    .btn-search-open{order:2}
    .mega-dropdown{max-height:65vh;overflow-y:auto}
    .hero-slide{min-height:300px}
    .hero-title{font-size:26px}
    .hero-sub{font-size:14px}
    .section-title{font-size:24px}
}

/* 栏目页专用样式 */
.banner-wrap{padding:18px 0 12px}
.channel-banner{width:100%;aspect-ratio:16 / 5;object-fit:cover;display:block}
.channel-title{text-align:center;font-size:34px;font-weight:400;color:#222;margin:12px 0 18px}
.subnav{text-align:center;margin-bottom:14px}
.subnav a{color:#555;padding:0 15px;font-size:18px;border-right:1px solid #b7b7b7}
.subnav a:last-child{border:0}
.subnav a:hover{color:#111}
.breadcrumb{width:100%;max-width:1440px;font-size:16px;color:#707070;margin:10px auto;padding:5px 0 24px 0}
.breadcrumb span{color:#ccc;padding:0 12px}
.panel{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:14px 0}
.filter-head{display:flex;justify-content:space-between;align-items:center;font-size:16px;color:#666;margin-bottom:10px}
.btn-collapse{border:0;background:none;color:#666;font-size:14px}
.filter-row{display:flex;gap:12px;padding:10px 0}
.filter-label{width:56px;flex:0 0 auto;color:#666;font-size:16px;padding-top:2px}
.tags{display:flex;flex-wrap:wrap;gap:8px 12px}
.check-item{font-size:14px;color:#4f4f4f;display:inline-flex;align-items:center;gap:4px}
.check-item input{width:14px;height:14px}
.is-hidden{display:none}
.sort-bar{display:flex;justify-content:space-between;align-items:center;padding:12px 0 8px;color:#666;font-size:13px}
.sort-left button{border:0;background:none;color:#666;padding:25px;font-size:14px}
.sort-left .active{color:#111;font-weight:500}
.pager{text-align:right;color:#666;font-size:14px;margin:26px 0 47px}
.pager a{color:#666;margin:0 6px}
.entry{padding:24px 0 40px}
.entry-card{position:relative;overflow:hidden;min-height:280px}
.entry-card .img-wrap{width:100%;aspect-ratio:16 / 10;max-height:400px;overflow:hidden;background:#eee}
.entry-card .img-wrap img{width:100%;height:100%;object-fit:cover;display:block}
.entry-btn{position:absolute;left:50%;transform:translateX(-50%);bottom:16px;background:#111;color:#fff;padding:10px 20px;font-size:14px;font-weight:400;white-space:nowrap}
.entry-btn:hover{background:#000;color:#fff}
.footer{background:#000;color:#fff;padding:36px 0 14px;font-size:13px}
.footer h6{font-size:15px;font-weight:500;margin-bottom:10px}
.footer a{color:#fff;opacity:0.88;display:block;margin-bottom:6px;font-size:13px;font-weight:400}
.footer-note{margin-top:16px;border-top:1px solid rgba(255,255,255,0.2);padding-top:10px;font-size:12px;text-align:center;color:#c8c8c8;font-weight:400;line-height:1.6}
.search-hit{outline:2px solid #111;outline-offset:2px}
.good-card.is-dim{opacity:0.25}

/* 响应式 */
@media (max-width:991.98px){:root{--img-product-max-h:440px}
    .main-nav .nav-link{padding:0 10px;font-size:14px}
    .hero-slide{min-height:400px}
    .hero-title{font-size:34px}
    .hero-sub{font-size:16px}
    .section-title{font-size:28px}
    .hot-slide{grid-template-columns:1fr}
    .channel-title{font-size:30px}
    .subnav a{font-size:16px}
}@media (max-width:767.98px){.head-main{height:auto;flex-wrap:wrap;padding:10px 0}
    .main-nav{order:3;width:100%;justify-content:flex-start;overflow-x:auto;-webkit-overflow-scrolling:touch}
    .main-nav .nav-link{line-height:44px}
    .btn-search-open{order:2}
    .mega-dropdown{max-height:65vh;overflow-y:auto}
    .hero-slide{min-height:300px}
    .hero-title{font-size:26px}
    .hero-sub{font-size:14px}
    .section-title{font-size:24px}
    .channel-title{font-size:26px}
    .filter-row{display:block}
    .filter-label{width:auto;margin-bottom:6px;display:block}
}

/* 热卖/新品 轮播容器 */
.hot-slider-wrap{position:relative;margin-top:12px}
.hot-slider-viewport{overflow:hidden;width:100%}
.hot-slider-track{display:flex;transition:transform 0.4s ease}
.hot-slider-slide{min-width:100%}

/* 一行4个商品布局 */
.hot-slide-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
@media (max-width:991.98px){.hot-slide-grid{grid-template-columns:repeat(2,1fr)}
}@media (max-width:575.98px){.hot-slide-grid{grid-template-columns:1fr}
}

/* 箭头与指示器沿用你原有 hot 样式，保持一致 */
.hot-arrow{position:absolute;top:50%;transform:translateY(-50%);width:36px;height:36px;border:1px solid #dbdbdb;border-radius:50%;background:rgba(255,255,255,0.94);color:#666;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:10}
.hot-prev{left:-10px}
.hot-next{right:-10px}
.hot-arrow:hover{background:#fff;color:#111}

/* 指示器 dots 样式保持你原来风格 */
.hot-dots{display:flex;justify-content:center;gap:8px;margin-top:16px}
.hot-dot{width:36px;height:3px;border:none;background:#d8d8d8;cursor:pointer;padding:0}
.hot-dot.active{background:#888}

/* 筛选标签展示 */
.selected-tags{display:flex;gap:6px;margin-left:10px;flex:1}
.selected-tag{background:#f1f1f1;padding:3px 8px;border-radius:4px;font-size:13px;display:inline-flex;align-items:center;gap:4px}
.selected-tag .close{cursor:pointer;color:#999}
.selected-tag .close:hover{color:#000}

/* ======================================= */
/* ========== 商品详情页专用样式 ========== */
/* ======================================= */
.container-custom{width:100%;max-width:1200px;margin:0 auto;padding:0 20px}
.section-gap{margin-bottom:60px}
.breadcrumbs{padding:15px 0;font-size:12px;color:#666}
.breadcrumbs a{color:#666;margin:0 8px}
.breadcrumbs span{margin:0 4px}
.product-core{padding:30px 0}
.product-images{position:relative}
.main-img-container{width:100%;background:#f5f5f5;margin-bottom:20px;border-radius:4px;overflow:hidden}
.main-img{width:100%;height:auto;display:block;cursor:zoom-in}
.thumbnails-wrap{position:relative;width:100%;display:flex;align-items:center;gap:10px}
.thumb-btn{width:24px;height:24px;background:transparent;border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:16px;color:#666;flex-shrink:0}
.thumb-btn:hover{color:#111}
.thumbnails{display:flex;gap:12px;overflow-x:hidden;scroll-behavior:smooth;flex:1}
.thumbnail-item{width:80px;height:100px;flex-shrink:0;cursor:pointer;border:2px solid transparent;border-radius:4px;overflow:hidden;background:#f5f5f5;transition:all 0.2s ease}
.thumbnail-item:hover{border-color:#999;box-shadow:0 0 0 1px #999 inset}
.thumbnail-item.active{border-color:#666;box-shadow:0 0 0 1px #666 inset;background-color:#eee}
.thumbnail-img{width:100%;height:100%;object-fit:cover}
.product-info{padding-left:40px}
.product-name{font-size:24px;font-weight:400;margin-bottom:10px}
.product-sku{font-size:13px;color:#666;margin-bottom:20px}
.product-price{font-size:20px;font-weight:500;margin-bottom:30px}
.color-title{font-size:14px;font-weight:500;margin-bottom:15px}
.color-options{display:flex;gap:15px;margin-bottom:30px}
.color-item{display:flex;flex-direction:column;align-items:center;cursor:pointer}
.color-swatch{width:30px;height:30px;border-radius:50%;margin-bottom:5px;border:2px solid transparent}
.color-name.active {font-weight: bold;}
.color-item.active .color-swatch{border-color:#111; }
.color-name{font-size:13px}
.size-title{font-size:14px;font-weight:500;margin-bottom:15px}
.size-options{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:30px}
.size-item{width:auto; padding: 0 10px; height:45px;display:flex;align-items:center;justify-content:center;border:1px solid #eee;cursor:pointer;transition:all 0.3s}
.size-item:hover{border-color:#111}
.size-item.active{background:#111;color:#fff;border-color:#111}
.size-guide{font-size:13px;color:#0071e3;margin-bottom:30px;display:inline-block}
.quantity-title{font-size:14px;font-weight:500;margin-bottom:15px}
.quantity-selector{display:flex;align-items:center;gap:10px;margin-bottom:30px}
.quantity-btn{width:35px;height:35px;background:#fff;border:1px solid #eee;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:16px}
.quantity-btn:hover{border-color:#111}
.quantity-input{text-align:left;border:none;font-size:16px; background: none;}
.product-details{padding:40px 0;border-top:1px solid #eee}
.details-title{font-size:18px;font-weight:500;margin-bottom:20px}
.details-content{color:#333;line-height:1.8;margin-bottom:30px}
.details-content p{margin-bottom:15px}
.size-chart{margin-bottom:40px}
.chart-title{font-size:16px;font-weight:500;margin-bottom:15px}
.size-table{width:100%;border-collapse:collapse;margin-bottom:20px}
.size-table th,.size-table td{border:1px solid #eee;padding:12px;text-align:left;font-size:13px}
.size-table th{background:#f9f9f9;font-weight:500}
.asia-fit{background:#f9f9f9;padding:20px;margin-bottom:30px}
.asia-fit-title{font-size:14px;font-weight:500;margin-bottom:10px}
.asia-fit-desc{font-size:13px;color:#333;line-height:1.6}
.wash-guide{margin-bottom:30px}
.wash-title{font-size:16px;font-weight:500;margin-bottom:15px}
.wash-content{font-size:13px;color:#333;line-height:1.6}
@media (max-width:992px){.product-core .row{flex-direction:column}
    .product-info{padding-left:0;margin-top:30px}
}@media (max-width:576px){.product-name{font-size:20px}
    .product-price{font-size:18px}
}
.price-wrap{display:flex;align-items:center;gap:10px;margin-bottom:30px;padding-bottom:15px;border-bottom:1px solid #eee}
.price-label{font-size:14px;color:#666}
.product-price{font-size:24px;font-weight:600;color:#111}
.spec-group{margin-bottom:25px}
.spec-title{font-size:15px;font-weight:500;margin-bottom:12px;color:#333}
.spec-options{display:flex;flex-wrap:wrap;gap:12px}
.color-item{padding:8px 15px;border:1px solid #eee;border-radius:4px;font-size:14px;cursor:pointer;transition:all 0.2s ease}
.color-item.active{background:#111;color:#fff;border-color:#111}
.size-item{width:50px;height:50px;border-radius:4px;font-size:14px;display:flex;align-items:center;justify-content:center;border:1px solid #eee;cursor:pointer;transition:all 0.2s ease}
.size-item:hover{border-color:#111}
.size-item.active{background:#111;color:#fff;border-color:#111}
.size-guide-wrap{margin-bottom:20px;padding-bottom:15px;border-bottom:1px solid #eee}
.size-guide{font-size:14px;color:#0071e3}
.size-guide:hover{text-decoration:underline}
.quantity-group{margin-bottom:30px;padding-bottom:20px;border-bottom:1px solid #eee}
.stock-tip{font-size:15px;color:#333;margin-top:8px}
.stock-num{color:#d31334;font-weight:600;font-size:16px}
.product-attrs{display:flex;flex-direction:column;gap:12px;padding-top:10px}
.attr-item{display:flex;align-items:flex-start}
.attr-label{width:60px;flex:0 0 auto;font-size:14px;color:#666}
.attr-value{flex:1;font-size:14px;color:#333;line-height:1.5}
@media (max-width:992px){.product-info{padding-left:0;margin-top:30px}
}



/* ======================================= */
/* ========== 文章列表页专用样式 ========== */
/* ======================================= */
.article-list{padding:30px 0;min-height:calc(100vh - 265px)}
.article-list-title{font-size:32px;font-weight:400;color:#111;margin-bottom:40px;text-align:left;letter-spacing:0.04em}
.article-list-wrap{display:flex;flex-direction:column;gap:30px}
.article-item{display:flex;gap:15px;align-items:center;padding:10px;border:1px solid #eee;margin-bottom:10px}
.article-content{flex:1}
.article-cover img{width:150px;height:100px;object-fit:cover}
.article-item:last-child{border-bottom:none;padding-bottom:0}
.article-link{display:flex;gap:24px;align-items:flex-start}
.article-cover{flex:0 0 320px;aspect-ratio:16 / 10;border-radius:8px;overflow:hidden;background:#f5f5f5}
.article-cover img{width:100%;height:100%;object-fit:cover;transition:transform 0.3s ease}
.article-link:hover .article-cover img{transform:scale(1.05)}
.article-content{flex:1;display:flex;flex-direction:column;justify-content:space-between;min-height:180px}
.article-title{font-size:20px;font-weight:500;color:#111;margin-bottom:12px;line-height:1.4;transition:color 0.3s ease}
.article-link:hover .article-title{color:#0071e3}
.article-desc{font-size:14px;color:#666;line-height:1.6;margin-bottom:16px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.article-meta{display:flex;gap:24px;font-size:13px;color:#999}
.pagination-wrap{margin-top:50px;text-align:center}
.pagination-wrap .pagination{display:inline-flex;gap:8px;align-items:center}
.pagination-wrap .page-item .page-link{border:1px solid #eee;border-radius:4px;padding:8px 14px;font-size:14px;color:#666;background:#fff;transition:all 0.3s ease}
.pagination-wrap .page-item.active .page-link{background:#111;color:#fff;border-color:#111}
.pagination-wrap .page-item .page-link:hover{border-color:#111;color:#111}
.pagination-wrap .page-item.disabled .page-link{opacity:0.5;cursor:not-allowed}
@media (max-width:992px){.article-link{flex-direction:column}
    .article-cover{flex:0 0 auto;width:100%}
    .article-content{min-height:auto}
    .article-list-title{font-size:28px}
}@media (max-width:576px){.article-list-title{font-size:24px;margin-bottom:30px}
    .article-title{font-size:18px}
    .article-meta{flex-direction:column;gap:8px}
}





/* 详情页专属样式（按需调整） */
.article-detail {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px 0;
}
.article-detail-header {
    text-align: center;
    margin-bottom: 30px;
    padding-bottom: 20px;
    border-bottom: 1px solid #eee;
}
.article-detail-title {
    font-size: 28px;
    font-weight: bold;
    margin-bottom: 15px;
}
.article-detail-meta {
    color: #999;
    font-size: 14px;
}
.article-detail-meta span {
    margin: 0 10px;
}
.article-detail-cover {
    text-align: center;
    margin: 30px 0;
}
.article-detail-cover img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
}
.article-detail-content {
    line-height: 1.8;
    font-size: 16px;
    color: #333;
    padding: 0 10px;
}
.article-detail-content p {
    margin-bottom: 15px;
}
.back-list {
    margin: 30px 0;
    text-align: center;
}
.back-list a {
    padding: 8px 20px;
    border: 1px solid #007bff;
    color: #007bff;
    border-radius: 4px;
    text-decoration: none;
}
.back-list a:hover {
    background: #007bff;
    color: #fff;
}


/* ========== 全局布局：解决footer上顶问题 ========== */
html, body {
    height: 100%; /* 根元素占满可视区高度 */
    margin: 0;
    padding: 0;
}
body {
    display: flex;
    flex-direction: column; /* 垂直排列：header → main-content → footer */
}
/* 主体内容容器：自动撑满剩余高度 */
.main-content {
    flex: 1;
    width: 100%;
}

/* ========== 优化详情页内容区最小高度（可选增强） ========== */
.article-detail-content {
    min-height: 400px; /* 保证内容区至少有400px高度，避免内容过少时过于空旷 */
    line-height: 1.8;
    font-size: 16px;
    color: #333;
    padding: 0 10px;
}