/* 滚动动画样式 */
.scroll-animate {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.scroll-animate.animate {
  opacity: 1;
  transform: translateY(0);
}

/* 为每个功能区域的li元素设置不同的延迟时间，实现依次出现的效果 */
.feature-list li.scroll-animate:nth-child(1) {
  transition-delay: 0.1s;
}

.feature-list li.scroll-animate:nth-child(2) {
  transition-delay: 0.2s;
}

.feature-list li.scroll-animate:nth-child(3) {
  transition-delay: 0.3s;
}

.feature-list li.scroll-animate:nth-child(4) {
  transition-delay: 0.4s;
}

/* Hero区到Features区的连接部分虚化效果 */
.hero-wave {
  /* 增强hero-wave的渐变效果 */
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 200px;
  z-index: 2;
}

/* 在hero-section下方添加一个渐变遮罩层 */
.hero-section::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 150px;
  background: linear-gradient(to bottom, 
              rgba(14, 14, 20, 0) 0%, 
              rgba(14, 14, 20, 0.5) 50%, 
              rgba(46, 139, 87, 0.8) 100%);
  z-index: 3;
}

/* Features区域第一个section的淡入动画 */
#agent-store {
  opacity: 0;
  transition: opacity 1.2s ease-out;
}

#agent-store.animate {
  opacity: 1;
}

/* 为Features区域内容添加滚动触发的淡入效果 */
.feature-section-content {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.feature-section-content.animate {
  opacity: 1;
  transform: translateY(0);
}