.pc{position:relative;min-width:0;display:grid;grid-template-columns:1fr;grid-template-areas:"m" "t" "p"}.pc__media{grid-area:m;display:block;position:relative;background:var(--concrete);aspect-ratio:1 / 1;overflow:hidden}.pc__media img,.pc__media .placeholder{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;transition:opacity .35s}.pc__back{opacity:0}@media(hover:hover){.pc__media:hover .pc__back{opacity:1}.pc__media:has(.pc__back):hover .pc__front{opacity:0}}.pc__badge{position:absolute;top:10px;left:10px;z-index:2;background:var(--ink);color:#fff;font-size:12px;font-weight:700;padding:4px 8px}.pc__add{grid-area:m;align-self:end;justify-self:end;position:relative;z-index:2;margin:0 8px 8px 0;width:40px;height:40px;border:0;background:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 0 0 1px var(--line);padding:0}.pc__add:after{content:"";position:absolute;top:-2px;right:-2px;bottom:-2px;left:-2px}.pc__add .icon{width:18px;height:18px;stroke-width:2}.pc__add:hover{background:var(--ember)}.pc__add[disabled]{opacity:.4;cursor:not-allowed}.pc__add[aria-busy=true]{opacity:.6;cursor:progress}.pc__title{grid-area:t;font-size:14px;font-weight:600;margin:12px 0 2px;line-height:1.3}.pc__title a{text-decoration:none}.pc__title a:hover{text-decoration:underline;text-underline-offset:3px}.pc__price{grid-area:p;margin:0;font-size:14px;color:var(--graphite)}.swatches{display:flex;gap:4px;margin-top:6px;align-items:center}.swatches i{width:12px;height:12px;border-radius:50%;box-shadow:inset 0 0 0 1px #0000002e}.swatches small{font-size:12px;color:var(--graphite);margin-left:2px}.row{scroll-padding-inline:var(--g);display:grid;grid-auto-flow:column;grid-auto-columns:minmax(62%,1fr);gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 var(--g) 6px;margin:0 calc(var(--g) * -1);scrollbar-width:none}.row::-webkit-scrollbar{display:none}.row>*{scroll-snap-align:start}@media(min-width:760px){.row{grid-auto-columns:calc((100% - 3 * 16px) / 3.4);gap:16px}}@media(min-width:1100px){.row{grid-auto-columns:calc((100% - 4 * 16px) / 4.5)}}.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px 12px}@media(min-width:900px){.grid{grid-template-columns:repeat(4,1fr);gap:28px 16px}}
/*# sourceMappingURL=/cdn/shop/t/2/assets/component-product-card.css.map */
