.kbd-card{display:flex;flex-direction:column;position:relative;text-decoration:none;color:inherit;font-family:var(--kbd-font-body)}.kbd-card__media{position:relative;aspect-ratio:1 / 1;overflow:hidden;background:var(--kbd-surface-inset);border:var(--kbd-border-width-hairline) solid var(--kbd-border-hairline);border-radius:var(--kbd-radius-xs);margin-bottom:var(--kbd-space-sm);transition:border-color var(--kbd-duration-base) var(--kbd-ease-standard)}.kbd-card__media img{width:100%;height:100%;object-fit:contain;object-position:center;display:block}.kbd-card:hover .kbd-card__media{border-color:var(--kbd-accent)}.kbd-card__badge{position:absolute;top:var(--kbd-space-xs);left:var(--kbd-space-xs);z-index:var(--kbd-z-raised);display:inline-block;padding:5px 10px;border-radius:var(--kbd-radius-sm);background:var(--kbd-accent-deep);color:var(--kbd-text-on-accent);font-size:var(--kbd-text-3xs);font-weight:var(--kbd-weight-bold);letter-spacing:var(--kbd-tracking-caps);text-transform:uppercase;line-height:1;pointer-events:none}.kbd-card__badge--off{left:auto;right:var(--kbd-space-xs);background:var(--kbd-accent-deep)}.kbd-card__rating{display:flex;align-items:center;gap:6px;margin-bottom:6px;line-height:1}.kbd-card__rating .kbd-stars{display:inline-flex;gap:1px;color:var(--kbd-accent)}.kbd-card__rating .kbd-stars svg{width:12px;height:12px}.kbd-card__rating-count{font-size:var(--kbd-text-2xs);color:var(--kbd-text-muted);letter-spacing:var(--kbd-tracking-normal)}.kbd-card .kbd-card__title{font-family:var(--kbd-font-heading);font-size:var(--kbd-text-lg);font-weight:var(--kbd-weight-regular);line-height:var(--kbd-leading-snug);letter-spacing:var(--kbd-tracking-normal);color:var(--kbd-text-strong);margin:0 0 6px}.kbd-card__swatches{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 var(--kbd-space-xs);padding:3px 0;line-height:1}.kbd-card__meta{display:flex;align-items:center;gap:var(--kbd-space-xs);margin-bottom:6px;font-size:var(--kbd-text-2xs);color:var(--kbd-text-muted);text-transform:uppercase;letter-spacing:var(--kbd-tracking-caps)}.kbd-card__colour{font-size:var(--kbd-text-2xs);color:var(--kbd-text-muted);text-transform:uppercase;letter-spacing:var(--kbd-tracking-caps);margin:0 0 6px}.kbd-card__price{display:flex;align-items:baseline;gap:var(--kbd-space-xs);margin-top:auto;padding-top:2px;font-size:var(--kbd-text-md);font-weight:var(--kbd-weight-medium);color:var(--kbd-text-strong)}.kbd-card__price-now.is-sale{color:var(--kbd-accent-deep)}.kbd-card__price-was{font-size:var(--kbd-text-xs);font-weight:var(--kbd-weight-regular);color:var(--kbd-text-faint);text-decoration:line-through}.kbd-card__quick-add{position:absolute;bottom:var(--kbd-space-xs);right:var(--kbd-space-xs);z-index:var(--kbd-z-raised);width:32px;height:32px;border:0;border-radius:var(--kbd-radius-pill);background:var(--kbd-accent);color:var(--kbd-accent-contrast);font-size:var(--kbd-text-lg);line-height:1;cursor:pointer;opacity:0;transition:opacity var(--kbd-duration-fast) var(--kbd-ease-standard)}.kbd-card:hover .kbd-card__quick-add,.kbd-card__quick-add:focus-visible{opacity:1}.kbd-card__quick-add:focus-visible{outline:2px solid var(--kbd-accent);outline-offset:2px}.kbd-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--kbd-space-md)}@media(min-width:900px){.kbd-card-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--kbd-space-xl)}.kbd-card-grid--essentials{grid-template-columns:repeat(3,minmax(0,1fr))}.kbd-card .kbd-card__title{font-size:var(--kbd-text-xl)}}@media(pointer:coarse){.kbd-card__quick-add{opacity:1}}@media(prefers-reduced-motion:reduce){.kbd-card__media,.kbd-card__quick-add{transition:none}}.section--ink .kbd-card .kbd-card__title,.section--ink .kbd-card__price,.section--ink .kbd-card__price-now.is-sale{color:var(--kbd-text-on-dark)}.section--ink .kbd-card__meta,.section--ink .kbd-card__colour,.section--ink .kbd-card__rating-count,.section--ink .kbd-card__price-was{color:var(--kbd-text-muted-dark)}.section--ink .kbd-card__media{border-color:var(--kbd-surface-raised-dark)}
/*# sourceMappingURL=/cdn/shop/t/7/assets/kbd-card.css.map */