/* 赢商专栏第二屏：WINSHANG PERSPECTIVES + 最新文章轮播 */
.columns-perspectives{
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-height:calc(100vh - 72px);
  padding:36px 0 32px;
  background:
    radial-gradient(circle at 88% 8%,rgba(0,73,255,.05),transparent 28%),
    linear-gradient(180deg,#fff 0%,#f7faff 100%);
  scroll-margin-top:84px;
}
.columns-anchor{
  position:absolute;
  top:0;
  left:0;
  width:1px;
  height:1px;
  pointer-events:none;
}
.columns-shell{
  width:calc(100% - 64px);
  max-width:1280px;
  margin:auto;
}
.columns-head{
  max-width:none;
  margin-bottom:22px;
}
.columns-head h2{
  max-width:18em;
  font:700 clamp(28px,2.5vw,38px)/1.32 var(--font-serif,"Noto Serif SC",serif);
  color:#102347;
  margin:0 0 12px;
  letter-spacing:-.02em;
  overflow-wrap:break-word;
}
.columns-head p{
  max-width:46em;
  font-size:15px;
  line-height:1.75;
  color:#5d738f;
  margin:0;
}
.columns-stage{
  display:grid;
  grid-template-columns:minmax(280px,.78fr) minmax(0,1.22fr);
  gap:18px;
  align-items:stretch;
  min-height:0;
}
.expert-stack{
  display:grid;
  grid-template-rows:1fr 1fr;
  gap:14px;
  min-height:0;
}
.expert-card{
  position:relative;
  display:flex;
  flex-direction:column;
  min-height:0;
  padding:22px 24px 20px;
  border:1px solid #dce6f4;
  border-radius:20px;
  background:
    radial-gradient(circle at 92% 8%,rgba(0,73,255,.06),transparent 32%),
    #fff;
  overflow:hidden;
  box-shadow:0 14px 32px -28px #1e4b9a55;
  scroll-margin-top:96px;
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
}
.expert-card:hover{
  transform:translateY(-2px);
  border-color:#c5d7f6;
  box-shadow:0 18px 36px -24px #1e4b9a66;
}
.expert-card:after{
  content:attr(data-index);
  position:absolute;
  right:14px;
  top:4px;
  font:600 76px/1 var(--font-serif,"Noto Serif SC",serif);
  color:rgba(0,73,255,.045);
  pointer-events:none;
}
.expert-topline{
  display:flex;
  align-items:center;
  justify-content:space-between;
  position:relative;
  z-index:1;
}
.expert-topline small{
  font:800 10px/1 var(--font-mono,monospace);
  letter-spacing:.16em;
  color:#0049ff;
}
.expert-topline span{
  font:700 11px/1 var(--font-mono,monospace);
  letter-spacing:.08em;
  color:#9bb0c8;
}
.expert-card h3{
  position:relative;
  z-index:1;
  font:700 26px/1.3 var(--font-serif,"Noto Serif SC",serif);
  color:#122c4f;
  margin:18px 0 8px;
}
.expert-card>p{
  position:relative;
  z-index:1;
  font-size:13px;
  line-height:1.7;
  color:#5e738c;
  margin:0;
  max-width:96%;
}
.expert-tags{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  position:relative;
  z-index:1;
  margin-top:auto;
  padding-top:16px;
}
.expert-tags span{
  padding:6px 10px;
  border-radius:999px;
  background:#f1f5fb;
  color:#4f6784;
  font-size:12px;
  font-weight:600;
}
.column-feed{
  min-width:0;
  display:flex;
  flex-direction:column;
  padding:20px 22px 16px;
  border:1px solid #dce6f4;
  border-radius:22px;
  background:linear-gradient(180deg,#fbfdff 0%,#f3f7ff 100%);
  box-shadow:0 14px 32px -28px #1e4b9a55;
  overflow:hidden;
}
.column-feed-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  padding-bottom:14px;
  border-bottom:1px solid #dfe7f2;
}
.column-feed-head small{
  display:block;
  font:800 10px/1 var(--font-mono,monospace);
  letter-spacing:.15em;
  color:#0049ff;
  margin-bottom:6px;
}
.column-feed-head h3{
  font:700 24px/1.25 var(--font-serif,"Noto Serif SC",serif);
  color:#102347;
  margin:0;
}
.column-feed-actions{
  display:flex;
  align-items:center;
  gap:8px;
  flex-shrink:0;
}
.column-feed-actions>a{
  font-size:13px;
  font-weight:700;
  color:#0049ff;
  margin-right:4px;
  white-space:nowrap;
  text-decoration:none;
}
.column-feed-actions>a:hover{text-decoration:underline}
.column-feed-btn{
  width:34px;
  height:34px;
  border:1px solid #d6e1f2;
  border-radius:50%;
  background:#fff;
  color:#0049ff;
  font-size:14px;
  cursor:pointer;
  transition:background .2s ease,border-color .2s ease,color .2s ease,transform .2s ease;
}
.column-feed-btn:hover{
  background:#0049ff;
  border-color:#0049ff;
  color:#fff;
  transform:translateY(-1px);
}
.column-feed-btn:focus-visible{
  outline:2px solid #0049ff;
  outline-offset:3px;
}
.column-feed-viewport{
  height:414px;
  margin-top:8px;
  overflow:hidden;
}
.column-feed-track{
  display:flex;
  flex-direction:column;
  will-change:transform;
  transition:transform .21s cubic-bezier(.22,.61,.36,1);
}
.column-article{
  box-sizing:border-box;
  flex:0 0 138px;
  height:138px;
  display:grid;
  grid-template-columns:42px minmax(0,1fr) 28px;
  gap:12px;
  align-items:center;
  padding:12px 8px;
  border-bottom:1px solid #e2e8f2;
  text-decoration:none;
  color:inherit;
  transition:background .2s ease,padding .2s ease,opacity .2s ease;
}
.column-article.is-current{
  background:rgba(255,255,255,.92);
  padding-left:12px;
  padding-right:10px;
  border-radius:14px;
  box-shadow:inset 3px 0 0 #0049ff;
}
.column-article:hover{background:rgba(255,255,255,.86)}
.column-article-no{
  align-self:start;
  margin-top:6px;
  font:700 12px/1 var(--font-mono,monospace);
  letter-spacing:.08em;
  color:#8ea3bc;
}
.column-article.is-current .column-article-no{color:#0049ff}
.column-article-copy h4{
  font:700 17px/1.4 var(--font-serif,"Noto Serif SC",serif);
  color:#0c1b2d;
  margin:0 0 6px;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.column-article-copy p{
  font-size:13px;
  line-height:1.5;
  color:#6a8098;
  margin:0 0 8px;
  display:-webkit-box;
  -webkit-line-clamp:1;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.column-article-meta{
  display:flex;
  gap:12px;
  align-items:center;
  font-size:12px;
  color:#8b9aae;
}
.column-article-meta b{color:#4d6480;font-weight:700}
.column-article>i{
  font-style:normal;
  width:26px;
  height:26px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#edf3ff;
  color:#0049ff;
  font-size:12px;
  transition:background .2s ease,color .2s ease,transform .2s ease;
}
.column-article:hover>i,
.column-article.is-current>i{
  background:#0049ff;
  color:#fff;
}
.column-article:hover>i{transform:translate(2px,-2px)}
.column-feed-foot{
  display:flex;
  align-items:center;
  gap:12px;
  padding-top:12px;
  color:#7d8fa4;
  font-size:12px;
}
.column-feed-count{font-variant-numeric:tabular-nums;color:#4d6480;font-weight:700}
.column-feed-progress{
  position:relative;
  display:block;
  height:2px;
  background:#dbe5f5;
  flex:1;
  overflow:hidden;
  border-radius:2px;
}
.column-feed-progress i{
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:14%;
  background:#0049ff;
  transition:width .35s ease;
}
@media(max-width:1100px){
  .columns-perspectives{min-height:0;padding:32px 0}
  .columns-stage{grid-template-columns:1fr}
  .expert-stack{grid-template-columns:1fr 1fr;grid-template-rows:auto}
  .expert-card{min-height:210px}
  .column-feed-viewport{height:390px}
}
@media(max-width:760px){
  .columns-shell{width:calc(100% - 32px)}
  .columns-head{margin-bottom:18px}
  .columns-head h2{font-size:26px}
  .columns-head p{font-size:14px}
  .expert-stack{grid-template-columns:1fr}
  .column-feed-head{align-items:flex-start;flex-direction:column}
  .column-feed-viewport{height:360px}
  .column-article,
  .column-feed-track .column-article{
    flex-basis:120px;
    height:120px;
    grid-template-columns:32px minmax(0,1fr) 24px;
  }
  .column-article-copy h4{font-size:15px}
  .column-article-copy p{display:none}
}
@media(prefers-reduced-motion:reduce){
  .expert-card,
  .column-feed-btn,
  .column-article,
  .column-article>i,
  .column-feed-track,
  .column-feed-progress i{transition:none}
  .expert-card:hover,
  .column-feed-btn:hover,
  .column-article:hover>i{transform:none}
}