* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin:0; font-family: "WenQuanYi Micro Hei", "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
  color:#1d2430; background:#f4f6f9; line-height:1.85; font-size:16px; }
a { color:#1257a6; text-decoration:none; }
a:hover { text-decoration:underline; }
img { max-width:100%; height:auto; display:block; }
.wrap { width:min(1180px, 94%); margin:0 auto; }
.site-head { background:#0e2c50; color:#fff; }
.site-head .wrap { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; padding:14px 0; }
.brand { font-size:23px; font-weight:700; color:#fff; letter-spacing:1px; }
.brand span { font-size:13px; font-weight:400; opacity:.75; margin-left:10px; letter-spacing:0; }
.nav a { color:#dbe8f7; margin-left:18px; font-size:15px; }
.nav a:hover, .nav a.on { color:#fff; text-decoration:underline; }
.subnav { background:#fff; border-bottom:1px solid #e2e8f0; }
.subnav .wrap { display:flex; flex-wrap:wrap; gap:6px 18px; padding:10px 0; font-size:14px; }
.crumb { font-size:14px; color:#6b7787; padding:18px 0 4px; }
.crumb a { color:#6b7787; }
.layout { display:grid; grid-template-columns: minmax(0,1fr) 300px; gap:26px; padding:18px 0 40px; align-items:start; }
.main, .side { background:#fff; border:1px solid #e6ebf2; border-radius:10px; padding:26px 28px; }
.page-title { font-size:28px; line-height:1.45; margin:6px 0 8px; }
.page-lead { color:#5b6879; margin:0 0 22px; font-size:15px; }
.card { display:grid; grid-template-columns:260px minmax(0,1fr); gap:20px; padding:18px 0; border-bottom:1px solid #edf1f6; }
.card:last-child { border-bottom:0; }
.card img { width:260px; height:146px; object-fit:cover; border-radius:8px; background:#e8edf4; }
.card h3 { font-size:19px; margin:2px 0 8px; line-height:1.5; }
.card .meta { font-size:13px; color:#8793a3; margin-bottom:8px; }
.card p { margin:0 0 10px; color:#4b5868; font-size:15px; }
.more { font-size:14px; }
.pager { display:flex; flex-wrap:wrap; gap:8px; margin-top:26px; padding-top:20px; border-top:1px solid #edf1f6; }
.pager a, .pager span { padding:7px 13px; border:1px solid #d6dfeb; border-radius:6px; font-size:14px; background:#fff; }
.pager .on { background:#1257a6; color:#fff; border-color:#1257a6; }
.pager .dis { color:#aab3bf; }
.side h2 { font-size:17px; margin:0 0 12px; padding-bottom:10px; border-bottom:1px solid #edf1f6; }
.side ul { list-style:none; padding:0; margin:0 0 24px; }
.side li { padding:8px 0; border-bottom:1px dashed #eef2f7; font-size:14px; line-height:1.6; }
.side li:last-child { border-bottom:0; }
.art-img { width:100%; border-radius:10px; margin:6px 0 22px; }
.article h2 { font-size:20px; margin:30px 0 10px; padding-left:12px; border-left:4px solid #1257a6; }
.article p { margin:0 0 16px; color:#33404f; }
.article ul { margin:0 0 18px; padding-left:22px; }
.article li { margin-bottom:8px; }
.tags { margin-top:26px; font-size:14px; color:#6b7787; }
.rel { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:12px; }
.rel a { display:block; background:#f7f9fc; border:1px solid #e6ebf2; border-radius:8px; padding:12px; font-size:14px; line-height:1.6; }
.prevnext { display:flex; justify-content:space-between; gap:14px; margin-top:28px; padding-top:18px; border-top:1px solid #edf1f6; font-size:14px; }
.nav-groups { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
.nav-groups section { background:#f8fafc; border:1px solid #e6ebf2; border-radius:10px; padding:16px 18px; }
.nav-groups h2 { font-size:17px; margin:0 0 10px; }
.nav-groups ol { margin:0; padding-left:22px; font-size:14px; }
.nav-groups li { padding:4px 0; }
.search { width:100%; padding:11px 14px; border:1px solid #d6dfeb; border-radius:8px; font-size:15px; margin-bottom:22px; }
.foot { background:#0e2c50; color:#c7d7ea; padding:28px 0; font-size:14px; }
.foot .wrap { display:flex; flex-wrap:wrap; gap:10px 30px; align-items:flex-start; justify-content:space-between; }
.foot a { color:#e6f0fb; }
.foot .fine { width:100%; opacity:.72; font-size:13px; line-height:1.8; }
@media (max-width: 900px) {
  .layout { grid-template-columns:1fr; }
  .side { order:2; }
  .card { grid-template-columns:1fr; }
  .card img { width:100%; height:auto; }
  .rel, .nav-groups { grid-template-columns:1fr; }
  .main, .side { padding:20px 18px; }
  .nav a { margin:0 12px 4px 0; display:inline-block; }
  .page-title { font-size:23px; }
}
