/* 合作流程优化 CSS - 最小化改动版本 */

/* 优化1: 折叠的图片添加深色蒙版 */
.process-card:not(.is-active) .process-card__media::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  transition: opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  pointer-events: none;
  z-index: 1;
}

/* 优化2: 展开的图片移除蒙版 */
.process-card.is-active .process-card__media::after {
  opacity: 0;
}

/* 优化3: 缩小图片间距（从原来的一半） */
.home-process__grid {
  gap: 8px !important;
}

/* 优化4: 更丝滑的过渡效果 */
.process-card {
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* 优化5: 图片过渡效果 */
.process-card__media img {
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* 优化6: 展开时图片轻微放大 */
.process-card.is-active .process-card__media img {
  transform: scale(1.02);
}

/* 优化7: 内容区域透明度过渡 */
.process-card__content {
  transition: opacity 0.3s ease;
}

.process-card:not(.is-active) .process-card__content {
  opacity: 0.7;
}

.process-card.is-active .process-card__content {
  opacity: 1;
}

/* 优化8: 文字顶部对齐，不要居中对齐 */
.process-card__content {
  align-self: flex-start !important;
  justify-content: flex-start !important;
  align-items: flex-start !important;
}

/* 确保标题和描述都顶部对齐 */
.process-card__content h3,
.process-card__content p {
  text-align: left !important;
}