/* =============================================================
   零度星锋 · PC 装机助手 — 卡片组件样式（共享）
   适用页面：pc-assist / usb-boot / activate / os-download /
            software / nvidia / links
   说明：依赖 base.css 中的 CSS 变量；使用 flex/grid 自适应布局，
        无固定大宽度，移动端自动变为单列。
   ============================================================= */

/* ---------- 卡片网格（自动填充列数） ---------- */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px}

/* ---------- 卡片 ---------- */
.card{background:#fff;border:1px solid var(--border);border-radius:12px;padding:20px;display:flex;flex-direction:column;transition:box-shadow .2s,border-color .2s}
.card:hover{border-color:#bcd7f8;box-shadow:0 2px 10px rgba(0,119,255,.06)}
.card-head{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.card-head .ic{width:38px;height:38px;border-radius:10px;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700;flex-shrink:0}
.card-head .name{font-size:16px;font-weight:700;color:#2b2f36;flex:1;line-height:1.3}

/* 角标（推荐 / 官方 / 免费 / 付费 / 有广告） */
.badge{font-size:.7rem;font-weight:600;color:#8b5a00;background:#fff7e0;border:1px solid #ffd591;padding:1px 9px;border-radius:999px;white-space:nowrap}
.badge.free{color:#15803d;background:#e8f8ee;border-color:#bfe6ce}
.badge.paid{color:#b91c1c;background:#fdecec;border-color:#f3c1c1}
.badge.ad{color:#8b5a00;background:#fff7e0;border-color:#ffd591}

.card-desc{color:var(--text-2);font-size:.84rem;margin-bottom:14px}
.card-feat{font-size:.82rem;font-weight:700;color:#333;margin-bottom:6px}
.card ul{list-style:disc;padding-left:18px;margin-bottom:16px;color:#5a606a;font-size:.82rem;flex-grow:1}
.card ul li{margin-bottom:3px}
.card-btn{background:var(--blue);color:#fff;padding:8px 0;border-radius:8px;font-size:.85rem;font-weight:500;text-align:center;transition:background .2s;display:block}
.card-btn:hover{background:var(--blue-2)}

/* ---------- 卡片主题色（默认蓝 / 紫 / 青） ---------- */
.card.t-purple{background:#f2eeff;border-color:#d9cbf8}
.card.t-purple .ic{background:#7c4dff}
.card.t-purple .card-btn{background:#7c4dff}
.card.t-purple .card-btn:hover{background:#9a70ff}
.card.t-cyan{background:#e7f8fb;border-color:#bde8ef}
.card.t-cyan .ic{background:#12a8b8}
.card.t-cyan .card-btn{background:#12a8b8}
.card.t-cyan .card-btn:hover{background:#2ec1d1}
.card.t-blue{background:#e8f3ff;border-color:#bcd7f8}
.card.t-blue .ic{background:var(--blue)}
.card.t-blue .card-btn{background:var(--blue)}
.card.t-blue .card-btn:hover{background:var(--blue-2)}

/* ---------- 超小屏（≤480px）间距收紧 ---------- */
@media(max-width:480px){.content{padding:16px 12px 40px}.grid{gap:14px}}