/* 合作伙伴和特点容器样式 */
.partners-and-features-container {
    width: 100%;  /* 容器宽度为100% */
    background: linear-gradient(to bottom, #f8f9fa, #ffffff);  /* 渐变背景色 */
    padding: 30px 0;  /* 上下内边距60px */
}

/* 合作伙伴容器样式 */
.partners-container {
    max-width: 1200px;  /* 最大宽度1200px */
    margin: 0 auto;  /* 居中对齐 */
    padding: 0 20px;  /* 左右内边距20px */
    display: flex;  /* 使用flex布局 */
    flex-direction: column;  /* 垂直排列 */
    align-items: center;  /* 水平居中对齐 */
}

/* 标题容器样式 */
.sk-title-container {
    text-align: center;  /* 文本居中对齐 */
    margin-bottom: 50px;  /* 下边距50px */
}

/* 标题样式 */
.sk-title {
    font-size: 32px;  /* 字体大小32px */
    font-weight: bold;  /* 粗体 */
    margin-bottom: 15px;  /* 下边距15px */
    color: #333;  /* 字体颜色 */
}

/* 描述样式 */
.sk-desc {
    font-size: 16px;  /* 字体大小16px */
    color: #666;  /* 字体颜色 */
    display: block;  /* 块级元素 */
}

/* 合作伙伴列表容器样式 */
.partners-list-container {
    display: flex;  /* 使用flex布局 */
    flex-direction: column;  /* 垂直排列 */
    gap: 15px;  /* 列表项之间的间距，上下两行 */
    max-width: 1100px;  /* 最大宽度1100px */
    margin: 0 auto;  /* 居中对齐 */
    width: 100%;  /* 宽度100% */
}

/* 合作伙伴项容器样式 */
.partners-item-container {
    overflow: hidden;  /* 隐藏溢出内容 */
    padding: 0px 0;  /* 上下内边距为0 */
    background: #ffffff;  /* 背景色为白色 */
    position: relative;  /* 相对定位 */
    width: 100%;  /* 宽度100% */
    height: 10px;  /* 高度自适应 */
    min-height: 90px;  /* 最小高度90px */
    display: flex;  /* 使用flex布局 */
    justify-content: flex-start;  /* 左对齐 */
}

/* 合作伙伴项轨道样式 */
.partners-item-track {
    display: flex;  /* 使用flex布局 */
    gap: 24px;  /* 项目之间的间距 */
    height: 100%;  /* 高度100% */
    align-items: center;  /* 垂直居中对齐 */
    position: relative;  /* 相对定位 */
    will-change: transform;  /* 提示浏览器优化 */
}

/* 单个合作伙伴项样式 */
.partner-item {
    flex: 0 0 auto;  /* 不允许缩放 */
    width: 160px !important;  /* 固定宽度160px */
    height: 80px !important;  /* 固定高度80px */
    padding: 18px;  /* 内边距18px */
    background: #ffffff;  /* 背景色为白色 */
    border-radius: 20px;  /* 圆角边框 */
    display: flex;  /* 使用flex布局 */
    align-items: center;  /* 垂直居中对齐 */
    justify-content: center;  /* 水平居中对齐 */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);  /* 阴影效果 */
    transition: all 0.3s ease;  /* 过渡效果 */
}

/* 合作伙伴项图片样式 */
.partner-item img {
    max-width: 100%;  /* 最大宽度100% */
    max-height: 80px;  /* 最大高度80px */
    width: auto;  /* 宽度自适应 */
    height: auto;  /* 高度自适应 */
    object-fit: contain;  /* 保持图片比例 */
    display: block;  /* 块级元素 */
    filter: grayscale(0);  /* 无灰度 */
    opacity: 0.8;  /* 透明度80% */
    transition: all 0.3s ease;  /* 过渡效果 */
}

/* 合作伙伴项悬停效果 */
.partner-item:hover {
    transform: translateY(-5px);  /* 向上移动5px */
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);  /* 增加阴影效果 */
}

/* 合作伙伴项悬停时图片效果 */
.partner-item:hover img {
    opacity: 1;  /* 透明度变为100% */
}

/* 添加渐变遮罩 */
.partners-item-container::before,
.partners-item-container::after {
    content: "";  /* 伪元素内容为空 */
    position: absolute;  /* 绝对定位 */
    top: 0;  /* 顶部对齐 */
    height: 100%;  /* 高度100% */
    width: 100px;  /* 宽度100px */
    z-index: 2;  /* 层级 */
    pointer-events: none;  /* 不响应鼠标事件 */
}

