.lodestar-colour-grid{background-color:var(--ink)}.lodestar-colour-grid__inner{max-width:var(--maxw);margin:0 auto;padding:60px 24px 30px}.lodestar-colour-grid__heading{margin:0 0 26px;font-family:var(--font-display);font-weight:700;font-size:32px;line-height:1.08;letter-spacing:.02em;color:var(--text)}.lodestar-colour-grid__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:14px}.lodestar-colour-card{display:flex;align-items:center;gap:13px;text-decoration:none;color:inherit;background-color:var(--surface);border:1px solid var(--border);border-radius:var(--r-card);padding:16px;transition:border-color var(--t-base) var(--ease),transform var(--t-snap) var(--ease)}.lodestar-colour-card__swatch{width:30px;height:30px;flex:none;border-radius:var(--r-btn);border:1px solid var(--border)}.lodestar-colour-card__swatch--red{background-color:var(--card-red)}.lodestar-colour-card__swatch--green{background-color:var(--card-green)}.lodestar-colour-card__swatch--blue{background-color:var(--card-blue)}.lodestar-colour-card__swatch--purple{background-color:var(--card-purple)}.lodestar-colour-card__swatch--black{background-color:var(--card-black)}.lodestar-colour-card__swatch--yellow{background-color:var(--card-yellow)}.lodestar-colour-card__text{display:flex;flex-direction:column;gap:4px}.lodestar-colour-card__name{font-family:var(--font-display);font-weight:600;font-size:16px;line-height:1;color:var(--text)}.lodestar-colour-card__sub{font-family:var(--font-body);font-size:12px;line-height:1.4;color:var(--muted)}.lodestar-colour-card:focus-visible{outline:2px solid var(--brass);outline-offset:2px}@media(hover:hover){.lodestar-colour-card:hover{border-color:var(--brass);transform:translateY(-3px)}}.lodestar-colour-card:active{transform:scale(.97)}@media screen and (max-width:749px){.lodestar-colour-grid__inner{padding:48px 16px 24px}.lodestar-colour-grid__heading{font-size:25px}}@media(prefers-reduced-motion:reduce){.lodestar-colour-card{transition:none}.lodestar-colour-card:hover,.lodestar-colour-card:active{transform:none}}
/*# sourceMappingURL=/cdn/shop/t/10/assets/lodestar-colour-grid.css.map */