.chroma-grid{--x:50%;--y:50%;--r:320px;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:16px;width:100%;display:grid;position:relative}.chroma-card{border:1px solid var(--line);color:inherit;transition:border-color .3s ease, transform .35s var(--ease), box-shadow .35s var(--ease);--mouse-x:50%;--mouse-y:50%;--spotlight-color:#d61f261f;background:#fff;border-radius:14px;flex-direction:column;text-decoration:none;display:flex;position:relative;overflow:hidden}.chroma-card:hover{border-color:var(--red);box-shadow:var(--shadow);transform:translateY(-3px)}.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:2;transition:opacity .5s;position:absolute;inset:0}.chroma-card:hover:before{opacity:1}.chroma-img-wrapper{z-index:1;aspect-ratio:16/10;background:var(--silver);position:relative;overflow:hidden}.chroma-img-wrapper img{object-fit:cover;width:100%;height:100%;transition:transform .6s var(--ease);display:block}.chroma-card:hover .chroma-img-wrapper img{transform:scale(1.04)}.chroma-img-wrapper .tag{z-index:2;letter-spacing:.08em;text-transform:uppercase;color:var(--ok);background:#fcfcfdf2;border-radius:999px;padding:6px 10px;font-size:12px;font-weight:700;position:absolute;top:12px;left:12px}.chroma-info{z-index:1;gap:8px;padding:18px 18px 20px;display:grid;position:relative}.chroma-info .name{font-family:var(--font-display);font-size:26px;font-weight:700;line-height:1.05}.chroma-info .role{color:var(--graphite);-webkit-line-clamp:3;-webkit-box-orient:vertical;font-size:15px;display:-webkit-box;overflow:hidden}.chroma-info .footer{justify-content:space-between;align-items:center;gap:10px;margin-top:6px;display:flex}.chroma-info .location{color:var(--muted);align-items:center;gap:6px;font-size:14px;font-weight:600;display:inline-flex}.chroma-info .cta{color:var(--red);align-items:center;gap:8px;font-weight:700;display:inline-flex}.chroma-info .cta svg{width:16px;height:16px;transition:transform .3s var(--ease)}.chroma-card:hover .cta svg{transform:translate(4px)}.chroma-overlay,.chroma-fade{display:none}@media (hover:hover) and (pointer:fine){.chroma-overlay{pointer-events:none;z-index:3;-webkit-backdrop-filter:grayscale()brightness(.985);-webkit-mask-image:radial-gradient(circle var(--r) at var(--x) var(--y), transparent 0%, transparent 15%, #0000001a 30%, #00000038 45%, #00000059 60%, #00000080 75%, #000000ad 88%, white 100%);mask-image:radial-gradient(circle var(--r) at var(--x) var(--y), transparent 0%, transparent 15%, #0000001a 30%, #00000038 45%, #00000059 60%, #00000080 75%, #000000ad 88%, white 100%);-webkit-mask-image:radial-gradient(circle var(--r) at var(--x) var(--y), transparent 0%, transparent 15%, #0000001a 30%, #00000038 45%, #00000059 60%, #00000080 75%, #000000ad 88%, white 100%);background:0 0;display:block;position:absolute;inset:0}.chroma-fade{pointer-events:none;z-index:4;-webkit-backdrop-filter:grayscale()brightness(.985);-webkit-mask-image:radial-gradient(circle var(--r) at var(--x) var(--y), white 0%, white 15%, #ffffffe6 30%, #ffffffc7 45%, #ffffffa6 60%, #ffffff80 75%, #ffffff52 88%, transparent 100%);mask-image:radial-gradient(circle var(--r) at var(--x) var(--y), white 0%, white 15%, #ffffffe6 30%, #ffffffc7 45%, #ffffffa6 60%, #ffffff80 75%, #ffffff52 88%, transparent 100%);-webkit-mask-image:radial-gradient(circle var(--r) at var(--x) var(--y), white 0%, white 15%, #ffffffe6 30%, #ffffffc7 45%, #ffffffa6 60%, #ffffff80 75%, #ffffff52 88%, transparent 100%);opacity:1;background:0 0;transition:opacity .25s;display:block;position:absolute;inset:0}}