/* 服务案例页面 */
.case-subnav{
    background:#fff;
    border-bottom:1px solid #eee;
}
.case-subnav ul{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
}
.case-subnav ul li a{
    display:block;
    padding:18px 28px;
    font-size:15px;
    color:#666;
    border-bottom:3px solid transparent;
    transition:all .3s;
}
.case-subnav ul li a:hover,
.case-subnav ul li a.active{
    color:var(--fq-red);
    border-bottom-color:var(--fq-red);
    font-weight:500;
}

.case-main{padding:48px 0 80px;background:#fff;}
.case-layout{display:flex;gap:40px;align-items:flex-start;}
.case-sidebar{
    flex:0 0 200px;
    position:sticky;
    top:100px;
}
.case-sidebar ul li{margin-bottom:4px;}
.case-sidebar ul li a{
    display:block;
    padding:14px 20px;
    font-size:14px;
    color:#666;
    border-left:3px solid transparent;
    transition:all .3s;
}
.case-sidebar ul li a:hover,
.case-sidebar ul li a.active{
    color:var(--fq-red);
    background:var(--fq-pink);
    border-left-color:var(--fq-red);
    font-weight:500;
}
.case-content{flex:1;min-width:0;}

/* 案例区块 */
.case-block{
    padding-bottom:64px;
    margin-bottom:64px;
    border-bottom:1px solid #eee;
}
.case-block:last-child{
    padding-bottom:0;
    margin-bottom:0;
    border-bottom:none;
}
.case-block .case-header{
    display:flex;
    gap:40px;
    align-items:flex-start;
    margin-bottom:40px;
}
.case-block .case-intro{flex:1;}
.case-block .case-intro h2{
    font-size:26px;
    font-weight:600;
    color:#333;
    line-height:1.4;
    margin-bottom:20px;
}
.case-block .case-intro p{
    font-size:14px;
    color:var(--fq-gray);
    line-height:2.2;
    margin-bottom:20px;
}
.case-block .case-tags{display:flex;flex-wrap:wrap;gap:10px;}
.case-block .case-tags span{
    display:inline-block;
    padding:4px 16px;
    font-size:12px;
    color:var(--fq-red);
    border:1px solid var(--fq-red);
    border-radius:20px;
}
.case-block .case-hero-img{flex:0 0 46%;}
.case-block .case-hero-img img{
    width:100%;
    border-radius:2px;
    display:block;
}

/* 四大特点 */
.case-features{
    display:flex;
    gap:16px;
    margin-bottom:32px;
}
.case-features .feat-item{
    flex:1;
    background:var(--fq-light);
    padding:28px 20px;
    text-align:center;
    position:relative;
    transition:box-shadow .3s;
}
.case-features .feat-item:hover{box-shadow:0 4px 16px rgba(0,0,0,.06);}
.case-features .feat-item .feat-icon{
    font-size:24px;
    color:var(--fq-red);
    margin-bottom:12px;
}
.case-features .feat-item .feat-num{
    font-size:36px;
    font-weight:700;
    color:#e8e8e8;
    line-height:1;
    margin-bottom:10px;
}
.case-features .feat-item h4{
    font-size:14px;
    font-weight:600;
    color:#333;
    margin-bottom:6px;
}
.case-features .feat-item p{
    font-size:12px;
    color:#999;
    line-height:1.6;
}

/* 详情列表 */
.case-details .detail-row{
    display:flex;
    align-items:center;
    gap:20px;
    padding:20px 24px;
    background:var(--fq-light);
    margin-bottom:12px;
    transition:background .3s;
}
.case-details .detail-row:last-child{margin-bottom:0;}
.case-details .detail-row:hover{background:#f0f0f0;}
.case-details .detail-row img{
    flex:0 0 120px;
    width:120px;
    height:80px;
    object-fit:cover;
    border-radius:2px;
    display:block;
}
.case-details .detail-row .detail-info h4{
    font-size:15px;
    font-weight:600;
    color:#333;
    margin-bottom:6px;
}
.case-details .detail-row .detail-info p{
    font-size:13px;
    color:var(--fq-gray);
    line-height:1.7;
}

/* 服务案例网格 */
.case-grid-section{padding:80px 0;background:var(--fq-light);}
.case-grid-section .case-grid{
    display:flex;
    flex-wrap:wrap;
    gap:24px;
    margin-top:48px;
}
.case-grid-break{width:100%;height:0;}
.case-grid-section .case-card{
    flex:0 0 calc(50% - 12px);
    background:#fff;
    border-radius:2px;
    overflow:hidden;
    transition:box-shadow .3s,transform .3s;
}
.case-grid-section .case-card:hover{
    box-shadow:0 8px 28px rgba(0,0,0,.1);
    transform:translateY(-4px);
}
.case-grid-section .case-card .card-img{
    display:block;
    overflow:hidden;
}
.case-grid-section .case-card .card-img img{
    width:100%;
    height:260px;
    object-fit:cover;
    display:block;
    transition:transform .4s;
}
.case-grid-section .case-card:hover .card-img img{transform:scale(1.05);}
.case-grid-section .case-card .card-body{padding:24px;}
.case-grid-section .case-card .card-body h3{
    font-size:18px;
    font-weight:600;
    color:#333;
    margin-bottom:12px;
    line-height:1.4;
}
.case-grid-section .case-card .card-body h3 a{color:#333;}
.case-grid-section .case-card .card-body h3 a:hover{color:var(--fq-red);}
.case-grid-section .case-card .card-body .summary{
    font-size:13px;
    color:var(--fq-gray);
    line-height:1.8;
    margin-bottom:16px;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}
.case-grid-section .case-card .card-meta{
    display:flex;
    align-items:center;
    justify-content:space-between;
    font-size:12px;
    color:#999;
    padding-top:14px;
    border-top:1px solid #f0f0f0;
}
.case-grid-section .case-card .card-meta .meta-left{
    display:flex;
    align-items:center;
    gap:16px;
}
.case-grid-section .case-card .card-meta .meta-left i{margin-right:4px;}
.case-grid-section .case-card .card-meta a.more{
    color:var(--fq-red);
    font-size:13px;
}
.case-grid-section .case-card .card-meta a.more:hover{text-decoration:underline;}

/* 分页 */
.case-pagination{
    margin-top:40px;
    text-align:center;
}
.case-pagination .pagination{
    display:inline-flex;
    gap:6px;
    list-style:none;
    padding:0;
    margin:0;
}
.case-pagination .pagination li a,
.case-pagination .pagination li span{
    display:block;
    min-width:36px;
    height:36px;
    line-height:36px;
    padding:0 10px;
    font-size:14px;
    color:#666;
    border:1px solid #ddd;
    border-radius:2px;
    transition:all .3s;
}
.case-pagination .pagination li a:hover,
.case-pagination .pagination li.active span{
    background:var(--fq-red);
    border-color:var(--fq-red);
    color:#fff;
}

/* 口碑见证 */
.case-testimonials{padding:80px 0;background:#fff;}
.case-testimonials .testimonial-grid{
    display:flex;
    gap:24px;
    margin-top:48px;
    align-items:flex-start;
}
.case-testimonials .testimonial-item{
    flex:1;
    text-align:center;
}
.case-testimonials .testimonial-bubble{
    position:relative;
    background:#fff;
    border:1px solid #eee;
    padding:32px 24px;
    margin-bottom:20px;
    min-height:160px;
    box-shadow:0 2px 12px rgba(0,0,0,.04);
}
.case-testimonials .testimonial-item.featured .testimonial-bubble{
    background:var(--fq-red);
    border-color:var(--fq-red);
    color:#fff;
    box-shadow:0 8px 24px rgba(186,66,50,.25);
}
.case-testimonials .testimonial-bubble .quote-icon{
    font-size:28px;
    color:var(--fq-red);
    opacity:.3;
    margin-bottom:12px;
    line-height:1;
}
.case-testimonials .testimonial-item.featured .quote-icon{color:#fff;opacity:.4;}
.case-testimonials .testimonial-bubble p{
    font-size:14px;
    line-height:2;
    color:var(--fq-gray);
}
.case-testimonials .testimonial-item.featured .testimonial-bubble p{color:rgba(255,255,255,.92);}
.case-testimonials .testimonial-bubble:after{
    content:'';
    position:absolute;
    bottom:-10px;
    left:50%;
    transform:translateX(-50%);
    width:0;height:0;
    border-left:10px solid transparent;
    border-right:10px solid transparent;
    border-top:10px solid #fff;
}
.case-testimonials .testimonial-item.featured .testimonial-bubble:after{border-top-color:var(--fq-red);}
.case-testimonials .testimonial-avatar{
    width:56px;
    height:56px;
    border-radius:50%;
    object-fit:cover;
    margin:0 auto 10px;
    display:block;
    border:3px solid #fff;
    box-shadow:0 2px 8px rgba(0,0,0,.1);
}
.case-testimonials .testimonial-name{
    font-size:14px;
    font-weight:600;
    color:#333;
}
.case-testimonials .testimonial-title{
    font-size:12px;
    color:#999;
    margin-top:4px;
}

/* ========== 平板适配 ========== */
@media(max-width:1000px){
    .case-layout{flex-direction:column;gap:0;}
    .case-sidebar{
        flex:none;width:100%;
        position:static;
        margin-bottom:32px;
    }
    .case-sidebar ul{
        display:flex;
        flex-wrap:wrap;
        gap:8px;
    }
    .case-sidebar ul li{margin-bottom:0;flex:1;min-width:calc(33.33% - 6px);}
    .case-sidebar ul li a{
        border-left:none;
        border-bottom:3px solid transparent;
        text-align:center;
        padding:12px 10px;
    }
    .case-sidebar ul li a.active{border-bottom-color:var(--fq-red);border-left-color:transparent;}
    .case-block .case-header{flex-direction:column;gap:24px;}
    .case-block .case-hero-img{flex:none;width:100%;}
    .case-features{flex-wrap:wrap;}
    .case-features .feat-item{flex:0 0 calc(50% - 8px);}
    .case-grid-section .case-card{flex:0 0 100%;}
    .case-testimonials .testimonial-grid{flex-wrap:wrap;}
    .case-testimonials .testimonial-item{flex:0 0 calc(50% - 12px);}
}

/* ========== 手机适配 ========== */
@media(max-width:768px){
    .case-main{padding:32px 0 48px;}
    .case-sidebar ul li{min-width:calc(50% - 4px);}
    .case-block{padding-bottom:48px;margin-bottom:48px;}
    .case-block .case-intro h2{font-size:22px;}
    .case-features .feat-item{flex:0 0 100%;}
    .case-details .detail-row{flex-direction:column;align-items:flex-start;}
    .case-details .detail-row img{width:100%;height:160px;flex:none;}
    .case-grid-section,
    .case-testimonials{padding:48px 0;}
    .case-grid-section .case-card .card-img img{height:200px;}
    .case-testimonials .testimonial-item{flex:0 0 100%;}
}

@media(max-width:375px){
    .case-sidebar ul li{min-width:100%;}
}

/* ========== 案例详情页 ========== */
.case-detail-main{padding:48px 0 64px;background:#fff;}
.case-detail-layout{display:flex;gap:40px;align-items:flex-start;}
.case-detail-article{flex:1;min-width:0;}
.case-detail-side{
    flex:0 0 280px;
    position:sticky;
    top:100px;
}

/* 主图 */
.case-detail-gallery{margin-bottom:32px;}
.case-detail-gallery .gallery-main{
    border-radius:2px;
    overflow:hidden;
    background:#f5f5f5;
}
.case-detail-gallery .gallery-main img{
    width:100%;
    max-height:480px;
    object-fit:cover;
    display:block;
}
.case-detail-gallery .gallery-thumbs{
    display:flex;
    gap:10px;
    margin-top:12px;
}
.case-detail-gallery .gallery-thumbs img:first-child{
    opacity:1;
    border-color:var(--fq-red);
}
.case-detail-gallery .gallery-thumbs img{
    flex:1;
    height:80px;
    object-fit:cover;
    border-radius:2px;
    cursor:pointer;
    opacity:.65;
    border:2px solid transparent;
    transition:all .3s;
}
.case-detail-gallery .gallery-thumbs img:hover,
.case-detail-gallery .gallery-thumbs img.active{
    opacity:1;
    border-color:var(--fq-red);
}

/* 标题区 */
.case-detail-header{margin-bottom:32px;padding-bottom:28px;border-bottom:1px solid #eee;}
.case-detail-header h1{
    font-size:28px;
    font-weight:600;
    color:#333;
    line-height:1.5;
    margin-bottom:16px;
}
.case-detail-header .detail-meta{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:20px;
    font-size:13px;
    color:#999;
    margin-bottom:16px;
}
.case-detail-header .detail-meta span i{margin-right:6px;}
.case-detail-header .detail-lead{
    font-size:15px;
    color:var(--fq-gray);
    line-height:2;
    padding:16px 20px;
    background:var(--fq-light);
    border-left:3px solid var(--fq-red);
}
.case-detail-header .detail-tags{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:16px;
}
.case-detail-header .detail-tags a,
.case-detail-header .detail-tags span{
    display:inline-block;
    padding:4px 14px;
    font-size:12px;
    color:var(--fq-red);
    border:1px solid var(--fq-red);
    border-radius:20px;
}
.case-detail-header .detail-tags a:hover{background:var(--fq-red);color:#fff;}

/* 正文 */
.case-detail-body{
    font-size:15px;
    color:#444;
    line-height:2;
}
.case-detail-body img{max-width:100%;height:auto;border-radius:2px;margin:12px 0;}
.case-detail-body p{margin-bottom:16px;}
.case-detail-body h2,
.case-detail-body h3,
.case-detail-body h4{
    font-weight:600;
    color:#333;
    margin:28px 0 16px;
    line-height:1.4;
}
.case-detail-body h2{font-size:22px;}
.case-detail-body h3{font-size:18px;}
.case-detail-body ul,
.case-detail-body ol{padding-left:20px;margin-bottom:16px;}
.case-detail-body li{margin-bottom:8px;line-height:1.9;}

/* 上下篇 */
.case-detail-nav{
    display:flex;
    gap:16px;
    margin-top:48px;
    padding-top:32px;
    border-top:1px solid #eee;
}
.case-detail-nav .nav-item{
    flex:1;
    padding:20px 24px;
    background:var(--fq-light);
    transition:background .3s;
}
.case-detail-nav .nav-item:hover{background:#f0f0f0;}
.case-detail-nav .nav-item .nav-label{
    font-size:12px;
    color:#999;
    margin-bottom:8px;
}
.case-detail-nav .nav-item a{
    font-size:14px;
    color:#333;
    font-weight:500;
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.case-detail-nav .nav-item a:hover{color:var(--fq-red);}
.case-detail-nav .nav-item.empty{color:#ccc;font-size:14px;}

/* 侧栏 */
.case-detail-side .side-box{
    background:var(--fq-light);
    padding:24px 20px;
    margin-bottom:20px;
}
.case-detail-side .side-box h3{
    font-size:16px;
    font-weight:600;
    color:#333;
    margin-bottom:16px;
    padding-bottom:12px;
    border-bottom:1px solid #e8e8e8;
}
.case-detail-side .side-back{
    display:block;
    text-align:center;
    padding:12px 0;
    font-size:14px;
    color:#fff;
    background:var(--fq-red);
    border-radius:2px;
    margin-bottom:20px;
    transition:background .3s;
}
.case-detail-side .side-back:hover{background:var(--fq-red-hover);color:#fff;}
.case-detail-side .side-hot li{
    padding:12px 0;
    border-bottom:1px solid #eee;
}
.case-detail-side .side-hot li:last-child{border-bottom:none;}
.case-detail-side .side-hot li a{
    display:flex;
    gap:12px;
    align-items:center;
}
.case-detail-side .side-hot li img{
    flex:0 0 64px;
    width:64px;
    height:48px;
    object-fit:cover;
    border-radius:2px;
}
.case-detail-side .side-hot li span{
    flex:1;
    font-size:13px;
    color:#333;
    line-height:1.6;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}
.case-detail-side .side-hot li a:hover span{color:var(--fq-red);}
.case-detail-side .side-cta{
    background:var(--fq-red);
    color:#fff;
    text-align:center;
    padding:28px 20px;
}
.case-detail-side .side-cta h4{font-size:16px;font-weight:600;margin-bottom:8px;}
.case-detail-side .side-cta p{font-size:13px;opacity:.88;margin-bottom:16px;line-height:1.7;}
.case-detail-side .side-cta .cta-tel{
    display:block;
    font-size:22px;
    font-weight:700;
    color:#fff;
    letter-spacing:1px;
}
.case-detail-side .side-cta .cta-tel:hover{opacity:.9;}

/* 相关案例 */
.case-detail-related{padding:64px 0 80px;background:var(--fq-light);}
.case-detail-related .related-grid{
    display:flex;
    flex-wrap:wrap;
    gap:24px;
    margin-top:40px;
}
.case-detail-related .related-card{
    flex:0 0 calc(25% - 18px);
    background:#fff;
    overflow:hidden;
    transition:box-shadow .3s,transform .3s;
}
.case-detail-related .related-card:hover{
    box-shadow:0 8px 24px rgba(0,0,0,.08);
    transform:translateY(-4px);
}
.case-detail-related .related-card a{display:block;}
.case-detail-related .related-card img{
    width:100%;
    height:160px;
    object-fit:cover;
    display:block;
}
.case-detail-related .related-card .card-info{padding:16px;}
.case-detail-related .related-card h4{
    font-size:14px;
    font-weight:500;
    color:#333;
    line-height:1.5;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}
.case-detail-related .related-card:hover h4{color:var(--fq-red);}

@media(max-width:1000px){
    .case-detail-layout{flex-direction:column;}
    .case-detail-side{flex:none;width:100%;position:static;}
    .case-detail-related .related-card{flex:0 0 calc(50% - 12px);}
}

@media(max-width:768px){
    .case-detail-main{padding:32px 0 48px;}
    .case-detail-header h1{font-size:22px;}
    .case-detail-gallery .gallery-main img{max-height:280px;}
    .case-detail-nav{flex-direction:column;}
    .case-detail-related{padding:48px 0;}
    .case-detail-related .related-card{flex:0 0 100%;}
}