/* ============================================
   XXCF 传奇私服发布网 - 主样式表
   设计风格：暗色游戏风 + 金色点缀，热血传奇氛围
   ============================================ */

/* ---------- 基础重置 ---------- */
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
    font-family:"Microsoft YaHei","PingFang SC","WenQuanYi Micro Hei",sans-serif;
    background:#0d0d12 url("../images/bg-body.jpg") repeat;
    color:#d8d8e0;
    font-size:14px;
    line-height:1.7;
}
a { color:#e8c15a; text-decoration:none; transition:color .2s; }
a:hover { color:#ffd966; }
ul { list-style:none; }
img { max-width:100%; height:auto; border:none; }
.container { width:1180px; margin:0 auto; }

/* ---------- 通用组件 ---------- */
.section { padding:35px 0; }
.section-title {
    display:flex; align-items:center; justify-content:space-between;
    border-left:5px solid #c9a227; padding-left:14px; margin-bottom:22px;
}
.section-title h2 { font-size:22px; color:#f0d77a; letter-spacing:1px; }
.section-title h2 small { font-size:13px; color:#8a8a98; font-weight:normal; margin-left:8px; }
.section-title .more { font-size:13px; color:#c9a227; }
.section-title .more:hover { color:#ffd966; }

/* 按钮 */
.btn {
    display:inline-block; padding:7px 18px; background:linear-gradient(180deg,#c9a227,#8a7018);
    color:#1a1a12; font-weight:bold; border-radius:3px; border:1px solid #e8c15a;
    text-align:center; cursor:pointer; font-size:13px;
}
.btn:hover { background:linear-gradient(180deg,#e8c15a,#c9a227); color:#000; }

.btn-sm { padding:4px 12px; font-size:12px; }

/* 标签 */
.tag { display:inline-block; padding:2px 8px; border-radius:2px; font-size:12px; font-weight:bold; }
.tag-hot { background:#c0392b; color:#fff; }
.tag-new { background:#2788c4; color:#fff; }
.tag-rec { background:#d48806; color:#fff; }
.tag-grey { background:#555; color:#ddd; }

/* 面板 */
.panel {
    background:linear-gradient(180deg,#1a1a24,#14141c);
    border:1px solid #2a2a38; border-radius:5px; padding:20px;
    margin-bottom:22px;
}
.panel h3 { color:#f0d77a; font-size:16px; margin-bottom:14px; border-bottom:1px dashed #333; padding-bottom:8px; }

/* ---------- 顶部导航 ---------- */
.navbar {
    background:linear-gradient(180deg,#1c1c28,#0f0f16);
    border-bottom:2px solid #c9a227; position:sticky; top:0; z-index:999;
    box-shadow:0 2px 10px rgba(0,0,0,.6);
}
.nav-inner { display:flex; align-items:center; height:60px; }
.logo { display:flex; align-items:baseline; gap:8px; text-decoration:none; }
.logo-text { font-size:26px; font-weight:900; color:#e8c15a; text-shadow:0 0 8px rgba(232,193,90,.5); letter-spacing:1px; }
.logo em { font-style:normal; font-size:13px; color:#b0b0be; }
.nav-menu { display:flex; margin-left:32px; }
.nav-menu li { margin-right:2px; }
.nav-menu li a {
    display:block; padding:8px 16px; color:#d8d8e0; font-size:15px; font-weight:bold;
    border-radius:3px 3px 0 0; position:relative;
}
.nav-menu li a:hover { color:#ffd966; background:rgba(232,193,90,.08); }
.nav-menu li.active a { color:#1a1a12; background:#c9a227; }

.nav-search { margin-left:auto; }
.nav-search form { display:flex; }
.nav-search input {
    width:200px; padding:7px 10px; border:1px solid #3a3a4a; border-radius:3px 0 0 3px;
    background:#0d0d14; color:#ddd; outline:none; font-size:13px;
}
.nav-search input:focus { border-color:#c9a227; }
.nav-search button {
    padding:7px 14px; border:none; background:#c9a227; color:#1a1a12; font-weight:bold;
    border-radius:0 3px 3px 0; cursor:pointer;
}
.nav-search button:hover { background:#e8c15a; }

/* ---------- 面包屑 ---------- */
.breadcrumb { background:#12121a; border-bottom:1px solid #222; padding:10px 0; font-size:13px; color:#8a8a98; }
.breadcrumb a { color:#c9a227; }
.breadcrumb a:hover { color:#ffd966; }

/* ---------- 首页 Hero ---------- */
.hero {
    background:linear-gradient(rgba(13,13,18,.55),rgba(13,13,18,.95)), url("../images/bg-hero.jpg") center/cover no-repeat;
    padding:50px 0 40px; text-align:center; border-bottom:1px solid #2a2a38;
}
.hero h1 { font-size:36px; color:#f0d77a; text-shadow:0 0 16px rgba(232,193,90,.4); margin-bottom:14px; letter-spacing:1px; }
.hero p.lead { font-size:16px; color:#c8c8d4; max-width:760px; margin:0 auto 24px; }
.hero-stats { display:flex; justify-content:center; gap:50px; margin-top:20px; }
.hero-stats .stat { text-align:center; }
.hero-stats .num { font-size:32px; font-weight:900; color:#e8c15a; display:block; }
.hero-stats .lbl { font-size:13px; color:#9a9aa6; }

/* ---------- 表格（开服表/排行榜） ---------- */
.data-table { width:100%; border-collapse:collapse; background:#12121a; }
.data-table th {
    background:linear-gradient(180deg,#2a2a3a,#1a1a26); color:#f0d77a;
    padding:12px 10px; text-align:left; font-size:14px; border-bottom:2px solid #c9a227;
}
.data-table td { padding:11px 10px; border-bottom:1px solid #222; color:#d0d0dc; }
.data-table tr:hover td { background:rgba(232,193,90,.05); }
.data-table .svr-name { font-weight:bold; color:#e8e8f0; }
.data-table .svr-name a { color:#e8e8f0; }
.data-table .svr-name a:hover { color:#ffd966; }
.data-table .ver { color:#8ec5f0; }
.data-table .online { color:#5fd07a; font-weight:bold; }
.data-table .score { color:#ffb84d; }

/* ---------- 卡片列表（资讯/攻略） ---------- */
.card-list { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.card {
    background:linear-gradient(180deg,#1a1a24,#14141c);
    border:1px solid #2a2a38; border-radius:5px; padding:18px; transition:border-color .2s,transform .2s;
}
.card:hover { border-color:#c9a227; transform:translateY(-2px); }
.card .cat { font-size:12px; color:#c9a227; }
.card h3 { font-size:17px; margin:8px 0; }
.card h3 a { color:#e8e8f0; }
.card h3 a:hover { color:#ffd966; }
.card .desc { color:#9a9aa6; font-size:13px; margin-bottom:10px; }
.card .meta { font-size:12px; color:#6a6a76; display:flex; justify-content:space-between; }

/* 侧边栏 */
.sidebar .panel { padding:16px; }
.side-list li { padding:8px 0; border-bottom:1px dashed #2a2a38; display:flex; justify-content:space-between; font-size:13px; }
.side-list li:last-child { border-bottom:none; }
.side-list li a { color:#d0d0dc; flex:1; margin-right:10px; }
.side-list li a:hover { color:#ffd966; }
.side-list .date { color:#6a6a76; font-size:12px; white-space:nowrap; }

/* 两栏布局 */
.layout-2col { display:flex; gap:24px; }
.layout-2col .main { flex:1; min-width:0; }
.layout-2col .sidebar { width:320px; flex-shrink:0; }

/* ---------- 文章正文 ---------- */
.article-header { margin-bottom:20px; }
.article-header h1 { font-size:26px; color:#f0d77a; margin-bottom:12px; line-height:1.4; }
.article-header .info { font-size:13px; color:#7a7a86; border-bottom:1px dashed #333; padding-bottom:12px; }
.article-header .info span { margin-right:18px; }
.article-body { font-size:15px; line-height:2; color:#d8d8e0; }
.article-body p { margin-bottom:18px; text-indent:2em; }
.article-body h2 { font-size:20px; color:#e8c15a; margin:26px 0 14px; border-left:4px solid #c9a227; padding-left:12px; }
.article-body h3 { font-size:17px; color:#f0d77a; margin:20px 0 10px; }
.article-body ul { margin:0 0 18px 2em; }
.article-body li { margin-bottom:8px; list-style:disc; }
.article-body strong { color:#ffd966; }

/* ---------- 下载项 ---------- */
.download-item {
    display:flex; align-items:center; gap:16px; padding:16px;
    border-bottom:1px solid #222;
}
.download-item:last-child { border-bottom:none; }
.download-item .icon { width:52px; height:52px; background:#c9a227; border-radius:6px; flex-shrink:0;
    display:flex; align-items:center; justify-content:center; font-size:22px; color:#1a1a12; font-weight:bold; }
.download-item .info { flex:1; }
.download-item .info h4 { font-size:16px; color:#e8e8f0; margin-bottom:5px; }
.download-item .info p { color:#8a8a98; font-size:13px; }

/* ---------- 关于我们 ---------- */
.about-block { margin-bottom:26px; }
.about-block h2 { font-size:20px; color:#e8c15a; margin-bottom:14px; }
.about-block p { margin-bottom:12px; color:#c8c8d4; }

/* ---------- 分页 ---------- */
.pagination { text-align:center; margin-top:26px; }
.pagination a, .pagination span {
    display:inline-block; padding:7px 13px; margin:0 3px; border:1px solid #333; border-radius:3px; color:#c8c8d4; font-size:13px;
}
.pagination a:hover { border-color:#c9a227; color:#ffd966; }
.pagination .current { background:#c9a227; border-color:#c9a227; color:#1a1a12; font-weight:bold; }

/* ---------- 页脚 ---------- */
.footer { background:#0a0a0f; border-top:2px solid #c9a227; padding:30px 0 24px; margin-top:40px; }
.foot-links { text-align:center; margin-bottom:16px; }
.foot-links a { color:#c8c8d4; margin:0 12px; font-size:14px; }
.foot-links a:hover { color:#ffd966; }
.foot-info { text-align:center; font-size:12px; color:#6a6a76; line-height:2; }
.foot-info a { color:#c9a227; }
.foot-info .foot-desc { color:#8a8a98; }

/* ---------- 回到顶部 ---------- */
.back-top {
    position:fixed; right:24px; bottom:24px; width:46px; height:46px; border-radius:50%;
    background:#c9a227; color:#1a1a12; display:flex; align-items:center; justify-content:center;
    font-size:22px; cursor:pointer; box-shadow:0 3px 10px rgba(0,0,0,.5); opacity:0; transition:opacity .3s;
    z-index:1000; border:none;
}
.back-top.show { opacity:.9; }
.back-top:hover { opacity:1; }

/* ---------- 响应式 ---------- */
@media (max-width:1200px){
    .container { width:96%; }
}
@media (max-width:900px){
    .nav-menu { display:none; }
    .layout-2col { flex-direction:column; }
    .layout-2col .sidebar { width:100%; }
    .card-list { grid-template-columns:1fr; }
    .hero h1 { font-size:24px; }
    .hero-stats { gap:24px; }
    .hero-stats .num { font-size:24px; }
}
