.oile-card{position:relative;display:flex;flex-direction:column;gap:1.4rem;height:100%}.oile-card__media{position:relative;aspect-ratio:var(--oile-card-ratio, 4 / 5);overflow:hidden;border-radius:var(--oile-radius-md);background-color:#efeae1}.oile-card__img{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;width:100%;height:100%;object-fit:cover;transition:opacity var(--oile-dur-3) var(--oile-ease),transform .6s var(--oile-ease)}.oile-card__img--hover{opacity:0}@media(hover:hover){.oile-card:hover .oile-card__img--hover{opacity:1}.oile-card:hover .oile-card__img:only-of-type,.oile-card:hover .oile-card__img:not(.oile-card__img--hover):last-of-type{transform:scale(1.03)}}@media(prefers-reduced-motion:reduce){.oile-card:hover .oile-card__img{transform:none}}.oile-card__fallback{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;color:#29241f47}.oile-card__fallback .oile-icon{width:3.2rem;height:3.2rem}.oile-card__badges{position:absolute;top:1rem;left:1rem;right:1rem;z-index:2;pointer-events:none}.oile-card__link:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:1}.oile-card__link:focus-visible{outline:none}.oile-card__link:focus-visible:after{outline:.2rem solid rgb(var(--color-foreground));outline-offset:.3rem;border-radius:var(--oile-radius-md)}.oile-card__info{display:flex;flex-direction:column;gap:.4rem}.oile-card__title{margin:0;font-family:var(--font-body-family);font-size:1.5rem;font-weight:400;line-height:1.4;letter-spacing:.005em;color:rgb(var(--color-foreground));display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-wrap:pretty}.oile-card__link{text-decoration:none}@media(hover:hover){.oile-card:hover .oile-card__link{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.3rem}}.oile-card__meta,.oile-card__rating{margin:0;font-size:1.3rem;line-height:1.4;color:rgba(var(--color-foreground),.68)}.oile-card__swatches{display:flex;align-items:center;gap:.8rem;min-height:2rem;font-size:1.3rem;color:rgba(var(--color-foreground),.68)}.oile-card__swatch-list{display:inline-flex;gap:.4rem}.oile-card__swatch{width:1.4rem;height:1.4rem;border-radius:50%;background:var(--swatch) center / cover no-repeat;box-shadow:inset 0 0 0 1px #29241f2e}.oile-card__price.price{margin-top:.2rem;font-size:1.5rem}.oile-card__price .price__container{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 .8rem}.oile-card--soldout .oile-card__img{opacity:.72}.oile-card .oile-card__quick{position:absolute;top:auto;left:auto;right:.8rem;bottom:.8rem;z-index:3;margin:0;grid-row-start:auto}.oile-card .oile-card__quick-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.8rem;width:4.4rem;min-width:0;height:4.4rem;padding:0;border:0;border-radius:50%;background-color:#fcfaf6f2;color:#29241f;font:inherit;font-size:1.4rem;font-weight:500;letter-spacing:.02em;cursor:pointer;box-shadow:var(--oile-shadow-sm);transition:background-color var(--oile-dur-1) var(--oile-ease),color var(--oile-dur-1) var(--oile-ease)}.oile-card__quick-btn .oile-icon{width:2rem;height:2rem}.oile-card__quick-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.oile-card__quick-btn.loading>.oile-icon{visibility:hidden}.oile-card__quick-btn .loading__spinner{position:absolute}.oile-card__quick-btn .loading__spinner.hidden{display:none}.oile-card__quick-btn:hover{background-color:#29241f;color:#fcfaf6}@media(hover:hover)and (min-width:990px){.oile-card .oile-card__quick{left:1rem;right:1rem;bottom:1rem;opacity:0;transform:translateY(.6rem);transition:opacity var(--oile-dur-2) var(--oile-ease),transform var(--oile-dur-2) var(--oile-ease)}.oile-card:hover .oile-card__quick,.oile-card:focus-within .oile-card__quick{opacity:1;transform:none}.oile-card .oile-card__quick modal-opener,.oile-card .oile-card__quick product-form,.oile-card .oile-card__quick form{display:block}.oile-card .oile-card__quick-btn{width:100%;height:4.4rem;border-radius:var(--oile-radius-sm)}.oile-card .oile-card__quick-btn .oile-icon{display:none}.oile-card .oile-card__quick-label{position:static;width:auto;height:auto;clip:auto;overflow:visible}.oile-card .oile-card__quick-btn.loading .oile-card__quick-label{visibility:hidden}}.oile-card--horizontal{flex-direction:row;align-items:center;gap:1.6rem}.oile-card--horizontal .oile-card__media{flex:0 0 8.8rem;width:8.8rem}.oile-card--horizontal .oile-card__info{flex:1 1 auto;min-width:0}.oile-card--horizontal .oile-card__title{font-size:1.4rem}.oile-card--horizontal .oile-card__quick{position:static;flex:0 0 auto;opacity:1;transform:none}.oile-card--horizontal .oile-card__quick-btn{width:4.4rem;height:4.4rem;border-radius:50%;box-shadow:inset 0 0 0 1px var(--oile-border);background-color:transparent}.oile-card--horizontal .oile-card__quick-btn .oile-icon{display:block}.oile-card--horizontal .oile-card__quick-label{position:absolute;width:1px;height:1px;clip:rect(0 0 0 0);overflow:hidden}.oile-product-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3.2rem 1.2rem;margin:0;padding:0;list-style:none}@media screen and (min-width:750px){.oile-product-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:4rem 2rem}}@media screen and (min-width:1200px){.oile-product-grid--4{grid-template-columns:repeat(4,minmax(0,1fr));gap:4.8rem 2.4rem}}.oile-product-grid--carousel{display:grid;grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:calc((100% - 1.2rem) / 2.25);overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scroll-padding-inline:var(--oile-gutter);padding-inline:var(--oile-gutter);margin-inline:calc(var(--oile-gutter) * -1);scrollbar-width:none}.oile-product-grid--carousel::-webkit-scrollbar{display:none}.oile-product-grid--carousel>*{scroll-snap-align:start}@media screen and (min-width:750px){.oile-product-grid--carousel{grid-auto-columns:calc((100% - 4rem)/3.2)}}@media screen and (min-width:1200px){.oile-product-grid--carousel{grid-auto-flow:row;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-columns:auto;overflow:visible;padding-inline:0;margin-inline:0}}
/*# sourceMappingURL=/cdn/shop/t/5/assets/oile-card.css.map */
