/* 第3套：对比驱动 — 深色底 + 对打表格 + 左右对切 */
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: "Source Han Sans SC", "Noto Sans SC", "Microsoft YaHei", sans-serif;
  background: #0e1512;
  color: #e8f0ea;
  line-height: 1.8;
  font-size: 16px;
}
a { color: #d4b24a; }
a:hover { color: #f0d57a; }
.frame { width: min(1280px, calc(100% - 36px)); margin: 0 auto; }
.mast {
  background: #06110c;
  border-bottom: 1px solid #1d3328;
}
.mast .frame {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 70px;
}
.wordmark {
  color: #f3e2a8;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: 0.16em;
}
.wordmark:hover { color: #d4b24a; text-decoration: none; }
.links a {
  color: #b7c8bb;
  margin-left: 22px;
  padding: 4px 0;
  border-bottom: 1px solid transparent;
  text-decoration: none;
}
.links a:hover, .links a.now {
  color: #d4b24a;
  border-bottom-color: #d4b24a;
}
.split-hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 360px;
  border-bottom: 1px solid #1d3328;
}
.split-hero .copy {
  padding: 48px 8% 40px 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.split-hero .copy h1 { font-size: 28px; line-height: 1.4; margin: 10px 0 16px; color: #f6efd4; }
.split-hero .pane {
  background: #122018;
  border-left: 1px solid #1d3328;
  padding: 32px 28px;
}
.tag { color: #d4b24a; font-size: 12px; letter-spacing: 0.18em; }
.btn-gold {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #d4b24a;
  color: #1a1404;
  padding: 11px 20px;
  font-weight: 700;
  text-decoration: none;
  margin-right: 10px;
  margin-top: 8px;
}
.btn-gold:hover { background: #f0d57a; color: #1a1404; }
.btn-line {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid #d4b24a;
  color: #d4b24a;
  padding: 10px 18px;
  text-decoration: none;
}
.versus { width: 100%; border-collapse: collapse; font-size: 14px; }
.versus th, .versus td { border: 1px solid #2a4636; padding: 8px 10px; }
.versus th { background: #1a3324; color: #f3e2a8; }
.sec { padding: 40px 0; border-bottom: 1px solid #1d3328; }
.sec h2 { font-size: 22px; color: #f3e2a8; margin-bottom: 14px; }
.sec p { margin-bottom: 12px; color: #c9d6cc; }
.pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.box {
  background: #122018;
  border: 1px solid #2a4636;
  padding: 18px 16px;
}
.box h3 { color: #d4b24a; margin-bottom: 8px; font-size: 17px; }
.ask { margin-bottom: 18px; }
.ask h3 { color: #f3e2a8; font-size: 17px; margin-bottom: 8px; }
.colophon {
  background: #040806;
  color: #9aafa0;
  padding: 26px 0;
  font-size: 13px;
}
.colophon a { color: #d4b24a; margin-right: 14px; text-decoration: none; }
.colophon p { margin-top: 8px; }
@media (max-width: 900px) {
  .split-hero, .pair { grid-template-columns: 1fr; }
  .split-hero .pane { border-left: 0; border-top: 1px solid #1d3328; }
  .mast .frame { flex-direction: column; padding: 12px 0; }
  .links a { margin: 8px 10px 0 0; }
}