/* ========================================
   category_product 页面专用样式
   ======================================== */

/* ========== 通用工具类 ========== */

/* 标题样式统一 */
.section-title {
    font-size: 48px;
    font-weight: bold;
    margin-bottom: 20px;
    text-align: center;
}

.section-subtitle {
    font-family: 'Alibaba PuHuiTi 3.0', sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;
    line-height: 100%;
    letter-spacing: 0px;
    text-align: center;
    color: #3D485D;
}

.section-subtitle .highlight {
    color: #0052D9;
    font-weight: 700;
}

/* 容器统一 */
.section-container {
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 20px;
}

/* ========== Banner 区域样式 ========== */

/* Banner 轮播图内容容器 - 垂直布局 */
/* Banner 轮播图内容容器 - 垂直布局 */
.category-banner .box-slider-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
}

.category-banner .swiper-slide::before {
    display: none;
}

/* Banner 特性列表 - 水平排列 */
.category-banner .banner-features {
    display: flex;
    flex-direction: row;
    gap: 31px;
}

/* 每个特性项 - 内部垂直排列（图片在上，文字在下）*/
.category-banner .banner-features span {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 22px;
    font-weight: 400;
    text-align: center;
}

/* 特性图标尺寸 */
.category-banner .banner-features .feature-icon {
    width: 71px;
    height: 71px;
    margin-right: 0 !important;
}

/* 按钮组 - 水平排列 */
.category-banner .banner-btns {
    display: flex;
    flex-direction: row;
    gap: 15px;
    margin-top: 10px;
}

/* 点击咨询按钮 */
.category-banner .banner-btns .consult-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

/* 获取报价按钮 - 白色背景，蓝色边框和文字 */
.category-banner .banner-btns .quote-btn,
.category-banner .banner-btns .quote-btn.white-bg {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 170px;
    height: 52px;
    background: #fff;
    border: 1px solid #1366EE;
    border-radius: 4px;
    color: #1366EE !important;
    font-size: 15px;
    font-weight: 500;
    text-decoration: none;
}

/* 获取报价按钮图标颜色与文字一致 */
.category-banner .banner-btns .quote-btn .consult-icon {
    filter: brightness(0) saturate(100%) invert(42%) sepia(93%) saturate(1352%) hue-rotate(208deg) brightness(97%) contrast(101%);
}

/* 覆盖 style.css 中的 hover 图标切换效果 */
.category-banner .banner-btns .quote-btn:hover .consult-icon {
    content: normal !important;
}

/* Banner 响应式优化 */
@media (max-width: 991px) {
    .category-banner .banner-features {
        flex-wrap: wrap;
        gap: 20px;
    }

    .category-banner .banner-features span {
        font-size: 18px;
    }

    .category-banner .banner-features .feature-icon {
        width: 50px;
        height: 50px;
    }

    .category-banner .banner-btns {
        flex-direction: column;
        width: 100%;
        max-width: 300px;
    }

    .category-banner .banner-btns .consult-btn,
    .category-banner .banner-btns .quote-btn {
        width: 100%;
    }
}

@media (max-width: 767px) {
    .category-banner .box-slide-title {
        font-size: 24px;
    }

    .category-banner .box-slide-sub-title {
        font-size: 18px;
    }

    .category-banner .box-slide-description {
        font-size: 14px;
    }

    .category-banner .banner-features {
        gap: 15px;
    }

    .category-banner .banner-features span {
        font-size: 14px;
    }

    .category-banner .banner-features .feature-icon {
        width: 40px;
        height: 40px;
    }
}

/* ========== 行业设备配置区域 ========== */

.device-section {
    padding-top: 90px;
}

/* 设备展示区域容器 */
.cases-section .cases-container {
    max-width: 1440px;
    margin: 0 auto;
}

/* 设备展示区域标题 */
.device-section .device-title {
    font-size: 48px;
    font-weight: bold;
    margin-bottom: 20px;
}

/* 设备展示区域副标题 */
.device-section .device-subtitle {
    font-family: 'Alibaba PuHuiTi 3.0', sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;
    line-height: 100%;
    letter-spacing: 0px;
    text-align: center;
}

