/* ==========================================================================
   article.css
   Insights 文章页专属样式。由 insights/_TEMPLATE.html 通过 <link> 引用。
   抽离自模板内联 <style>，供上百篇文章共享缓存。

   依赖 main.css 中的 CSS 变量。
   ========================================================================== */

.article-wrap { max-width: 780px; margin: 0 auto; }

/* ---------- 正文排版 ---------- */
.article-body { font-size: 1.04rem; line-height: 1.78; color: var(--ink-700); }
.article-body h2 { font-size: 1.45rem; margin-top: 2.2em; margin-bottom: .6em; padding-top: .2em; }
.article-body h3 { font-size: 1.12rem; margin-top: 1.7em; margin-bottom: .5em; }
.article-body p { margin-bottom: 1.15em; }
.article-body strong { color: var(--ink-900); }
.article-body ul, .article-body ol { margin-bottom: 1.2em; }
.article-body li { margin-bottom: .5em; }
.article-body code { font-family: var(--mono); font-size: .87em; background: var(--surface-3); padding: 2px 6px; border-radius: 4px; color: var(--navy-700); }

/* Markdown 表格：与上下段落留出呼吸感（原写在生成器的 style="" 里） */
.article-body .table-wrap { margin-bottom: 1.4em; }

/* 正文内链接：型号词 / 品牌词锚文本的视觉样式 */
.article-body a { color: var(--blue-500); text-decoration: none; border-bottom: 1px solid rgba(26,111,212,.35); padding-bottom: 1px; transition: color .15s, border-color .15s, background .15s; }
.article-body a:hover { color: var(--navy-700); border-bottom-color: var(--navy-700); background: var(--blue-50); }
.article-body a:visited { color: #6b4bb5; border-bottom-color: rgba(107,75,181,.3); }

/* ---------- 导语 / 元信息 ---------- */
.article-lead { font-size: 1.14rem; color: var(--ink-700); border-left: 3px solid var(--blue-500); padding-left: 18px; margin-bottom: 2em; }
.article-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; font-size: .84rem; color: var(--ink-400); padding-bottom: 26px; margin-bottom: 34px; border-bottom: 1px solid var(--line); }
.article-meta .badge { color: var(--blue-500); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; font-size: .74rem; }

/* ---------- 要点框 ---------- */
.keytake { background: var(--blue-50); border: 1px solid #cfe2fa; border-radius: var(--radius); padding: 24px 26px; margin-bottom: 34px; }
.keytake h3 { margin-top: 0; font-size: .96rem; color: var(--navy-800); letter-spacing: .03em; text-transform: uppercase; }
.keytake ul { margin-bottom: 0; }

/* ---------- FAQ 折叠块 ---------- */
.faq-item { border-bottom: 1px solid var(--line); padding: 18px 0; }
.faq-item:last-child { border-bottom: 0; }
.faq-item h3 { margin-bottom: .4em; font-size: 1.02rem; }
.faq-item p { margin-bottom: 0; font-size: .95rem; }

/* ---------- 底部询价 + 翻页 ---------- */
.article-cta { background: linear-gradient(120deg, var(--navy-900), var(--navy-700) 60%, #1a4b80); border-radius: var(--radius-lg); padding: 36px 34px; color: #cbd8e8; margin-top: 46px; }
.article-cta h3 { color: #fff; margin-bottom: .35em; }
.article-cta p { color: #a9c1da; margin-bottom: 18px; font-size: .95rem; }
.article-cta .actions { display: flex; gap: 12px; flex-wrap: wrap; }
.article-nav { display: flex; justify-content: space-between; gap: 16px; margin-top: 40px; padding-top: 26px; border-top: 1px solid var(--line); font-size: .9rem; }