/* 正文排版（.prose）：前台（布局里引入）和后台编辑器的内容区（编辑页引入）共用这一份，
 * 编辑时正文看到的就是上线后的样子。改这里两边一起变；用到的颜色、字体变量在 site.css 和 admin.css 的 :root 里各有一份，值保持一致。
 * 栏宽不在这里定：文章页在 people.css 里限 36em，编辑器随编辑框宽度。
 */
.prose { max-width: 720px; font-size: 17px; line-height: 1.95; }
.prose > * + * { margin-top: 1.1em; }
.prose > :first-child { margin-top: 0; }
.prose h2 { margin-top: 2em; font-family: var(--kai); font-size: 30px; line-height: 1.35; }
.prose h3 { margin-top: 1.6em; font-family: var(--kai); font-size: 23px; line-height: 1.4; }
.prose .lede { font-family: var(--kai); font-size: 21px; line-height: 1.85; } /* 导语：编辑器「段落格式」里可选 */
.prose a { color: var(--orange-ink); text-decoration: underline; text-underline-offset: 3px; }
.prose strong { font-weight: 700; }
.prose ul { padding-left: 1.3em; list-style: disc; }
.prose ol { padding-left: 1.5em; list-style: decimal; }
.prose li + li { margin-top: .4em; }
.prose figure { margin-top: 1.8em; margin-bottom: 1.8em; text-align: center; } /* 图片说明跟着图片居中 */
.prose img { margin-left: auto; margin-right: auto; } /* 正文里的图片都居中（img 是块元素） */
.prose figure img { width: auto; max-width: 100%; border-radius: 14px; } /* 老站照片多为 500px 宽，按原图宽度显示，不放大 */
.prose figcaption { margin-top: 10px; font-family: var(--kai); font-size: 17px; line-height: 1.6; color: var(--ink-2); }
.prose blockquote { padding: 2px 0 2px 22px; border-left: 3px solid var(--green); font-family: var(--kai); font-size: 21px; line-height: 1.8; }
.prose hr { height: 0; margin: 2em 0; border: 0; border-top: 1px solid var(--green-line); }

/* ---------- 关键信息表、信息卡 ----------
 * 放在这里是因为全站和编辑器都加载这份：正文里的信息卡和找中心页昌平总部的卡片（.hq）是同一个样子，共用下面的规则，改一处两边一起变。
 * 信息卡在正文里存 <info-card> 标记，显示时渲染成 div.info-card > h3 + dl.info-facts（App\Support\Content::card）。
 * .hq 的两栏布局、配图、城市名在 info.css */
/* 名称 | 内容 的信息表，科室介绍页也用。叫 info-facts：专家页的 .facts 是另一套样式（people.css） */
.info-facts { display: grid; grid-template-columns: 7em minmax(0, 1fr); }
.info-facts dt, .info-facts dd { padding: 14px 0; border-bottom: 1px solid var(--green-line); }
.info-facts dt { font-family: var(--kai); font-size: 18px; line-height: 1.6; color: var(--green-ink); }
.info-facts dd { font-size: 16px; line-height: 1.75; }
.info-facts dd a { font-weight: 700; letter-spacing: .02em; }
.info-facts dd a:hover { color: var(--orange-ink); }
.hq, .info-card { padding: 40px 44px; border-radius: 20px; background: var(--green-tint); }
.hq h2, .info-card h3 { font-family: var(--kai); font-size: 36px; line-height: 1.3; }
.hq .info-facts, .info-card .info-facts { margin-top: 20px; }
.hq .info-facts dt, .hq .info-facts dd, .info-card .info-facts dt, .info-card .info-facts dd { padding: 11px 0; }
/* 正文里的信息卡：上下和别的段落多空一些；没有标题时表格顶着卡片上边；最后一行下面不画线 */
.prose .info-card { margin: 1.6em 0; }
.prose > .info-card:first-child { margin-top: 0; }
.info-card h3 { margin-top: 0; }
.info-card > .info-facts:first-child { margin-top: 0; }
.info-card .info-facts dt:last-of-type, .info-card .info-facts dd:last-of-type { border-bottom: 0; }

@media (max-width: 1100px) {
  .hq, .info-card { padding: 32px; }
}

@media (max-width: 600px) {
  .prose { font-size: 16px; }
  .prose h2 { font-size: 26px; }
  .prose .lede { font-size: 19px; }
  .info-facts { grid-template-columns: 6.2em minmax(0, 1fr); }
}
