.strix-grid{display:grid;gap:var(--grid-mobile-vertical-spacing) var(--grid-mobile-horizontal-spacing)}@media(min-width:768px){.strix-grid{gap:var(--grid-desktop-vertical-spacing) var(--grid-desktop-horizontal-spacing)}}.grid-cols-reverse div:nth-child(1){grid-row:2}@media(min-width:768px){.grid-cols-reverse div:nth-child(1){grid-row:auto}}.grid-cols-1,.grid-cols-2{grid-template-columns:1fr}@media(min-width:768px){.grid-cols-2{grid-template-columns:1fr 1fr}}.grid-cols-4-3{grid-template-columns:1fr}@media(min-width:768px){.grid-cols-4-3{grid-template-columns:.67fr .33fr}}.grid-cols-3-4{grid-template-columns:1fr}@media(min-width:768px){.grid-cols-3-4{grid-template-columns:.33fr .67fr}}@media(min-width:768px){.md-grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.md-grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md-grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md-grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}.strix-offcanvas{position:fixed;top:0;left:0;z-index:50;width:100vw;height:100vh}.strix-offcanvas.is--open{display:block}.strix-offcanvas__wrapper{transition-timing-function:cubic-bezier(.4,0,.2,1);--strix-translate-x: 0;--strix-translate-y: 0;--strix-rotate: 0;--strix-skew-x: 0;--strix-skew-y: 0;--strix-scale-x: 1;--strix-scale-y: 1;transform:translate(var(--strix-translate-x)) translateY(var(--strix-translate-y)) rotate(var(--strix-rotate)) skew(var(--strix-skew-x)) skewY(var(--strix-skew-y)) scaleX(var(--strix-scale-x)) scaleY(var(--strix-scale-y));--strix-translate-y: 100%;--strix-translate-x: -50%;--strix-offcanvas-border-radius: .5rem;position:absolute;bottom:0;left:50%;border-top-left-radius:var(--strix-offcanvas-border-radius);border-top-right-radius:var(--strix-offcanvas-border-radius);width:100%;background-color:#fff;transition:all .3s}.strix-offcanvas__wrapper.is--vertical-drawer{--strix-translate-x: 100%;--strix-translate-y: 0;width:420px;max-width:100vw;height:100%;right:0;left:auto;overflow-y:auto}.strix-offcanvas__wrapper.is--modal{--strix-translate-x: -50%;--strix-translate-y: -50%;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a;position:absolute;top:35%;left:50%;bottom:auto;width:90%;max-width:500px;border-radius:var(--strix-offcanvas-border-radius)}.strix-offcanvas__wrapper.is--fading{opacity:0}.strix-offcanvas.is--open .strix-offcanvas__wrapper{--strix-translate-y: 0;opacity:1}.strix-offcanvas.is--open .strix-offcanvas__wrapper.is--vertical-drawer{--strix-translate-x: 0}.strix-offcanvas__backdrop{-webkit-appearance:button;background-image:none;border:none;padding:0;cursor:pointer;transition-timing-function:cubic-bezier(.4,0,.2,1);position:absolute;top:0;left:0;width:100vw;height:100vh;transition:all .3s;opacity:0;background-color:transparent}.strix-offcanvas__backdrop.is--shown{background-color:#0000004d}.strix-offcanvas.is--open .strix-offcanvas__backdrop{opacity:1}.strix-offcanvas__close-btn{-webkit-appearance:button;background-color:transparent;background-image:none;border:none;padding:0;cursor:pointer;position:absolute;top:15px;right:16px;width:20px;height:20px}.strix-offcanvas__close-btn svg{width:20px;height:20px}
/*# sourceMappingURL=/cdn/shop/t/2/assets/strix-offcanvas.css.map */