
/* ===== 皮肤 B：案例卡片版（对应 ltd.com/case 15 页） ===== */
.skin-showcase{background:var(--sc-bg);color:var(--navy)}
.skin-showcase .grid-wrap{width:min(var(--sc),calc(100% - 32px));margin:0 auto}
.skin-showcase .page-head{padding:28px 0 10px}
.skin-showcase .page-title{color:var(--navy);font-size:clamp(28px,3.4vw,46px);font-weight:950;line-height:1.18}
.skin-showcase .page-subtitle,.skin-showcase .page-subline{color:var(--text)}
.hero-band{position:relative;overflow:hidden;padding:clamp(28px,4vw,46px) 0 clamp(34px,5vw,60px);background:linear-gradient(180deg,#eef7ff 0%,rgba(238,247,255,.55) 55%,rgba(244,247,251,0) 100%)}
.hero-band:before,.hero-band:after{content:"";position:absolute;border-radius:50%;filter:blur(60px);opacity:.5}
.hero-band:before{width:520px;height:520px;left:-140px;top:-160px;background:#cfe6ff}
.hero-band:after{width:420px;height:420px;right:-120px;top:-80px;background:#dbeafe}
.hero-inner{position:relative;z-index:2;width:min(var(--sc),calc(100% - 32px));margin:0 auto;text-align:center}
.filters{display:grid;grid-template-columns:repeat(2,minmax(0,240px));gap:12px;justify-content:center;margin:22px auto 0}
.sc-section-head{width:min(var(--sc),calc(100% - 32px));margin:6px auto 18px;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.sc-section-head h2{margin:0;color:var(--navy);font-size:clamp(22px,2.4vw,30px);font-weight:950}
.sc-section-head span{color:var(--text);font-size:14px}
.sc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.2vw,28px)}
.sc-card{display:flex;flex-direction:column;border-radius:var(--radius-card);background:#fff;box-shadow:0 18px 40px -18px rgba(13,126,234,.28),0 0 0 1px rgba(229,242,255,.9);overflow:hidden;cursor:pointer;transition:transform .5s cubic-bezier(.25,.8,.25,1),box-shadow .5s}
.sc-card:hover{transform:translateY(-8px);box-shadow:0 25px 50px -12px rgba(13,126,234,.15),0 0 0 1px rgba(13,126,234,.1)}
.sc-shot{position:relative;padding:14px 14px 0;background:linear-gradient(180deg,#eaf4ff,#f7fbff)}
.sc-bar{display:flex;gap:5px;padding:0 4px 9px}
.sc-bar i{width:8px;height:8px;border-radius:50%;background:#c7dcf2}
.sc-bar i:nth-child(1){background:#ff6058}.sc-bar i:nth-child(2){background:#ffbd2e}.sc-bar i:nth-child(3){background:#28c840}
.sc-cover{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top center;border-radius:12px 12px 0 0;background:#fff;box-shadow:0 -1px 0 rgba(7,59,114,.06) inset}
.sc-body{position:relative;margin-top:-26px;padding:20px 22px 22px;background:#fff;border-radius:22px 22px 0 0;flex:1;display:flex;flex-direction:column;gap:9px}
.sc-pill{align-self:flex-start;padding:4px 12px;border-radius:999px;background:rgba(13,126,234,.1);color:var(--primary);font-size:12px;font-weight:800}
.sc-title{margin:0;color:var(--navy);font-size:17px;font-weight:900;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sc-cat{margin:0;color:var(--text);font-size:12.5px}
.sc-desc{flex:1;margin:0;color:var(--text);font-size:13px;line-height:1.8;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.sc-link{display:inline-flex;align-items:center;gap:6px;margin-top:4px;color:var(--primary);font-size:13px;font-weight:800}
.sc-link:hover{color:var(--primary-hover)}
.sc-floating{position:fixed;right:22px;bottom:96px;z-index:50;display:grid;gap:10px;padding:14px;border-radius:20px;background:rgba(255,255,255,.95);box-shadow:0 20px 40px -10px rgba(0,0,0,.12);border:1px solid rgba(229,242,255,.9);text-align:center}
.sc-floating img{width:96px;height:96px;border-radius:12px}
.sc-floating small{display:block;color:var(--text);font-size:12px;margin-top:6px}
.sc-floating a{margin-top:8px;padding:10px 16px;border-radius:999px;background:#7c3aed;color:#fff;font-size:13px;font-weight:800}
@media (max-width:1024px){.sc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sc-floating{display:none}}
@media (max-width:680px){.sc-grid{grid-template-columns:minmax(0,1fr)}.filters{grid-template-columns:minmax(0,1fr)}}
