.tpcc-grid{display:grid;gap:var(--tp-gap,16px)}
@media (min-width:1024px){.tpcc-grid{grid-template-columns:repeat(var(--tp-cols-d,3),1fr)}}
@media (min-width:640px) and (max-width:1023.98px){.tpcc-grid{grid-template-columns:repeat(var(--tp-cols-t,2),1fr)}}
@media (max-width:639.98px){.tpcc-grid{grid-template-columns:repeat(var(--tp-cols-m,1),1fr)}}
.tpcc-card{display:block;position:relative;border-radius:16px;overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.25);transform:translateZ(0);}
.tpcc-media{position:relative}
.tpcc-media::before{content:"";display:block;padding-top:var(--tp-aspect,56.25%);}
.tpcc-media img,.tpcc-noimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tpcc-noimg{display:flex;align-items:center;justify-content:center;background:#222;color:#999;font-size:12px}
.tpcc-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 40%,rgba(0,0,0,.65) 100%);opacity:.9;transition:opacity .3s}
.tpcc-title{position:absolute;left:16px;bottom:14px;color:#fff;font-weight:700;font-size:18px;line-height:1.2;text-shadow:0 1px 12px rgba(0,0,0,.45)}
.tpcc-badge{position:absolute;top:12px;left:12px;background:rgba(255,215,0,.92);color:#000;font-weight:700;font-size:12px;padding:6px 10px;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,.25)}
.tpcc-card:hover .tpcc-overlay{opacity:1}
.tpcc-card:hover img{transform:scale(1.05);transition:transform .35s ease}