.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-slider--img::after{background-color:transparent;background-image:radial-gradient(at center right, #FFFFFF00 50%, #00000096 100%);}.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-slider{height:100vh;}.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-slider .ms-nav--next, .ms-slider .ms-nav--prev{background-color:#FFFFFF00;backdrop-filter:blur(20px);border-top-left-radius:40px 40px;border-top-right-radius:40px 40px;border-bottom-right-radius:40px 40px;border-bottom-left-radius:40px 40px;}.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-slider .ms-nav--next:hover, .ms-slider .ms-nav--prev:hover{background-color:#FFFFFF0D;}.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-rb--avatar img{border-top-left-radius:40px 40px;border-top-right-radius:40px 40px;border-bottom-right-radius:40px 40px;border-bottom-left-radius:40px 40px;}.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-slider--pagination .swiper-pagination-progressbar-fill{background-color:#FFFFFF;}.elementor-782 .elementor-element.elementor-element-dc20e9d .swiper-pagination-progressbar{background-color:#FFFFFF78;}.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-slider--count{color:#FFFFFF;}.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-slider--count__total{color:#FFFFFF;}.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-slider--progress{width:32vw;bottom:3rem;}.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-slider .swiper-slide .ms-slider--img img{object-fit:cover;}.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-slider--cont{justify-content:left;align-items:center;}.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-slider--cont .ms-cont__inner{text-align:left;margin:0px 0px 0px 50px;}.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-sc--st{font-weight:900;text-transform:uppercase;color:#FFFFFF;}.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-sc--t{font-family:"Inter", Sans-serif;font-size:8vw;font-weight:900;text-transform:uppercase;line-height:1.1em;text-indent:-12px;margin-top:15px;margin-bottom:15px;color:#FFFFFF;}.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-sc--desc{margin:0px 0px 40px 0px;font-size:20px;font-weight:400;line-height:32px;color:#FFFFFFB0;}.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-slider--cont .btn-wrap .btn{color:#FFFFFF;}.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-slider--cont .btn-wrap .btn .ms-btn--circle .circle-outline{stroke:#FFFFFF;}.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-slider--cont .btn-wrap .btn .ms-btn--circle .circle-fill{background-color:#FFFFFF;}.elementor-782 .elementor-element.elementor-element-dc20e9d .btn-wrap .btn .ms-btn--circle .circle-icon .icon-arrow{fill:#000000;}.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-slider--cont .ms-sc--l{justify-content:left;}.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-slider--cont .elementor-section-wrap{margin:0px 0px 0px 50px;}@media(max-width:1024px){.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-slider--progress{bottom:2rem;}.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-slider--cont{justify-content:center;}.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-slider--cont .ms-cont__inner{text-align:center;margin:0px 0px 0px 15px;}.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-sc--t{font-size:15vw;text-indent:0px;}.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-slider--cont .elementor-section-wrap{margin:0px 0px 0px 15px;}}@media(max-width:767px){.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-slider--cont{align-items:center;}.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-slider--cont .ms-cont__inner{text-align:center;}.elementor-782 .elementor-element.elementor-element-dc20e9d .ms-sc--t{font-size:4rem;}}/* Start custom CSS for ms_slider_fs, class: .elementor-element-dc20e9d *//* 产品图片 */
.ms-slider--img {
    position: relative;
    overflow: hidden;
}

/* =========================================
   第一张 Slider - YO产品
   ========================================= */

/* 1. 图片设置 (保持不变) */
.swiper-slide:nth-child(1) .ms-slider--img::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 450px;
    height: 450px;
    background-image: url('https://walavapes.com//wp-content/uploads/2025/10/产品1.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    z-index: 5;
    filter: drop-shadow(0 5px 15px rgba(0, 0, 0, 0.3));
}

/* 2. 装饰横线 (新增加 - 使用 ::before 绘制线条) */
.swiper-slide:nth-child(1) .slide-inner::before {
    content: "";
    position: absolute;
    top: 50%;
    right: 80px; /* 与文字右对齐 */
    transform: translateY(-50%); /* 垂直居中 */
    width: 320px; /* PC端横线默认宽度 */
    height: 3px;  /* 线条厚度 */
    background-color: #ffffff; /* 线条颜色 */
    box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.5); /* 给线条加点阴影，增加层次感 */
    z-index: 10;
}

/* 3. 文字内容 (修改 - 去掉横线字符，增加换行间距) */
.swiper-slide:nth-child(1) .slide-inner::after {
    /* \A 是换行符，中间加两个换行符留出空隙给横线 */
    content: "18000\A \A PUFFS"; 
    white-space: pre;
    position: absolute;
    top: 50%;
    right: 80px;
    transform: translateY(-50%);
    font-size: 56px;
    font-weight: bold;
    color: #ffffff;
    text-align: right;
    line-height: 1.0; /* 调整行高 */
    z-index: 10;
    font-family: inherit;
    text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.7);
}


