.chroma-grid{box-sizing:border-box;--x:-9999px;--y:-9999px;--r:300px;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:.75rem;width:100%;max-width:1200px;margin:0 auto;padding:.5rem;display:grid;position:relative}.chroma-grid--photos{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:.5rem}@media (max-width:640px){.chroma-grid{grid-template-columns:1fr;padding:0}.chroma-grid--photos{grid-template-columns:repeat(2,1fr);gap:.375rem}}.chroma-card{background:var(--card-gradient,linear-gradient(145deg, #1a1a1a, #000));color:inherit;--mouse-x:50%;--mouse-y:50%;--spotlight-color:#ffffff40;border:1px solid #2a2a2a;border-radius:.75rem;flex-direction:column;text-decoration:none;transition:border-color .3s;display:flex;position:relative;overflow:hidden}.chroma-card:hover{border-color:var(--card-border,transparent)}.chroma-card:before{content:"";background:radial-gradient(circle at var(--mouse-x) var(--mouse-y), var(--spotlight-color), transparent 70%);pointer-events:none;opacity:0;z-index:1;transition:opacity .5s;position:absolute;inset:0}.chroma-card:hover:before{opacity:1}.chroma-img-wrapper{aspect-ratio:4/3;flex-shrink:0;position:relative;overflow:hidden}.chroma-grid--photos .chroma-img-wrapper{aspect-ratio:3/4}.chroma-img-wrapper img{object-fit:cover;filter:grayscale()brightness(.85);width:100%;height:100%;transition:filter .5s,transform .5s;display:block}.chroma-card:hover .chroma-img-wrapper img{filter:grayscale(0)brightness();transform:scale(1.04)}.chroma-info{z-index:1;color:#fff;flex-direction:column;gap:.2rem;padding:.75rem 1rem;display:flex;position:relative}.chroma-name{margin:0;font-size:.95rem;font-weight:600;line-height:1.3}.chroma-role{color:#999;text-transform:uppercase;letter-spacing:.05em;font-size:.8rem}@media (hover:none){.chroma-img-wrapper img{filter:none}.chroma-overlay,.chroma-fade{display:none}}.chroma-overlay{pointer-events:none;z-index:2;-webkit-backdrop-filter:grayscale()brightness(.75);-webkit-mask-image:radial-gradient(circle var(--r) at var(--x) var(--y), transparent 0%, transparent 15%, #0000001a 30%, #00000038 42%, #00000059 55%, #00000080 67%, #000000ad 80%, white 100%);mask-image:radial-gradient(circle var(--r) at var(--x) var(--y), transparent 0%, transparent 15%, #0000001a 30%, #00000038 42%, #00000059 55%, #00000080 67%, #000000ad 80%, white 100%);-webkit-mask-image:radial-gradient(circle var(--r) at var(--x) var(--y), transparent 0%, transparent 15%, #0000001a 30%, #00000038 42%, #00000059 55%, #00000080 67%, #000000ad 80%, white 100%);background:0 0;position:absolute;inset:0}.chroma-fade{pointer-events:none;z-index:3;-webkit-backdrop-filter:grayscale()brightness(.75);opacity:0;-webkit-mask-image:radial-gradient(circle var(--r) at var(--x) var(--y), white 0%, white 15%, #ffffffe6 30%, #ffffffc7 42%, #ffffffa6 55%, #ffffff80 67%, #ffffff52 80%, transparent 100%);mask-image:radial-gradient(circle var(--r) at var(--x) var(--y), white 0%, white 15%, #ffffffe6 30%, #ffffffc7 42%, #ffffffa6 55%, #ffffff80 67%, #ffffff52 80%, transparent 100%);-webkit-mask-image:radial-gradient(circle var(--r) at var(--x) var(--y), white 0%, white 15%, #ffffffe6 30%, #ffffffc7 42%, #ffffffa6 55%, #ffffff80 67%, #ffffff52 80%, transparent 100%);background:0 0;transition:opacity .25s;position:absolute;inset:0}