/* --- 幻灯片底部波浪 CSS (修正版) --- */
.wvn-wave-box {
    position: absolute; /* 绝对定位 */
    bottom: 0;
    left: 0;
    width: 100%;
    height: auto;
    z-index: 1;         /* 【重点修改】层级改为1，确保在文字和卡片之下 */
    pointer-events: none; /* 让鼠标可以穿透波浪点击下面的内容 */
}

.wvn-waves {
    position: relative;
    width: 100%;
    height: 90px;       /* 稍微调低一点高度，避免占据太多空间 */
    margin-bottom: -1px;
    display: block;
}

/* 手机端进一步减小 */
@media (max-width: 768px) {
    .wvn-waves {
        height: 60px;
    }
}

/* 动画定义不变 */
.wvn-parallax > use {
    animation: wvn-move-forever 25s cubic-bezier(.55, .5, .45, .5) infinite;
}
.wvn-parallax > use:nth-child(1) { animation-delay: -2s; animation-duration: 7s; fill: rgba(255,255,255,0.7); }
.wvn-parallax > use:nth-child(2) { animation-delay: -3s; animation-duration: 10s; fill: rgba(255,255,255,0.5); }
.wvn-parallax > use:nth-child(3) { animation-delay: -4s; animation-duration: 13s; fill: rgba(255,255,255,0.3); }

/* --- 颜色设置 --- */
/* 这里改成你 幻灯片下方区域 的背景色 */
/* 通常是灰色 #f7f7f7 或 白色 #fff */
.wvn-parallax > use:nth-child(4) { 
    animation-delay: -5s; 
    animation-duration: 20s; 
    fill: #f7f7f7; 
}

@keyframes wvn-move-forever {
    0% { transform: translate3d(-90px, 0, 0); }
    100% { transform: translate3d(85px, 0, 0); }
}

/* 夜间模式适配 */
.dark-theme .wvn-parallax > use:nth-child(4) { fill: #1f1f1f; }
.dark-theme .wvn-parallax > use:nth-child(1) { fill: rgba(30, 30, 30, 0.7); }
.dark-theme .wvn-parallax > use:nth-child(2) { fill: rgba(30, 30, 30, 0.5); }
.dark-theme .wvn-parallax > use:nth-child(3) { fill: rgba(30, 30, 30, 0.3); }