/* ============================================================
   微略官网 CMS · 前台补充样式 front-extra.css
   ============================================================
   tokens.css / app.css 是原型的原文件，一律不动 —— 这里只放两件事：
     1. 原型里没有的「后台可替换图片」：占位块被真实图片接替时的统一尺寸；
     2. 原型里没有的分页器（原型内容少，不需要翻页）。
   目的是让「静态原型 → 数据驱动」这一步不产生任何额外视觉偏差：
   有图时用图片，没图时仍是原来的虚线占位块。
   ============================================================ */

/* ---- 占位块 → 真实图片：尺寸与圆角对齐 .media-placeholder ---- */
.media-fill{
  width:100%;
  aspect-ratio:4/3;
  border-radius:var(--radius);
  object-fit:cover;
  display:block;
  background:var(--ink-100);
}
/* 首屏与案例幅面不同，沿用各自占位块的宽高比 */
.hero-slide__media .media-fill{aspect-ratio:4/3;}
.case-slide__media .media-fill{aspect-ratio:4/3;}

/* ---- 页脚二维码：占位块换成真实图片 ---- */
.qr-image{
  width:120px;
  height:120px;
  margin-top:var(--sp-3);
  border-radius:var(--radius);
  object-fit:cover;
  display:block;
  background:var(--indigo-700);
}

/* ---- 分页器 ---- */
.pager{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:var(--sp-3);
  flex-wrap:wrap;
  margin-top:var(--sp-6);
}
.pager__info{font-size:var(--fs-sm);color:var(--text-muted);}
.pager__info b{color:var(--text-primary);}
.pager__list{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap;}
.pager__gap{padding:0 4px;color:var(--text-muted);}
.pager__item{
  min-width:36px;
  height:36px;
  padding:0 10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--border-default);
  border-radius:var(--radius-sm);
  background:var(--white);
  color:var(--text-secondary);
  font-size:var(--fs-sm);
  text-decoration:none;
  transition:border-color var(--transition-fast),color var(--transition-fast);
}
.pager__item:hover{border-color:var(--brand-indigo);color:var(--brand-indigo);}
.pager__item.is-current{
  background:var(--brand-indigo);
  border-color:var(--brand-indigo);
  color:var(--white);
  font-weight:var(--fw-semibold);
}
.pager__item.is-disabled{opacity:.45;pointer-events:none;}

/* ---- 富文本正文（后台编辑器产出），沿用原型排版尺度 ---- */
.c-imagetext__body ul{margin:0;padding-left:1.1em;}
.c-imagetext__body ul li{margin:6px 0;}