/* ============================================================
   文章页样式（正文区）
   作用域：.article-content —— 只影响正文，不污染其他区域
   加载：news.html / content.html / list.html 等文章类模板
   ============================================================ */

/* ---------- 1) 正文图片：居中（本次重点） ---------- */
.article-content img {
	display: block;              /* 块级才能用 margin 居中 */
	max-width: 100%;
	height: auto;
	margin: 1.4em auto;          /* 上下留白 + 左右自动 = 水平居中 */
	border-radius: 8px;
	border: 1px solid #dde3ec;
	box-shadow: 0 2px 10px rgba(0, 49, 95, .08);
}

/* 小图不用撑满，避免放大失真 */
.article-content img[width="484"] { max-width: 484px; }

/* ---------- 2) 标题层级 ---------- */
.article-content h2 {
	font-size: 22px;
	font-weight: 700;
	color: #0b2f5f;
	line-height: 1.45;
	margin: 1.9em 0 .8em;
	padding-left: 12px;
	border-left: 4px solid #0056b3;
	scroll-margin-top: 90px;
}
.article-content h3 {
	font-size: 18px;
	font-weight: 600;
	color: #003d80;
	line-height: 1.5;
	margin: 1.5em 0 .6em;
}
.article-content h4 { font-size: 16px; font-weight: 600; color: #0b2f5f; margin: 1.2em 0 .5em; }

/* ---------- 3) 正文排版 ---------- */
.article-content { font-size: 16px; line-height: 1.9; color: #2d2d2d; }
.article-content p { margin: 0 0 1.15em; }
.article-content strong { color: #0b2f5f; font-weight: 600; }
.article-content a { color: #0056b3; text-decoration: underline; }
.article-content a:hover { color: #003d80; }
.article-content ul, .article-content ol { padding-left: 1.5em; margin-bottom: 1.15em; }
.article-content li { margin-bottom: 6px; }
.article-content blockquote {
	margin: 1.2em 0; padding: 10px 16px;
	border-left: 4px solid #0056b3; background: #f5f8fd; color: #5a6b7d;
}

/* ---------- 4) 表格 ---------- */
.article-content .art-table {
	width: 100%; border-collapse: collapse; margin: 1.4em 0; font-size: 15px;
}
.article-content .art-table th {
	background: #e8f1fc; color: #003d80; font-weight: 600;
	padding: 10px 14px; border: 1px solid #dde3ec;
}
.article-content .art-table td {
	padding: 10px 14px; border: 1px solid #dde3ec;
}
.article-content .art-table tbody tr:nth-child(even) { background: #fafcff; }
.article-content .art-table tbody tr:hover { background: #f0f6ff; }
.article-content .art-table--param { table-layout: fixed; }
.article-content .art-table--param td:first-child,
.article-content .art-table--param th:first-child { width: 32%; background: #f7faff; }

/* 手机端：表格横向滚动，避免撑破页面 */
@media (max-width: 767px) {
	.article-content .art-table { display: block; overflow-x: auto; white-space: nowrap; }
}

/* ---------- 5) 问答区（先给基础样式，后续可按需细化） ---------- */
.article-content .art-faq,
.art-faq {
	margin: 1.8em 0 1em;
}
.art-faq .art-faq-title {
	font-size: 20px; font-weight: 700; color: #0b2f5f;
	margin: 0 0 .8em; padding-left: 12px;
	border-left: 4px solid #0056b3; line-height: 1.4;
}
.art-faq .art-faq-q {
	font-size: 16px; font-weight: 600; color: #003d80;
	margin: 1.2em 0 .5em; padding-left: 12px;
	border-left: 3px solid #0056b3; line-height: 1.6;
}
.art-faq .art-faq-a {
	margin: 0 0 1.1em; padding-left: 12px;
	font-size: 15px; line-height: 1.9; color: #5a6b7d;
}

/* ---------- 6) 手机端 ---------- */
@media (max-width: 767px) {
	.article-content { font-size: 15px; line-height: 1.85; }
	.article-content h2 { font-size: 19px; margin: 1.6em 0 .7em; }
	.article-content h3 { font-size: 17px; }
	.article-content img { margin: 1.1em auto; border-radius: 6px; }
}

/* ---------- 7) 产品参数表（.art-spec 在正文之外） ---------- */
.art-spec {
	margin: 1.6em 0 2em;
	padding: 18px 20px;
	background: #f8fbff;
	border: 1px solid #e1eaf6;
	border-radius: 10px;
}
.art-spec > h3 {
	margin: 0 0 14px;
	font-size: 18px;
	font-weight: 700;
	color: #0b2f5f;
	padding-left: 12px;
	border-left: 4px solid #0056b3;
	line-height: 1.4;
}
.art-spec .art-table {
	width: 100%;
	border-collapse: collapse;
	margin: 0;
	font-size: 15px;
	background: #fff;
}
.art-spec .art-table th {
	background: #e8f1fc;
	color: #003d80;
	font-weight: 600;
	padding: 10px 14px;
	border: 1px solid #dde3ec;
	text-align: center;
}
.art-spec .art-table td {
	padding: 10px 14px;
	border: 1px solid #dde3ec;
	color: #2d2d2d;
	line-height: 1.7;
}
.art-spec .art-table tbody tr:nth-child(even) { background: #fafcff; }
.art-spec .art-table tbody tr:hover { background: #f0f6ff; }
.art-spec .art-table--param { table-layout: fixed; }
.art-spec .art-table--param th:first-child { width: 26%; white-space: nowrap; }

/* ---------- 8) 文章标签（标题下方） ---------- */
.art-tags {
	margin: 0 0 1.2em;
	text-align: center;
}
.art-tags .art-tag {
	display: inline-block;
	margin: 0 6px 6px 0;
	padding: 2px 12px;
	font-size: 13px;
	line-height: 22px;
	color: #0056b3;
	background: #eef5ff;
	border: 1px solid #d3e3f7;
	border-radius: 12px;
}

/* ---------- 9) 相关内容（文章结尾） ---------- */
.art-related {
	margin: 2em 0 1.4em;
	padding: 16px 20px;
	background: #f8fbff;
	border: 1px solid #e1eaf6;
	border-radius: 10px;
}
.art-related > h3 {
	margin: 0 0 10px;
	font-size: 17px;
	font-weight: 700;
	color: #0b2f5f;
	padding-left: 12px;
	border-left: 4px solid #0056b3;
	line-height: 1.4;
}
.art-related ul { margin: 0; padding-left: 1.3em; }
.art-related li { margin-bottom: 8px; line-height: 1.7; }
.art-related a { color: #0056b3; text-decoration: none; }
.art-related a:hover { color: #003d80; text-decoration: underline; }

/* ---------- 10) 产品页/文章页手机端 ---------- */
@media (max-width: 767px) {
	.art-spec { padding: 12px 10px; }
	.art-spec .art-table { display: block; overflow-x: auto; }
	.art-spec .art-table--param th:first-child { width: auto; white-space: normal; }
}