/* 西气东输专题公共基础 */
* { box-sizing: border-box; }
html { color: #254453; background: #fff; }
body { margin: 0; font: 16px/1.65 "Microsoft YaHei", "PingFang SC", Arial, sans-serif; }
a { color: inherit; text-decoration: none; }
a:hover { color: #168eae; }
button { font: inherit; cursor: pointer; }
button:focus-visible, a:focus-visible { outline: 3px solid #0875ba; outline-offset: 4px; }
img { max-width: 100%; vertical-align: middle; }
[hidden] { display: none !important; }
.topic-container { width: min(1200px, calc(100% - 48px)); margin-inline: auto; }
.topic-header { width: 100%; }
.topic-banner { display: block; }
.topic-banner img { display: block; width: 100%; height: auto; }
.topic-inner { display: flex; flex-direction: column; min-height: 100vh; min-height: 100dvh; background: #f3f9fc; }
.topic-inner > .topic-header, .topic-inner > .topic-footer { flex-shrink: 0; }
.topic-inner > .inner-main { flex: 1 0 auto; }
.topic-inner .topic-header { height: clamp(180px, 27vw, 360px); overflow: hidden; background: #c2e7f2; }
.topic-inner .topic-banner img { min-height: 180px; object-fit: cover; object-position: center top; }
.inner-main { margin-top: 28px; margin-bottom: 72px; min-height: 45vh; }
.breadcrumb { margin-bottom: 24px; font-size: 14px; color: #65818e; overflow-wrap: anywhere; }
.breadcrumb a { color: #157da1; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.image-placeholder { background: linear-gradient(135deg, #e4f6fa, #bedeea); object-fit: contain !important; }
.empty-message { padding: 48px 20px; margin: 0; text-align: center; color: #567a8b; background: #f1f9fc; }
@media (max-width: 767px) {
  body { font-size: 15px; }
  .topic-container { width: calc(100% - 32px); }
  .topic-inner .topic-header { height: auto; }
  .topic-inner .topic-banner img { min-height: 0; }
  .inner-main { margin-top: 20px; margin-bottom: 40px; }
}