.section-4 {
  /* height: 9.6rem; */
  background-image: url("../image/bg-3.png");
  background-repeat: no-repeat, no-repeat;
  background-position: center, center;
  background-size: cover, cover;
  padding: 0.76rem 2.6rem 0.76rem 2.6rem;
}
.section-4 .top {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.section-4 .top .title-1 {
  font-size: 0.48rem;
  font-weight: 800;
  line-height: normal;
  color: #ffffff;
}
.section-4 .top .title-2 {
  margin-top: 0.14rem;
  font-size: 0.2rem;
  /* font-weight: 500; */
  line-height: normal;
  text-align: center;
  color: #ffffff;
}
.section-4 .bottom {
  margin-top: 0.59rem;
  display: flex;
  gap: 0.16rem;
  width: 100%;
  max-width: 14rem;
  height: 4.8rem; /* 强制父容器高度为 4.8rem */
  align-items: stretch; /* 确保子元素高度拉伸一致 */
}

/* ===== 左侧边栏样式 ===== */
.section-4 .sidebar {
  width: 3rem;
  height: 100%; /* 填满父容器 */
  box-sizing: border-box;
  background: #ffffff;
  /* border-radius: 0.04rem; */
  flex-shrink: 0;
  overflow: hidden;
  box-shadow: 0 0.04rem 0.1rem 0 rgba(0, 0, 0, 0.05);
}

.section-4 .sidebar-title {
  height: 0.72rem;
  display: flex;
  align-items: center;
  padding-left: 0.24rem;
  font-size: 0.2rem;
  font-weight: bold;
  color: #1a1a1a;
  /* border-bottom: 1px solid #f0f0f0; */
}
.section-4 .sidebar-title .line {
  width: 0.04rem;
  height: 0.2rem;
  background: #3662ec;
  margin-right: 0.06rem;
}
.section-4 .sidebar-title .title {
  font-size: 0.2rem;
  font-weight: 600;
  line-height: normal;
  text-align: center;
  /* 主要文字 */
  color: #222222;
}
.section-4 .sidebar-nav {
  list-style: none;
  margin: 0;
  padding: 0;
}

.section-4 .sidebar-nav li {
  height: 0.55rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 0.36rem;
  font-size: 0.16rem;
  font-weight: normal;
  line-height: 0.48rem;
  color: #222222;
  cursor: pointer;
  transition: all 0.3s ease;
  border-bottom: 1px solid #f9f9f9;
}

.section-4 .sidebar-nav li:last-child {
  border-bottom: none;
}

.section-4 .sidebar-nav li img,
.section-4 .sidebar-nav li .arrow {
  display: none; /* 默认隐藏箭头图片和 span 箭头 */
}

.section-4 .sidebar-nav li:hover {
  color: #1c63fe;
}

.section-4 .sidebar-nav li.active {
  background-color: #eaf1ff;
  font-size: 0.16rem;
  font-weight: normal;
  line-height: 0.48rem;
  letter-spacing: 0em;

  font-variation-settings: "opsz" auto;
  font-feature-settings: "kern" on;
  /* 制造业/二手设备出海方案 */
  color: #3662ec;
}

.section-4 .sidebar-nav li.active img,
.section-4 .sidebar-nav li.active .arrow {
  display: block; /* 只有在 active 时显示箭头图片或 span 箭头 */
}
.section-4 .sidebar-nav li.active .arrow {
  display: inline;
  color: #3662ec; /* 与选中文字颜色一致 */
}

/* ===== 右侧内容区样式 ===== */
.section-4 .content-panel {
  flex: 1;
  width: 8.2rem;
  height: 100%; /* 填满父容器 */
  box-sizing: border-box;
  background: #ffffff;
  padding: 0.33rem 0.5rem;
  /* 移除 max-height 让其可以撑开 */
  display: flex;
  flex-direction: column;
}

.section-4 .panel-section {
  display: none; /* 默认隐藏所有面板 */
  height: 100%;
}

.section-4 .panel-section.active {
  display: flex; /* 只显示 active 的面板 */
  flex-direction: column;
}

.section-4 .panel-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  align-items: center;
  /* padding: 0.4rem 0.4rem 0; */
}

.section-4 .panel-title-area .title {
  font-size: 0.32rem;
  font-weight: 800;
  line-height: normal;
  /* 主要文字 */
  color: #222222;
}

.section-4 .panel-title-area p {
  margin-top: 0.08rem;
  font-size: 0.16rem;
  font-weight: 500;
  line-height: normal;
  /* 辅助文字色 */
  color: #61646f;
}

.section-4 .btn-custom-plan {
  display: inline-flex;
  align-items: center;
  gap: 0.08rem;
  background: #1c63fe;
  color: #ffffff;
  padding: 0.12rem 0.24rem;
  border-radius: 0.04rem;
  font-size: 0.16rem;
  font-weight: 500;
  text-decoration: none;
  transition: background-color 0.3s ease;
}

.section-4 .btn-custom-plan:hover {
  background: #1550d4;
}

.section-4 .panel-body {
  display: flex;
  /* padding: 0.4rem; */
  margin-top: 0.48rem;
  gap: 1rem;
  flex: 1;
}

/* 核心服务 */
.section-4 .core-services,
.section-4 .advantages {
  flex: 1;
}

.section-4 .panel-body h4 {
  margin: 0 0 0.24rem 0;
  font-size: 0.2rem;
  font-weight: bold;
  color: #1a1a1a;
}

.section-4 .service-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.28rem;
  margin-top: 0.2rem;
}

.section-4 .service-list li {
  display: flex;
  align-items: center;
  gap: 0.12rem;
  font-size: 0.16rem;
  color: #333333;
}

/* 优势亮点 */
.section-4 .advantage-cards {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  margin-top: 0.2rem;
}

.section-4 .adv-card {
  display: flex;
  align-items: center;
  /* gap: 0.1rem; */
  /* padding: 0.16rem 0.2rem; */
  width: 3.2rem;
  height: 0.68rem;
  border-radius: 0.08rem;
  background: linear-gradient(90deg, #dae3ff 0%, rgba(246, 246, 255, 0.3) 100%);
}
.section-4 .adv-card img {
  margin-left: 0.19rem;
  margin-right: 0.12rem;
}
.section-4 .adv-card span {
  font-size: 0.2rem;
  font-weight: 600;
  line-height: normal;
  text-align: center;
  color: #2049ca;
}
/* 右侧配图 */
.section-4 .panel-image {
  width: 4.54rem; /* 使用固定宽度，不再用2.8rem */
  height: 100%; /* 填满父容器 */
  box-sizing: border-box;
  flex-shrink: 0;
}

.section-4 .panel-image img {
  width: 2.8rem;
  max-height: 4.8rem;
  object-fit: cover;
}

/* 为了给右侧图片留出空间，需要限制左侧内容区的宽度
.section-4 .panel-header,
.section-4 .panel-body {
  padding-right: 3.2rem;
} */
.section-4 .bottom-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 0.51rem;
}