@charset "utf-8";
/* CSS Document */
.crumbs-bar{
  background:#fff;
  /*border-bottom:1px solid var(--gray);*/border-top: 1px solid var(--gray);
	padding: 0.8rem 1.3rem 0rem 1.3rem;background-color: #F9F9F9;
}
.crumbs-inner{
  width: 100%;
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-weight:300;
 
}
.crumbs-inner a{transition:color .2s;color:var(--text-t);}
.crumbs-inner a:hover{color:var(--primary)}
.crumbs-inner svg{width:7px;height:11px;flex-shrink:0;color:var(--text-t)}
.crumbs-inner .cur{
  color:var(--text-t);
  max-width:46%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
/* ---------- Page intro ---------- */
.page-intro{
  padding: 0.8rem 1.3rem 0rem 1.3rem;
  position:relative;background-color: #F9F9F9;
}
.page-intro .kicker{
  display:inline-flex;align-items:center;gap:12px;
  text-transform:uppercase;
  color:var(--primary);font-weight:400;margin-bottom:20px;
}
.page-intro .kicker::before{
  content:"";width:34px;height:2px;background:var(--primary);display:block;
}
.page-intro h1{
  font-weight:400;color:var(--dark);
  line-height:1.24;margin-bottom:18px;
}
.page-intro h1 em{font-style:normal;color:var(--primary)}
.page-intro p{
  color:var(--dark);max-width:680px;line-height:1.9;font-weight:400;
}
.page-intro .quote-mark{
  position:absolute;right:1.3rem;top:40px;
  width:120px;height:120px;color:var(--primary);opacity:.1;
  pointer-events:none;
}
/* ---------- Main ---------- */
.mains{padding: 0.8rem 1.3rem 0.8rem 1.3rem;background-color: #F9F9F9;border-bottom: 1px solid var(--gray);}
.main-head{
  display:flex;align-items:center;justify-content:flex-end;
  gap:16px;margin:6px 0 26px;flex-wrap:wrap;
}
.main-head .note{font-size:13.5px;color:var(--gray);letter-spacing:.8px}
.main-head .note b{color:var(--primary);font-weight:600}

/* ---------- 文章行（无主图） ---------- */
.rows{display:flex;flex-direction:column;gap:20px}
.row{
  position:relative;
  display:flex;align-items:center;gap:34px;
  background:#fff;border:1px solid #e8e8e6;
  border-radius:var(--radius);padding:38px 42px;
  transition:transform .28s,box-shadow .28s,border-color .28s;
  animation:rise .42s both;
  overflow:hidden;
}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
.row:nth-child(2){animation-delay:.05s}
.row:nth-child(3){animation-delay:.1s}
.row:nth-child(4){animation-delay:.15s}
.row:nth-child(5){animation-delay:.2s}
.row:nth-child(6){animation-delay:.25s}
.row:nth-child(7){animation-delay:.3s}
.row:nth-child(8){animation-delay:.35s}
.row:hover{
  transform:translateY(-4px);border-color:var(--primary);
  box-shadow:0 20px 46px rgba(50,50,47,.11);
}
.row::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:4px;
  background:var(--primary);transform:scaleY(0);transform-origin:top;
  transition:transform .3s;
}
.row:hover::before{transform:scaleY(1)}
.row-body{flex:1;min-width:0}
.row-meta{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  margin-bottom:12px;
}
.row-cat{
  color:var(--primary);background:#FFF6E6;
  border:1px solid rgba(255,162,0,.32);
  padding:4px 13px;border-radius:var(--radius);font-weight:400;
}
.row-date{
  display:flex;align-items:center;gap:7px;
  color:var(--gray);
  font-variant-numeric:tabular-nums;
}
.row-date img{width:15px;height:15px;flex-shrink:0}
.row h3{
  font-weight:400;line-height:1.5;
  margin-bottom:10px;
  display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;
  overflow:hidden;
  transition:color .2s;
}
.row:hover h3{color:var(--primary-dark)}
.row p{
  color:var(--gray);line-height:1.85;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden;
}
.row-more{
  flex-shrink:0;width:52px;height:52px;border-radius:50%;
  border:1px solid #e8e8e6;color:var(--text-t);
  display:flex;align-items:center;justify-content:center;
  transition:.28s;
}
.row-more img{width:16px;height:16px;transition:transform .25s}
.row:hover .row-more{
  background:var(--primary);border-color:var(--primary);color:#fff;
  box-shadow:0 10px 22px rgba(255,162,0,.35);
}
.row:hover .row-more svg{transform:translateX(2px)}

/* ---------- Pagination ---------- */
.pager{
  display:flex;justify-content:center;align-items:center;
  gap:9px;margin-top:48px;flex-wrap:wrap;
}
.pager a,.pager span{
  min-width:40px;height:40px;padding:0 13px;
  border:1px solid #e8e8e6;background:#fff;color:var(--ink-2);
  border-radius:8px;font-size:13.5px;
  display:flex;align-items:center;justify-content:center;
  transition:.2s;
}
.pager li{list-style: none;}
.pager a:hover{border-color:var(--primary);color:var(--primary)}
.pager .on{background:var(--primary);border-color:var(--primary);color:#fff;font-weight:500}
.pager .disabled{opacity:.4;pointer-events:none}
