@charset "UTF-8";
@font-face {
  font-family: 'AlibabaPuHuiTi-Black';
  src: url("../fonts/AlibabaPuHuiTi-3-115-Black.eot");
  src: url("../fonts/AlibabaPuHuiTi-3-115-Black.eot?#iefix") format("embedded-opentype"), url("../fonts/AlibabaPuHuiTi-3-115-Black.woff2") format("woff2"), url("../fonts/AlibabaPuHuiTi-3-115-Black.woff") format("woff"), url("../fonts/AlibabaPuHuiTi-3-115-Black.ttf") format("truetype"), url("../fonts/AlibabaPuHuiTi-3-115-Black.svg#AlibabaPuHuiTi-3-115-Black") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

.AlibabaPuHuiTi-Black {
  font-family: 'AlibabaPuHuiTi-Black';
}

.process-container {
  /* PC端高度 */
}

.process-item {
  position: relative;
  flex: 1;
  overflow: hidden;
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  cursor: pointer;
  border-radius: 4px;
}

/* Hover伸缩效果 */
.process-container:hover .process-item {
  flex: 1;
}

.process-container .process-item:hover {
  flex: 1.4;
}

.process-container:not(:hover) .process-item:first-child {
  flex: 1.4;
}

/* 内容层显示隐藏动画 */
.process-item .active-content, .process-item .bg-active {
  opacity: 0;
  transition: opacity 0.4s ease;
  z-index: 10;
}

.process-item .inactive-content, .process-item .bg-inactive {
  opacity: 1;
  transition: opacity 0.4s ease;
  z-index: 10;
}

/* 激活状态 */
.process-container .process-item:hover .active-content,
.process-container .process-item:hover .bg-active,
.process-container:not(:hover) .process-item:first-child .active-content,
.process-container:not(:hover) .process-item:first-child .bg-active {
  opacity: 1;
}

.process-container .process-item:hover .inactive-content,
.process-container .process-item:hover .bg-inactive,
.process-container:not(:hover) .process-item:first-child .inactive-content,
.process-container:not(:hover) .process-item:first-child .bg-inactive {
  opacity: 0;
}

/* 描边特效字体 */
.text-stroke-blue {
  color: transparent;
  -webkit-text-stroke: 2px #3b82f6;
}

.text-stroke-white {
  color: transparent;
  -webkit-text-stroke: 1px rgba(255, 255, 255, 0.8);
}

/* 响应式：移动端平铺布局，全部展开 */
@media (max-width: 1024px) {
  .process-container {
    flex-direction: column;
    height: auto;
    gap: 1rem;
  }
  .process-item {
    height: 240px;
    flex: none !important;
    min-height: 240px;
  }
  /* 移动端全部显示激活态（详细内容）——暂注释，日后若要恢复「移动端统一白字展开」再取消注释
  .process-item .active-content,
  .process-item .bg-active {
    opacity: 1;
  }
  .process-item .inactive-content,
  .process-item .bg-inactive {
    opacity: 0;
  }
  */

  /* 移动端：首项也保持未激活（与 PC 默认「首项高亮」区分）；悬停/触摸某张时仍走上面的 hover 激活规则 */
  .process-container:not(:hover) .process-item:first-child .active-content,
  .process-container:not(:hover) .process-item:first-child .bg-active {
    opacity: 0;
  }
  .process-container:not(:hover) .process-item:first-child .inactive-content,
  .process-container:not(:hover) .process-item:first-child .bg-inactive {
    opacity: 1;
  }
}

@media (max-width: 768px) {
  .process-item {
    height: 200px;
    flex: none !important;
    min-height: 200px;
  }
}

@media (max-width: 480px) {
  .process-item {
    height: 180px;
    flex: none !important;
    min-height: 180px;
  }
}

/* 公司介绍区块 */
@media (max-width: 1023px) {
  .company-intro__inner .company-intro__text {
    max-width: 100%;
  }
  .company-intro__inner .company-intro__media {
    max-width: 100%;
  }
}

.company-intro__underline {
  flex-shrink: 0;
}

.company-intro__media {
  min-height: 280px;
  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
}

@media (min-width: 1024px) {
  .company-intro__media {
    min-height: 360px;
  }
}

.company-intro__img {
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
}

.company-intro__deco {
  position: absolute;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(4, 77, 183, 0.15) 0%, rgba(4, 77, 183, 0.05) 70%, transparent 100%);
  z-index: 1;
  pointer-events: none;
}

.company-intro__deco--1 {
  width: 200px;
  height: 200px;
  top: -40px;
  right: -40px;
}

@media (min-width: 1024px) {
  .company-intro__deco--1 {
    width: 280px;
    height: 280px;
    top: -60px;
    right: -60px;
  }
}

.company-intro__deco--2 {
  width: 120px;
  height: 120px;
  bottom: -20px;
  left: -20px;
}

@media (min-width: 1024px) {
  .company-intro__deco--2 {
    width: 180px;
    height: 180px;
    bottom: -40px;
    left: -40px;
  }
}