/* ============================================================
   sections-cases.css — 成功案例板块专用样式
   适用 widget：cases_home / cases_featured_list / cases_featured_detail / cases_clients
   设计基准：Figma 桌面端-成功案例 #240:18447（1440 画板 / 1200 内容区）
   类名前缀 .xy-cases-；依赖 style.css：--xy-* 变量、.xy-container、.xy-pg-grid、.xy-side-*
   ============================================================ */

/* ---------- 页面容器：内页灰底 ---------- */
.xy-cases-page { background: var(--xy-gray-bg); padding: 0 0 60px; }
.xy-cases-page a { text-decoration: none; }

/* ---------- 区块标题（精选案例 / 合作客户）：32px 标题 + 橙线60x3 + 副标题 ---------- */
.xy-cases-page .xy-cases-sec-hd { text-align: center; margin: 0 0 26px; }
.xy-cases-page .xy-cases-sec-hd h2 { font-size: 32px; line-height: 40px; font-weight: 500; color: rgba(0, 0, 0, .75); margin: 0; }
.xy-cases-page .xy-cases-sec-hd .line { display: block; width: 60px; height: 3px; margin: 16px auto 0; background: var(--xy-primary); }
.xy-cases-page .xy-cases-sec-hd p { font-size: 14px; line-height: 24px; font-weight: 350; color: rgba(0, 0, 0, .75); margin: 10px 0 0; }