/* 左侧渐变遮罩样式 */
.partners-item-container::before {
    left: 0;  /* 左对齐 */
    background: linear-gradient(to right, #fff, transparent);  /* 渐变背景 */
    max-width: 50px;  /* 最大宽度100px */
}

/* 右侧渐变遮罩样式 */
.partners-item-container::after {
    right: 0;  /* 右对齐 */
    background: linear-gradient(to left, #fff, transparent);  /* 渐变背景 */
    max-width: 50px;  /* 最大宽度100px */
}

/* 响应式调整 */
@media (max-width: 1200px) {
    .partners-container {
        padding: 0 15px;  /* 左右内边距15px */
    }
}

@media (max-width: 768px) {
    .partners-list-container {
        max-width: 90%;  /* 最大宽度90% */
        gap: 5px;  /* 列表项之间的间距，上下两行 */
    }

    .partner-item {
        width: 150px !important;  /* 固定宽度150px */
        height: 70px !important;  /* 固定高度70px */
        padding: 15px;  /* 内边距15px */
    }

    .partner-item img {
        max-height: 50px;  /* 最大高度50px */
    }

    .partners-item-track {
        gap: 22px;  /* 项目之间的间距 */
    }

    .sk-title {
        font-size: 28px;  /* 字体大小28px */
    }

    .sk-desc {
        font-size: 14px;  /* 字体大小14px */
    }

    .partners-item-container::before,
    .partners-item-container::after {
        width: 40px;  /* 渐变遮罩宽度60px */
    }
}

@media (max-width: 480px) {
    .partners-list-container {
        gap: 0px;  /* 手机设备间距 */
    }
    .partner-item {
        width: 130px !important;  /* 固定宽度120px */
        height: 70px !important;  /* 固定高度60px */
        padding: 10px;  /* 内边距10px */
    }

    .partner-item img {
        max-height: 40px;  /* 最大高度40px */
    }

    .partners-item-track {
        gap: 20px;  /* 项目之间的间距 */
    }

    .partners-item-container::before,
    .partners-item-container::after {
        width: 20px;  /* 渐变遮罩宽度40px */
    }
}

/* 服务特点部分样式 */
.service-features {
    max-width: 1200px;  /* 最大宽度1200px */
    margin: 0 auto;  /* 居中对齐 */
    display: flex;  /* 使用flex布局 */
    justify-content: center;  /* 水平居中对齐 */
    align-items: center;  /* 垂直居中对齐 */
    padding: 40px 20px;  /* 内边距40px上下，20px左右 */
    flex-wrap: wrap;  /* 换行 */
    gap: 20px;  /* 项目之间的间距 */
}

/* 特点项样式 */
.feature {
    display: flex;  /* 使用flex布局 */
    align-items: center;  /* 垂直居中对齐 */
    justify-content: center;  /* 水平居中对齐 */
    flex-direction: row;  /* 水平排列 */
    gap: 15px;  /* 项目之间的间距 */
    padding: 20px;  /* 内边距20px */
    flex: 0 1 auto;  /* 不允许缩放 */
    min-width: 250px;  /* 最小宽度250px */
    border-right: 1px solid #eee;  /* 右边框 */
    text-align: center;  /* 文本居中对齐 */
}

/* 最后一个特点项去掉右边框 */
.feature:last-child {
    border-right: none;  /* 去掉右边框 */
}

/* 特点项图片样式 */
.feature img {
    width: 32px;  /* 宽度32px */
    height: 32px;  /* 高度32px */
    opacity: 0.8;  /* 透明度80% */
}

/* 特点项文本样式 */
.feature span {
    color: #333;  /* 字体颜色 */
    font-size: 15px;  /* 字体大小15px */
    font-weight: 500;  /* 字体粗细 */
    white-space: nowrap;  /* 不换行 */
}

/* 响应式调整 */
@media (max-width: 768px) {
    .service-features {
        flex-direction: column;  /* 垂直排列 */
        gap: 20px;  /* 项目之间的间距 */
    }

    .feature {
        border-right: none;  /* 去掉右边框 */
        border-bottom: 1px solid #eee;  /* 添加下边框 */
        padding: 15px 0;  /* 上下内边距15px */
    }

    .feature:last-child {
        border-bottom: none;  /* 去掉下边框 */
    }
}