/* ================================
   OKXUN 列表页布局（修正版）
   ================================ */

/* 外层容器：统一用 flex，兼容性最好 */
.views-row {
    position: relative; 
    &::after {
        position: absolute;
        inset-block-end: 0;
        width: var(--sp3);
        height: 0;
        content: "";
        border-top: solid 2px var(--color--gray-95);
    }
}

.okxun-teaser__inner {
  display: flex;
  gap: 1.5rem;
  align-items: flex-start;
  margin-bottom: 2rem;
}

/* 有图时：左图右文 */
.okxun-teaser__inner.has-image .okxun-teaser__media {
  flex: 0 0 260px; /* 可改 240 / 280 / 300 */
}

.okxun-teaser__media img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 6px;
}

/* 右侧内容区域：始终占满剩余空间 */
.okxun-teaser__body {
  flex: 1 1 auto;
}

/* 无图时：因为根本没有 */
.okxun-teaser__inner.no-image .okxun-teaser__body {
}

/* 标题样式 */
.okxun-teaser__title {
  margin: 0 0 0.5rem;
  font-size: 1.4rem;
  line-height: 1.3;
}
.okxun-teaser__title a {
  text-decoration: none;
  color: #000000;
}
.okxun-teaser__title a:hover {
  color: #188dd1;
}

/* 摘要样式 */
.okxun-teaser__summary {
  margin-bottom: 0.5rem;
  color: #444;
  font-size: 1rem;
}

/* 移动端：上下排列 */
@media (max-width: 640px) {
  .okxun-teaser__inner {
    flex-direction: column;
  }

  .okxun-teaser__inner.has-image .okxun-teaser__media {
    width: 100%;
  }
}