/* 每日洞察 dailyinsightpost.hk —— 品牌层（Bootstrap 5.3 之上的薄薄一层）
   角度：比較選擇 / 語調：理性冷靜 / 模板分組：Magazine 資訊流
   主色：石板藍 #3b4f6b + 陶橙 #c96a3f（對照高亮）
   字體：標題無襯線 900（Noto Sans HK）+ 正文襯線（Noto Serif HK）—— 與站 1、站 9 的組合都不同
   规则：能用 Bootstrap 类解决的一律不写自定义样式；这里只放
        ① 品牌变量覆盖 ② Bootstrap 没有的正文排版(prose) ③ A vs B 對照索引专属组件 */

:root{
  --bs-primary:#3b4f6b;
  --bs-primary-rgb:59,79,107;
  --brand-dark:#27374d;
  --brand-soft:#eef2f7;
  --brand-accent:#c96a3f;
  --brand-accent-soft:#fbf0e9;

  --bs-link-color:#3b4f6b;
  --bs-link-color-rgb:59,79,107;
  --bs-link-hover-color:#27374d;
  --bs-link-hover-color-rgb:39,55,77;

  --bs-body-color:#1f242b;
  --bs-body-color-rgb:31,36,43;
  --bs-secondary-color:rgba(31,36,43,.68);
  --bs-tertiary-color:rgba(31,36,43,.5);
  --bs-border-color:#dfe3e9;
  --bs-tertiary-bg:#f5f7fa;
  --bs-border-radius:.5rem;
  --bs-border-radius-sm:.25rem;

  --bs-body-font-family:"Noto Serif HK","Source Han Serif HK","Songti TC","PMingLiU",Georgia,serif;
  --bs-body-font-size:1.02rem;
  --bs-body-line-height:2;
  --brand-sans:"Noto Sans HK","PingFang HK","Hiragino Sans CNS","Microsoft JhengHei",system-ui,-apple-system,"Segoe UI",sans-serif;
}

h1,h2,h3,h4,h5,h6,.navbar,.btn,.badge,.breadcrumb,.dcell,.list-group,.card-footer,.small,small,table{font-family:var(--brand-sans)}
h1,h2,h3{font-weight:800;letter-spacing:-.01em}

.btn-primary{--bs-btn-bg:#3b4f6b;--bs-btn-border-color:#3b4f6b;--bs-btn-hover-bg:#27374d;--bs-btn-hover-border-color:#27374d;--bs-btn-active-bg:#27374d;--bs-btn-active-border-color:#27374d}
.btn-outline-primary{--bs-btn-color:#3b4f6b;--bs-btn-border-color:#3b4f6b;--bs-btn-hover-bg:#3b4f6b;--bs-btn-hover-border-color:#3b4f6b;--bs-btn-active-bg:#3b4f6b;--bs-btn-active-border-color:#3b4f6b}
.bg-brand-dark{background-color:var(--brand-dark)!important}
.bg-brand-soft{background-color:var(--brand-soft)!important}
.text-accent{color:var(--brand-accent)!important}

/* 区块标题：Magazine 风的通栏细线 + 左侧方块，跟站 1 的竖杠、站 9 的下划线都不同 */
.sec-title{font-family:var(--brand-sans);font-size:1.28rem;font-weight:800;margin:0;display:flex;align-items:center;gap:.5rem}
.sec-title::before{content:"";width:14px;height:14px;background:var(--brand-accent);display:inline-block;flex:0 0 auto}

.thumb-16x9{background:var(--bs-tertiary-bg);overflow:hidden}
.thumb-16x9 img{width:100%;height:100%;object-fit:cover}

.navbar .nav-link{font-weight:600}
.navbar .nav-link.active{color:var(--bs-primary)!important;box-shadow:inset 0 -3px 0 var(--brand-accent)}

/* ③ 招牌模組：A vs B 對照索引（Bootstrap 无对应组件） */
.vs-card{display:block;height:100%;padding:.9rem 1rem;border:1px solid var(--bs-border-color);background:#fff;text-decoration:none;color:inherit;transition:border-color .15s,box-shadow .15s}
.vs-card:hover{border-color:var(--bs-primary);box-shadow:0 .25rem .75rem rgba(39,55,77,.08);text-decoration:none}
.vs-pair{display:flex;align-items:center;gap:.5rem;font-family:var(--brand-sans);font-weight:800;font-size:1.02rem;line-height:1.4}
.vs-pair .a,.vs-pair .b{flex:1 1 0;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vs-pair .b{text-align:right}
.vs-mark{flex:0 0 auto;font-size:.68rem;font-weight:800;letter-spacing:.08em;color:#fff;background:var(--brand-accent);padding:.1rem .38rem;border-radius:2px}
.vs-meta{font-family:var(--brand-sans);font-size:.76rem;color:var(--bs-tertiary-color);margin-top:.4rem;display:flex;justify-content:space-between;gap:.5rem}
.vs-card:hover .vs-pair{color:var(--bs-primary)}

/* ② 正文排版：Bootstrap 不提供 prose，文章正文由 CMS 输出裸标签，这段必须自己写 */
.article-body{line-height:2.05}
.article-body h2{font-size:1.32rem;margin:2.1rem 0 .9rem;padding:.35rem 0 .35rem .8rem;border-left:5px solid var(--brand-accent);background:var(--bs-tertiary-bg)}
.article-body h3{font-size:1.12rem;margin:1.6rem 0 .7rem}
.article-body p{margin:0 0 1.1rem}
.article-body ul,.article-body ol{margin:0 0 1.1rem;padding-left:1.4rem}
.article-body li{margin-bottom:.45rem}
.article-body img{max-width:100%;height:auto;margin:.6rem 0}
.article-body blockquote{margin:1.2rem 0;padding:.8rem 1rem;background:var(--brand-accent-soft);border-left:4px solid var(--brand-accent)}
.article-body a{text-decoration:underline}
/* 對比表是本站的必备结构，给足存在感 */
.article-body .table>thead th{background:var(--brand-soft);white-space:nowrap;font-weight:800}
.article-body .table td,.article-body .table th{vertical-align:middle}
.article-body .table tbody tr:first-child td{background:#fff}

.article-body h2[id],.article-body h3[id],[id^="sec-"]{scroll-margin-top:78px}