.product-nav{bottom:0;height:100vh;height:100dvh;pointer-events:none;position:fixed;right:0;width:100%;z-index:100}.product-nav>.sub-wrapper{height:100%}.product-nav-btn{bottom:var(--side-padding);justify-content:space-between;pointer-events:all;position:absolute;right:var(--side-padding);transition:width .3s ease;width:9.2em;z-index:4}.product-nav-btn.open{width:min(calc(100% - var(--side-padding)*2),500px)}.main-btn.product-nav-btn .icon{font-size:1.2em}.product-nav-main{background:var(--mono-50);border-radius:1em;bottom:var(--side-padding);overflow:hidden;pointer-events:all;position:absolute;right:var(--side-padding);transition:width .3s ease,height .3s ease;width:0}.product-nav-main.open{pointer-events:all;width:min(calc(100% - var(--side-padding)*2),500px)}.product-nav-main:after{background:var(--yellow-500);border-radius:0 0 1em 1em;bottom:0;content:"";display:block;height:2.2em;left:0;margin-top:auto;position:absolute;width:100%;z-index:3}.product-nav-root,.product-subnav{display:flex;flex-direction:column;gap:1em;list-style:none;overflow:hidden;padding:1.2em 1.2em 3.2em;white-space:nowrap}.product-subnav{background:var(--mono-50);bottom:0;left:0;opacity:0;overflow-y:hidden;pointer-events:none;position:absolute;top:0;transition:opacity .3s ease;width:100%;z-index:0}.product-subnav.open{opacity:1;pointer-events:auto;z-index:2}.product-nav-root>li>a,.product-nav-root>li>button,.product-subnav>li>a,.product-subnav>li>button{font-family:var(--font-mono);text-transform:uppercase}.product-nav-root a.active.router-link-exact-active,.product-nav-root button.active,.product-subnav a.active.router-link-exact-active{text-decoration:underline}.product-subnav-back-btn{color:var(--mono-500);display:inline-flex;font-family:var(--font-body)!important;font-weight:600;gap:.5em;text-transform:uppercase}.product-subnav-back-btn:hover{color:var(--mono-700)}@media (min-width:1000px){.product-nav{display:flex;height:auto;padding-bottom:2em;position:sticky;top:calc(var(--header-height) + 10px);width:100%}.product-nav-btn{display:none}.product-nav-main{align-items:center;background:none;border-radius:0;display:flex;flex-direction:column;height:auto;inset:auto;max-width:none;overflow:initial;padding:0;pointer-events:auto;position:relative;width:100%}.product-nav-main.open{width:100%}.product-nav-main:after{display:none}.product-nav-root,.product-subnav{align-items:center;flex-direction:row;flex-wrap:wrap;justify-content:center}.product-nav-root{background:var(--mono-50);border-radius:1em;gap:.5em 1em;padding:1em .5em;position:relative;width:100%;z-index:3}.product-subnav{background:var(--mono-100);border-radius:0 0 1em 1em;bottom:auto;gap:.5em 1.5em;left:0;overflow:initial;padding:2.5em 1em 1.5em;pointer-events:none;position:absolute;top:calc(100% - 1em);transition:opacity .3s ease,transform .3s ease;width:100%}.product-subnav:not(.open){transform:translateY(-2em)}.product-subnav.open{opacity:1;pointer-events:auto}.product-nav-root li>a{background:transparent;border:1px solid transparent;border-radius:2em;font-size:14px;padding:.5em 1em}.product-nav-root li>a:hover{background:transparent;border-color:var(--mono-300);color:var(--black)}.product-nav-root li>a.active.router-link-exact-active{background:var(--yellow-500);border-color:var(--yellow-500);color:var(--black);text-decoration:none}.product-subnav li>a{color:var(--mono-700);font-size:14px}.product-subnav li>a:hover{text-decoration:underline}.product-subnav li>a.active.router-link-exact-active{color:var(--black)}}.main-load-more{align-items:center;align-self:center;display:flex;flex-direction:column;gap:2em;justify-content:center;margin-top:2em;text-align:center;width:100%}.main-load-more .label{animation:loading 2s ease infinite forwards;color:var(--mono-500)}.product-feed{padding:2em 0 5em}.product-feed>.sub-wrapper{align-items:center}.product-feed-grid{align-items:stretch;display:grid;gap:10px;grid-template-columns:repeat(2,1fr);justify-content:stretch;width:100%}@media (min-width:500px){.product-feed-grid{gap:1em;grid-template-columns:repeat(2,1fr)}}@media (min-width:700px){.product-feed-grid{grid-template-columns:repeat(3,1fr)}}@media (min-width:1000px){.product-feed{padding:1em 0 5em}}@media (min-width:1200px){.product-feed-grid{grid-template-columns:repeat(4,1fr)}}
