/* dōzo mag(列表 /a/p/magazines + 文章 /a/p/magazines/1175)。
   基础组件复用 home.css;此处只放 mag 专属:分类 tab / 列表网格覆写 / 载入更多 / 文章 eyecatch / editorSec.v1_1。
   数值取自 analysis/05 + 线上 measure(841/801px 内容列, editorSec 15px/1.6, h1 29px)。 */

/* ============ PART A — 列表页 ============ */

/* 页面标题(narrow 间距):线上 .add-sectionGeneral.narrow 30px 顶 + inner 85px 顶,
   标题负 margin -114px 把大字标拉上来(移动 -86px)。 */
.section--mag-heading { padding: 30px 0 0; }
.section--mag-heading .section__inner { padding: 85px 0 0; }
.section--mag-heading .section-title { margin-top: -114px; margin-bottom: 60px; }
@media (max-width: 768px) {
  .section--mag-heading { padding: 60px 0 0; }
  .section--mag-heading .section-title { margin-top: -86px; margin-bottom: 20px; }
}

/* 分类过滤 tab(线上 .categoryNav max-width 980 居中) */
.category-nav { max-width: 980px; margin-inline: auto; padding: 20px 20px 40px; }
.category-nav__list { display: flex; flex-wrap: wrap; gap: 20px; font-weight: 500; }
.category-nav__tab {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 14px 32px; font-size: 15px; font-weight: 700; letter-spacing: .045em; line-height: 1.15;
  background: var(--color-white); border: 1px solid var(--color-ink); border-left: 8px solid var(--color-ink);
  transition: background var(--transition-duration);
}
.category-nav__tab.is-selected, .category-nav__tab:hover { background: var(--color-base-orange); }
@media (max-width: 768px) {
  /* 移动端 = 换行的描边小盒(线上 li padding-top 3 + mb 8;活动态黑下划线,无橙色) */
  .category-nav { padding: 20px 0 0; }
  .category-nav__list { flex-wrap: wrap; justify-content: flex-start; gap: 11px 13px; }
  .category-nav__tab { min-width: 90px; padding: 10px 12px 11px; font-size: 13px; }
  .category-nav__tab:hover { background: var(--color-white); }
  .category-nav__tab.is-selected { background: var(--color-white); border-bottom: 3px solid var(--color-ink); }
}

/* 列表网格:body 底色(非蓝),3 列黑竖线,每行首卡无线。
   section = 线上 .add-sectionGeneral 60px 0 124px(移动 40px 0 96px);inner 10px(移动 30px)。 */
.section--mag-list { background: var(--color-bg); padding: 60px 0 124px; }
.section--mag-list .section__inner { padding-inline: 10px; }
@media (max-width: 768px) {
  .section--mag-list { padding: 40px 0 96px; }
  .section--mag-list .section__inner { padding-inline: 30px; }
}
.magazine-grid--list { gap: 90px 36px; }
@media (max-width: 768px) { .magazine-grid--list { gap: 40px 36px; } }
.magazine-grid--list > *:nth-child(3n+1) { border-left: none; }
/* 分类过滤:.article-item{display:grid} 会盖过 [hidden],故用更高优先级的类隐藏 */
.magazine-grid--list .article-item.is-hidden { display: none; }
@media (max-width: 768px) {
  .magazine-grid--list > * { border-left: none; border-top: 1px solid var(--color-ink); }
  .magazine-grid--list > *:first-child { border-top: none; }
}

/* 载入更多:黑药丸(纯客户端揭示下一批)。网格底→按钮实测 220px(桌面)/152px(移动),
   下方留白由 section 的 padding-bottom 承担。 */
.mag-more { display: flex; justify-content: center; margin: 220px 0 4px; }
.mag-more__button {
  width: 256px; max-width: 100%; padding: 24px 0; text-align: center; line-height: 1.15;
  font-size: 16px; color: var(--color-white); background: var(--color-ink-soft); border-radius: var(--radius-pill);
}
.mag-more__button:hover { opacity: .7; }
.mag-more.is-done { display: none; }
@media (max-width: 768px) {
  .mag-more { margin: 152px 0 0; }
  .mag-more__button { width: 208px; padding: 20px 0; font-size: 15px; }
}

/* ============ PART B — 文章页 ============ */

/* 内容列:居中 841px(内 801),两侧 20px */
.article-eyecatch, .magazine-content__inner, .article-share {
  width: 100%; max-width: 841px; margin-inline: auto; padding-inline: 20px;
}

