.plan-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px; }
.plan-card { position:relative; display:flex; flex-direction:column; gap:6px; padding:22px; border-radius:var(--radius); border:1px solid var(--border); background:var(--card); cursor:pointer; transition:transform .35s cubic-bezier(.2,.7,.2,1), border-color .25s, box-shadow .25s; }
.plan-card:hover { transform:translateY(-4px); border-color:rgba(124,92,255,.5); }
.plan-card input { position:absolute; top:0; left:0; width:1px; height:1px; opacity:0; pointer-events:none; }
.plan-card.selected { border-color:var(--brand); box-shadow:0 0 0 3px rgba(124,92,255,.22); }
.plan-card strong { font-size:1rem; }
.plan-card .price { font-size:1.3rem; font-weight:700; letter-spacing:-.02em; margin-top:auto; padding-top:8px; }
.plan-card .muted { font-size:.82rem; }

.tpl-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:16px; }
.tpl-card { display:flex; flex-direction:column; border-radius:var(--radius); border:1px solid var(--border); background:var(--card); overflow:hidden; transition:transform .35s cubic-bezier(.2,.7,.2,1), border-color .35s, box-shadow .35s; }
.tpl-card:hover { transform:translateY(-5px); border-color:rgba(255,255,255,.19); box-shadow:0 24px 50px -30px #000; }
.tpl-shot { position:relative; aspect-ratio:16/10; background:linear-gradient(135deg,#7c5cff,#c084fc); overflow:hidden; }
.tpl-shot img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:top; }
.tpl-body { display:flex; flex-direction:column; gap:6px; padding:14px; flex:1; }
.tpl-body p { color:var(--muted); font-size:.82rem; }
.tpl-foot { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-top:auto; padding-top:10px; }
.tpl-foot .price { font-weight:700; }
.tpl-foot button { padding:8px 12px; font-size:.8rem; }
.tag { display:inline-block; font-size:.7rem; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:#c4b5ff; background:rgba(124,92,255,.14); padding:3px 8px; border-radius:999px; align-self:flex-start; }

.cart-bar { position:fixed; left:0; right:0; bottom:0; z-index:15; display:none; align-items:center; justify-content:space-between; gap:12px; padding:12px 22px; background:rgba(6,6,11,.9); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border-top:1px solid var(--border); }
.cart-bar.show { display:flex; }
.cart-bar.inline { position:static; margin-top:16px; padding:14px 16px; border:1px solid var(--border); border-radius:var(--radius); background:var(--card); backdrop-filter:none; -webkit-backdrop-filter:none; }
.cart-bar-info { display:flex; flex-direction:column; min-width:0; }
.cart-bar-info strong { font-size:1rem; }
.cart-bar-info small { color:var(--muted); font-size:.78rem; }

@media (max-width:560px) {
  .tpl-grid { grid-template-columns:1fr 1fr; gap:10px; }
  .tpl-body { padding:10px; }
  .tpl-foot { flex-direction:column; align-items:stretch; }
  .cart-bar { padding:10px 14px; }
}
@media (max-width:380px) {
  .tpl-grid { grid-template-columns:1fr; }
}
