/* 轮播核心样式 */
        .slider {
            background: white;
            box-shadow: 0 10px 20px -5px rgba(0, 0, 0, .125);
            height: 100px;
            margin: auto;
            overflow: hidden;
            position: relative;
            width: 100%px;
        }

        /* 轮播左右渐变遮罩 */
        .slider::before,
        .slider::after {
            background: linear-gradient(to right, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);
            content: "";
            height: 100px;
            position: absolute;
            width: 200px;
            z-index: 2;
        }

        .slider::after {
            right: 0;
            top: 0;
            transform: rotateZ(180deg);
        }

        .slider::before {
            left: 0;
            top: 0;
        }

        /* 轮播轨道（动画核心） */
        .slider .slide-track {
            animation: scroll 30s linear infinite;
            display: flex;
            width: calc(250px * 14); /* 14张图的总宽度，适配无缝滚动 */
        }

        /* 单张轮播图容器 */
        .slider .slide {
            height: 100px;
            width: 250px;
        }

        /* 滚动动画关键帧 */
        @keyframes scroll {
            0% { transform: translateX(0); }
            100% { transform: translateX(calc(-250px * 7)); } /* 平移7张图宽度，衔接重复的图 */
        }

        /* 响应式适配（移动端自动适配） */
        @media (max-width: 768px) {
            .slider {
                width: 100%; /* 移动端占满屏幕宽度 */
                padding: 0 10px;
            }
            .slider::before,
            .slider::after {
                width: 50px; /* 移动端遮罩宽度缩小，更适配小屏 */
            }
        }