/* ================= 首页：精选案例（Figma 卡片 285x420，4 列 gap20） ================= */
.xy-cases-home .xy-cases-sec { padding-top: 26px; }
.xy-cases-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.xy-cases-card { position: relative; display: block; height: 420px; background: #fff; border: 1px solid rgba(0, 0, 0, .15); border-radius: 8px; overflow: hidden; transition: box-shadow .3s, transform .3s; }
.xy-cases-card:hover { box-shadow: 0 12px 28px rgba(0, 0, 0, .14); transform: translateY(-4px); }
.xy-cases-card .cl { display: block; padding: 24px 26px 0; font-size: 20px; line-height: 28px; font-weight: 400; color: var(--xy-primary); }
.xy-cases-card .ds { display: block; position: relative; margin: 5px 26px 0; height: 1px; background: rgba(0, 0, 0, .25); }
.xy-cases-card .ds i { position: absolute; left: 0; top: 0; width: 80px; height: 1px; background: var(--xy-primary); }
.xy-cases-card .desc { display: block; padding: 15px 26px 0; height: 69px; font-size: 12px; line-height: 18px; font-weight: 350; color: #787878; overflow: hidden; }
.xy-cases-card .pic { display: block; margin: 14px 26px 0; height: 140px; border-radius: 4px; overflow: hidden; }
.xy-cases-card .pic .im { display: block; width: 100%; height: 100%; background: center/cover no-repeat; transition: transform .4s; }
.xy-cases-card:hover .pic .im { transform: scale(1.06); }
.xy-cases-card .logo { display: block; margin-top: 35px; text-align: center; }
.xy-cases-card .logo img { width: 139px; height: 31px; }
.xy-cases-card .go { position: absolute; right: 26px; bottom: 22px; width: 28px; height: 28px; transition: transform .3s; }
.xy-cases-card .go img { width: 100%; height: 100%; display: block; }
.xy-cases-card:hover .go { transform: translateX(4px); }

/* ---------- 更多按钮（更多案例 / 更多客户）：135x42 白底橙描边 + 橙色圆箭头 ---------- */
.xy-cases-more { position: relative; display: flex; width: 135px; height: 42px; align-items: center; justify-content: center; gap: 5px; margin: 32px auto 0; border: 1px solid var(--xy-primary); border-radius: 21px; background: transparent; color: var(--xy-primary); font-size: 14px; line-height: 1; transition: all .3s; }
.xy-cases-more .arr { display: block; width: 28px; height: 28px; margin-right: -10px; transition: transform .3s; }
.xy-cases-more .arr img { width: 100%; height: 100%; display: block; }
.xy-cases-more:hover { background: #FFF4E5; }
.xy-cases-more:hover .arr { transform: translateX(3px); }

/* ================= 首页：合作客户区（1440 全宽背景图 717 高） ================= */
.xy-cases-home .xy-cases-clients-sec { position: relative; margin-top: 60px; padding: 33px 0 38px; overflow: hidden; }
.xy-cases-home .xy-cases-clients-sec .bg { position: absolute; inset: 0; background: center/cover no-repeat; opacity: .25; pointer-events: none; }
.xy-cases-home .xy-cases-clients-sec .xy-container { position: relative; z-index: 1; }

/* ---------- tab 胶囊（800x42：边框#CCC 圆角35 底rgba(204,204,204,.15)，7 等分 113.31） ---------- */
.xy-cases-clients-tabs { display: flex; width: 800px; height: 42px; margin: 0 auto 30px; border: 1px solid #CCC; border-radius: 21px; background: rgba(204, 204, 204, .15); }
.xy-cases-clients-tabs a { flex: 1 1 0; display: flex; align-items: center; justify-content: center; margin: 2px 0; border-radius: 19px; font-size: 13px; font-weight: 350; color: #000; transition: all .3s; }
.xy-cases-clients-tabs a:hover { color: var(--xy-primary); }
.xy-cases-clients-tabs a.on, .xy-cases-clients-tabs a.on:hover { background: var(--xy-primary); color: #fff; font-weight: 500; }

/* ---------- logo 墙：全部 = Figma 整图（首页 1200x364 / 独立页 1200x1905） ---------- */
.xy-cases-wall-img { width: 1200px; height: 364px; margin: 0 auto; background: center/contain no-repeat; }

/* ---------- logo 墙：分类筛选文字墙（6 列） ---------- */
.xy-cases-wall { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; }
.xy-cases-cli { height: 64px; padding: 0 12px; background: #fff; border: 1px solid rgba(0, 0, 0, .08); border-radius: 6px; display: flex; align-items: center; justify-content: center; gap: 9px; transition: border-color .3s, box-shadow .3s; animation: xyCasesIn .4s both; }
.xy-cases-cli:hover { border-color: var(--xy-primary); box-shadow: 0 6px 16px rgba(255, 138, 0, .15); }
.xy-cases-cli .em { flex: 0 0 30px; width: 30px; height: 30px; border-radius: 50%; color: #fff; font-size: 13px; font-weight: 600; display: flex; align-items: center; justify-content: center; }
.xy-cases-cli .nm { font-size: 13px; line-height: 18px; color: var(--xy-text-75); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@keyframes xyCasesIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* ================= 合作客户独立页 ================= */
/* 页面 tabs：叠在 inner_banner 渲染的 .xy-crumb 46px 白条右端（同服务支持 xy-page-tabs 模式） */
.xy-cases-clients-page { padding: 0 0 46px; }
.xy-cases-clients-page .xy-page-tabs { position: relative; z-index: 2; height: 46px; margin-top: -46px; display: flex; justify-content: flex-end; align-items: center; padding: 0; }
.xy-cases-clients-page .xy-page-tabs a { position: relative; margin-left: 33px; padding: 4px 2px 12px; font-size: 14px; line-height: 22px; color: rgba(0, 0, 0, .65); transition: color .25s; }
.xy-cases-clients-page .xy-page-tabs a + a::before { content: ''; position: absolute; left: -17px; top: 50%; transform: translateY(-50%); width: 1px; height: 13px; background: #DDD; }
.xy-cases-clients-page .xy-page-tabs a:hover, .xy-cases-clients-page .xy-page-tabs a.on { color: var(--xy-primary); }
.xy-cases-clients-page .xy-page-tabs a.on::after { content: ''; position: absolute; left: 50%; transform: translateX(-50%); bottom: 4px; width: 25px; height: 1.5px; border-radius: 1px; background: var(--xy-primary); }
.xy-cases-clients-page .xy-cases-sec-hd { margin: 25px 0 26px; }
.xy-cases-clients-page .xy-cases-wall-img { height: auto; aspect-ratio: 1200 / 1905; }

/* ================= 精选案例列表（Figma #241:22753） ================= */
/* 页标题：40/48 Medium 黑75% 居中 + 橙线60x3 + 副标题16/24 */
.xy-cases-list-hd { text-align: center; margin: 25px 0 26px; }
.xy-cases-list-hd h2 { font-size: 40px; line-height: 48px; font-weight: 500; color: rgba(0, 0, 0, .75); margin: 0; }
.xy-cases-list-hd .line { display: block; width: 60px; height: 3px; margin: 8px auto 0; background: var(--xy-primary); }
.xy-cases-list-hd p { font-size: 16px; line-height: 24px; font-weight: 350; color: rgba(0, 0, 0, .75); margin: 7px 0 0; }

/* ---------- 条目卡 834x205 r12 边框黑15%：徽章SVG130x111 垂直居中，内容区 左200/右24/上24 ---------- */
.xy-cases-list-item { position: relative; display: block; height: 205px; background: #fff; border: 1px solid rgba(0, 0, 0, .15); border-radius: 12px; transition: box-shadow .3s, transform .3s; }
.xy-cases-list-item + .xy-cases-list-item { margin-top: 25px; }
.xy-cases-list-item:hover { box-shadow: 0 12px 28px rgba(0, 0, 0, .13); transform: translateY(-2px); }
.xy-cases-list-item .xy-cases-badge { position: absolute; left: 25px; top: 50%; transform: translateY(-50%); width: 130px; height: 111px; }
.xy-cases-li-main { display: block; height: 157px; margin: 24px 24px 0 200px; }
.xy-cases-li-hd { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.xy-cases-li-hd h3 { flex: 1; min-width: 0; font-size: 18px; line-height: 28px; font-weight: 700; color: var(--xy-primary); margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.xy-cases-li-cbtn { flex: 0 0 80px; width: 80px; height: 28px; line-height: 26px; text-align: center; background: #FEF1E0; border: 1px solid var(--xy-primary); border-radius: 0 9px 0 9px; color: var(--xy-primary); font-size: 12px; white-space: nowrap; transition: all .3s; }
.xy-cases-list-item:hover .xy-cases-li-cbtn { background: var(--xy-primary); color: #fff; }
.xy-cases-li-line { display: block; width: 72px; height: 3px; margin-top: 13px; background: var(--xy-primary); }
.xy-cases-li-desc { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; height: 44px; font-size: 14px; line-height: 22px; font-weight: 400; color: rgba(0, 0, 0, .6); margin: 10px 0 0; }
.xy-cases-li-bt { position: relative; display: flex; align-items: center; margin-top: 13px; }
.xy-cases-li-date { flex: 0 0 auto; font-size: 14px; line-height: 22px; font-weight: 350; color: rgba(0, 0, 0, .5); margin-right: 18px; }
.xy-cases-li-bt .tag { height: 24px; line-height: 24px; padding: 0 11px; background: rgba(0, 0, 0, .05); border-radius: 3px; color: rgba(0, 0, 0, .5); font-size: 12px; line-height: 24px; }
.xy-cases-li-bt .tag + .tag { margin-left: 10px; }
.xy-cases-li-bt .arr { position: absolute; right: 0; top: 0; width: 24px; height: 24px; transition: transform .3s; }
.xy-cases-list-item:hover .arr { transform: translateX(4px); }

/* ---------- 列表分页：28x28 r3 #FEF1E0，active橙白，跳转到[输入]页+确定48x28橙 ---------- */
.xy-cases-pager { display: flex; align-items: center; justify-content: center; gap: 12px; margin-top: 30px; font-size: 12px; line-height: 18px; color: #000; }
.xy-cases-pager .pg { width: 28px; height: 28px; line-height: 28px; text-align: center; background: #FEF1E0; border-radius: 3px; color: #000; font-size: 12px; transition: all .3s; }
.xy-cases-pager .pg:hover { background: #FFE3C2; }
.xy-cases-pager .pg.on, .xy-cases-pager .pg.on:hover { background: var(--xy-primary); color: #fff; }
.xy-cases-pager .dots { color: #000; }
.xy-cases-pager .jump input { width: 28px; height: 28px; margin: 0 5px; padding: 0; border: none; outline: none; background: #FEF1E0; border-radius: 3px; text-align: center; font-size: 12px; color: #000; }
.xy-cases-pager .go { width: 48px; height: 28px; line-height: 28px; text-align: center; background: var(--xy-primary); border-radius: 3px; color: #fff; font-size: 12px; transition: background .3s; }
.xy-cases-pager .go:hover { background: #E67B00; color: #fff; }

/* ---------- 侧栏（本页 Figma 规格）：卡片 r12；标题16/24 500；热门排行 Bebas 01-05 ---------- */
.xy-cases-page .side-r .xy-wg { border-radius: 12px; }
.xy-cases-page .xy-side-hot .hd, .xy-cases-page .xy-side-rec .hd { padding: 29px 35px 4px; margin: 0; }
.xy-cases-page .xy-side-hot .hd .bar, .xy-cases-page .xy-side-rec .hd .bar { left: 35px; right: 35px; }
.xy-cases-page .xy-side-hot .hd b, .xy-cases-page .xy-side-rec .hd b { font-size: 16px; line-height: 24px; font-weight: 500; color: #000; }
.xy-cases-page .xy-side-hot .hd a, .xy-cases-page .xy-side-rec .hd a { color: var(--xy-primary); font-size: 12px; line-height: 18px; }
.xy-cases-page .xy-side-hot ul { padding: 8px 35px 10px; }
.xy-cases-page .xy-side-hot li { display: flex; align-items: center; gap: 20px; height: 58px; padding: 0; }
.xy-cases-page .xy-side-hot li + li { border-top: 1px solid rgba(0, 0, 0, .06); }
.xy-cases-page .xy-side-hot li .n { width: 26px; font-size: 32px; line-height: 28px; font-weight: 400; font-family: 'Bebas Neue', 'D-DIN Exp', DIN, sans-serif; background: none; border-radius: 0; }
.xy-cases-page .xy-side-hot li.rank-1 .n { color: #FF0000; }
.xy-cases-page .xy-side-hot li.rank-2 .n { color: var(--xy-primary); }
.xy-cases-page .xy-side-hot li.rank-3 .n { color: rgba(255, 138, 0, .7); }
.xy-cases-page .xy-side-hot li.rank-4 .n,
.xy-cases-page .xy-side-hot li.rank-5 .n { color: rgba(35, 24, 21, .3); }
.xy-cases-page .xy-side-hot li a h4 { height: 22px; line-height: 22px; font-weight: 350; color: #000; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.xy-cases-page .xy-side-hot li.rank-1 a h4 { color: #000; font-weight: 350; }
.xy-cases-page .xy-side-hot li a .d { display: block; font-size: 12px; line-height: 18px; color: rgba(0, 0, 0, .5); margin-top: 3px; }

/* ================= 精选案例详情（Figma #241:24065）：文章卡 834 r12 边框黑15% ================= */
.xy-cases-article { background: #fff; border: 1px solid rgba(0, 0, 0, .15); border-radius: 12px; padding: 42px 47px 34px; }
.xy-cases-art-title { font-size: 20px; line-height: 28px; font-weight: 400; color: var(--xy-primary); text-align: center; margin: 0; }
.xy-cases-art-meta { display: flex; align-items: center; justify-content: space-between; margin-top: 32px; padding-bottom: 12px; border-bottom: 1px solid rgba(0, 0, 0, .08); font-size: 12px; line-height: 18px; color: rgba(0, 0, 0, .45); }
.xy-cases-art-meta .v i { margin-right: 6px; opacity: .65; }
.xy-cases-abstract { margin-top: 30px; padding: 20px 24px; background: rgba(0, 0, 0, .04); border-radius: 6px; font-size: 14px; line-height: 26px; color: rgba(0, 0, 0, .75); }
.xy-cases-abstract b { color: #000; font-weight: 600; }
.xy-cases-fig { width: 440px; height: 260px; margin: 30px auto; border-radius: 6px; overflow: hidden; }
.xy-cases-fig .im { width: 100%; height: 100%; background: center/cover no-repeat; }
.xy-cases-body { font-size: 14px; line-height: 24px; color: rgba(0, 0, 0, .75); }
.xy-cases-body h3 { font-size: 15px; line-height: 24px; font-weight: 700; color: #000; margin: 20px 0 8px; }
.xy-cases-body p { margin: 0 0 10px; }
.xy-cases-body ul { margin: 0 0 10px; padding-left: 22px; list-style: disc; }
.xy-cases-body ul li { margin-bottom: 4px; }

/* ---------- 详情：右对齐 编辑/分享栏 + 分隔线 + 上一篇/下一篇 ---------- */
.xy-cases-share { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; margin-top: 30px; }
.xy-cases-share .ed { font-size: 12px; line-height: 18px; color: rgba(0, 0, 0, .45); }
.xy-cases-share .row { display: flex; align-items: center; gap: 8px; }
.xy-cases-share .row em { font-style: normal; font-size: 14px; line-height: 22px; color: rgba(0, 0, 0, .45); margin-right: 4px; }
.xy-cases-share .ic { width: 22px; height: 22px; border-radius: 50%; color: #fff; font-size: 12px; display: flex; align-items: center; justify-content: center; transition: all .3s; }
.xy-cases-share .ic:hover { transform: translateY(-3px); opacity: .85; }
.xy-cases-share .ic-wx { background: #07C160; }
.xy-cases-share .ic-wb { background: #E6162D; }
.xy-cases-share .ic-qq { background: #12B7F5; }
.xy-cases-share .ic-li { background: #0A66C2; }
.xy-cases-share .ic-fb { background: #1877F2; }
.xy-cases-share .ic-x  { background: #000000; }

/* 案例详情侧栏人员介绍 */
.xy-cases-detail-page .xy-side-consult .txt h4 { font-size: 18px; line-height: 26px; color: var(--xy-dark); margin: 0 0 6px; }
.xy-cases-detail-page .xy-side-consult .txt h4 small { font-size: 13px; color: var(--xy-primary); font-weight: 500; }
.xy-cases-detail-page .xy-side-consult .txt .intro {
    font-size: 13px; line-height: 20px; color: rgba(0, 0, 0, .65);
    margin: 0 0 10px; padding: 8px 0;
    border-top: 1px solid rgba(0, 0, 0, .05);
    border-bottom: 1px solid rgba(0, 0, 0, .05);
}

.xy-cases-adj { display: flex; flex-direction: column; gap: 14px; margin-top: 22px; padding-top: 22px; border-top: 1px solid rgba(0, 0, 0, .08); }
.xy-cases-adj a { font-size: 14px; line-height: 22px; font-weight: 350; color: #000; transition: color .3s; }
.xy-cases-adj a .lb { color: rgba(0, 0, 0, .45); margin-right: 0; }
.xy-cases-adj a:hover { color: var(--xy-primary); }

/* ---------- 简单响应式兜底 ---------- */
@media (max-width: 1240px) {
    .xy-cases-clients-tabs { width: 100%; }
    .xy-cases-wall-img { width: 100%; height: auto; aspect-ratio: 1200 / 364; }
}
@media (max-width: 992px) {
    .xy-cases-grid { grid-template-columns: repeat(2, 1fr); }
    .xy-cases-card { height: auto; padding-bottom: 60px; }
    .xy-cases-wall { grid-template-columns: repeat(3, 1fr); }
    .xy-cases-fig { height: 260px; }
    .xy-cases-article { padding: 24px 20px; }
}

/* ============================================================
   移动端适配（≤768px，Figma 移动端-成功案例 系列 #268:52597 总览 /
   #268:63005 精选列表 / #268:64563 案例内容 / #268:64934 合作客户）
   总览：精选卡 2 列 195×270（名 16/24 橙 / 简介 12/18 / 图 162×97 / logo 112×25）
   列表：卡 400×205 图左 110×110（徽章）+ 标题 16/24 橙 + 分割线 + 描述 14/22
        底行 合作案例角标 + 标签 + 日期
   详情：标题 20/28 Bold 橙居中 / 摘要框 rgba(0,0,0,.05) / 正文 16/24 两端对齐
   客户：格 4 列 白底橙描边直角 logo 高约 20
   ============================================================ */
@media (max-width: 768px) {
    .xy-cases-page { padding: 0 0 46px; }

    /* ---- 区块标题：20/28 Bold + 橙线 35×3 + 副题 12/18 ---- */
    .xy-cases-page .xy-cases-sec-hd { margin: 0 0 15px; }
    .xy-cases-page .xy-cases-sec-hd h2 { font-size: 20px; line-height: 28px; font-weight: 700; }
    .xy-cases-page .xy-cases-sec-hd .line { width: 35px; height: 3px; margin-top: 5px; }
    .xy-cases-page .xy-cases-sec-hd p { margin-top: 5px; font-size: 12px; line-height: 18px; }

    /* ---- 更多按钮：150×42 底 rgba(255,138,0,.15) r5，文字 16/24 ---- */
    .xy-cases-more { width: 150px; height: 42px; margin-top: 20px; background: rgba(255, 138, 0, .15); border-radius: 5px; font-size: 16px; }
    .xy-cases-more .arr { width: 24px; height: 24px; margin-right: -6px; }

    /* ================= 案例总览（xy-cases-home）：精选卡 2 列 195×270 ================= */
    .xy-cases-home .xy-cases-sec { padding-top: 16px; }
    .xy-cases-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .xy-cases-card { height: 270px; padding-bottom: 0; border: 0; border-radius: 8px; box-shadow: 0 0 5px rgba(0, 0, 0, .25); }
    .xy-cases-card .cl { padding: 15px 15px 0; font-size: 16px; line-height: 24px; font-weight: 500; }
    .xy-cases-card .ds { display: none; }
    .xy-cases-card .desc { padding: 11px 15px 0; height: 36px; font-size: 12px; line-height: 18px; }
    .xy-cases-card .pic { margin: 5px 15px 0; height: 97px; border-radius: 4px; }
    .xy-cases-card .logo { margin-top: 13px; }
    .xy-cases-card .logo img { width: 112px; height: 25px; }
    .xy-cases-card .go { display: none; }

    /* 总览页合作客户区：标题 → 4 列橙框墙（Figma #268:64934：格 87.5×31、2px #FF8A00 圆角5，
       列距 15.5 行距 18；后台图强制拉伸填满；设计稿无分类 tabs） */
    .xy-cases-home .xy-cases-clients-sec { margin-top: 26px; padding: 20px 0 26px; }
    .xy-cases-home .cats { display: none !important; }
    .xy-cases-home .xy-cwall-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: clamp(14px, 4.1vw, 18px) clamp(12px, 3.5vw, 15.5px) !important; padding: 0 !important; }
    /* 单元格比例锁死 87.5/31，白底橙描边圆角 5，logo 一律 fill 填满（客户反馈 #9） */
    .xy-cases-home .cli { height: auto !important; aspect-ratio: 87.5 / 31; padding: 0 !important;
        background: #FFFFFF; border: 2px solid var(--xy-primary) !important; border-radius: 5px !important;
        box-shadow: none !important; gap: 0; }
    .xy-cases-home .cli .logo { width: 100% !important; height: 100% !important; max-width: none; max-height: none;
        object-fit: fill; border-radius: 3px; }
    .xy-cases-home .cli .em { flex: 0 0 22px; width: 22px; height: 22px; font-size: 11px; }
    .xy-cases-home .cli .nm { font-size: 11px; }

    /* ================= 精选案例列表（xy-cases-list-page） ================= */
    /* 页标题：40/48 → 20/28 Bold + 橙线 35×3 + 副题 12/18 */
    .xy-cases-list-hd { margin: 16px 0 15px; }
    .xy-cases-list-hd h2 { font-size: 20px; line-height: 28px; font-weight: 700; }
    .xy-cases-list-hd .line { width: 35px; height: 3px; margin-top: 5px; }
    .xy-cases-list-hd p { margin-top: 5px; font-size: 12px; line-height: 18px; }

    /* 检索条（侧栏搜索卡）置于卡片上方 */
    .xy-cases-list-page .xy-pg-grid, .xy-cases-detail-page .xy-pg-grid { display: flex; flex-direction: column; }
    .xy-cases-list-page .xy-pg-grid > .side-r, .xy-cases-detail-page .xy-pg-grid > .side-r { order: -1; }
    .xy-cases-list-page .xy-side-search-wrap, .xy-cases-detail-page .xy-side-search-wrap { margin: 0 0 17px; }

    /* 条目卡：400×205 图左徽章 110×110 + 右文 + 底行角标/标签/日期 */
    .xy-cases-list-item { min-height: 205px; border: 0; border-radius: 8px; box-shadow: 0 0 5px rgba(0, 0, 0, .25); }
    .xy-cases-list-item + .xy-cases-list-item { margin-top: 16px; }
    .xy-cases-badge { left: 18px; top: 27px; width: 110px; height: 110px; transform: none; }
    .xy-cases-li-main { display: block; height: auto; margin: 24px 11px 44px 150px; }
    .xy-cases-li-hd { display: block; }
    .xy-cases-li-hd h3 { font-size: 16px; line-height: 24px; font-weight: 500; white-space: normal; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
    .xy-cases-li-line { width: 100%; height: 1px; margin-top: 6px; background: rgba(0, 0, 0, .12); }
    .xy-cases-li-desc { height: auto; margin-top: 8px; font-size: 14px; line-height: 22px; color: rgba(0, 0, 0, .5); -webkit-line-clamp: 3; }
    /* 底行横贯卡底：角标左下 + 标签 + 日期右下 */
    .xy-cases-li-cbtn { position: absolute; left: 9px; bottom: 9px; z-index: 1; width: 70px; height: 26px; line-height: 24px; border-radius: 0 5px 0 5px; font-size: 12px; }
    .xy-cases-li-bt { position: absolute; left: 87px; right: 11px; bottom: 9px; margin: 0; overflow: hidden; }
    .xy-cases-li-date { position: absolute; right: 0; bottom: 0; margin: 0; font-size: 12px; line-height: 26px; color: rgba(0, 0, 0, .5); }
    .xy-cases-li-bt .tag { height: 26px; padding: 0 10px; font-size: 12px; color: rgba(0, 0, 0, .4); }
    .xy-cases-li-bt .tag + .tag { margin-left: 6px; }
    .xy-cases-li-bt .arr { display: none; }

    /* 分页：紧凑居中 */
    .xy-cases-pager { flex-wrap: wrap; gap: 8px; margin-top: 24px; }

    /* ================= 案例详情（xy-cases-detail-page） ================= */
    .xy-cases-article { padding: 20px 20px 16px; border: 0; border-radius: 8px; box-shadow: 0 0 5px rgba(0, 0, 0, .25); }
    .xy-cases-art-title { font-size: 20px; line-height: 28px; font-weight: 700; }
    .xy-cases-art-meta { margin-top: 14px; padding-bottom: 12px; border-bottom: 1px solid rgba(204, 204, 204, .75); font-size: 12px; line-height: 18px; color: #787878; }
    .xy-cases-abstract { margin-top: 12px; padding: 10px; background: rgba(0, 0, 0, .05); border-radius: 5px; }
    .xy-cases-abstract b { font-size: 16px; line-height: 24px; font-weight: 500; color: rgba(0, 0, 0, .9); }
    .xy-cases-abstract { font-size: 14px; line-height: 22px; color: rgba(0, 0, 0, .75); text-align: justify; }
    .xy-cases-fig { width: 100%; height: 215px; margin: 16px auto; border-radius: 10px; }
    .xy-cases-body { font-size: 16px; line-height: 24px; color: rgba(0, 0, 0, .85); text-align: justify; }
    .xy-cases-body h3 { font-size: 18px; line-height: 28px; }
    .xy-cases-body img { max-width: 100%; height: auto; }
    .xy-cases-share { flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: space-between; margin-top: 20px; padding-top: 14px; border-top: 1px solid rgba(204, 204, 204, .75); }
    .xy-cases-adj { margin-top: 16px; padding-top: 14px; border-top: 1px solid rgba(204, 204, 204, .75); gap: 8px; }
    .xy-cases-adj a { font-size: 14px; line-height: 22px; }

    /* ================= 合作客户独立页（xy-cases-clients-page） ================= */
    /* 设计稿为分类下拉筛选；此处以可换行胶囊筛选组实现（保留全部 tab 功能）。
       DOM 顺序 tabs → 标题 → 整图墙 → 网格，用 flex order 调整为 标题 → 筛选 → 网格 */
    .xy-cases-clients-page .xy-cwall { display: flex; flex-direction: column; }
    .xy-cases-clients-page .xy-cwall .xy-cases-sec-hd { order: 1; margin: 16px 0 15px; }
    .xy-cases-clients-page .cats { order: 2; position: static; height: auto; margin: 0 0 15px; padding: 8px 10px; flex-wrap: wrap; justify-content: center; gap: 8px; background: #FFFFFF; border: .75px solid rgba(0, 0, 0, .15); border-radius: 3px; }
    .xy-cases-clients-page .cats a { flex: 0 0 auto; height: 30px; margin: 0; padding: 0 13px; border-radius: 15px; font-size: 13px; line-height: 30px; background: rgba(0, 0, 0, .05); color: rgba(0, 0, 0, .6); }
    .xy-cases-clients-page .cats a.on { background: var(--xy-primary); color: #FFF; font-weight: 500; }
    .xy-cases-clients-page .xy-cwall-allimg { display: none !important; }
    .xy-cases-clients-page .xy-cwall-grid { order: 3; display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: clamp(14px, 4.1vw, 18px) clamp(12px, 3.5vw, 15.5px) !important; padding: 0 !important; }
    /* 单元格比例锁死 87.5/31，白底橙描边圆角 5，logo 一律 fill 填满（客户反馈 #9） */
    .xy-cases-clients-page .cli { height: auto !important; aspect-ratio: 87.5 / 31; padding: 0 !important;
        background: #FFFFFF; border: 2px solid var(--xy-primary) !important; border-radius: 5px !important;
        box-shadow: none !important; gap: 0; }
    .xy-cases-clients-page .cli .logo { width: 100% !important; height: 100% !important; max-width: none; max-height: none;
        object-fit: fill; border-radius: 3px; }
    .xy-cases-clients-page .cli .em { flex: 0 0 22px; width: 22px; height: 22px; font-size: 11px; }
    .xy-cases-clients-page .cli .nm { font-size: 11px; }
}