.pcard{display:flex;flex-direction:column;min-width:0}.pcard__link{display:block;text-decoration:none}.pcard__media{position:relative;aspect-ratio:1 / 1;overflow:hidden;background-color:var(--hs-mist)}.pcard__image{width:100%;height:100%;object-fit:cover;transition:opacity var(--dur-slow) var(--ease),transform var(--dur-slow) var(--ease)}.pcard:hover .pcard__image{transform:scale(1.03)}.pcard__image--hover{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0}.pcard:hover .pcard__image--hover{opacity:1}.pcard__placeholder{width:100%;height:100%;background-color:var(--hs-sage-100);fill:var(--hs-sage-400)}.pcard__flag{position:absolute;inset-block-start:var(--space-2xs);inset-inline-start:var(--space-2xs);padding-block:.25rem;padding-inline:var(--space-2xs);background-color:var(--hs-white);color:var(--hs-ink);font-size:var(--text-xs);letter-spacing:var(--tracking-caps);text-transform:uppercase}.pcard__body{display:flex;flex-direction:column;gap:.1875rem;padding-block-start:var(--space-xs);padding-inline:var(--space-xs)}.pcard__title{margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.6em;font-family:var(--font-body);font-size:var(--text-sm);font-weight:var(--weight-medium);line-height:1.3;color:var(--color-foreground, var(--hs-ink))}.pcard__sub{margin:0;font-size:var(--text-sm);line-height:1.3;color:var(--color-foreground-muted, var(--hs-text-muted))}.pcard__title-link{text-decoration:none}.pcard__price{margin:0;display:flex;align-items:baseline;flex-wrap:wrap;gap:0 var(--space-2xs);margin-block-start:.1875rem;font-size:var(--text-sm);line-height:1.3;color:var(--color-foreground, var(--hs-ink))}.pcard__was{color:var(--color-foreground-muted, var(--hs-text-muted));text-decoration-thickness:1px}.pcard:has(.pcard__link:focus-visible){outline:2px solid var(--color-focus, var(--hs-emerald));outline-offset:4px}.pcard__link:focus-visible{outline:none}@media(prefers-reduced-motion:reduce){.pcard:hover .pcard__image{transform:none}}.pgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-lg) 1px}@media screen and (min-width:48rem){.pgrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-lg) 1px}}@media screen and (min-width:64rem){.pgrid{grid-template-columns:repeat(4,minmax(0,1fr))}}@media screen and (min-width:100rem){.pgrid{grid-template-columns:repeat(5,minmax(0,1fr))}}.pgrid--3{grid-template-columns:repeat(2,minmax(0,1fr))}@media screen and (min-width:64rem){.pgrid--3{grid-template-columns:repeat(3,minmax(0,1fr))}}.prail{display:grid;position:relative;grid-auto-flow:column;--rail-gap: 1px;grid-auto-columns:calc((100% - var(--rail-gap)) * .78);gap:var(--rail-gap);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-block-end:var(--space-2xs);overscroll-behavior-x:contain}.prail::-webkit-scrollbar{display:none}.prail>*{scroll-snap-align:start}@media screen and (min-width:48rem){.prail{grid-auto-columns:calc((100% - var(--rail-gap) * 2.4) / 3.4)}}@media screen and (min-width:64rem){.prail{grid-auto-columns:calc((100% - var(--rail-gap) * 3.3) / 4.3)}}@media screen and (min-width:100rem){.prail{grid-auto-columns:calc((100% - var(--rail-gap) * 4.3) / 5.3)}}.prail__nav{display:none}@media(hover:hover)and (pointer:fine){.prail__nav{display:flex;gap:var(--space-3xs)}}.prail__nav button:disabled{opacity:.25;cursor:default}.prail-wrap{position:relative;display:grid;grid-template-areas:"track track" "bar nav";grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:var(--space-md) var(--space-md)}.prail-wrap>.prail{grid-area:track;min-width:0}.prail__nav{grid-area:nav}.prail__progress{grid-area:bar;position:relative;height:1px;background-color:var(--color-border, var(--hs-hairline))}.prail__progress span{position:absolute;inset-block:0;inset-inline-start:0;display:block;width:30%;background-color:var(--color-foreground, var(--hs-ink))}@media(hover:hover)and (pointer:fine){.pgrid:has(.pcard:hover) .pcard:not(:hover),.prail:has(.pcard:hover)>*:not(:has(.pcard:hover)){opacity:.55}.pgrid .pcard,.prail>*{transition:opacity var(--dur-mid) var(--ease)}.cgrid:has(.ctile:hover) .cgrid__item:not(:has(.ctile:hover)){opacity:.55}.cgrid__item{transition:opacity var(--dur-mid) var(--ease)}}@media(prefers-reduced-motion:reduce){.pgrid:has(.pcard:hover) .pcard:not(:hover),.prail:has(.pcard:hover)>*:not(:has(.pcard:hover)),.cgrid:has(.ctile:hover) .cgrid__item:not(:has(.ctile:hover)){opacity:1}}
/*# sourceMappingURL=/cdn/shop/t/17/assets/hs-product-card.css.map */
