/* list_risk_management_span_launching.html 专用样式 — SPAN 2 框架首推页响应式适配 */

/*
 * 平板端（501–1259px）
 * 公共重置已提取至 responsive-tablet.css，此处仅保留页面专有规则
 */
@media screen and (max-width: 1259px) {
  /* SPAN 2 页面：视频高度缩小 */
  .span2-framework-recommendation .singleVideo {
    height: 400px;
  }

  /* 表格容器：允许横向滚动，防止溢出 */
  .span2-framework-recommendation .table-wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

/*
 * 小屏平板（768px 及以下）
 * 两栏导航堆叠、三列卡片堆叠、视频高度进一步缩小
 */
@media screen and (max-width: 1259px) {
  /* top-nav-wrapper：从左右分栏切换为上下堆叠 */
  .span2-framework-recommendation .top-nav-wrapper {
    display: block;
  }
  .span2-framework-recommendation .top-nav-wrapper .top-nav-left {
    width: 100%;
    margin-right: 0;
    border-right: none;
    padding-right: 0;
    margin-bottom: 30px;
  }
  .span2-framework-recommendation .top-nav-wrapper .nav-item-list {
    padding-right: 0;
  }

  /* card-list-3：从三列切换为纵向堆叠 */
  .span2-framework-recommendation .card-list-3 {
    display: block;
  }
  .span2-framework-recommendation .card-list-3 .card-item {
    width: auto;
    margin: 0 0 20px 0;
  }
  .span2-framework-recommendation .card-list-3 .card-item:nth-child(2) {
    margin: 0 0 20px 0;
  }
  .span2-framework-recommendation .card-list-3 .card-item:last-child {
    margin-bottom: 0;
  }

  /* 视频高度进一步缩小 */
  .span2-framework-recommendation .singleVideo {
    height: 320px;
  }

  /* 表格字体缩小 */
  .span2-framework-recommendation .table-wrapper .table-border {
    font-size: 13px;
  }
  .span2-framework-recommendation .table-wrapper .table-border th,
  .span2-framework-recommendation .table-wrapper .table-border td {
    padding: 10px 12px;
  }
  .span2-framework-recommendation .table-wrapper .table-title {
    font-size: 20px;
  }
  .span2-framework-recommendation .table-wrapper .table-title-2 {
    font-size: 16px;
  }

  /* concat-wrapper 高度缩小 */
  .span2-framework-recommendation .concat-wrapper {
    height: auto;
    min-height: 150px;
    padding: 30px 25px;
  }
  .span2-framework-recommendation .concat-wrapper .title {
    font-size: 24px;
    margin-bottom: 15px;
  }
}

/*
 * 移动端（500px 及以下）
 * 补充 p 标签字号规则（从内联样式迁移）
 */
@media screen and (max-width: 500px) {
  .v2022 p {
    font-size: 14px;
    line-height: 1.6;
  }
}