:root{
  --brand: var(--primary-color, #09559C);

}


*{ box-sizing: border-box; }
body{ background: #ffffff !important;  /* 你的背景色 */
  color: var(--ink); }
.container{ width: min(1280px, 96vw); margin: 0 auto; }  /* 放宽主容器 */

/* 顶部（无背景） */
.viz-hero{ background: none; padding: 1.2rem 0 .5rem; }
.viz-main .page-title{ margin: 0 0 .25rem; }
.lead{ margin: 0 0 1rem; color: color-mix(in srgb, var(--ink) 82%, #000 18%); }

/* 图片 + 按钮：上下居中 */
.media-block{
  display: grid;
  grid-template-columns: 1fr;
  justify-items: center;
  row-gap: .75rem;
}

/* 图像容器：完整显示，不裁切 */
.viz-figure{
  margin: 0;
  background: #fff;
  border-radius: 16px;
  padding: clamp(.4rem, 1vw, .8rem);
  box-shadow: 0 12px 28px rgba(0,0,0,.10);
  cursor: zoom-in;  /* 提示可放大 */
}
.viz-figure img{
  display: block;
  width: 100%;
  height: auto;
  max-height: 86vh;      /* 更大 */
  object-fit: contain;
  border-radius: 10px;
}

/* 新增：按钮上方说明文字 */
.btn-note{
  margin: .35rem 0 0;
  font-size: .95rem;
  color: #5a6a7a;
  text-align: center;
  max-width: 840px;
}


/* me 页面同款按钮（保持你现在的文本），蓝色渐变 */
.fun-btn{
  display: inline-block;
  padding: 14px 28px;
  font-size: 1.2rem;                 /* 与 me 按钮一致 */
  font-weight: 700;
  color: #fff;
  background: linear-gradient(135deg, #0B74D6, #09559C);
  border-radius: 14px;
  text-decoration: none;
  box-shadow: 0 6px 18px rgba(0,0,0,.25);
  transition: color .25s ease, transform .25s ease, box-shadow .25s ease, filter .25s ease;
}

/* 避免被浏览器默认链接色覆盖 */
.fun-btn:link,
.fun-btn:visited{
  color: #fff;
}

.fun-btn:hover,
.fun-btn:focus-visible{
  color: #ffffff; /* ← hover 时字体颜色 */
  transform: translateY(-3px) scale(1.05);
  box-shadow: 0 10px 28px rgba(0,0,0,.3);
  filter: brightness(1.05);
}

.fun-btn:active{ transform: scale(.96); }
.see-web{ margin-top: .35rem; }




/* ——— 去掉“框框” ——— */
.card{
  background: transparent;
  border: none;
  box-shadow: none;
  padding: .25rem 0 .75rem;   /* 仅保留垂直间距 */
  margin: .4rem 0;
}

/* Headings: make "Justification" use the same heading font as "References" */
#justification .sec-title{
  font-family: var(--font-heading, var(--font-title, inherit)) !important;
  font-weight: 800; /* same weight as your References heading */
}
/* Keep inner subtitles as body font */
#justification .sub-title{
  font-family: var(--font-body, inherit);
  font-weight: 700;
  text-shadow: none;
}

/* 列表/引用保持原样 */
.section{ padding: 1.1rem 0; }
.tight{ margin: 0; padding-left: 1.1rem; }
.tight li{ margin: .35rem 0; }
.refs{ margin: .4rem 0 1.2rem; padding-left: 1.1rem; }
.refs li{ margin: .25rem 0; }

/* reveal 动画（可留可去） */
.reveal{ opacity: 0; translate: 0 18px; }
.reveal.in{ opacity: 1; translate: 0 0; transition: opacity .6s ease, translate .6s ease; }

/* 图片放大模态（保留） */
.img-modal{
  position: fixed; inset: 0; background: rgba(4,16,28,.55);
  display: grid; place-items: center; padding: 4vmin;
  opacity: 0; pointer-events: none; transition: opacity .2s ease; z-index: 60;
  cursor: zoom-out;  /* 提示可缩小 */
}
.img-modal img{
  max-width: 92vw; max-height: 86vh; width: auto; height: auto;
  object-fit: contain; border-radius: 14px;
  box-shadow: 0 22px 60px rgba(0,0,0,.45); background: #fff;
}
.img-modal[aria-hidden="false"]{ opacity: 1; pointer-events: auto; }
.modal-close{
  position: absolute; right: 20px; top: 12px;
  width: 44px; height: 44px; border: none; border-radius: 999px;
  background: var(--accent); color: #fff; font-size: 26px; line-height: 44px;
  cursor: pointer; box-shadow: 0 10px 24px rgba(0,0,0,.25);
}

/* 无障碍隐藏文本 */
.sr-only{
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

/* Center & bold the top page title + center the subtitle line */
.viz-hero .page-title,
.viz-hero .lead{
  text-align: center;
}
.viz-hero .page-title{
  font-weight: 800;       /* extra bold */
  letter-spacing: .2px;
}

/* Justification 标题字体（与 References 同级的标题风格） */
#justification .sec-title{
  font-family: "Yatra One","Open Sans",system-ui,sans-serif !important;
  font-weight: 200;
}

#justification .sub-title {
  color: #3c3c3c;
  font-family: var(--font-body, inherit);
  font-weight: 700;
  text-shadow: none;
}

/* 顶部 banner */
/* .banner {
  width: 100%;
  max-height: 400px;         
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 1rem;
}
.banner img {
  width: 100%;
  height: auto;
  object-fit: cover;          
} */