.whsc-wrap{
  position: relative;
  width: 100%;
  --whsc-sticky-top: 96px;
  --whsc-gap: 36px;
}
.whsc-sticky{
  position: sticky;
  top: var(--whsc-sticky-top);
  height: calc(100vh - var(--whsc-sticky-top));
  overflow: hidden;
  display: flex;
  align-items: center;
}
.whsc-track{
  display: flex;
  align-items: stretch;
  gap: var(--whsc-gap);
  will-change: transform;
  transform: translate3d(0,0,0);
}
.whsc-card{
  flex: 0 0 auto;
  width: min(920px, 86vw);
  max-width: 920px;
  background: #fff;
  border-radius: 18px;
  border: 1px solid rgba(0,0,0,0.08);
  transform: translate3d(0,0,0) scale(1);
  transition: transform .22s ease, box-shadow .22s ease;
}
.whsc-inner{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0px;
}
.whsc-left{
  padding-right: 48px;
}
.whsc-right{
  min-height: 240px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.whsc-media{
  width: 100%;
  height: 100%;
  object-fit: contain;
  display:block;
}
.whsc-date{ margin:0 0 10px 0; opacity:.75; }
.whsc-title{ margin:0 0 10px 0; }
.whsc-excerpt{ margin:0; opacity:.9; }
.whsc-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-top: 14px;
  text-decoration:none;
  border:1px solid rgba(0,0,0,0.12);
  background:#fff;
  color: inherit;
  line-height:1;
  padding: 10px 14px;
  border-radius: 999px;
}

@media (max-width: 980px){
  .whsc-wrap{ height:auto !important; }
  .whsc-sticky{ height:auto; position: relative; top:auto; overflow: visible; }
  .whsc-track{ flex-direction: column; transform:none !important; }
  .whsc-card{ width: 100%; }
  .whsc-inner{ grid-template-columns: 1fr; }
  .whsc-left{ padding-right: 0; }
}