@charset "UTF-8";

/**
 * 解决方案页特殊样式 — 仅保留 utility 表达不了的部分
 * 14 段几何 / 字号 / 间距全部由 page-solution.php 的 utility 接管。
 *
 * 此文件保留：
 * 1. p3 场景图叠层切换（swiperSlide.active）
 * 2. p3 / p8 tab 当前态视觉（itemsTitle.active / toolsText.active）
 * 3. p5 PC 端剧场段图层叠层（多张 stepImg 同位绝对定位、JS 切 opacity 控制）
 * 4. p7 sound-canvas 兜底
 * 5. p14 menuList 当前态视觉（activeMenu）
 * 6. p8 video 同位叠层（amateur / pro 切换）
 * 7. p5 step 当前态（activeNumber / activeText）
 */

/* p3 场景图叠层 */
.swiperSlide {
    opacity: 0;
    transition: opacity 0.4s;
    z-index: 1;
}
.swiperSlide.active {
    opacity: 1;
    z-index: 2;
}

/* p3 场景 tab 当前态（旧站紫色 + 紫底线） */
.sceneTabsBox .itemsTitle {
    transition: color 0.2s;
}
.sceneTabsBox .itemsTitle.active {
    color: #5400e2;
    font-weight: 500;
    border-bottom: 3px solid #5400e2;
}

/* p8 麦克风 tab 当前态（旧站白字 + 紫底） */
.toolsInfoBox .toolsText {
    transition: color 0.2s;
}
.toolsInfoBox .toolsText.active {
    color: #fff;
    font-weight: 400;
    border-bottom: 3px solid #5400e2;
}

/* p5 PC 剧场段：多张 stepImg 同位置叠层（JS 通过 opacity 切换） */
@media (min-width: 1024px) {
    .pageContent5 .stepImg1,
    .pageContent5 .stepImg2,
    .pageContent5 .stepImg3 {
        transition: opacity 0.4s;
    }
}

/* p7 sound-canvas 兜底高度（solution.js 注入的 canvas） */
.sound-canvas canvas {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* p8 video 同位叠层（amateur / pro 切换） */
.bgVideoBox .img {
    transition: opacity 0.4s;
    opacity: 0;
}
.bgVideoBox .img.active {
    opacity: 1;
}

/* p14 menuList 当前态（旧站紫色 6px 粗底线 + 黑字加粗） */
.menuList .activeMenu {
    color: #000;
    font-weight: 500;
    padding-bottom: 15px;
    border-bottom: 6px solid #5400e2;
}
.menuList .activeMenu a {
    color: #000;
    font-weight: 500;
}

/* p5 step 当前态（旧站紫色 #5400e2 + 紫色边框） */
.itemsStepBox .number,
.itemsStepBox .text {
    transition: color 0.3s, border-color 0.3s;
}
.itemsStepBox .number.activeNumber {
    color: #5400e2 !important;
    border-color: #5400e2 !important;
}
.itemsStepBox .text.activeText {
    color: #5400e2 !important;
}