/* eyecatch:hero 图 + 竖排日期/分类 rail(桌面面包屑下 28px 起) */
.article-eyecatch { margin-top: 28px; }
@media (max-width: 768px) { .article-eyecatch { margin-top: 0; } }
.article-eyecatch__img { position: relative; margin-bottom: 32px; }
.article-eyecatch__img img { width: 100%; height: auto; }
.article-eyecatch__side {
  position: absolute; left: -42px; top: 0; bottom: 0; z-index: 1;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px;
  font-family: var(--font-en); font-size: 22px; font-weight: 400; line-height: 1.15; text-transform: uppercase;
}
.article-eyecatch__side > * { writing-mode: vertical-lr; scale: -1; }
.article-eyecatch__side hr { width: 24px; height: 1px; border: none; border-top: 1px solid #707070; translate: 1px 0; }
@media (max-width: 768px) {
  .article-eyecatch { padding-inline: 0; }
  .article-eyecatch__img { margin-bottom: 21px; }
  .article-eyecatch__side {
    position: relative; left: 0; flex-direction: row-reverse; justify-content: flex-start;
    gap: 0; font-size: 15px; margin: 32px 20px 0; /* 图→rail 32px,rail→标题由容器 mb 21px 承担(线上实测) */
  }
  .article-eyecatch__side > * { writing-mode: horizontal-tb; scale: 1; }
  .article-eyecatch__side hr { rotate: 90deg; width: 15px; margin-right: 1rem; }
}

.article-eyecatch__head { }
@media (max-width: 768px) { .article-eyecatch__head { margin-inline: 20px; } }
.article-eyecatch__title { margin-bottom: 40px; font-size: 29px; font-weight: 700; line-height: 1.15; }
@media (max-width: 768px) { .article-eyecatch__title { margin-bottom: 36px; font-size: 24px; line-height: 1.458; } }
.article-eyecatch__byline {
  display: inline-block; min-width: 400px; margin-bottom: 40px; line-height: 1.15;
  padding-bottom: 32px; border-bottom: 1px solid var(--color-ink);
}
@media (max-width: 768px) { .article-eyecatch__byline { display: block; min-width: 0; margin-bottom: 36px; } }
.article-eyecatch__editer { padding-right: 48px; font-size: 20px; }
@media (max-width: 768px) { .article-eyecatch__editer { font-size: 16px; } }
/* 标签和署名是两个相邻 span,中间没有空白节点,渲染出来是 "words:the committee" */
.article-eyecatch__editer .editer-label { font-family: var(--font-en); margin-right: .35em; }

/* 正文长文排版 editorSec.v1_1 */
.magazine-content { padding-bottom: 128px; }
@media (max-width: 768px) { .magazine-content { padding-bottom: 48px; } }
.editorSec { font-size: 15px; line-height: 1.6; }
@media (max-width: 768px) { .editorSec { font-size: 14px; } }
/* 段落:行高 2.2、两端对齐、段后 56px(取自线上 measure) */
.editorSec p { font-size: 15px; line-height: 2.2; margin-bottom: 56px; text-align: justify; }
@media (max-width: 768px) { .editorSec p { font-size: 14px; line-height: 1.929; margin-bottom: 40px; } }
.editorSec p.indent { padding: 0 2rem; }
.editorSec h1, .editorSec h2, .editorSec h3, .editorSec h4, .editorSec h5, .editorSec h6 { font-weight: 700; line-height: 1.6; margin: 0; }
.editorSec h1 { font-size: 180%; } .editorSec h2 { font-size: 145%; } .editorSec h3 { font-size: 110%; }
.editorSec h4 { font-size: 100%; } .editorSec h5 { font-size: 90%; } .editorSec h6 { font-size: 80%; }
.editorSec img { width: auto; height: auto; }
/* dd: placeholder art is mixed-ratio (tall roster crops / big photos) — cap and center inline images */
.editorSec p img { display: block; max-width: 100%; max-height: 420px; width: auto; margin: 0 auto; }
@media (max-width: 768px) { .editorSec img { object-fit: cover; } }
.editorSec img.wfull { width: 100%; }
.editorSec .caption { color: #707070; }
.editorSec a { display: inline; text-decoration: underline; }
.editorSec a:hover { text-decoration: none; }
.editorSec blockquote { position: relative; border-left: 3px solid #ccc; padding-left: 15px; }
.editorSec ol { list-style: decimal; padding-left: 20px; }
.editorSec hr { margin: 3rem auto; height: 1px; background: #333; border: none; }
.editorSec .waku { border: 1px solid var(--color-ink); padding: 2rem; margin: 3rem auto; }
/* chip 列表(check-bullet) */
.editorSec ul { margin: 1rem auto; }
.editorSec ul li {
  position: relative; display: inline-block; min-width: 400px; margin: 0 0 1rem 30px;
  padding: .5rem 1.5rem; background: #F4EFEF; border-radius: 2rem;
}
@media (max-width: 768px) { .editorSec ul li { min-width: -webkit-fill-available; } }
.editorSec ul li::before {
  content: ""; position: absolute; left: -30px; top: 50%; translate: 0 -50%;
  width: 25px; height: 25px; background: url(/assets/common/ic_list_check.svg) center/contain no-repeat;
}
/* 粉色马克笔(文章用 #F8D4D4,区别首页黄色) */
.editorSec .marker-line, .editorSec .add-markerline {
  display: inline; padding: 0 2px 3px;
  background: linear-gradient(transparent 50%, var(--marker-color, #F8D4D4) 50%);
}
.editorSec > p:last-child { margin-bottom: 0; } /* 线上末段 mb 0(实测) */

/* 分享:居中一行(复用 detail-share 视觉);正文→share 20px(移动 47px),share→相关 158px(移动 78px) */
.article-share { display: flex; justify-content: center; margin-top: 20px; padding-top: 0; padding-bottom: 30px; }
@media (max-width: 768px) { .article-share { margin-top: 47px; } }

/* 相关记事 band(文章页):线上 padding 60px 0(移动 40px 0);
   标题沿用线上 .add-sectionTitle 的 -114px 负 margin(字标浮出蓝带上缘,移动 -86px)。 */
.page-magazine-article .section--magazine { padding: 60px 0; }
.page-magazine-article .section--magazine .section-title { margin-top: -114px; margin-bottom: 60px; }
@media (max-width: 768px) {
  .page-magazine-article .section--magazine { padding: 40px 0; }
  .page-magazine-article .section--magazine .section-title { margin-top: -86px; margin-bottom: 40px; }
}
.article-share .detail-share { display: flex; gap: 40px; align-items: center; }
.article-share .detail-share__title { font-family: var(--font-en); font-size: 19px; font-style: italic; }
.article-share .detail-share__list { display: flex; gap: 20px; align-items: center; }
.article-share .detail-share__list li { width: 30px; }
.article-share .detail-share__list li a { display: block; }
.article-share .detail-share__list li a:hover { opacity: .7; }
.article-share .detail-share__list li img { width: 100%; }