/* 设备展示区域副标题高亮文字 */
.device-section .device-subtitle .highlight {
    color: #0052D9;
    font-weight: 700;
}

/* 导航容器 - 支持横向滚动 */
.device-section .nav-container {
    width: 100%;
    text-align: center;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    /* iOS平滑滚动 */
}

/* 隐藏滚动条但保持功能 */
.device-section .nav-container::-webkit-scrollbar {
    height: 0;
}

.device-section .nav-container {
    scrollbar-width: none;
    /* Firefox */
    -ms-overflow-style: none;
    /* IE/Edge */
}

/* 行业设备配置导航标签 - Flex布局，一行最多七个，始终居中 */
.device-section .nav-pills {
    max-width: 1440px;
    margin: 0 auto;
    gap: 20px;
    padding: 10px 0;
    display: flex;
    flex-wrap: wrap;
    align-self: center;
    justify-content: space-between;
}

/* 中等屏幕 - 自适应换行 */
@media (max-width: 1440px) and (min-width: 1200px) {
    .device-section .nav-pills .nav-item {
        max-width: calc((100% - 80px) / 5);
    }
}

.device-section .nav-pills .nav-item {
    display: flex;
    justify-content: center;
    flex: 0 0 auto;
    max-width: calc((100% - 120px) / 7);
}

.device-section .nav-pills .nav-link {
    width: 165px;
    min-width: 140px;
    height: 46px;
    background: #FFFFFF;
    border: none;
    border-bottom: 1px solid #EBEBEB;
    padding: 10px 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 16px;
    color: #333;
    white-space: nowrap;
    transition: all 0.3s ease;
    cursor: pointer;
}

.device-section .nav-pills .nav-link .feature-icon {
    width: 20px;
    height: 20px;
    object-fit: contain;
}

.device-section .nav-pills .nav-link:hover {
    background: #f5f7fa;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(19, 102, 238, 0.15);
}

.device-section .nav-pills .nav-link.active {
    background: #1366EE;
    border-bottom: 1px solid #1366EE;
    color: #FFFFFF;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(19, 102, 238, 0.3);
}

.device-section .nav-pills .nav-link.active .feature-icon {
    filter: brightness(0) invert(1);
}

/* Tab 内容区域 */
.device-section .tab-content .tab-pane {
    display: none;
}

.device-section .tab-content .tab-pane.show.active {
    display: block;
}

