/* 波浪css */
.main-hero-waves-area {
    width: 100%;
    position: absolute;
    left: 0;
    bottom: -11px;
    z-index: 5;
  }
  .waves-area .waves-svg {
    width: 100%;
    height: 5rem;
  }
  /* Animation */
  
  .parallax > use {
    animation: move-forever 25s cubic-bezier(0.55, 0.5, 0.45, 0.5) infinite;
  }
  .parallax > use:nth-child(1) {
    animation-delay: -2s;
    animation-duration: 7s;
    fill: #f7f9febd;
  }
  .parallax > use:nth-child(2) {
    animation-delay: -3s;
    animation-duration: 10s;
    fill: #f7f9fe82;
  }
  .parallax > use:nth-child(3) {
    animation-delay: -4s;
    animation-duration: 13s;
    fill: #f7f9fe36;
  }
  .parallax > use:nth-child(4) {
    animation-delay: -5s;
    animation-duration: 20s;
    fill: #f7f9fe;
  }
  /* 黑色模式背景 */
  [data-theme="dark"] .parallax > use:nth-child(1) {
    animation-delay: -2s;
    animation-duration: 7s;
    fill: #18171dc8;
  }
  [data-theme="dark"] .parallax > use:nth-child(2) {
    animation-delay: -3s;
    animation-duration: 10s;
    fill: #18171d80;
  }
  [data-theme="dark"] .parallax > use:nth-child(3) {
    animation-delay: -4s;
    animation-duration: 13s;
    fill: #18171d3e;
  }
  [data-theme="dark"] .parallax > use:nth-child(4) {
    animation-delay: -5s;
    animation-duration: 20s;
    fill: #18171d;
  }
  
  @keyframes move-forever {
    0% {
      transform: translate3d(-90px, 0, 0);
    }
    100% {
      transform: translate3d(85px, 0, 0);
    }
  }
  /*Shrinking for mobile*/
  @media (max-width: 768px) {
    .waves-area .waves-svg {
      height: 40px;
      min-height: 40px;
    }
  }

/* 添加动画性能优化 */
.parallax > use {
  will-change: transform;
}

/* 修正暗色模式选择器 */
.dark .parallax > use {
  fill-opacity: 0.6;  /* 示例值，根据实际需求调整 */
}

/* 电影卡片样式 */
.movie-card {
  display: flex;
  gap: 2rem;
  margin: 2rem 0;
  padding: 1.5rem;
  background: rgba(255,255,255,0.1);
  border-radius: 12px;
}

.card-left {
  flex: 0 0 40%;
}

.movie-poster {
  width: 100%;
  height: 400px;
  object-fit: cover;
  border-radius: 8px;
}

.card-right {
  flex: 1;
}

.movie-title {
  color: var(--heo-main);
  margin: 1rem 0 0.5rem;
}

.movie-rating {
  font-size: 1.2em;
  color: #ffd700;
}

.demo_line_02{  
  height: 1px;  
  border-top: 1px solid #ddd;  
  text-align: center;  
}  
.demo_line_02 span{  
  position: relative;  
  top: -8px;  
  background: #fff;  
  padding: 0 20px;  
}

.movie-card.with-border::after {
  content: '';
  display: block;
  position: absolute;
  bottom: -15px;
  left: 5%;
  right: 5%;
  height: 8px;
  background: linear-gradient(90deg, 
    rgba(255,243,205,0.6) 0%, 
    rgba(255,243,205,1) 50%, 
    rgba(255,243,205,0.6) 100%);
  border-radius: 4px;
  z-index: -1;
}