/* ===== 皮肤 A：案例库网格版（对应 saaas.com 97 页案例库） ===== */
.skin-grid{background:#fff}
.skin-grid .grid-wrap{width:min(var(--shell),calc(100% - 48px));margin:0 auto}
.grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.card{position:relative;display:flex;flex-direction:column;gap:8px;min-height:228px;padding:14px;border:0;border-radius:8px;background:#fff;box-shadow:inset 0 0 0 1px rgba(31,45,61,.08);cursor:pointer;transition:box-shadow .28s ease,transform .28s ease}
.card:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1px rgba(31,45,61,.16),0 14px 30px rgba(31,45,61,.1)}
.card-head{display:flex;align-items:center;min-height:46px}
.card-logo{max-width:180px;max-height:46px;width:auto;height:auto;object-fit:contain;transition:transform .24s ease}
.card:hover .card-logo{transform:scale(.96)}
.card-tags{display:flex;flex-wrap:wrap;gap:6px;min-height:20px}
.card-title{margin:0;font-size:15px;font-weight:700;line-height:1.45;color:var(--ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card-desc{flex:1;margin:0;color:#64748b;font-size:12px;line-height:1.7;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.card-url{display:inline-flex;align-items:center;gap:6px;max-width:100%;color:#425466;font-size:12px}
.card-url span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.card-url:hover{color:var(--brand-dark)}
.card-url:hover span{text-decoration:underline;text-underline-offset:3px}
.card-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:8px;border-top:1px dashed rgba(31,45,61,.1);color:var(--muted);font-size:12px}
.card-foot .ind{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.card-foot .go{color:var(--brand-dark);font-weight:700;white-space:nowrap}
.corner{position:absolute;top:10px;right:10px;padding:2px 8px;border-radius:999px;background:rgba(61,133,198,.12);color:var(--brand-dark);font-size:10px;font-weight:700}
.empty{grid-column:1/-1;padding:60px 0;text-align:center;color:var(--muted);font-size:15px}

/* 服务商列表视图（可选） */
.company-list{display:grid;gap:8px;width:min(var(--shell),calc(100% - 48px));margin:0 auto}
.company-item{display:grid;grid-template-columns:150px minmax(0,1fr) minmax(120px,200px);gap:14px;align-items:center;min-height:62px;padding:12px 16px;border-radius:8px;background:#fff;box-shadow:inset 0 0 0 1px rgba(31,45,61,.08);cursor:pointer;transition:box-shadow .22s ease}
.company-item:hover{box-shadow:inset 0 0 0 1px rgba(31,45,61,.18),0 10px 24px rgba(31,45,61,.07)}
.company-name{font-size:15px;font-weight:700;color:var(--ink)}
.company-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:5px}
.company-site{color:var(--muted);font-size:13px;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

@media (max-width:1280px){.grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:1024px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:768px){.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.card-desc{-webkit-line-clamp:3}}
@media (max-width:520px){
  .grid{grid-template-columns:minmax(0,1fr)}
  .company-item{grid-template-columns:1fr}
  .company-site{text-align:left}
}