/* =========================================
   第二张 Slider - 视频页面
   ========================================= */

/* 隐藏图片 */
.swiper-slide:nth-child(2) .ms-slider--img::before {
    display: none;
}

/* 隐藏文字 */
.swiper-slide:nth-child(2) .slide-inner::after {
    display: none;
}

/* 隐藏横线 (新增加) */
.swiper-slide:nth-child(2) .slide-inner::before {
    display: none;
}


/* =========================================
   第三张 Slider - POP产品
   ========================================= */

/* 1. 图片设置 (保持不变) */
.swiper-slide:nth-child(3) .ms-slider--img::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 450px;
    height: 450px;
    background-image: url('https://walavapes.com//wp-content/uploads/2025/10/产品2.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    z-index: 5;
    filter: drop-shadow(0 5px 15px rgba(0, 0, 0, 0.3));
}

/* 2. 装饰横线 (新增加 - 针对第三页的宽度调整) */
.swiper-slide:nth-child(3) .slide-inner::before {
    content: "";
    position: absolute;
    top: 50%;
    right: 80px;
    transform: translateY(-50%);
    width: 380px; /* POP页面的字比较长，横线稍微长一点 */
    height: 3px;
    background-color: #ffffff;
    box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.5);
    z-index: 10;
}

/* 3. 文字内容 (修改 - 去掉横线字符) */
.swiper-slide:nth-child(3) .slide-inner::after {
    content: "10000 PUFFS\A \A NON-RECHARGEABLE";
    white-space: pre;
    position: absolute;
    top: 50%;
    right: 80px;
    transform: translateY(-50%);
    font-size: 46px;
    font-weight: bold;
    color: #ffffff;
    text-align: right;
    line-height: 1.0;
    z-index: 10;
    font-family: inherit;
    text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.7);
}


/* =========================================
   响应式调整 (关键部分)
   ========================================= */

/* 平板/小屏幕 PC (Max 1024px) */
@media (max-width: 1024px) {
    /* 缩小图片 */
    .swiper-slide .ms-slider--img::before {
        width: 300px;
        height: 300px;
    }
    
    /* 这里是解决您问题的关键：缩小横线的宽度 */
    .swiper-slide:nth-child(1) .slide-inner::before {
        width: 220px; /* 第一页横线变短 */
        right: 60px;  /* 保持与文字对齐 */
    }
    .swiper-slide:nth-child(3) .slide-inner::before {
        width: 280px; /* 第三页横线变短 */
        right: 60px;
    }

    /* 缩小字体 */
    .swiper-slide:nth-child(1) .slide-inner::after {
        font-size: 44px;
        right: 60px;
    }
    
    .swiper-slide:nth-child(3) .slide-inner::after {
        font-size: 36px;
        right: 60px;
    }
}

/* 移动端 (Max 768px) - 完全隐藏 */
@media (max-width: 768px) {
    .swiper-slide .ms-slider--img::before {
        display: none;
    }
    
    .swiper-slide .slide-inner::after {
        display: none;
    }

    /* 记得也要隐藏横线 */
    .swiper-slide .slide-inner::before {
        display: none;
    }
}/* End custom CSS */