/* ============================================================
   ai17.com.cn 首页「解决方案」板块 两栏改版样式
   配合 template/default/index.htm 中的板块 HTML 使用
   交互：CSS :target 锚点切换（点击左侧分类 → 右侧面板切换）
   无 JS 依赖，Destoon 模板引擎安全；后台新增分类后切换自动生效
   说明：左侧分类"选中高亮"依赖 :has()，若浏览器过旧（2023年前）
   高亮失效但不影响点击切换功能
   ============================================================ */

.hcpj-box{background:#fff;border:1px solid #e6edf5;border-radius:10px;padding:14px 14px 8px;box-shadow:0 2px 10px rgba(31,45,178,.05);}

.hcpj-body{display:flex;align-items:flex-start;}

/* 左栏：行业分类列表 */
.hcpj-left{width:196px;flex:none;border-right:1px solid #eef2f7;padding:2px 12px 2px 2px;}
.hcpj-left a.hcpj-cat{display:block;padding:9px 14px;border-radius:8px;cursor:pointer;font-size:14px;color:#33475b;margin-bottom:6px;background:#f5f9fc;transition:all .2s;text-decoration:none;}
.hcpj-left a.hcpj-cat:hover{background:#e8f1fa;color:#2b78d6;}
.hcpj-left .more{display:block;margin-top:10px;padding:9px 14px;border-radius:8px;font-size:13px;color:#2b78d6;text-align:center;text-decoration:none;background:#f5f9fc;border:1px dashed #bcd7f2;}
.hcpj-left .more:hover{background:#e8f1fa;}

/* 右栏：方案卡片区 */
.hcpj-right{flex:1;min-width:0;padding-left:14px;}
.hcpj-pane{display:none;flex-wrap:wrap;gap:12px;align-content:flex-start;scroll-margin-top:140px;}
.hcpj-pane.pane-all{display:flex;}              /* 默认显示全部（未点击分类时） */
.hcpj-pane:target{display:flex;}                /* 点击分类后只显示对应面板 */
.hcpj-pane:target ~ .pane-all{display:none;}    /* 选中分类时隐藏"全部"面板 */

/* 方案卡片：左图右文 */
.hcpj-card{display:flex;width:calc(50% - 6px);box-sizing:border-box;background:#fff;border:1px solid #eef1f5;border-radius:10px;padding:10px;transition:all .2s;}
.hcpj-card:hover{box-shadow:0 4px 14px rgba(42,99,214,.10);border-color:#cfe3f8;}
.hcpj-img{width:118px;height:92px;flex:none;border-radius:8px;overflow:hidden;background:#f5f8fb;}
.hcpj-img img{width:100%;height:100%;object-fit:cover;display:block;border:none;}
.hcpj-info{flex:1;min-width:0;padding-left:12px;display:flex;flex-direction:column;}
.hcpj-title{font-size:15px;font-weight:bold;color:#222;line-height:1.45;text-decoration:none;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-height:44px;}
.hcpj-title:hover{color:#2b78d6;}
.hcpj-tags{margin-top:6px;display:flex;align-items:center;flex-wrap:wrap;}
.hcpj-tag{display:inline-block;padding:2px 10px;border-radius:999px;font-size:12px;color:#fff;background:linear-gradient(135deg,#5b9ef0,#3a83d8);white-space:nowrap;}
.hcpj-company{margin-top:auto;padding-top:6px;font-size:13px;color:#8a94a3;line-height:1.5;overflow-wrap:break-word;}

/* 左侧分类"选中高亮"：:target + :has（新浏览器）。分类变动时在此追加/删除对应一行即可 */
.hcpj-box:has(#pane-all:target) .hcpj-left a[href="#pane-all"],
.hcpj-box:has(#pane-547:target) .hcpj-left a[href="#pane-547"],
.hcpj-box:has(#pane-548:target) .hcpj-left a[href="#pane-548"],
.hcpj-box:has(#pane-549:target) .hcpj-left a[href="#pane-549"],
.hcpj-box:has(#pane-550:target) .hcpj-left a[href="#pane-550"],
.hcpj-box:has(#pane-679:target) .hcpj-left a[href="#pane-679"],
.hcpj-box:has(#pane-680:target) .hcpj-left a[href="#pane-680"],
.hcpj-box:has(#pane-681:target) .hcpj-left a[href="#pane-681"],
.hcpj-box:has(#pane-686:target) .hcpj-left a[href="#pane-686"],
.hcpj-box:has(#pane-687:target) .hcpj-left a[href="#pane-687"],
.hcpj-box:has(#pane-688:target) .hcpj-left a[href="#pane-688"],
.hcpj-box:has(#pane-689:target) .hcpj-left a[href="#pane-689"],
.hcpj-box:has(#pane-855:target) .hcpj-left a[href="#pane-855"],
.hcpj-box:has(#pane-856:target) .hcpj-left a[href="#pane-856"]{
  background:linear-gradient(90deg,#2a78d6,#4a92dd);color:#fff;font-weight:bold;
}