.card-bg{--card-bg-image-1x: none;--card-bg-image-2x: none;--card-overlay-color: var(--color-soot-black);--card-overlay-opacity: 40%;--card-title-color: var(--color-soot-black);--card-description-color: var(--color-clear-white);--card-badge-color: var(--color-clear-white);--card-badge-border-color: var(--color-clear-white);--card-badge-bg-color: var(--badge-bg-default);position:relative;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;width:100%;min-height:455px;padding:var(--spacing-18);background-color:var(--color-cream-white);border:var(--outline-subtle);border-radius:var(--radius-24);text-decoration:none;color:inherit;box-sizing:border-box;overflow:hidden;isolation:isolate;contain:layout style paint}.card-bg:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background-image:var(--card-bg-image-1x);background-size:cover;background-position:center;background-repeat:no-repeat;border-radius:inherit;z-index:0;transition:filter var(--transition-fast);pointer-events:none;overflow:hidden}.card-bg:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background-color:var(--card-overlay-color);border-radius:inherit;opacity:0;transition:opacity var(--transition-fast);z-index:1;pointer-events:none}.card-bg:hover:after{opacity:calc(var(--card-overlay-opacity, 80) / 100)}.card-bg[data-overlay-gradient=true]:after{background:linear-gradient(to bottom,rgba(var(--color-soot-black-rgb),calc(var(--card-overlay-opacity-top, 10) / 100)),rgba(var(--color-soot-black-rgb),calc(var(--card-overlay-opacity-bottom, 25) / 100)))}.card-bg[data-overlay-gradient=true]:hover:after{opacity:1}.card-bg:hover:before{will-change:filter;filter:var(--overlay-blur)}.card-bg__badge{position:absolute;top:var(--spacing-16);right:var(--spacing-16);display:flex;justify-content:center;align-items:center;gap:var(--spacing-4);padding:var(--spacing-4) var(--spacing-8);background-color:var(--card-badge-bg-color);background-color:rgba(var(--color-soot-black-rgb),.5);border:1px solid var(--card-badge-border-color);border-radius:var(--radius-pill);font-family:var(--font-sans);font-size:var(--text-micro-size);font-style:normal;font-weight:var(--fw-normal);line-height:var(--lh-title);letter-spacing:var(--text-micro-badge-spacing);color:var(--card-badge-color);z-index:3;transition:backdrop-filter var(--transition-fast),background-color var(--transition-fast)}@supports (backdrop-filter: blur(10px)){.card-bg__badge{background-color:var(--card-badge-bg-color);-webkit-backdrop-filter:var(--card-badge-backdrop-filter, var(--backdrop-blur));backdrop-filter:var(--card-badge-backdrop-filter, var(--backdrop-blur))}}.card-bg:hover .card-bg__badge{background-color:var(--card-overlay-color)}.card-bg__badge--with-icon{padding-left:0;padding-top:0;padding-bottom:0;padding-right:var(--spacing-10);height:var(--icon-size-lg);gap:0}@supports selector(:has(*)){.card-bg__badge:has(.card-bg__badge-icon){padding-left:0;padding-top:0;padding-bottom:0;padding-right:var(--spacing-10);height:var(--icon-size-lg);gap:0}}.card-bg__badge-icon{display:flex;align-items:center;justify-content:center;width:var(--icon-size-lg);height:var(--icon-size-lg);flex-shrink:0}.card-bg__badge-icon img{width:100%;height:100%;object-fit:contain;filter:brightness(0) invert(1)}.card-bg[style*="--card-badge-color: var(--color-soot-black)"] .card-bg__badge-icon img{filter:brightness(0)}.card-bg[style*="--card-badge-color: var(--color-clear-white)"] .card-bg__badge-icon img{filter:brightness(0) invert(1)}.card-bg[style*="--card-badge-color: var(--color-gunmetal-gray)"] .card-bg__badge-icon img{filter:brightness(0)}.card-bg[style*="--card-badge-color: var(--color-butter-yellow)"] .card-bg__badge-icon img{filter:brightness(0) saturate(100%) invert(95%) sepia(8%) saturate(2000%) hue-rotate(45deg) brightness(102%)}.card-bg[style*="--card-badge-color: var(--color-grass-green)"] .card-bg__badge-icon img{filter:brightness(0) saturate(100%) invert(30%) sepia(50%) saturate(2000%) hue-rotate(60deg) brightness(90%)}.card-bg[style*="--card-badge-color: var(--color-ruby-red)"] .card-bg__badge-icon img{filter:brightness(0) saturate(100%) invert(15%) sepia(60%) saturate(2000%) hue-rotate(320deg) brightness(80%)}.card-bg__badge-icon svg{width:100%;height:100%;color:var(--card-badge-color);fill:var(--card-badge-color);stroke:var(--card-badge-color)}.card-bg__badge-text{flex-shrink:0}.card-bg__title{position:relative;margin:0;text-align:left;color:var(--card-title-color);font-family:var(--font-sans);font-size:var(--title-display-size);font-weight:var(--fw-normal);font-style:normal;line-height:var(--lh-body);letter-spacing:var(--title-display-spacing);z-index:2}.card-bg__title--card{font-size:var(--title-card-size);letter-spacing:var(--title-card-spacing)}.card-bg__description{position:relative;margin:auto 0 0;padding:0;text-align:left;color:var(--card-description-color);font-family:var(--font-sans);font-size:var(--text-small-size);font-weight:var(--fw-normal);font-style:normal;line-height:var(--lh-body);letter-spacing:var(--text-body-spacing);opacity:0;visibility:hidden;transform:translateY(var(--spacing-10));transition:opacity var(--transition-fast),visibility var(--transition-fast),transform var(--transition-fast);z-index:2}.card-bg:hover .card-bg__description{opacity:1;visibility:visible;transform:translateY(0)}@media(-webkit-min-device-pixel-ratio:2),(min-resolution:2dppx){.card-bg:before{background-image:var(--card-bg-image-2x)}}@media(max-width:1023px){.card-bg{padding:var(--spacing-12)}.card-bg__title,.card-bg__title--card{font-size:var(--title-product-size);letter-spacing:var(--title-product-spacing)}.card-bg:hover:after,.card-bg[data-overlay-gradient=true]:hover:after{opacity:0}.card-bg:hover:before{filter:none}.card-bg:hover .card-bg__description{opacity:0;visibility:hidden;transform:translateY(var(--spacing-10))}.card-bg:hover .card-bg__badge{background-color:var(--card-badge-bg-color)}}
/*# sourceMappingURL=/cdn/shop/t/3/assets/card-bg.css.map */