/* ============================================================
   传奇私服发布网 · 品牌站 全局样式表
   设计规范：信任感 / 时效性 / 高可读性 / 快速收录友好
   ============================================================ */

:root{
  --brand:#e3a23a;          /* 主品牌金 */
  --brand-deep:#b67f1f;     /* 深金 */
  --brand-glow:rgba(227,162,58,.35);
  --ink:#1a130a;           /* 主文字 */
  --ink-soft:#5a4a35;       /* 次级文字 */
  --paper:#fffdf8;         /* 页面底色 */
  --card:#ffffff;          /* 卡片 */
  --line:#f0e3cb;          /* 分割线 */
  --hot:#ff4d3d;           /* 热点红 */
  --green:#1f9e5a;         /* 可信绿 */
  --blue:#2b6cb0;          /* 信息蓝 */
  --radius:14px;
  --shadow:0 8px 28px rgba(120,80,20,.10);
  --shadow-strong:0 14px 40px rgba(120,80,20,.16);
}

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  font-family:"PingFang SC","Microsoft YaHei","Hiragino Sans GB",system-ui,-apple-system,sans-serif;
  background:var(--paper);
  color:var(--ink);
  line-height:1.85;
  font-size:15px;
  overflow-x:hidden;
}
a{color:var(--ink);text-decoration:none;transition:.2s}
a:hover{color:var(--brand-deep)}
img{max-width:100%;display:block}
button{font-family:inherit;cursor:pointer;border:none;background:none}
ul,ol{list-style:none}

/* ---------- 布局容器 ---------- */
.wrap{max-width:1200px;margin:0 auto;padding:0 20px}
section{padding:56px 0}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:30px;flex-wrap:wrap}
.section-head .t{font-size:24px;font-weight:800;letter-spacing:.5px;position:relative;padding-left:16px}
.section-head .t::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:5px;border-radius:3px;background:linear-gradient(180deg,var(--brand),var(--brand-deep))}
.section-head .t em{font-style:normal;color:var(--brand-deep);font-size:14px;font-weight:500;margin-left:10px;letter-spacing:0}
.section-head .more{font-size:14px;color:var(--ink-soft)}
.section-head .more:hover{color:var(--brand-deep)}

