.chroma-grid{grid-template-columns:repeat(var(--cols),minmax(0,1fr));--x:50%;--y:50%;--r:200px;--cols:5;gap:.75rem;width:100%;height:100%;padding:1rem;display:grid;position:relative}@media (max-width:1124px){.chroma-grid{--cols:4}}@media (max-width:768px){.chroma-grid{--cols:3}}@media (max-width:480px){.chroma-grid{--cols:1}}.chroma-card{background:var(--card-gradient);will-change:filter;filter:grayscale();border:1px solid #333;border-radius:20px;flex-direction:column;width:100%;max-width:320px;margin-left:auto;margin-right:auto;transition:border-color .3s;display:flex;position:relative;overflow:hidden}.chroma-card:hover{border-color:var(--card-border);filter:grayscale(0)}.chroma-img-wrapper{padding:10px}.chroma-img-wrapper img{object-fit:cover;border-radius:10px;width:100%;height:100%}.chroma-info{color:#fff;flex-direction:column;gap:3px;padding:.75rem 1rem;display:flex}.chroma-card:hover:before{opacity:1}