.kb-card{display:flex;flex-direction:column;gap:var(--kb-space-2xs);container:kb-card / inline-size}@container kb-card (max-width: 200px){.kb-card__title{font-size:var(--kb-text-sm)}}.kb-card__link{display:flex;flex-direction:column;gap:var(--kb-space-xs);text-decoration:none;color:inherit}.kb-card__media{position:relative;aspect-ratio:4 / 5;overflow:hidden;border-radius:var(--kb-radius-sm);background:var(--kb-color-sunken)}.kb-card__image{inline-size:100%;block-size:100%;object-fit:cover;transition:transform var(--kb-duration-slow) var(--kb-ease-out),opacity var(--kb-duration) var(--kb-ease)}.kb-card__image--hover{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0}@media(hover:hover){.kb-card:hover .kb-card__image{transform:scale(1.04)}.kb-card:hover .kb-card__image--hover{opacity:1}}.kb-card__placeholder{display:grid;place-items:center;block-size:100%;background-color:color-mix(in srgb,var(--kb-color-hot) 12%,var(--kb-color-raised))}.kb-card__placeholder-art{inline-size:68%;max-inline-size:180px;block-size:auto;opacity:.55;transition:transform var(--kb-duration-slow) var(--kb-ease-spring),opacity var(--kb-duration) var(--kb-ease)}@media(hover:hover){.kb-card:hover .kb-card__placeholder-art{transform:scale(1.05);opacity:.8}}.kb-card__placeholder-mark{inline-size:28px;color:var(--kb-color-accent-graphic);opacity:.55;transition:transform var(--kb-duration-slow) var(--kb-ease-spring),opacity var(--kb-duration) var(--kb-ease)}@media(hover:hover){.kb-card:hover .kb-card__placeholder-mark{transform:rotate(90deg) scale(1.15);opacity:.9}}.kb-card__badge{position:absolute;inset-block-start:var(--kb-space-2xs);inset-inline-end:var(--kb-space-2xs);padding:.25rem .5rem;border-radius:var(--kb-radius-pill);font-size:var(--kb-text-2xs);letter-spacing:var(--kb-tracking-caps);text-transform:uppercase}.kb-card__badge--sale{background:var(--kb-color-hot);color:var(--kb-color-ink)}.kb-card__badge--out{background:var(--kb-color-hairline);color:var(--kb-color-ink-soft)}.kb-card__body{display:flex;flex-direction:column;gap:var(--kb-space-3xs)}.kb-card__title{margin:0;font-size:var(--kb-text-base);font-weight:var(--kb-weight-regular);line-height:var(--kb-leading-normal);text-wrap:pretty;overflow-wrap:break-word;transition:color var(--kb-duration-fast) var(--kb-ease)}.kb-card__link:hover .kb-card__title{color:var(--kb-color-accent)}.kb-card__price{margin:0;display:flex;align-items:baseline;gap:var(--kb-space-2xs);font-size:var(--kb-text-sm);color:var(--kb-color-ink-soft)}.kb-rating{display:flex;align-items:center;gap:var(--kb-space-3xs);margin:0}.kb-rating__stars{position:relative;display:inline-block;font-size:var(--kb-text-xs);line-height:1;letter-spacing:.1em;color:var(--kb-color-hairline-strong)}.kb-rating__stars:before{content:"\2605\2605\2605\2605\2605"}.kb-rating__fill{position:absolute;inset-block:0;inset-inline-start:0;inline-size:var(--kb-rating, 0%);overflow:hidden;white-space:nowrap;color:var(--kb-color-accent-graphic)}.kb-rating__fill:before{content:"\2605\2605\2605\2605\2605"}.kb-rating__count{font-size:var(--kb-text-2xs);color:var(--kb-color-ink-muted);font-variant-numeric:tabular-nums}.kb-card__price-now{color:var(--kb-color-accent)}.kb-card__price-was{color:var(--kb-color-ink-muted)}.kb-card--compact .kb-card__link{flex-direction:row;gap:var(--kb-space-sm);align-items:flex-start}.kb-card--compact .kb-card__media{flex:none;inline-size:72px;border-radius:var(--kb-radius-xs)}.kb-card--compact .kb-card__title{font-size:var(--kb-text-sm)}.kb-card--loading .kb-card__media,.kb-card--loading .kb-card__title,.kb-card--loading .kb-card__price{background:linear-gradient(90deg,var(--kb-color-raised) 0%,var(--kb-color-hairline) 50%,var(--kb-color-raised) 100%);background-size:200% 100%;animation:kb-shimmer 1.4s linear infinite;color:transparent;border-radius:var(--kb-radius-xs)}@keyframes kb-shimmer{to{background-position:-200% 0}}@media(prefers-reduced-motion:reduce){.kb-card--loading .kb-card__media,.kb-card--loading .kb-card__title,.kb-card--loading .kb-card__price{animation:none}}
/*# sourceMappingURL=/cdn/shop/t/8/assets/kb-product-card.css.map */