/* ---------- 顶部通告条 ---------- */
.topnotice{background:#231708;color:#f5e6c8;font-size:13px;padding:8px 0}
.topnotice .wrap{display:flex;align-items:center;gap:14px}
.topnotice .tag{background:var(--hot);color:#fff;padding:2px 10px;border-radius:20px;font-size:12px;font-weight:700;flex:none}
.marquee{overflow:hidden;flex:1;position:relative;height:22px}
.marquee p{white-space:nowrap;position:absolute;left:0;top:0;animation:scroll 40s linear infinite}
.marquee:hover p{animation-play-state:paused}
@keyframes scroll{0%{transform:translateX(100%)}100%{transform:translateX(-100%)}}
.topnotice a{color:#ffd98a}
.topnotice a:hover{color:#fff;text-decoration:underline}

/* ---------- 页头 ---------- */
header{background:var(--card);border-bottom:3px solid var(--brand);box-shadow:var(--shadow);position:sticky;top:0;z-index:100}
.h-top{padding:18px 0;display:flex;align-items:center;gap:26px}
.logo{display:flex;align-items:center;gap:12px;flex:none}
.logo .badge{width:52px;height:52px;border-radius:14px;background:linear-gradient(135deg,#f3c46b,#b67f1f);display:grid;place-items:center;font-size:26px;font-weight:900;color:#fff;box-shadow:0 6px 16px var(--brand-glow)}
.logo .name{font-size:21px;font-weight:900;letter-spacing:.5px;line-height:1.2}
.logo .name small{display:block;font-size:11px;font-weight:500;color:var(--ink-soft);letter-spacing:2px}

.search{flex:1;max-width:440px;position:relative;margin-left:auto}
.search input{width:100%;padding:12px 110px 12px 18px;border:2px solid var(--line);border-radius:30px;font-size:14px;background:#fdf9f1;transition:.25s}
.search input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 4px var(--brand-glow)}
.search button{position:absolute;right:4px;top:4px;bottom:4px;padding:0 22px;background:linear-gradient(135deg,var(--brand),var(--brand-deep));color:#fff;font-weight:700;border-radius:30px;font-size:14px}
.search button:hover{filter:brightness(1.08)}

.h-meta{display:flex;gap:18px;flex:none;font-size:13px;color:var(--ink-soft)}
.h-meta b{color:var(--brand-deep);font-size:16px;display:block;line-height:1.3}

/* 导航 */
nav{background:#1d1408}
.nav-inner{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.nav-inner a{
  color:#e9dcbf;padding:14px 20px;font-size:15px;font-weight:600;position:relative;
  display:flex;align-items:center;gap:6px;border-radius:8px 8px 0 0;
}
.nav-inner a .dot{width:6px;height:6px;border-radius:50%;background:var(--brand);flex:none}
.nav-inner a:hover{background:rgba(255,255,255,.07);color:#fff}
.nav-inner a.active{background:var(--brand);color:#2a1c06;box-shadow:0 -4px 14px var(--brand-glow)}
.nav-inner a.active .dot{background:#2a1c06}

/* ---------- 面包屑 ---------- */
.crumb{padding:14px 0;font-size:13px;color:var(--ink-soft);background:var(--paper)}
.crumb a{color:var(--ink-soft)}
.crumb a:hover{color:var(--brand-deep)}
.crumb span{margin:0 8px;color:#cbb992}

/* ---------- Hero ---------- */
.hero{background:radial-gradient(1200px 500px at 80% -10%,rgba(227,162,58,.28),transparent 60%),linear-gradient(160deg,#241708,#3a270f 60%,#2a1b09);color:#f6ecd6;padding:0;overflow:hidden}
.hero-inner{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center;padding:52px 0 0}
.hero h1{font-size:40px;line-height:1.25;font-weight:900;letter-spacing:1px}
.hero h1 .hl{color:var(--brand);text-shadow:0 2px 18px var(--brand-glow)}
.hero .sub{font-size:16px;color:#e2d2ac;margin-top:16px;max-width:540px}
.hero-stats{display:flex;gap:32px;margin-top:30px;flex-wrap:wrap}
.hero-stats div b{display:block;font-size:30px;font-weight:900;color:var(--brand);line-height:1}
.hero-stats div span{font-size:13px;color:#c9b888}

.hero-cta{display:flex;gap:14px;margin-top:32px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:8px;padding:14px 30px;border-radius:30px;font-weight:800;font-size:15px;transition:.25s}
.btn-primary{background:linear-gradient(135deg,var(--brand),var(--brand-deep));color:#2a1c06;box-shadow:0 8px 22px var(--brand-glow)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 12px 28px var(--brand-glow);color:#2a1c06}
.btn-ghost{border:2px solid rgba(255,255,255,.35);color:#fff}
.btn-ghost:hover{background:rgba(255,255,255,.12);color:#fff}

.hero-visual{position:relative}
.phone-mock{background:#fff;color:var(--ink);border-radius:22px;padding:6px;box-shadow:var(--shadow-strong);transform:rotate(1.5deg)}
.phone-mock .screen{background:var(--paper);border-radius:16px;padding:22px;min-height:340px;border:1px solid var(--line)}
.hot-label{display:inline-block;background:var(--hot);color:#fff;font-size:12px;font-weight:800;padding:4px 12px;border-radius:20px;margin-bottom:14px;animation:pulse 2s infinite}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
.phone-mock h3{font-size:19px;margin-bottom:14px}
.phone-mock .row{display:flex;justify-content:space-between;padding:11px 0;border-bottom:1px dashed var(--line);font-size:13.5px}
.phone-mock .row b{color:var(--brand-deep)}
.phone-mock .row .go{background:var(--green);color:#fff;font-size:12px;padding:3px 12px;border-radius:20px}

/* ---------- 信任条 ---------- */
.trustbar{background:var(--card);border-bottom:1px solid var(--line)}
.trust-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:0}
.trust-item{padding:26px 20px;text-align:center;border-right:1px solid var(--line)}
.trust-item:last-child{border-right:none}
.trust-item .ic{font-size:32px;margin-bottom:10px}
.trust-item b{display:block;font-size:15px;font-weight:800}
.trust-item span{font-size:13px;color:var(--ink-soft)}

/* ---------- 双栏通用 ---------- */
.cols{display:grid;grid-template-columns:2.2fr 1fr;gap:32px;align-items:start}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
.card-h{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--line);background:#fdf9f1}
.card-h h2{font-size:18px;font-weight:800;display:flex;align-items:center;gap:10px}
.card-h h2 i{width:8px;height:20px;border-radius:4px;background:var(--brand);display:inline-block}
.card-h .tab{display:flex;gap:6px}
.card-h .tab a{font-size:13px;padding:5px 13px;border-radius:20px;border:1px solid var(--line);color:var(--ink-soft)}
.card-h .tab a.on{background:var(--brand);border-color:var(--brand);color:#2a1c06;font-weight:700}
.card-b{padding:6px 22px 22px}

/* 开服表 */
.server-table{width:100%;border-collapse:collapse;font-size:14px}
.server-table th{background:#f7efdf;color:var(--ink-soft);font-weight:700;text-align:left;padding:12px 10px;font-size:13px;border-bottom:2px solid var(--brand);white-space:nowrap}
.server-table td{padding:13px 10px;border-bottom:1px solid var(--line);vertical-align:middle}
.server-table tr:hover td{background:#fdf7ea}
.s-time b{color:var(--brand-deep);font-size:15px}
.s-tag{display:inline-block;font-size:12px;padding:3px 10px;border-radius:6px;font-weight:700;white-space:nowrap}
.s-tag.new{background:#e8f7ef;color:var(--green)}
.s-tag.hot{background:#fdeceb;color:var(--hot)}
.s-tag.rec{background:#fdf3e0;color:var(--brand-deep)}
.s-name{font-weight:700;font-size:15px}
.s-name small{display:block;font-weight:400;color:var(--ink-soft);font-size:12.5px}
.s-play{background:linear-gradient(135deg,var(--green),#137a44);color:#fff;padding:7px 20px;border-radius:20px;font-weight:700;font-size:13px;display:inline-block}
.s-play:hover{color:#fff;filter:brightness(1.1);transform:translateY(-1px)}
.s-play.soon{background:#b9c4ce;cursor:default}

/* 列表条目 */
.art-list li{padding:16px 0;border-bottom:1px dashed var(--line)}
.art-list li:last-child{border-bottom:none}
.art-list .a{display:grid;grid-template-columns:130px 1fr;gap:16px;align-items:start}
.art-list .thumb{aspect-ratio:16/10;border-radius:10px;background:linear-gradient(135deg,#f3c46b,#b67f1f);display:grid;place-items:center;color:#fff;font-size:12px;font-weight:700;text-align:center;overflow:hidden}
.art-list .txt h3{font-size:16.5px;font-weight:800;line-height:1.5;margin-bottom:6px}
.art-list .txt p{font-size:13.5px;color:var(--ink-soft);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.art-list .meta{font-size:12.5px;color:#a49372;margin-top:8px;display:flex;gap:14px;flex-wrap:wrap}

/* 侧边通用 */
.side-block{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:26px;overflow:hidden}
.side-block h3{padding:16px 20px;font-size:16px;font-weight:800;border-bottom:1px solid var(--line);background:#fdf9f1;display:flex;align-items:center;gap:8px}
.side-block h3::before{content:"";width:5px;height:16px;background:var(--brand);border-radius:3px}
.side-block .b{padding:6px 20px 18px}
.rank li{padding:12px 0;border-bottom:1px dashed var(--line);display:flex;gap:12px;align-items:flex-start}
.rank li:last-child{border-bottom:none}
.rank .n{width:24px;height:24px;flex:none;border-radius:6px;background:#f2ead7;color:var(--brand-deep);font-weight:900;font-size:13px;display:grid;place-items:center}
.rank .n.top{background:var(--brand);color:#fff}
.rank .t{flex:1;font-size:14px;line-height:1.5}
.rank .t small{display:block;color:var(--ink-soft);font-size:12px}
.tagcloud{padding:18px 20px;display:flex;flex-wrap:wrap;gap:8px}
.tagcloud a{font-size:13px;padding:6px 14px;border:1px solid var(--line);border-radius:20px;background:#fdf9f1}
.tagcloud a:hover{background:var(--brand);border-color:var(--brand);color:#2a1c06}

/* 签到卡 */
.signin-card .b{padding:22px;text-align:center}
.signin-card .fire{font-size:42px;margin-bottom:8px;display:inline-block}
.signin-card .fire.on{animation:flick 1.2s infinite alternate}
@keyframes flick{from{transform:scale(1) rotate(-3deg);filter:drop-shadow(0 0 6px #ff8a3d)}to{transform:scale(1.12) rotate(3deg);filter:drop-shadow(0 0 18px #ff5a1f)}}
.signin-streak{font-size:15px;margin:8px 0;color:var(--ink-soft)}
.signin-streak b{color:var(--hot);font-size:24px;font-weight:900}
.streak-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin:18px 0}
.streak-day{aspect-ratio:1;border-radius:10px;background:#f2ead7;display:grid;place-items:center;font-size:11px;color:var(--ink-soft);position:relative;font-weight:700}
.streak-day.done{background:linear-gradient(135deg,#ffb347,#ff6b35);color:#fff;box-shadow:0 3px 10px rgba(255,107,53,.4)}
.streak-day.done::after{content:"✓";position:absolute;top:2px;right:4px;font-size:9px}
.streak-day.today{outline:2px solid var(--brand);outline-offset:-2px}
.signin-btn{width:100%;padding:14px;border-radius:30px;background:linear-gradient(135deg,var(--brand),var(--brand-deep));color:#fff;font-weight:800;font-size:16px;margin-top:6px;box-shadow:0 6px 18px var(--brand-glow)}
.signin-btn:hover{filter:brightness(1.08)}
.signin-btn.done{background:#c9d3dc;cursor:default;box-shadow:none}
.signin-tip{font-size:12.5px;color:var(--ink-soft);margin-top:12px;line-height:1.7}

/* ---------- 好评区 ---------- */
.reviews{background:#fbf6ec}
.review-summary{display:grid;grid-template-columns:240px 1fr;gap:40px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:30px;box-shadow:var(--shadow);margin-bottom:26px}
.score-num{text-align:center}
.score-num b{font-size:56px;font-weight:900;color:var(--brand-deep);line-height:1}
.score-num span{color:var(--ink-soft);font-size:14px}
.stars{color:var(--brand);font-size:22px;letter-spacing:3px;margin:8px 0}
.score-bars{display:flex;flex-direction:column;gap:8px}
.bar-row{display:flex;align-items:center;gap:12px;font-size:13px;color:var(--ink-soft)}
.bar{flex:1;height:10px;background:#f0e6d2;border-radius:20px;overflow:hidden}
.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--brand),var(--brand-deep));border-radius:20px}
.bar-row span:last-child{flex:none;width:42px;text-align:right}

.review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.review{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow);transition:.25s;position:relative}
.review:hover{transform:translateY(-4px);box-shadow:var(--shadow-strong)}
.review .q{position:absolute;top:14px;right:18px;font-size:46px;color:#f5ecd8;font-family:Georgia,serif;line-height:.8}
.review .rv-head{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.avatar{width:44px;height:44px;border-radius:50%;flex:none;display:grid;place-items:center;color:#fff;font-weight:800;font-size:15px}
.review .who b{display:block;font-size:14.5px}
.review .who small{color:#9a8a6c;font-size:12px}
.review .rs{color:var(--brand);font-size:13px;letter-spacing:2px;margin-bottom:6px}
.review p{font-size:14px;color:#4a3d28;position:relative;z-index:1}
.review .rz{margin-top:12px;font-size:12px;color:var(--green);border-top:1px dashed var(--line);padding-top:10px;display:flex;align-items:center;gap:6px}

/* ---------- 时效动态 ---------- */
.news-feed{background:linear-gradient(180deg,#fbf6ec,#fffdf8)}
.timeline{position:relative;padding-left:8px}
.tl-item{display:grid;grid-template-columns:96px 1fr;gap:22px;padding:20px 0;border-bottom:1px solid var(--line)}
.tl-item:last-child{border-bottom:none}
.tl-time{flex:none}
.tl-time b{display:block;color:var(--brand-deep);font-size:16px;font-weight:900}
.tl-time span{font-size:12px;color:var(--ink-soft)}
.tl-body h3{font-size:16.5px;font-weight:800;margin-bottom:8px;line-height:1.55}
.tl-body h3 .fresh{font-size:11px;background:var(--hot);color:#fff;padding:2px 8px;border-radius:4px;margin-right:8px;vertical-align:2px;font-weight:700}
.tl-body p{font-size:14px;color:#4a3d28;margin-bottom:10px}
.tl-body .tags{display:flex;gap:8px;flex-wrap:wrap}
.tl-body .tags a{font-size:12px;padding:3px 11px;border-radius:20px;background:#fdf3e0;color:var(--brand-deep)}
.tl-body .tags a:hover{background:var(--brand);color:#2a1c06}

/* ---------- 特性栅格 ---------- */
.features{background:var(--card)}
.feat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.feat{text-align:center;padding:30px 18px;border-radius:var(--radius);border:1px solid var(--line);transition:.25s;background:var(--paper)}
.feat:hover{border-color:var(--brand);box-shadow:var(--shadow);transform:translateY(-4px)}
.feat .ic{width:72px;height:72px;margin:0 auto 16px;border-radius:22px;background:linear-gradient(135deg,#fbe6bf,#f0cf8f);display:grid;place-items:center;font-size:34px}
.feat b{display:block;font-size:17px;margin-bottom:8px}
.feat p{font-size:13.5px;color:var(--ink-soft)}

/* ---------- 页脚 ---------- */
footer{background:#1a1208;color:#cbbd9e;padding:56px 0 0}
.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:36px}
.foot-grid h4{color:#fff;font-size:16px;margin-bottom:18px;position:relative;padding-left:12px}
.foot-grid h4::before{content:"";position:absolute;left:0;top:4px;bottom:4px;width:4px;border-radius:3px;background:var(--brand)}
.foot-links li{padding:6px 0;font-size:14px}
.foot-links a{color:#cbbd9e}
.foot-links a:hover{color:var(--brand)}
.foot-brand .badge-lg{display:flex;align-items:center;gap:14px;margin-bottom:16px}
.foot-brand .badge-lg i{width:56px;height:56px;border-radius:16px;background:linear-gradient(135deg,#f3c46b,#b67f1f);display:grid;place-items:center;font-size:26px;font-weight:900;color:#fff}
.foot-brand .badge-lg b{font-size:19px;color:#fff;display:block}
.foot-brand .badge-lg small{color:#9a8a6c;font-size:12px;letter-spacing:2px}
.foot-brand p{font-size:13.5px;line-height:1.9;color:#a99a7c}
.cert-line{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.cert-line span{font-size:12px;border:1px solid #3a2d16;color:#cbbd9e;padding:5px 12px;border-radius:6px}
.foot-bottom{margin-top:44px;border-top:1px solid #332613;padding:22px 0;font-size:13px;color:#9a8a6c;text-align:center;line-height:1.9}
.foot-bottom a{color:#cbbd9e}

/* ---------- 返回顶部 ---------- */
#toTop{position:fixed;right:26px;bottom:34px;width:46px;height:46px;border-radius:50%;background:var(--brand);color:#fff;display:none;place-items:center;font-size:20px;box-shadow:0 8px 22px var(--brand-glow);z-index:99}
#toTop.show{display:grid}

/* ---------- SEO 文字 ---------- */
.seo-block{background:#fbf6ec;border-top:1px solid var(--line)}
.seo-block h2{font-size:22px;text-align:center;margin-bottom:10px}
.seo-block .lead{text-align:center;color:var(--ink-soft);max-width:780px;margin:0 auto 34px}
.seo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.seo-grid article{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:26px}
.seo-grid article h3{font-size:17px;margin-bottom:12px;color:var(--brand-deep)}
.seo-grid article p{font-size:14px;color:#4a3d28}
.seo-faq{margin-top:36px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:30px 34px}
.seo-faq details{padding:14px 0;border-bottom:1px dashed var(--line)}
.seo-faq details:last-child{border-bottom:none}
.seo-faq summary{font-weight:800;font-size:15.5px;cursor:pointer;list-style:none;display:flex;gap:10px}
.seo-faq summary::-webkit-details-marker{display:none}
.seo-faq summary::before{content:"Q";color:#fff;background:var(--brand);width:22px;height:22px;border-radius:6px;display:grid;place-items:center;font-size:12px;flex:none;margin-top:3px}
.seo-faq details p{margin-top:10px;font-size:14px;color:#4a3d28;padding-left:32px}

/* ---------- 提示弹层 ---------- */
.toast{position:fixed;left:50%;bottom:44px;transform:translateX(-50%) translateY(20px);background:#2a1c06;color:#fff;padding:14px 26px;border-radius:30px;font-size:14px;opacity:0;transition:.3s;z-index:200;box-shadow:0 12px 30px rgba(0,0,0,.25)}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* ---------- 响应式 ---------- */
@media(max-width:980px){
  .hero-inner{grid-template-columns:1fr;padding-top:40px}
  .hero h1{font-size:30px}
  .trust-grid{grid-template-columns:repeat(2,1fr)}
  .trust-item{border-bottom:1px solid var(--line)}
  .cols{grid-template-columns:1fr}
  .review-grid,.seo-grid,.feat-grid{grid-template-columns:1fr 1fr}
  .review-summary{grid-template-columns:1fr;text-align:center;gap:24px}
  .foot-grid{grid-template-columns:1fr 1fr}
  .h-meta{display:none}
}
@media(max-width:640px){
  section{padding:40px 0}
  .wrap{padding:0 14px}
  .hero h1{font-size:25px}
  .hero-stats{gap:20px}
  .hero-stats div b{font-size:24px}
  .nav-inner a{padding:12px 14px;font-size:14px}
  .trust-grid{grid-template-columns:1fr 1fr}
  .review-grid,.seo-grid,.feat-grid,.foot-grid{grid-template-columns:1fr}
  .art-list .a{grid-template-columns:1fr}
  .art-list .thumb{max-height:150px}
  .search{display:none}
  .server-table th:nth-child(3),.server-table td:nth-child(3){display:none}
  .section-head .t{font-size:20px}
}