/* Tab内容容器背景 */
.device-section .tab-content-container {
    width: 100vw;
    height: 700px;
    background-image: url('/static/module/index/default/images/img_product_device.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Tab内容内部容器 */
.device-section .tab-content-inner {
    width: 1440px;
    max-width: 100%;
    height: calc(100% - 180px);
    margin: 90px auto;
}

/* 内容布局 - 左右结构 */
.device-section .content-layout {
    width: 100%;
    display: flex;
    height: 100%;
    align-items: center;
    gap: 40px;
}

/* ========== 左侧菜单区域 ========== */

.device-section .content-left {
    width: 284px;
    height: 510px;
    flex-shrink: 0;
    color: #fff;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    transition: background-image 0.3s ease;
    overflow-y: auto;
}

/* 隐藏左侧菜单滚动条 */
.device-section .content-left::-webkit-scrollbar {
    display: none;
}

.device-section .content-left {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.device-section .content-left .left-title {
    font-family: 'Alibaba PuHuiTi 3.0', sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 32px;
    line-height: 100%;
    letter-spacing: 0;
    margin-bottom: 30px;
    color: #ffffff;
}

.device-section .content-left .left-desc {
    font-family: 'Alibaba PuHuiTi 3.0', sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0;
    margin-bottom: 30px;
    opacity: 0.9;
}

.device-section .content-left .left-menu {
    list-style: none;
    padding: 0;
    margin: 0;
}

.device-section .content-left .menu-item {
    margin-bottom: 10px;
}

.device-section .content-left .menu-item a {
    display: block;
    padding: 12px 20px;
    color: rgba(255, 255, 255, 0.8);
    text-decoration: none;
    border-radius: 4px;
    transition: all 0.3s ease;
    font-size: 16px;
}

.device-section .content-left .menu-item.active a {
    background-image: url('/static/module/index/default/images/img_product_device_sel.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    color: #fff;
}

/* ========== 右侧内容区域 ========== */

.device-section .content-right {
    flex: 1;
    height: 510px;
    padding-left: 90px;
    display: flex;
    align-items: stretch;
    justify-content: center;
    position: relative;
}

/* 右侧内容卡片 */
.device-section .right-content-card {
    background: rgba(255, 255, 255, 0.95);
    border-radius: 12px;
    padding: 40px;
    padding-bottom: 100px;
    width: 100%;
    height: 100%;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column;
    position: relative;
}

.device-section .right-content-card .right-title {
    font-family: 'Alibaba PuHuiTi 3.0', sans-serif;
    font-weight: 700;
    font-size: 28px;
    line-height: 100%;
    letter-spacing: 0%;
    color: #3D485D;
    margin-bottom: 30px;
    flex-shrink: 0;
}

.device-section .right-content-card .right-desc {
    font-family: 'Alibaba PuHuiTi 3.0', sans-serif;
    font-weight: 300;
    font-style: normal;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0;
    text-align: justify;
    color: #666;
    margin-bottom: 30px;
    flex-shrink: 0;
}

/* 产品网格 */
.device-section .product-grid {
    display: flex;
    gap: 20px;
    justify-content: center;
    margin-bottom: 20px;
    flex: 1;
    align-items: center;
    min-height: 0;
}

/* 暂无数据提示 */
.device-section .no-data-tip {
    width: 100%;
    text-align: center;
    padding: 60px 20px;
    color: #999;
    font-size: 16px;
    font-family: 'Alibaba PuHuiTi 3.0', sans-serif;
}

.device-section .product-item {
    flex: 1;
    max-width: 160px;
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    cursor: pointer;
}

.device-section .product-item img {
    width: 100%;
    height: auto;
    border-radius: 8px;
    transition: transform 0.3s ease;
    display: block;
}

/* 产品名称遮罩层 */
.device-section .product-name-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.7);
    color: #fff;
    padding: 12px 8px;
    font-family: 'Alibaba PuHuiTi 3.0', sans-serif;
    font-size: 14px;
    text-align: center;
    opacity: 0;
    transform: translateY(100%);
    transition: all 0.3s ease;
    border-radius: 0 0 8px 8px;
}

.device-section .product-item:hover .product-name-overlay {
    opacity: 1;
    transform: translateY(0);
}

.device-section .product-item::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(19, 102, 238, 0.1);
    opacity: 0;
    transition: opacity 0.3s ease;
    border-radius: 8px;
    pointer-events: none;
}

.device-section .product-item:hover img {
    transform: scale(1.05);
}

.device-section .product-item:hover::after {
    opacity: 1;
}

/* 右侧操作按钮 */
.device-section .right-actions {
    display: flex;
    gap: 32px;
    justify-content: center;
    flex-shrink: 0;
    position: absolute;
    bottom: 40px;
    left: 40px;
    right: 40px;
}

.device-section .right-actions .btn {
    width: 180px;
    height: 48px;
    padding: 12px 30px;
    border-radius: 4px;
    font-size: 15px;
    font-weight: 500;
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

/* 按钮图标样式 */
.device-section .right-actions .btn .consult-icon,
.device-section .right-actions .btn .feature-icon {
    width: 20px;
    height: 20px;
    object-fit: contain;
}

/* 立即咨询按钮 */
.device-section .right-actions .btn-consult {
    background: #1366EE;
    color: #fff;
    border: none;
    box-shadow: 0px 9px 26px 0px rgba(13, 153, 255, 0.3);
    transition: all 0.3s ease;
}

.device-section .right-actions .btn-consult:hover {
    transform: translateY(-2px);
}

/* 查看更多按钮 */
.device-section .right-actions .btn-more {
    background: #fff;
    color: #1366EE;
    border: 2px solid #1366EE;
    transition: all 0.3s ease;
    box-shadow: 0px 9px 26px 0px rgba(13, 153, 255, 0.3);
}

.device-section .right-actions .btn-more:hover {
    transform: translateY(-2px);
}

/* ========== 整体解决方案区域 ========== */

.solution-section {
    padding-top: 90px;
    padding-bottom: 90px;
    background-color: #F1F5FF;
}

.solution-container {
    max-width: 1680px;
    margin: 0 auto;
    padding: 0 20px;
}

/* 整体解决方案区域标题 */
.solution-section .solution-title {
    font-size: 48px;
    font-weight: bold;
    margin-bottom: 20px;
    text-align: center;
}

/* 整体解决方案区域副标题 */
.solution-section .solution-subtitle {
    font-family: 'Alibaba PuHuiTi 3.0', sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;
    line-height: 100%;
    letter-spacing: 0px;
    text-align: center;
    color: #3D485D;
}

/* 整体解决方案区域副标题高亮文字 */
.solution-section .solution-subtitle .highlight {
    color: #0052D9;
    font-weight: 700;
}

/* 轮播容器 */
.solution-carousel-wrapper {
    display: flex;
    align-items: center;
    margin: 0 auto;
}

/* 轮播箭头按钮 */
.solution-arrow {
    flex-shrink: 0;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    cursor: pointer;
    transition: all 0.3s ease;
}

.solution-arrow:hover {
    transform: scale(1.1);
    opacity: 0.8;
}

.solution-arrow .carousel-arrow-icon {
    width: 37.5px;
    height: 37.5px;
    object-fit: contain;
    filter: brightness(0) invert(0.5);
    transition: filter 0.3s ease;
}

/* 轮播视口 */
.solution-carousel-viewport {
    flex: 1;
}

/* 轮播轨道 */
.solution-carousel-track {
    width: 1440px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: transform 0.5s ease;
}

/* 解决方案卡片 */
.solution-section .solution-card {
    width: 410px;
    height: 610px;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    overflow: visible;
    box-shadow: 8px 8px 20px 0px #3763AA1A;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    position: relative;
}

/* 解决方案卡片内容包裹器（用于保持圆角） */
.solution-section .solution-card-inner {
    width: 100%;
    height: 100%;
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.solution-section .solution-card:hover {
    transform: translateY(-5px);
    box-shadow: 8px 8px 20px 0px #3763AA1A;
    border-radius: 8px;
}

/* 解决方案卡片图片区域 */
.solution-section .solution-card-image {
    position: relative;
    width: 100%;
    height: 280px;
    background-size: 110% 120%;
    background-position: center;
    background-repeat: no-repeat;
    transition: transform 0.3s ease;

}

/* 解决方案卡片链接覆盖层 */
.solution-section .solution-card-link {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
}

/* 解决方案卡片banner图片 */
.solution-section .solution-banner-img {
    position: absolute;
    width: 348px;
    height: 261px;
    top: -52px;
    right: -25px;
    transform: rotate(0deg) scale(1);
    opacity: 1;
    object-fit: cover;
    z-index: 999;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* 卡片悬停时banner图片的效果 */
.solution-section .solution-card:hover .solution-banner-img {
    transform: scale(1.08) rotate(2deg);
    opacity: 0.95;
    filter: brightness(1.05);
}

/* 解决方案卡片遮罩层 */
.solution-section .solution-card-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%);
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-end;
    padding: 20px;
}

.solution-section .solution-card-title {
    color: #fff;
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 0;
    width: 148px;
    flex-shrink: 0;
}

.solution-section .solution-card-area {
    color: #fff;
    font-size: 20px;
    opacity: 0.9;
    white-space: nowrap;
}

/* 解决方案卡片内容区域 */
.solution-section .solution-card-body {
    flex: 1;
    padding: 26px;
    background: #fff;
}

.solution-section .solution-card-desc {
    color: #81848A;
    margin-bottom: 16px;
    min-height: 80px;
    font-family: Alibaba PuHuiTi 3.0;
    font-weight: 400;
    font-style: 55 Regular;
    font-size: 18px;
    line-height: 200%;
    letter-spacing: 0%;
    text-align: justify;

}

/* 解决方案卡片标签 */
.solution-section .solution-card-tags {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 20px;
    border-radius: 0 0 8px 8px;
    background: #fff;
}

.solution-section .solution-card-tags .tag-item {
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 12px;
    color: #0066FF;
    background: #FFFFFF;
    border: 0.5px solid #0066FF;
    box-shadow: 8px 8px 20px 0px #3763AA1A;
    white-space: nowrap;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

/* 选中标签样式 */
.solution-section .solution-card-tags .tag-item.tag-active {
    background: linear-gradient(90deg, #0072FF 0%, #00A3FF 100%);
    box-shadow: 0px 9px 26px 0px #0D99FF4D;
    color: #fff;
    border: none;
}

/* ========== 案例展示区域 ========== */

/* 案例展示区域容器 */
.cases-section .cases-container {
    max-width: 1440px;
    margin: 0 auto;
}

/* 案例展示区域标题 */
.cases-section .cases-title {
    font-size: 48px;
    font-weight: bold;
    margin-bottom: 20px;
}

/* 案例展示区域副标题 */
.cases-section .cases-subtitle {
    font-family: 'Alibaba PuHuiTi 3.0', sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;
    line-height: 100%;
    letter-spacing: 0px;
    text-align: center;
    color: #3D485D;
}

/* 案例展示区域副标题高亮文字 */
.cases-section .cases-subtitle .highlight {
    color: #0052D9;
    font-weight: 700;
}

/* 案例卡片行 */
.cases-section .case-row {
    width: 100%;
    min-height: 420px;
    display: flex;
}

/* 小屏幕案例卡片调整为垂直布局 */
@media (max-width: 991px) {
    .cases-section .case-row {
        flex-direction: column;
        min-height: auto;
    }

    .cases-section .case-left {
        width: 100%;
        height: 300px;
        padding: 30px;
    }

    .cases-section .case-right {
        padding: 30px;
    }

    .cases-section .case-images-wrapper {
        gap: 15px;
    }

    .cases-section .case-image-item img {
        height: 120px;
    }
}

/* 案例左侧区域 */
.cases-section .case-left {
    width: 346px;
    position: relative;
    height: 420px;
    overflow: hidden;
    padding: 50px;
    flex-shrink: 0;
}

/* 案例左侧背景图 */
.cases-section .case-left .case-bg-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
}

/* 案例左侧内容层 */
.cases-section .case-left-content {
    position: relative;
    z-index: 1;
    height: 100%;
    display: flex;
    flex-direction: column;
}

/* 案例标题 */
.cases-section .case-title {
    font-size: 24px;
    font-weight: 700;
    margin-top: 0;
    color: #fff;
}

/* 案例分隔线 */
.cases-section .case-divider {
    height: 1px;
    background-color: #fff;
    margin: 10px 0;
}

/* 案例内容描述 */
.cases-section .case-description {
    font-size: 13px;
    line-height: 1.6;
    color: #ffffff !important;
    flex-grow: 1;
}

/* 案例查看更多按钮 */
.cases-section .case-more-btn {
    color: #1366EE;
    margin-top: auto;
    margin-bottom: -10px;
    width: 180px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: center;
}

/* 案例查看更多按钮图标 */
.cases-section .case-more-btn .feature-icon {
    margin-right: 8px;
}

/* 案例右侧图集区域 */
.cases-section .case-right {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #F2F5F7;
}

/* 案例右侧图集容器 */
.cases-section .case-images-wrapper {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    width: 100%;
    gap: 20px;
}

/* 案例单个图片项 */
.cases-section .case-image-item {
    display: flex;
    justify-content: center;
    align-items: center;
}

/* 案例单个图片 */
.cases-section .case-image-item img {
    height: 160px;
    width: 240px;
    object-fit: cover;
    border-radius: 4px;
    max-width: 100%;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* 案例图片悬停效果 */
.cases-section .case-image-item:hover img {
    transform: scale(1.05);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

/* ========== 性能优化和可访问性 ========== */

/* 减少动画对性能的影响 */
@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* 打印样式优化 */
@media print {

    .device-section .nav-container,
    .device-section .right-actions {
        display: none;
    }

    .device-section .tab-content-inner {
        width: 100%;
        margin: 0;
    }

    .device-section .content-layout {
        flex-direction: column;
    }

    .device-section .content-left,
    .device-section .content-right {
        width: 100%;
        height: auto;
    }
}

/* ========== 响应式布局 ========== */

/* 大屏幕设备 (1440px以上) */
@media (min-width: 1441px) {
    .device-section .tab-content-inner {
        width: 1440px;
        margin: 90px auto;
    }
}

/* 中等屏幕设备 (1200px - 1440px) */
@media (max-width: 1440px) and (min-width: 1200px) {
    .device-section .tab-content-inner {
        width: calc(100% - 60px);
        max-width: 1440px;
        margin: 90px 30px;
    }

    .device-section .content-layout {
        gap: 30px;
    }

    .device-section .content-left {
        width: 284px;
        padding: 0 30px;
    }

    .device-section .content-right {
        padding-left: 60px;
    }
}

/* 小屏幕设备 (992px - 1199px) */
@media (max-width: 1199px) and (min-width: 992px) {
    .solution-section {
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .device-section .tab-content-inner {
        width: calc(100% - 40px);
        margin: 70px 20px;
        height: auto;
        min-height: 600px;
    }

    .device-section .content-layout {
        flex-direction: column;
        gap: 30px;
        padding: 20px 0;
    }

    .device-section .content-left {
        width: 100%;
        max-width: 100%;
        height: auto;
        max-height: 400px;
        padding: 30px 40px;
    }

    .device-section .content-right {
        width: 100%;
        height: auto;
        padding-left: 0;
        padding: 0 20px;
    }

    .device-section .right-content-card {
        padding: 30px;
    }

    .device-section .product-grid {
        flex-wrap: wrap;
    }

    .device-section .product-item {
        max-width: calc(33.333% - 14px);
    }
}

/* 平板设备 (768px - 991px) */
@media (max-width: 991px) and (min-width: 768px) {
    .solution-section {
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .device-section {
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .device-section .tab-content-container {
        height: auto;
        min-height: 500px;
    }

    .device-section .tab-content-inner {
        width: calc(100% - 30px);
        margin: 50px 15px;
        height: auto;
    }

    .device-section .content-layout {
        flex-direction: column;
        gap: 25px;
        padding: 15px 0;
    }

    .device-section .content-left {
        width: 100%;
        height: auto;
        max-height: 350px;
        padding: 25px 30px;
    }

    .device-section .content-left .left-title {
        font-family: 'Alibaba PuHuiTi 3.0', sans-serif;
        font-weight: 700;
        font-size: 24px;
        line-height: 100%;
        letter-spacing: 0;
    }

    .device-section .content-right {
        width: 100%;
        height: auto;
        padding-left: 0;
    }

    .device-section .right-content-card {
        padding: 25px;
    }

    .device-section .right-content-card .right-title {
        font-size: 20px;
    }

    .device-section .product-grid {
        flex-wrap: wrap;
        gap: 15px;
    }

    .device-section .product-item {
        max-width: calc(50% - 8px);
    }

    .device-section .right-actions .btn {
        width: 160px;
        height: 44px;
        font-size: 14px;
    }

    /* 导航标签调整 */
    .device-section .nav-pills {
        grid-template-columns: repeat(4, 1fr);
        gap: 15px;
    }

    .device-section .nav-pills .nav-link {
        width: 100%;
        max-width: 165px;
    }
}

/* 手机设备 (小于768px) */
@media (max-width: 767px) {
    .solution-section {
        padding-top: 40px;
        padding-bottom: 40px;
    }

    .solution-section .device-title {
        font-size: 32px;
    }

    .solution-section .device-subtitle {
        font-size: 16px;
    }

    .device-section {
        padding-top: 40px;
        padding-bottom: 40px;
    }

    .device-section .cases-title {
        font-size: 32px;
    }

    .device-section .cases-subtitle {
        font-size: 16px;
    }

    .device-section .tab-content-container {
        height: auto;
        min-height: 400px;
    }

    .device-section .tab-content-inner {
        width: calc(100% - 20px);
        margin: 30px 10px;
        height: auto;
    }

    .device-section .content-layout {
        flex-direction: column;
        gap: 20px;
        padding: 10px 0;
    }

    .device-section .content-left {
        width: 100%;
        height: auto;
        max-height: 300px;
        padding: 20px 25px;
    }

    .device-section .content-left .left-title {
        font-family: 'Alibaba PuHuiTi 3.0', sans-serif;
        font-weight: 700;
        font-size: 32px;
        line-height: 100%;
        letter-spacing: 0;
        margin-bottom: 30px;
    }

    .device-section .content-left .left-desc {
        font-family: 'Alibaba PuHuiTi 3.0', sans-serif;
        font-weight: 400;
        font-size: 16px;
        line-height: 100%;
        letter-spacing: 0;
        margin-bottom: 30px;
    }

    .device-section .content-left .menu-item a {
        padding: 10px 15px;
        font-size: 14px;
    }

    .device-section .content-right {
        width: 100%;
        height: auto;
        padding-left: 0;
        padding: 0 10px;
    }

    .device-section .right-content-card {
        padding: 20px;
    }

    .device-section .right-content-card .right-title {
        font-size: 18px;
        margin-bottom: 10px;
    }

    .device-section .right-content-card .right-desc {
        font-size: 13px;
        margin-bottom: 20px;
    }

    .device-section .product-grid {
        flex-wrap: wrap;
        gap: 10px;
        margin-bottom: 20px;
    }

    .device-section .product-item {
        max-width: calc(50% - 5px);
        margin-bottom: 10px;
    }

    .device-section .right-actions {
        flex-direction: column;
        gap: 10px;
    }

    .device-section .right-actions .btn {
        width: 100%;
        max-width: 280px;
        height: 44px;
        font-size: 14px;
    }

    /* 导航标签调整 */
    .device-section .nav-pills {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
        padding: 5px 0;
    }

    .device-section .nav-pills .nav-link {
        width: 100%;
        height: 40px;
        font-size: 14px;
        padding: 8px 10px;
    }

    .device-section .nav-pills .nav-link .feature-icon {
        width: 16px;
        height: 16px;
    }
}

/* 超小屏幕 (小于480px) */
@media (max-width: 479px) {
    .solution-section .device-title {
        font-size: 28px;
    }

    .solution-section .device-subtitle {
        font-size: 14px;
    }

    .device-section .cases-title {
        font-size: 28px;
    }

    .device-section .cases-subtitle {
        font-size: 14px;
    }

    .device-section .tab-content-inner {
        width: calc(100% - 10px);
        margin: 20px 5px;
    }

    .device-section .content-left {
        max-height: 250px;
        padding: 15px 20px;
    }

    .device-section .content-left .left-title {
        font-family: 'Alibaba PuHuiTi 3.0', sans-serif;
        font-weight: 700;
        font-size: 20px;
        line-height: 100%;
        letter-spacing: 0;
    }

    .device-section .content-left .left-desc {
        font-family: 'Alibaba PuHuiTi 3.0', sans-serif;
        font-weight: 400;
        font-size: 12px;
        line-height: 100%;
        letter-spacing: 0;
    }

    .device-section .content-left .menu-item a {
        padding: 8px 12px;
        font-size: 13px;
    }

    .device-section .right-content-card {
        padding: 15px;
    }

    .device-section .right-content-card .right-title {
        font-size: 16px;
    }

    .device-section .right-content-card .right-desc {
        font-size: 12px;
    }

    .device-section .product-grid {
        gap: 8px;
        margin-bottom: 15px;
    }

    .device-section .product-item {
        max-width: 100%;
        margin-bottom: 8px;
    }

    .device-section .right-actions .btn {
        height: 40px;
        font-size: 13px;
        padding: 10px 20px;
    }

    /* 导航标签调整 */
    .device-section .nav-pills {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .device-section .nav-pills .nav-link {
        height: 36px;
        font-size: 13px;
        padding: 6px 8px;
    }

    .device-section .nav-pills .nav-link .feature-icon {
        width: 14px;
        height: 14px;
    }
}

/* ========== 综合体验馆精品案例区域 ========== */

/* 综合体验馆区域 */
.exhibition-section {
    padding: 90px 0;
}

/* 综合体验馆容器 */
.exhibition-container {
    max-width: 1440px;
    margin: 0 auto;
}

/* 综合体验馆标题 */
.exhibition-section .exhibition-title {
    font-size: 48px;
    font-weight: bold;
    margin-bottom: 20px;
    text-align: center;
}

/* 综合体验馆副标题 */
.exhibition-section .exhibition-subtitle {
    font-family: 'Alibaba PuHuiTi 3.0', sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;
    line-height: 100%;
    letter-spacing: 0px;
    text-align: center;
    color: #3D485D;
}

/* 综合体验馆副标题高亮 */
.exhibition-section .exhibition-subtitle .highlight {
    color: #0052D9;
    font-weight: 700;
}

/* 综合体验馆列表容器 */
.exhibition-list {
    margin-top: 50px;
    display: flex;
    flex-direction: column;
}

/* 综合体验馆主卡片 */
.exhibition-main-card {
    display: flex;
    box-sizing: border-box;
    height: 556px;
    margin-bottom: 24px;
    position: relative;
}

/* 综合体验馆卡片底部背景图片 */
.exhibition-card-bg-img {
    position: absolute;
    bottom: 0;
    left: 22px;
    width: 100%;
    height: auto;
    z-index: 0;
    pointer-events: none;
}

/* 综合体验馆主图片 */
.exhibition-main-image {
    width: 720px;
    height: 510px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    flex-shrink: 0;
    position: relative;
    border-radius: 8px;
    z-index: 1;
}

/* 综合体验馆主信息区 */
.exhibition-main-info {
    flex: 1;
    padding: 90px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    z-index: 1;
}

/* 综合体验馆主标题 */
.exhibition-main-title {
    font-family: 'Alibaba PuHuiTi 3.0', sans-serif;
    font-size: 32px;
    font-weight: 700;
    line-height: 100%;
    letter-spacing: 0%;
    color: #0066FF;
    margin-bottom: 20px;
}

/* 综合体验馆主描述 */
.exhibition-main-desc {
    font-family: 'Alibaba PuHuiTi 3.0', sans-serif;
    height: 80px;
    font-size: 20px;
    font-weight: 400;
    line-height: 1.8;
    letter-spacing: 0%;
    color: #666;
    margin-bottom: 40px;
}

/* 综合体验馆主按钮组 */
.exhibition-main-buttons {
    display: flex;
    gap: 32px;
}

/* 综合体验馆按钮 */
.exhibition-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 14px 32px;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.3s ease;
    cursor: pointer;
}

.exhibition-btn .btn-icon {
    width: 20px;
    height: 20px;
    margin-right: 8px;
}

/* 综合体验馆主按钮 */
.exhibition-btn-primary {
    background: linear-gradient(135deg, #1366EE 0%, #3B82F6 100%);
    color: #fff;
    box-shadow: 0 4px 15px rgba(19, 102, 238, 0.3);
    transition: all 0.3s ease;
}

.exhibition-btn-primary:hover {
    transform: translateY(-2px);
    color: #fff;
}

/* 综合体验馆次按钮 */
.exhibition-btn-secondary {
    background: #fff;
    color: #1366EE;
    border: 1px solid #1366EE;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(19, 102, 238, 0.3);
}

.exhibition-btn-secondary:hover {
    transform: translateY(-2px);
    color: #1366EE;
}

/* 综合体验馆子卡片组 */
.exhibition-sub-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

/* 综合体验馆子卡片 */
.exhibition-sub-card {
    width: 340px;
    height: 340px;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
}

.exhibition-sub-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.12);
}

/* 综合体验馆子图片 */
.exhibition-sub-image {
    width: 100%;
    height: 220px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 8px 8px 0 0;
}

/* 综合体验馆子信息 */
.exhibition-sub-info {
    padding: 20px 40px;
    background: #fff;
    border-radius: 8px 8px 0 0;
    margin-top: -8px;
    position: relative;
    z-index: 1;
}

/* 综合体验馆子标题 */
.exhibition-sub-title {
    font-family: 'Alibaba PuHuiTi 3.0', sans-serif;
    font-size: 24px;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0%;
    text-align: justify;
}

/* 综合体验馆子描述 */
.exhibition-sub-desc {
    font-family: 'Alibaba PuHuiTi 3.0', sans-serif;
    font-size: 16px;
    font-weight: 400;
    color: #81848A;
}