.chroma-grid{grid-template-columns:repeat(var(--cols,3), 1fr);box-sizing:border-box;grid-auto-rows:auto;gap:.625rem;width:100%;display:grid;position:relative}@media (max-width:768px){.chroma-grid{grid-template-columns:repeat(2,1fr);gap:.5rem}}@media (max-width:480px){.chroma-grid{grid-template-columns:1fr;gap:.75rem}}.chroma-card{background:var(--card-gradient);cursor:pointer;--mouse-x:-9999px;--mouse-y:-9999px;border:1px solid #2d2926e6;border-radius:.75rem;flex-direction:column;width:100%;height:auto;transition:border-color .4s;display:flex;position:relative;overflow:hidden}.chroma-card:hover{border-color:#b5843a73}.chroma-card:before{content:"";z-index:2;pointer-events:none;background:radial-gradient(ellipse 75% 55% at var(--mouse-x) var(--mouse-y), #b5843a2e, transparent 70%);transition:opacity .4s;position:absolute;inset:0}.chroma-img-wrapper{aspect-ratio:4/3;width:100%;position:relative;overflow:hidden}.chroma-img{object-fit:cover;object-position:center;width:100%;height:100%;transition:transform .6s cubic-bezier(.16,1,.3,1);display:block;position:absolute;inset:0}.chroma-card:hover .chroma-img{transform:scale(1.05)}.chroma-info{z-index:1;color:#f5f0e8e6;flex-direction:column;gap:.2rem;padding:.75rem 1rem .875rem;display:flex;position:relative}.chroma-info .chroma-category{font-family:var(--font-sans), "DM Sans", system-ui, sans-serif;letter-spacing:.22em;text-transform:uppercase;color:var(--card-border);opacity:.85;font-size:.48rem}.chroma-info .chroma-name{font-family:var(--font-display), "Cormorant Garamond", Georgia, serif;color:#f5f0e8eb;margin:0;font-size:clamp(.9rem,1.4vw,1.1rem);font-style:italic;font-weight:400;line-height:1.2}.chroma-info .chroma-ref{font-family:var(--font-sans), "DM Sans", system-ui, sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#f5f0e859;font-size:.5rem}