/* ==========================================================================
   PROCEEDINGS 板块 —— Proceedings and special issue
   ========================================================================== */

/* 上一板块（Attend：Venue图片）到本板块背景块顶部的间距，用户核对为72px
   （两个小标签区域之间的空白间距）。同样按 attend-bg的padding-bottom:32px
   + 这里的gap div + proceedings-bg自己的padding-top:24px 三段反推，
   gap div = 72-32-24=16px */
.proceedings-section-gap {
  height: 16px;
}

.proceedings-bg {
  width: 100%;
  background: var(--color-section-bg);
  /* 2026-08 Visual Refinement：跨tab板块间距整体从72收紧到64 */
  padding-top: var(--space-section-top);
  padding-bottom: var(--space-section-bottom);
}

/* .proceedings-box-scroll 负责整体宽度的封顶（>1425px不再变宽）/居中/
   两侧至少16px边距——这一层的职责和下面"两栏拆成两张卡片"是两回事，没有
   变动。overflow-x:auto这套横向滚动是历史遗留，两张卡片改成等宽自适应后
   已经不会触发，留着无副作用，不做改动 */
.proceedings-box-scroll {
  /* 视口>1425px时同一处修复：原来没有上限，改成封顶+居中，和submit-section
     那几处是同一个问题、同一套修法 */
  max-width: calc(var(--page-width) - 32px);
  /* 2026-09 同一处修复：补width，两侧至少各留16px，和submit-section那几处
     是同一个问题、同一套修法 */
  width: calc(100% - 32px);
  margin: 0 auto;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.proceedings-box-scroll::-webkit-scrollbar {
  display: none;
}

/* 2026-09 用户明确要求：原来"一张橘色卡片里塞两栏"改成"两张独立等宽的
   橘色卡片"，卡片间距16px。外层.proceedings-box-scroll负责整体的居中/
   封顶/两侧最小16px边距（规则未变，不动）；.proceedings-box只是纯布局行，
   不再承担背景/圆角/阴影/内边距——这些整体移到下面.proceedings-col上，
   两张卡片各自独立。
   自适应规则：箭头图标尺寸、图标到文字16px、卡片四边16px内边距，任何
   宽度下都不变；只有文字框自己的宽度跟着卡片宽度变化去换行（.proceedings-
   col p 的 flex:1 1 auto + min-width:0，任何宽度下都生效，不再只在
   <=500px时才加）。>1425px时这两张卡片不在"7个大屏放大板块"范围内，
   维持原样不额外放大，和本文件其它规则的既有约定一致 */
.proceedings-box {
  display: flex;
  gap: 16px;
  width: 100%;
}

/* 两张卡片等宽、可以跟着容器一起收缩（min-width:0防止被文字内容撑开），
   不再像原来那样用flex-shrink:0锁定各自的精确像素宽度 */
.proceedings-col {
  flex: 1 1 0;
  min-width: 0;
  background: var(--color-accent-orange-lt); /* #FFE5BF */
  border-radius: 5px;
  box-shadow: 0px 0px 6px 0px rgba(128, 128, 128, 0.2);
  padding: 16px;
  display: flex;
  align-items: flex-start;
}

/* 箭头图标：get_design_context精确核对宽20.72/高16.468（用户口头描述的
   20.72*16.47与此完全吻合）；图标顶边相对自身所在文本框顶边的偏移量两列
   核对一致，恒为6.87px（88.87-82），不是简单居中，这次没有要求改动，保留；
   2026-09 用户明确要求：图标到文本框的间距统一改成16px（原12.28px）。
   2026-08：用户导出了这个箭头图标的透明底PNG（4x），原位替换此前占位用的
   CSS手绘箭头 */
.proceedings-col .icon-arrow-asset {
  flex-shrink: 0;
  /* 2026-09 用户明确要求：全站同款箭头icon统一等比缩小，长宽各减2px
     （原20.72×16.47） */
  width: 18.72px;
  height: 14.47px;
  margin-top: 6.87px;
  margin-right: 16px;
  display: block;
}

.proceedings-col p {
  margin: 0;
  font-family: var(--font-nav);
  /* 2026-09 用户核对反馈：700太粗，改细一点，但要求"比小标签稍粗"——
     小标签(.sub-label-tag)是600 SemiBold，这里用变量字体（Red Hat Text
     Variable）介于两者之间的650 */
  font-weight: 650;
  /* 2026-08 用户明确要求：字号/行高整体缩小一档——从H3档(22/27)降到
     全站正文主力档--fs-body/--lh-body(18/25)，不分桌面/手机端，两处都生效 */
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  letter-spacing: -0.2px;
  color: var(--color-ink);
  /* flex子项默认min-width:auto会被文字内容撑开、拒绝收缩换行，这个坑之前
     在别处也踩过；现在文本框宽度需要跟着卡片一起自适应变化，任何宽度下
     都要生效，不再只在<=500px时才加 */
  flex: 1 1 auto;
  min-width: 0;
}

/* 2026-09 用户明确要求：视口<=500px时，两张卡片改成上下堆叠，间距同样是
   16px（和桌面端左右两张卡片之间的间距保持同一个数值，不再是此前单独
   给手机端加大到26px的特殊值）。卡片自身的内边距/箭头到文字的间距在
   上面已经统一是16px、不分宽度，这里不需要再重复设置。
   这条规则必须放在文件最后——CSS按源码顺序层叠，选择器权重相同时写在
   后面的才会生效 */
@media (max-width: 500px) {
  .proceedings-box {
    flex-direction: column;
    gap: 16px;
  }
}