.okko-collection-level-card{position:relative;display:block;min-width:0;width:100%;aspect-ratio:.86;min-height:280px;border:0;border-radius:calc(12px * var(--okko-radius-scale));background:var(--okko-surface);color:var(--okko-text);isolation:isolate;overflow:hidden;text-decoration:none!important;transition:background-color 1s ease,border-radius 1s ease}.okko-collection-level-card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;background:#0000;pointer-events:none;transition:background-color 1s ease}.okko-collection-level-card:hover,.okko-collection-level-card:focus-visible{border-radius:calc(18px * var(--okko-radius-scale));background:var(--okko-surface);text-decoration:none!important}.okko-collection-level-card:hover:before,.okko-collection-level-card:focus-visible:before{background:#0009}.okko-collection-level-card:focus-visible{outline:2px solid var(--okko-text);outline-offset:4px}.okko-collection-level-card__image-wrap{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;display:flex;align-items:flex-start;justify-content:center;overflow:hidden;background:var(--okko-surface)}.okko-collection-level-card__image{display:block;width:100%;height:calc(100% - 76px);padding:calc(28px * var(--okko-spacing-scale)) calc(18px * var(--okko-spacing-scale)) calc(20px * var(--okko-spacing-scale));object-fit:contain;object-position:center;transform:translateY(0);transition:transform 1s ease,opacity 1s ease,filter 1s ease}.okko-collection-level-card:hover .okko-collection-level-card__image,.okko-collection-level-card:focus-visible .okko-collection-level-card__image{filter:none;opacity:1;transform:translateY(34px)}.okko-collection-level-card__placeholder{display:flex;width:100%;height:100%;align-items:center;justify-content:center;background:var(--okko-surface)}.okko-collection-level-card__placeholder-svg{width:80%;height:80%}.okko-collection-level-card__description{position:absolute;top:28px;left:22px;right:22px;z-index:2;display:-webkit-box;max-height:calc(50% - 28px);margin:0;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:6;color:var(--okko-inverse);font-size:var(--okko-text-14);line-height:var(--okko-leading-1-5);opacity:0;pointer-events:none;transform:translateY(-10px);transition:opacity 1s ease,transform 1s ease}.okko-collection-level-card:hover .okko-collection-level-card__description,.okko-collection-level-card:focus-visible .okko-collection-level-card__description{opacity:1;transform:translateY(0)}.okko-collection-level-card__footer{position:absolute;left:22px;right:22px;bottom:22px;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:calc(14px * var(--okko-spacing-scale));align-items:end}.okko-collection-level-card__title{display:-webkit-box;min-width:0;margin:0;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;color:var(--okko-text);font-size:var(--okko-heading-18);font-weight:var(--okko-heading-weight-800);line-height:var(--okko-leading-1-05);letter-spacing:0;transition:color 1s ease;padding-bottom:calc(4px * var(--okko-spacing-scale))}.okko-collection-level-card:hover .okko-collection-level-card__title,.okko-collection-level-card:focus-visible .okko-collection-level-card__title{color:var(--okko-inverse)}.okko-collection-level-card__arrow{display:inline-flex;width:34px;height:34px;flex:0 0 34px;align-items:center;justify-content:center;border-radius:50%;background:var(--okko-tone-dedede);color:var(--okko-tone-303030);transition:background-color 1s ease,color 1s ease}.okko-collection-level-card__arrow .icon{width:18px;height:18px}.okko-collection-level-card:hover .okko-collection-level-card__arrow,.okko-collection-level-card:focus-visible .okko-collection-level-card__arrow{background:var(--okko-tone-000000);color:var(--okko-inverse)}@media screen and (max-width:749px){.okko-collection-level-card{min-height:220px}.okko-collection-level-card__image{height:calc(100% - 64px);padding:calc(14px * var(--okko-spacing-scale)) calc(10px * var(--okko-spacing-scale)) calc(2px * var(--okko-spacing-scale))}.okko-collection-level-card:hover .okko-collection-level-card__image,.okko-collection-level-card:focus-visible .okko-collection-level-card__image{transform:translateY(26px)}.okko-collection-level-card__description{top:18px;left:12px;right:12px;max-height:calc(50% - 18px);font-size:var(--okko-text-13);line-height:var(--okko-leading-1-4);-webkit-line-clamp:5}.okko-collection-level-card__footer{left:12px;right:12px;bottom:16px;gap:calc(10px * var(--okko-spacing-scale))}.okko-collection-level-card__title{font-size:var(--okko-heading-14)}.okko-collection-level-card__arrow{width:32px;height:32px;flex-basis:32px}}@media screen and (max-width:479px){.collection-list .collection-list__items:not(.swipe-mobile__inner){grid-template-columns:minmax(0,1fr)}}@media(hover:none),(pointer:coarse){.okko-collection-level-card:hover,.okko-collection-level-card:focus-visible{border-radius:calc(12px * var(--okko-radius-scale));background:var(--okko-surface)}.okko-collection-level-card:hover:before,.okko-collection-level-card:focus-visible:before{background:#0000}.okko-collection-level-card:hover .okko-collection-level-card__image,.okko-collection-level-card:focus-visible .okko-collection-level-card__image{filter:none;opacity:1;transform:translateY(0)}.okko-collection-level-card:hover .okko-collection-level-card__description,.okko-collection-level-card:focus-visible .okko-collection-level-card__description{opacity:0;transform:translateY(-10px)}.okko-collection-level-card:hover .okko-collection-level-card__title,.okko-collection-level-card:focus-visible .okko-collection-level-card__title{color:var(--okko-text)}.okko-collection-level-card:hover .okko-collection-level-card__arrow,.okko-collection-level-card:focus-visible .okko-collection-level-card__arrow{background:var(--okko-tone-dedede);color:var(--okko-tone-303030)}}
/*# sourceMappingURL=/cdn/shop/t/3/assets/component-okko-collection-level-card.css.map */