/* ===========================================================
   行业观察 · 大健康月刊  专属排版样式
   依赖 style.css 的 :root 变量（--purple / --cyan / --ink ...）
   =========================================================== */

/* ---------- articles 列表页：简素 page-hero 覆盖（覆盖 style.css 深色科技海报） ---------- */
.articles-body .page-hero{
  background:linear-gradient(180deg,#FAFAFF 0%,#F3F2FC 100%) !important;
  min-height:auto !important;padding:48px 40px 36px !important;
  display:block !important;text-align:center;
}
.articles-body .page-hero .eyebrow{
  font-size:13px;color:var(--purple);letter-spacing:2.5px;font-weight:600;
  display:inline-block;margin-bottom:12px;
}
.articles-body .page-hero h1{
  font-family:'Noto Serif SC',serif;font-size:36px !important;font-weight:700 !important;
  color:var(--ink) !important;letter-spacing:2px !important;margin-bottom:12px !important;
  background:none !important;-webkit-background-clip:unset !important;background-clip:unset !important;
  -webkit-text-fill-color:var(--ink) !important;filter:none !important;text-shadow:none !important;
}
.articles-body .page-hero p{
  font-size:16px;color:var(--ink-soft);max-width:620px;margin:0 auto;line-height:1.8;
}

/* ---------- articles 列表页：内容区间距 ---------- */
.articles-body #monthly{padding:40px 0 60px}

:root{
  --obs-line:rgba(124,58,237,.10);
  --obs-tint:rgba(124,58,237,.04);
  --obs-warm:#F59E0B;
  --obs-green:#10B981;
  --obs-read:17px;
}

/* ---------- 阅读进度条 ---------- */
.obs-progress{
  position:fixed;top:0;left:0;height:3px;width:0;z-index:99;
  background:var(--grad);border-radius:0 3px 3px 0;transition:width .1s linear;
}

/* ---------- 文章头部 ---------- */
.obs-hero{
  position:relative;overflow:hidden;
  padding:64px 40px 52px;text-align:center;
  background:
    radial-gradient(900px 340px at 50% -140px,rgba(124,58,237,.14),transparent 70%),
    linear-gradient(180deg,#FAFAFF 0%,#F3F2FC 100%);
  border-bottom:1px solid var(--obs-line);
}
.obs-hero::before,.obs-hero::after{
  content:'';position:absolute;border-radius:50%;pointer-events:none;
  background:var(--grad-soft);filter:blur(2px);
}
.obs-hero::before{width:180px;height:180px;top:-60px;left:-40px}
.obs-hero::after{width:150px;height:150px;bottom:-70px;right:-30px}

.obs-kicker{
  position:relative;z-index:1;display:inline-flex;align-items:center;gap:10px;
  padding:7px 18px;border-radius:999px;background:#fff;
  box-shadow:0 4px 18px rgba(124,58,237,.12);
  font-size:13px;font-weight:600;color:var(--purple);letter-spacing:.5px;
}
.obs-kicker .k-dot{width:6px;height:6px;border-radius:50%;background:var(--grad)}
.obs-issue{
  position:relative;z-index:1;margin-top:22px;
  font-family:'Noto Serif SC',serif;font-size:15px;color:var(--ink-faint);letter-spacing:3px;
}
.obs-hero h1{
  position:relative;z-index:1;margin:10px auto 0;max-width:900px;
  font-family:'Noto Serif SC',serif;font-size:40px;font-weight:700;
  line-height:1.35;color:var(--ink);letter-spacing:.5px;
}
.obs-sub{
  position:relative;z-index:1;margin:20px auto 0;max-width:660px;
  font-size:17px;line-height:1.9;color:var(--ink-soft);
}
.obs-meta{
  position:relative;z-index:1;margin-top:26px;
  display:flex;flex-wrap:wrap;gap:10px 22px;justify-content:center;align-items:center;
  font-size:13px;color:var(--ink-faint);
}
.obs-meta .dot{width:4px;height:4px;border-radius:50%;background:var(--ink-faint);opacity:.5}
.obs-tags{position:relative;z-index:1;margin-top:22px;display:flex;flex-wrap:wrap;gap:9px;justify-content:center}
.obs-tag{
  font-size:12.5px;font-weight:500;color:var(--purple);
  background:rgba(124,58,237,.08);border:1px solid rgba(124,58,237,.14);
  padding:5px 13px;border-radius:8px;
}

/* ---------- 正文容器 ---------- */
.obs-wrap{max-width:1080px;margin:0 auto;padding:0 40px 20px;display:flex;gap:44px;align-items:flex-start}
.obs-main{flex:1 1 auto;min-width:0;max-width:760px;margin:0 auto}
.obs-side{
  flex:0 0 214px;position:sticky;top:100px;
  padding:22px 0 0;
}
.obs-side .s-title{font-size:12px;letter-spacing:2px;color:var(--ink-faint);font-weight:600;margin-bottom:14px}
.obs-toc{list-style:none;border-left:2px solid var(--obs-line);padding-left:0}
.obs-toc li a{
  display:block;padding:9px 0 9px 16px;margin-left:-2px;
  border-left:2px solid transparent;
  font-size:13.5px;line-height:1.55;color:var(--ink-soft);transition:.2s;
}
.obs-toc li a:hover{color:var(--purple)}
.obs-toc li a.on{color:var(--purple);font-weight:600;border-left-color:var(--purple)}

/* ---------- 速览面板 ---------- */
.obs-glance{
  margin:44px 0 8px;padding:30px 32px;border-radius:20px;
  background:linear-gradient(135deg,rgba(124,58,237,.055) 0%,rgba(6,182,212,.055) 100%);
  border:1px solid var(--obs-line);
}
.obs-glance .g-head{
  display:flex;align-items:center;gap:10px;margin-bottom:20px;
  font-size:14px;font-weight:700;color:var(--purple);letter-spacing:1px;
}
.obs-glance .g-head::before{content:'';width:20px;height:2px;background:var(--grad);border-radius:2px}
.obs-stats{display:flex;flex-wrap:wrap;gap:14px}
.obs-stat{
  flex:1 1 150px;min-width:140px;background:#fff;border-radius:14px;padding:18px 18px 16px;
  box-shadow:0 3px 14px rgba(124,58,237,.06);
}
.obs-stat .v{
  font-family:'Noto Serif SC',serif;font-size:26px;font-weight:700;line-height:1.15;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.obs-stat .l{margin-top:8px;font-size:13px;font-weight:600;color:var(--ink)}
.obs-stat .n{margin-top:5px;font-size:12px;line-height:1.6;color:var(--ink-faint)}

/* ---------- 正文排版 ---------- */
.obs-lead{
  margin:40px 0 8px;padding:0 0 0 20px;border-left:3px solid var(--purple);
  font-size:18px;line-height:2;color:var(--ink-mid);font-weight:500;
}
.obs-h2{
  margin:56px 0 20px;padding-top:6px;
  display:flex;align-items:baseline;gap:14px;
  font-family:'Noto Serif SC',serif;font-size:25px;font-weight:700;color:var(--ink);line-height:1.45;
}
.obs-h2 .num{
  flex:none;font-size:14px;font-weight:700;letter-spacing:1px;
  color:#fff;background:var(--grad);border-radius:8px;padding:4px 9px;
  transform:translateY(-3px);
}
.obs-h3{margin:34px 0 14px;font-size:18.5px;font-weight:600;color:var(--ink);line-height:1.6}
.obs-main p{
  font-size:var(--obs-read);line-height:2.05;color:var(--ink-mid);margin:0 0 22px;
  letter-spacing:.2px;
}
.obs-main p strong{color:var(--ink);font-weight:600}
.obs-main em{font-style:normal;color:var(--purple);font-weight:600}

/* ---------- 要点列表 ---------- */
.obs-points{list-style:none;margin:8px 0 26px}
.obs-points li{
  position:relative;padding:14px 0 14px 30px;
  font-size:17px;line-height:1.95;color:var(--ink-mid);
  border-bottom:1px dashed var(--obs-line);
}
.obs-points li:last-child{border-bottom:none}
.obs-points li::before{
  content:'';position:absolute;left:6px;top:26px;
  width:7px;height:7px;border-radius:2px;background:var(--grad);transform:rotate(45deg);
}
.obs-points li b{color:var(--ink);font-weight:600;margin-right:6px}

/* ---------- 事实卡 ---------- */
.obs-facts{display:flex;flex-wrap:wrap;gap:16px;margin:12px 0 30px}
.obs-fact{
  flex:1 1 220px;min-width:210px;background:#fff;border:1px solid var(--obs-line);
  border-radius:16px;padding:20px 20px 18px;transition:.22s;
}
.obs-fact:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(124,58,237,.10)}
.obs-fact .f-t{font-size:16.5px;font-weight:700;color:var(--ink);margin-bottom:10px;line-height:1.55}
.obs-fact .f-d{font-size:17px;line-height:1.9;color:var(--ink-soft)}

/* ---------- 时间线 ---------- */
.obs-timeline{position:relative;margin:16px 0 34px;padding-left:26px}
.obs-timeline::before{
  content:'';position:absolute;left:6px;top:8px;bottom:8px;width:2px;
  background:linear-gradient(180deg,rgba(124,58,237,.35),rgba(6,182,212,.25));border-radius:2px;
}
.obs-tl{position:relative;padding:0 0 26px 8px}
.obs-tl:last-child{padding-bottom:4px}
.obs-tl::before{
  content:'';position:absolute;left:-25px;top:7px;width:11px;height:11px;border-radius:50%;
  background:#fff;border:2.5px solid var(--purple);box-shadow:0 0 0 4px rgba(124,58,237,.08);
}
.obs-tl .t-date{font-size:12.5px;font-weight:700;color:var(--purple);letter-spacing:.5px}
.obs-tl .t-title{margin-top:5px;font-size:16.5px;font-weight:600;color:var(--ink);line-height:1.6}
.obs-tl .t-desc{margin-top:7px;font-size:14.5px;line-height:1.9;color:var(--ink-soft)}

/* ---------- 观点块 ---------- */
.obs-view{
  position:relative;margin:34px 0;padding:30px 32px 28px 34px;border-radius:18px;
  background:linear-gradient(135deg,#FFFFFF 0%,#FBFAFF 100%);
  border:1px solid rgba(124,58,237,.16);
  box-shadow:0 10px 34px rgba(124,58,237,.07);
}
.obs-view::before{
  content:'';position:absolute;left:0;top:22px;bottom:22px;width:4px;border-radius:0 4px 4px 0;background:var(--grad);
}
.obs-view .v-tag{
  display:inline-block;font-size:12px;font-weight:700;letter-spacing:1.5px;color:var(--purple);
  background:rgba(124,58,237,.09);padding:4px 12px;border-radius:7px;margin-bottom:14px;
}
.obs-view p{font-size:17px;line-height:2.05;color:var(--ink-mid);margin-bottom:14px}
.obs-view p:last-child{margin-bottom:0}

/* ---------- 提示框 ---------- */
.obs-note{
  margin:26px 0 30px;padding:20px 24px;border-radius:14px;
  background:var(--bg-soft);border:1px dashed rgba(124,58,237,.22);
  font-size:15px;line-height:1.95;color:var(--ink-soft);
}
.obs-note b{color:var(--ink);font-weight:600}

/* ---------- 表格 ---------- */
.obs-tablewrap{margin:16px 0 32px;overflow-x:auto;border-radius:16px;border:1px solid var(--obs-line)}
.obs-table{width:100%;border-collapse:collapse;background:#fff;min-width:520px}
.obs-table th{
  background:linear-gradient(135deg,rgba(124,58,237,.07),rgba(6,182,212,.07));
  font-size:13.5px;font-weight:700;color:var(--ink);text-align:left;padding:14px 18px;white-space:nowrap;
}
.obs-table td{
  font-size:14.5px;line-height:1.8;color:var(--ink-mid);padding:14px 18px;
  border-top:1px solid var(--obs-line);vertical-align:top;
}
.obs-table tr:hover td{background:var(--obs-tint)}
.obs-table td:first-child{font-weight:600;color:var(--ink);white-space:nowrap}

/* ---------- 启示卡 ---------- */
.obs-take{
  margin:40px 0 12px;padding:32px 34px;border-radius:20px;
  background:linear-gradient(135deg,#1A1A2E 0%,#2B2050 55%,#123A48 100%);
  color:#fff;box-shadow:0 16px 44px rgba(26,26,46,.22);
}
.obs-take .k-head{
  display:flex;align-items:center;gap:10px;margin-bottom:22px;
  font-family:'Noto Serif SC',serif;font-size:20px;font-weight:700;
}
.obs-take .k-head span{
  font-size:11.5px;font-weight:600;letter-spacing:1.5px;color:#C4B5FD;
  border:1px solid rgba(196,181,253,.35);border-radius:6px;padding:3px 9px;
}
.obs-take ol{list-style:none;counter-reset:tk}
.obs-take li{
  counter-increment:tk;position:relative;padding:0 0 20px 42px;
  font-size:16px;line-height:1.95;color:rgba(255,255,255,.82);
}
.obs-take li:last-child{padding-bottom:0}
.obs-take li::before{
  content:counter(tk);position:absolute;left:0;top:2px;
  width:26px;height:26px;border-radius:8px;display:flex;align-items:center;justify-content:center;
  font-size:13px;font-weight:700;color:#fff;background:rgba(255,255,255,.13);
  border:1px solid rgba(255,255,255,.16);
}
.obs-take li b{color:#fff;font-weight:600}

/* ---------- 结语 ---------- */
.obs-end{
  margin:44px 0 8px;padding:34px 30px;border-radius:20px;text-align:center;
  background:linear-gradient(135deg,rgba(124,58,237,.06),rgba(6,182,212,.06));
  border:1px solid var(--obs-line);
}
.obs-end .e-line{
  font-family:'Noto Serif SC',serif;font-size:20px;font-weight:700;line-height:1.85;color:var(--ink);
  max-width:560px;margin:0 auto;
}
.obs-end .e-by{margin-top:16px;font-size:14px;color:var(--ink-faint)}

/* ---------- 免责 & 翻页 ---------- */
.obs-disc{
  margin:34px 0 0;font-size:12.5px;line-height:1.9;color:var(--ink-faint);
  padding:16px 20px;background:var(--bg-soft);border-radius:12px;
}
.obs-nav{
  max-width:1080px;margin:44px auto 0;padding:0 40px;
  display:flex;gap:18px;flex-wrap:wrap;
}
.obs-nav a{
  flex:1 1 260px;background:#fff;border:1px solid var(--obs-line);border-radius:16px;
  padding:20px 24px;transition:.22s;
}
.obs-nav a:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(124,58,237,.10);border-color:rgba(124,58,237,.25)}
.obs-nav .n-dir{font-size:12px;color:var(--ink-faint);letter-spacing:1px}
.obs-nav .n-t{margin-top:8px;font-size:15.5px;font-weight:600;color:var(--ink);line-height:1.6}
.obs-nav .n-back{text-align:center;display:flex;flex-direction:column;justify-content:center}

/* ===========================================================
   列表页：期刊索引（标题列表式）
   =========================================================== */
.iz-list{max-width:960px;margin:0 auto;display:flex;flex-direction:column}
.iz-row{
  display:flex;align-items:flex-start;gap:26px;padding:28px 26px;
  border-bottom:1px solid var(--obs-line);border-radius:14px;
  transition:background .22s,transform .22s,box-shadow .22s;position:relative;text-align:left;
}
.iz-row:first-child{border-top:1px solid var(--obs-line)}
.iz-row::before{
  content:'';position:absolute;left:0;top:14px;bottom:14px;width:3px;border-radius:3px;
  background:var(--grad);opacity:0;transition:opacity .22s;
}
.iz-row:hover{background:#fff;box-shadow:0 14px 38px rgba(124,58,237,.10);transform:translateX(4px)}
.iz-row:hover::before{opacity:1}
.iz-row:hover .iz-title{
  background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.iz-row:hover .iz-go{opacity:1}
.iz-row:hover .iz-go i{transform:translateX(4px)}

.iz-no{
  flex:none;width:74px;height:74px;border-radius:16px;color:#fff;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  font-family:'Noto Serif SC',serif;line-height:1;box-shadow:0 6px 18px rgba(124,58,237,.20);
}
.iz-no .mm{font-size:29px;font-weight:700;letter-spacing:-.5px}
.iz-no .yy{margin-top:5px;font-size:10.5px;letter-spacing:1.6px;opacity:.85;font-weight:400}

.iz-main{flex:1;min-width:0}
.iz-topic{font-size:12px;font-weight:600;color:var(--purple);letter-spacing:.4px;margin-bottom:7px}
.iz-title{
  font-family:'Noto Serif SC',serif;font-size:20.5px;font-weight:700;color:var(--ink);
  line-height:1.55;margin-bottom:9px;transition:color .22s;
}
.iz-desc{font-size:14px;color:var(--ink-soft);line-height:1.85;margin-bottom:12px}
.iz-tags{display:flex;flex-wrap:wrap;gap:7px}
.iz-tags span{
  font-size:11.5px;color:var(--ink-faint);background:rgba(124,58,237,.055);
  border-radius:6px;padding:3px 9px;
}
.iz-side{flex:none;width:104px;text-align:right;padding-top:2px}
.iz-date{font-size:12.5px;color:var(--ink-mid);font-weight:500}
.iz-read{margin-top:5px;font-size:11.5px;color:var(--ink-faint)}
.iz-go{margin-top:14px;font-size:12.5px;font-weight:600;color:var(--purple);opacity:.45;transition:opacity .22s}
.iz-go i{display:inline-block;font-style:normal;transition:transform .22s}

/* ===========================================================
   列表页：月刊卡片（旧版保留）
   =========================================================== */
.mz-grid{display:flex;flex-wrap:wrap;gap:24px;justify-content:center;max-width:1180px;margin:0 auto}
.mz-card{
  width:360px;background:var(--card);border-radius:var(--radius);overflow:hidden;
  box-shadow:var(--shadow);transition:transform .25s,box-shadow .25s;text-align:left;display:flex;flex-direction:column;
}
.mz-card:hover{transform:translateY(-6px);box-shadow:0 18px 44px rgba(124,58,237,.15)}
.mz-cover{
  position:relative;height:132px;padding:0 24px;display:flex;align-items:center;justify-content:space-between;
  overflow:hidden;
}
.mz-cover::after{
  content:'';position:absolute;right:-34px;bottom:-46px;width:140px;height:140px;border-radius:50%;
  background:rgba(255,255,255,.13);
}
.mz-cover .mz-m{
  position:relative;z-index:1;font-family:'Noto Serif SC',serif;color:#fff;line-height:1;
}
.mz-cover .mz-m .mm{font-size:44px;font-weight:700;letter-spacing:-1px}
.mz-cover .mz-m .yy{display:block;margin-top:8px;font-size:12px;letter-spacing:3px;opacity:.82;font-weight:400}
.mz-cover .mz-topic{
  position:relative;z-index:1;max-width:180px;text-align:right;
  font-size:13px;font-weight:600;color:#fff;line-height:1.7;opacity:.95;
}
.mz-body{padding:22px 24px 20px;display:flex;flex-direction:column;flex:1}
.mz-body h3{font-size:19px;font-weight:600;color:var(--ink);line-height:1.5;margin-bottom:10px}
.mz-body p{font-size:14px;color:var(--ink-soft);line-height:1.8;margin-bottom:14px;flex:1}
.mz-tags{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:14px}
.mz-tags span{
  font-size:11.5px;color:var(--purple);background:rgba(124,58,237,.07);
  border-radius:6px;padding:3px 9px;
}
.mz-foot{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:var(--ink-faint)}
.mz-foot .go{font-size:13px;font-weight:600;color:var(--purple)}

.col-intro{
  max-width:960px;margin:0 auto 40px;padding:26px 30px;border-radius:18px;
  background:linear-gradient(135deg,rgba(124,58,237,.05),rgba(6,182,212,.05));
  border:1px solid var(--obs-line);
  display:flex;flex-wrap:wrap;gap:22px;align-items:center;justify-content:space-between;
}
.col-intro .ci-t{font-family:'Noto Serif SC',serif;font-size:19px;font-weight:700;color:var(--ink);margin-bottom:8px}
.col-intro .ci-d{font-size:14.5px;line-height:1.9;color:var(--ink-soft);max-width:620px}
.col-intro .ci-badge{
  flex:none;text-align:center;padding:16px 22px;border-radius:14px;background:#fff;
  box-shadow:0 4px 18px rgba(124,58,237,.09);
}
.col-intro .ci-badge .b-n{
  font-family:'Noto Serif SC',serif;font-size:30px;font-weight:700;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.col-intro .ci-badge .b-l{margin-top:4px;font-size:12px;color:var(--ink-faint)}

/* ---------- 文章插图 ---------- */
.obs-figure{
  margin:28px 0 34px;border-radius:18px;overflow:hidden;
  background:#fff;border:1px solid var(--obs-line);
  box-shadow:0 10px 34px rgba(124,58,237,.08);
}
.obs-figure img{display:block;width:100%;height:auto}
.obs-figure .fig-cap{
  padding:14px 18px;font-size:16px;line-height:1.75;color:var(--ink-soft);
  background:linear-gradient(180deg,#fff 0%,#FAFAFF 100%);
  border-top:1px solid var(--obs-line);
}
.obs-figure .fig-cap strong{color:var(--ink);font-weight:600}

/* ---------- 响应式 ---------- */
@media (max-width:1080px){
  .obs-side{display:none}
  .obs-wrap{padding:0 32px 20px}
  .obs-main{max-width:100%}
}
@media (max-width:768px){
  .obs-hero{padding:40px 20px 34px}
  .obs-hero h1{font-size:27px}
  .obs-sub{font-size:15.5px}
  .obs-wrap{padding:0 20px 12px}
  .obs-main p{font-size:17px;line-height:1.98}
  .obs-h2{font-size:21px;margin-top:44px}
  .obs-fact{flex:1 1 100%;padding:18px 18px 16px}
  .obs-fact .f-t{font-size:17px;margin-bottom:9px}
  .obs-fact .f-d{font-size:17px;line-height:1.92}
  .obs-figure{margin:22px 0 28px;border-radius:14px}
  .obs-figure .fig-cap{padding:12px 14px;font-size:16px}
  .obs-glance{padding:22px 20px}
  .obs-stat{flex:1 1 100%}
  .obs-take{padding:26px 22px}
  .obs-view{padding:24px 22px 22px 24px}
  .obs-nav{padding:0 20px}
  .mz-card{width:100%;max-width:420px}
  .col-intro{padding:22px 20px}
  .iz-row{flex-wrap:wrap;gap:16px;padding:22px 16px 22px 8px}
  .iz-no{width:56px;height:56px;border-radius:13px}
  .iz-no .mm{font-size:22px}
  .iz-no .yy{font-size:9.5px;margin-top:4px}
  .iz-main{flex:1 1 calc(100% - 82px);min-width:200px}
  .iz-title{font-size:17.5px}
  .iz-desc{font-size:13.5px}
  .iz-side{width:100%;text-align:left;display:flex;align-items:center;gap:12px;padding-top:0}
  .iz-read{margin-top:0}
  .iz-go{margin-top:0;margin-left:auto;opacity:1}
  #monthly.section{padding:40px 12px 60px}
}
