:root{--header-height: unset;--nav-height: 73.883px;--nav-menu-height: var(--dynamic-nav-menu-height, 65svh);--nav-gap: 20px;--nav-x-padding: 4vw;--nav-z-index: 500;--ticker-height: 24px;--ticker-z-index: 550;--color-light: #ffffff;--color-dark: #000000;--color-cream: #F0EFE5;--color-grey: #DBD5CA;--color-echelon: #ba9e5b}.onyx-nav[data-color-mode=dark]{--fill-color: var(--color-light);--text-color: var(--color-light);--background-color: var(--color-cream);--contrast-color: var(--color-dark);--grey-color: var(--color-grey)}.onyx-nav[data-color-mode=light]{--fill-color: var(--color-dark);--text-color: var(--color-dark);--background-color: var(--color-cream);--contrast-color: var(--color-cream);--grey-color: var(--color-grey)}@media screen and (max-width:800px){:root{--nav-menu-height: 100svh}}.wipe-in{animation:swipe-in .3s ease-out forwards;animation-duration:.3s;animation-timing-function:ease-out;animation-iteration-count:1;animation-direction:normal;animation-fill-mode:forwards;animation-play-state:running;animation-name:wipe-in;clip-path:polygon(0% 0%,0% 0%,0% 100%,0% 100%);-webkit-clip-path:polygon(0% 0%,0% 0%,0% 100%,0% 100%)}@keyframes wipe-in{0%{clip-path:polygon(0% 0%,0% 0%,0% 100%,0% 100%);-webkit-clip-path:polygon(0% 0%,0% 0%,0% 100%,0% 100%)}to{clip-path:polygon(0% 0%,100% 0%,100% 100%,0% 100%);-webkit-clip-path:polygon(0% 0%,100% 0%,100% 100%,0% 100%)}}@keyframes onyx-nav-logo-fade-in{to{opacity:1}}@keyframes onyx-nav-logo-draw-in{to{stroke-dashoffset:0}}@keyframes onyx-nav-search-input-in{0%{clip-path:inset(0 0 0 100%)}to{clip-path:inset(0 0 0 0)}}@keyframes onyx-nav-fade-in{0%{opacity:0}to{opacity:1}}@keyframes onyx-nav-slide-fade-in{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}.animation-delay-1{animation-delay:.1s}.animation-delay-2{animation-delay:.2s}.animation-delay-3{animation-delay:.3s}.animation-delay-4{animation-delay:.4s}.animation-delay-5{animation-delay:.5s}.animation-delay-6{animation-delay:.6s}.animation-delay-7{animation-delay:.7s}.animation-delay-8{animation-delay:.8s}.animation-delay-9{animation-delay:.9s}.the-ticker{height:var(--ticker-height);z-index:var(--ticker-z-index)}header.onyx-header{height:var(--header-height);top:0;left:0;padding:0;width:100%;position:sticky;z-index:var(--nav-z-index)}.onyx-nav{--legacy-fill-color: var(--header-primary, var(--color-dark));--legacy-contrast-color: var(--header-secondary, var(--color-cream));--fill-color: var(--legacy-fill-color, var(--color-dark));--text-color: var(--legacy-fill-color, var(--color-cream));--background-color: var(--color-cream);--contrast-color: var(--legacy-contrast-color, var(--color-cream));--grey-color: var(--color-grey);--placeholder-color: rgb(0 0 0 / 30%);--logo-draw-length: 1;--logo-draw-duration: 1.4s;--logo-draw-ease: cubic-bezier(.37, 0, .13, 1);box-sizing:border-box;position:relative;width:100%;height:var(--nav-height);padding:0 var(--nav-x-padding);isolation:isolate;contain:paint}.onyx-nav .wipe-in,.onyx-nav .onyx-nav-search input[type=search]{backface-visibility:hidden;transform:translateZ(0)}.onyx-nav .inner-wrapper{position:relative;z-index:1;display:flex;align-items:center;height:100%;box-sizing:border-box;gap:var(--nav-gap);width:100%;max-width:1600px;margin:auto;padding:8px 0}.onyx-nav .onyx-nav-logo{display:inline-flex;align-items:center}.onyx-nav .onyx-nav-logo svg{display:block;width:auto;height:100%;fill:var(--fill-color)}.onyx-nav .onyx-nav-logo svg [fill]:not([fill=none]){fill:var(--fill-color)!important}.onyx-nav .onyx-nav-logo svg [stroke]:not([stroke=none]){stroke:var(--fill-color)!important}.onyx-nav .onyx-nav-logo[data-onyx-nav-logo=normal]{width:50px;opacity:0;animation:onyx-nav-logo-fade-in .35s ease forwards}.onyx-nav .onyx-nav-logo[data-onyx-nav-logo=normal] svg #anim path{fill:transparent!important;stroke:var(--fill-color);stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:var(--logo-draw-length);stroke-dashoffset:var(--logo-draw-length);animation:onyx-nav-logo-draw-in var(--logo-draw-duration) var(--logo-draw-ease) forwards;vector-effect:non-scaling-stroke}.onyx-nav .onyx-nav-logo[data-onyx-nav-logo=wholesale]{width:70px;opacity:1}.onyx-nav .onyx-nav-logo[data-onyx-nav-logo=echelon]{width:auto;height:100%;opacity:1}.onyx-nav .onyx-nav-search{--search-height: 40px;--search-open-transition: .25s ease;--search-close-transition: .25s ease-out;--search-width-transition: var(--search-close-transition);--search-background-transition: .18s ease-out;display:flex;justify-content:flex-end;flex:1 1 auto;min-width:0;height:var(--search-height)}.onyx-nav .onyx-nav-search form{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:flex-end;gap:0;width:40px;min-width:40px;height:100%;max-width:100%;overflow:hidden;padding:0;background:transparent;box-sizing:border-box;transition:width var(--search-width-transition),min-width var(--search-width-transition),padding var(--search-width-transition)}.onyx-nav .onyx-nav-search form:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:var(--grey-color);transform:translateZ(0) scaleX(0);transform-origin:right center;transition:transform var(--search-background-transition);will-change:transform;backface-visibility:hidden;z-index:0;pointer-events:none}.onyx-nav .onyx-nav-search .onyx-nav-search-button{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;width:auto;height:100%;padding:0;border:none;background:transparent;cursor:pointer;-webkit-appearance:none;appearance:none}.onyx-nav .onyx-nav-search .onyx-nav-search-button svg{height:15px;width:unset;overflow:visible}.onyx-nav .onyx-nav-search .onyx-nav-search-button svg *{stroke:var(--fill-color);stroke-width:1.5px}.onyx-nav .onyx-nav-search input[type=search]{position:relative;z-index:1;display:none;-webkit-appearance:none;appearance:none;flex:1 1 auto;min-width:0;width:0;opacity:1;clip-path:inset(0 0 0 100%);pointer-events:none;outline:none;border:none;background:transparent;color:var(--text-color);transition:none;will-change:clip-path}.onyx-nav .onyx-nav-search input[type=search]::placeholder{color:var(--placeholder-color)}.onyx-nav .onyx-nav-search input[type=search]::-webkit-search-decoration,.onyx-nav .onyx-nav-search input[type=search]::-webkit-search-cancel-button{display:none}.onyx-nav .onyx-nav-search .onyx-nav-search-submit{display:none;position:relative;z-index:1;align-items:center;justify-content:center;flex:0 0 auto;height:100%;padding:0 18px;border:0;border-left:1px solid #00000038;background:transparent;color:#00000061;font-family:var(--body-family);font-size:12px;font-weight:500;letter-spacing:2px;line-height:1;text-transform:uppercase;cursor:pointer;-webkit-appearance:none;appearance:none;transition:color .25s ease}.onyx-nav .onyx-nav-search .onyx-nav-search-submit:hover,.onyx-nav .onyx-nav-search .onyx-nav-search-submit:focus-visible{color:var(--text-color);transition:color .25s ease}.onyx-nav .onyx-nav-actions{display:flex;align-items:center;margin-left:0;gap:var(--nav-gap)}.onyx-nav .onyx-nav-actions .account-button,.onyx-nav .onyx-nav-actions .show-login{font-family:Montserrat,sans-serif;font-weight:500;color:var(--text-color);font-size:12px;letter-spacing:2px;text-transform:uppercase}.onyx-nav .onyx-nav-actions .cart-count{background:var(--fill-color);font-weight:500;font-size:10px;text-align:center;height:25px;width:auto;aspect-ratio:var(--cart-count-ratio, 1 / 1);display:flex;justify-content:center;align-items:center;border-radius:1000px;color:var(--contrast-color)}.onyx-nav .onyx-nav-actions .menu-button{padding:22px 18px;cursor:pointer;width:28px;transition:transform .2s ease;position:relative;margin-left:unset;background:none;border:none;-webkit-appearance:none;appearance:none}.onyx-nav .onyx-nav-actions .menu-button:hover{transform:scale(1.1)}.onyx-nav .onyx-nav-actions .menu-button .bar{width:100%;height:1px;transition:transform .3s ease-out,opacity .2s ease-out;transform-origin:center center;position:absolute;left:0;background:var(--fill-color)}.onyx-nav .onyx-nav-actions .menu-button .bar.top{transform:translateY(-8px)}.onyx-nav .onyx-nav-actions .menu-button .bar.bottom{transform:translateY(8px)}.onyx-nav .onyx-nav-actions .menu-button.active .bar.mid{opacity:0}.onyx-nav .onyx-nav-actions .menu-button.active .bar.top{transform:rotate(45deg)}.onyx-nav .onyx-nav-actions .menu-button.active .bar.bottom{transform:rotate(-45deg)}.onyx-nav.open{--fill-color: var(--color-dark);--text-color: var(--color-dark);--background-color: var(--color-cream);--contrast-color: var(--color-cream)}@media screen and (max-width:800px){.onyx-nav.open:before{display:block}}.onyx-nav.open .onyx-nav-search{--search-width-transition: var(--search-open-transition);--search-background-transition: var(--search-open-transition)}.onyx-nav.open .onyx-nav-search form{justify-content:flex-start;gap:10px;width:100%;min-width:0;height:100%;padding:6px 0 6px 15px}.onyx-nav.open .onyx-nav-search form:before{transform:translateZ(0) scaleX(1)}.onyx-nav.open .onyx-nav-search .onyx-nav-search-button{cursor:pointer}.onyx-nav.open .onyx-nav-search .onyx-nav-search-button svg *{stroke:var(--text-color)}.onyx-nav.open .onyx-nav-search input[type=search]{display:block;width:auto;clip-path:inset(0 0 0 0);animation:onyx-nav-search-input-in var(--search-open-transition) forwards;pointer-events:auto}.onyx-nav.open .onyx-nav-search .onyx-nav-search-submit{display:inline-flex}.onyx-nav-visibility-assistant{position:fixed;content:"";height:var(--nav-height);width:100%;top:0;left:0;background:linear-gradient(to bottom,#00000025 0%,transparent 100%);-webkit-mask-image:linear-gradient(90deg,#000000 -10%,transparent 50%,#000000 110%);mask-image:linear-gradient(90deg,#000000 -10%,transparent 50%,#000000 110%);z-index:calc(var(--nav-z-index) - 2);mix-blend-mode:multiply}.onyx-nav-menu{--nav-menu-transform-duration: .25s;--nav-menu-transform-ease: ease;--nav-menu-content-fade-duration: .16s;--nav-menu-content-fade-ease: ease;--nav-menu-group-animation-duration: .25s;--nav-menu-group-animation-ease: ease;--background-color: var(--color-cream);box-sizing:border-box;background:var(--background-color);width:auto;min-height:450px;height:var(--nav-menu-height);overflow-y:auto;position:fixed;top:0;left:0;right:0;z-index:calc(var(--nav-z-index) - 1);padding:calc(var(--nav-height) + calc(var(--nav-gap) * 2)) var(--nav-x-padding) calc(var(--nav-x-padding) / 2);transform:translateY(calc(var(--nav-menu-height) * -1));transition:transform var(--nav-menu-transform-duration) var(--nav-menu-transform-ease);transform-origin:bottom;border-bottom:1px solid var(--color-grey)}.onyx-nav-menu .inner-wrapper{box-sizing:border-box;display:flex;align-items:stretch;gap:var(--nav-gap);width:100%;height:100%;max-width:1600px;min-width:0;margin:auto}.onyx-nav-menu .groups{display:flex;flex:0 0 22%;flex-direction:column;max-width:260px;min-width:0}.onyx-nav-menu .group-item{width:100%}.onyx-nav-menu .group-button,.onyx-nav-menu .group-link{-webkit-appearance:none;appearance:none;display:flex;align-items:center;justify-content:flex-start;width:100%;min-height:36px;min-width:0;padding:8px 10px;border:0;background:transparent;color:var(--color-dark);font-family:Montserrat,sans-serif;font-size:16px;font-weight:400;line-height:1.2;text-align:left;text-decoration:none;cursor:pointer}.onyx-nav-menu .group-button[aria-expanded=true]{background:var(--color-grey)}.onyx-nav-menu .group-button-text{--nav-menu-group-delay: 0ms;display:block;opacity:0;transform:translate(20px);will-change:opacity,transform}.onyx-nav-menu .login-link{display:none}.onyx-nav-menu hr{display:none;background:var(--color-grey);margin-bottom:15px}.onyx-nav-menu .panels{flex:1 1 0;min-width:0;opacity:0;will-change:opacity}.onyx-nav-menu .mobile-panel-slot,.onyx-nav-menu .panel[hidden]{display:none}.onyx-nav-menu .panel{height:100%;min-width:0}.onyx-nav-menu .panel .panel-body{height:100%;display:flex;gap:var(--nav-gap);min-width:0}.onyx-nav-menu .panel .panel-body>*{flex:1 1 0;min-width:0}.onyx-nav-menu .child-list{display:flex;flex-direction:column;margin:0;min-width:0;padding:0;list-style:none}.onyx-nav-menu .child-list li{width:100%}.onyx-nav-menu .child-link{display:flex;gap:12px;align-items:center;box-sizing:border-box;width:100%;min-width:0;padding:8px 10px;color:var(--onyx-nav-menu-link-color, var(--color-dark));font-family:Montserrat,sans-serif;font-weight:500;text-decoration:none}@media(hover:hover)and (pointer:fine)and (min-width:801px){.onyx-nav-menu .child-link{position:relative;--hover-in-duration: .2s;--hover-out-duration: .25s}.onyx-nav-menu .child-link:before{content:"";position:absolute;top:0;bottom:0;left:0;width:3px;background:currentColor;opacity:0;pointer-events:none}.onyx-nav-menu .child-link>*{transition:transform var(--hover-out-duration) ease-out;will-change:transform}.onyx-nav-menu .child-list li:hover .child-link:before,.onyx-nav-menu .child-link:hover:before{opacity:1}.onyx-nav-menu .child-list li:hover .child-link>*,.onyx-nav-menu .child-link:hover>*{transform:translate(10px);transition-duration:var(--hover-in-duration)}}.onyx-nav-menu .child-media{display:block;flex:0 0 72px;width:72px;aspect-ratio:1 / 1;overflow:hidden;background:var(--color-grey)}.onyx-nav-menu .child-image{display:block;width:100%;height:100%;object-fit:cover}.onyx-nav-menu .child-content{display:block;flex:1 1 auto;min-width:0}.onyx-nav-menu .child-title{display:block;font-size:12px;letter-spacing:3px;line-height:1.4;text-transform:uppercase}.onyx-nav-menu .child-subtitle{display:block;margin-top:4px;font-size:10px;font-family:var(--body-family);opacity:.5;letter-spacing:2px;line-height:1;text-transform:uppercase}.onyx-nav-menu .banner-callout{position:relative;display:block;height:100%;overflow:hidden;isolation:isolate;background-color:var(--color-grey);color:var(--color-light)}.onyx-nav-menu .banner-callout:before{content:"";position:absolute;top:-2%;right:-2%;bottom:-2%;left:-2%;z-index:0;background-image:var(--banner-background, none);background-position:center;background-size:cover;transform:scale(1) rotate(0);transition:transform .45s ease;will-change:transform;pointer-events:none}@media(hover:hover)and (pointer:fine){.onyx-nav-menu .banner-callout:hover:before{transform:scale(1.05)}}.onyx-nav-menu .panel-body[data-has-children=true] .banner-callout{width:100%}.onyx-nav-menu .banner-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;background:var(--color-dark);pointer-events:none}.onyx-nav-menu .mobile-banner-overlay{display:none;position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;background:linear-gradient(90deg,var(--color-dark) 0%,transparent 100%);pointer-events:none}.onyx-nav-menu .banner-content{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;padding:25px}.onyx-nav-menu .title{display:block;font-family:var(--detail-family);font-size:32px;letter-spacing:1px;line-height:1.4;text-transform:uppercase}.onyx-nav-menu .subtitle{display:block;margin-top:4px;font-size:12px;font-family:var(--body-family);letter-spacing:1px;line-height:1;text-transform:uppercase}.onyx-nav-menu .button.cta{display:inline-flex;margin-top:14px;padding:8px 14px;background:var(--color-dark);color:var(--color-light);font-family:Montserrat,sans-serif;font-size:11px;font-weight:500;letter-spacing:2px;line-height:1.2;text-decoration:none;text-transform:uppercase}.onyx-nav-menu.open{transform:translateY(0);transition:transform var(--nav-menu-transform-duration) var(--nav-menu-transform-ease)}.onyx-nav-menu.open .panels{animation:onyx-nav-fade-in;animation-duration:.5s;animation-delay:var(--nav-menu-transform-duration);animation-fill-mode:both}.onyx-nav-menu.open .group-button-text{animation:onyx-nav-slide-fade-in;animation-duration:var(--nav-menu-group-animation-duration);animation-timing-function:var(--nav-menu-group-animation-ease);animation-delay:calc(var(--nav-menu-transform-duration) + var(--nav-menu-group-delay));animation-fill-mode:both}@media screen and (min-width:801px)and (max-width:1200px){.onyx-nav-menu .panel-body>:nth-child(n+3){display:none}}@media screen and (max-width:800px){.onyx-nav-menu{padding-top:calc(var(--nav-height) + var(--nav-gap));scrollbar-width:none;-ms-overflow-style:none}.onyx-nav-menu::-webkit-scrollbar{display:none;width:0;height:0}.onyx-nav-menu .inner-wrapper{flex-direction:column}.onyx-nav-menu .groups{flex:0 0 auto;flex-direction:column;gap:0;max-width:none;width:100%}.onyx-nav-menu .groups>.group-item,.onyx-nav-menu .groups>.group-link{opacity:0;transform:translate(20px);will-change:opacity,transform}.onyx-nav-menu.open .groups>.group-item,.onyx-nav-menu.open .groups>.group-link{animation:onyx-nav-slide-fade-in;animation-duration:var(--nav-menu-group-animation-duration);animation-timing-function:var(--nav-menu-group-animation-ease);animation-delay:var(--nav-menu-transform-duration);animation-fill-mode:both}.onyx-nav-menu hr{display:block}.onyx-nav-menu .login-link{display:flex;align-items:center;color:var(--color-dark);font-family:var(--body-family);font-size:12px;font-weight:400;line-height:2;text-decoration:none;text-transform:uppercase;letter-spacing:2px}.onyx-nav-menu .group-button,.onyx-nav-menu .group-link{justify-content:space-between;width:100%;min-height:40px;padding:0;white-space:normal}.onyx-nav-menu .group-button-text,.onyx-nav-menu.open .group-button-text{opacity:1;transform:none;animation:none;will-change:auto}.onyx-nav-menu .group-indicator{position:relative;display:block;flex:0 0 18px;width:18px;height:18px;margin-left:var(--nav-gap)}.onyx-nav-menu .group-indicator:before,.onyx-nav-menu .group-indicator:after{content:"";position:absolute;top:50%;left:50%;width:16px;height:1px;background:currentColor;transform:translate(-50%,-50%);opacity:1}.onyx-nav-menu .group-indicator:after{transform:translate(-50%,-50%) rotate(90deg)}.onyx-nav-menu .group-item[data-open=true]{box-sizing:border-box;width:calc(100% + (var(--nav-x-padding) * 2));margin-inline:calc(var(--nav-x-padding) * -1);padding-inline:var(--nav-x-padding);background:var(--color-grey)}.onyx-nav-menu .group-button[aria-expanded=true]{width:100%;margin-inline:0;padding-inline:0;background:transparent}.onyx-nav-menu .group-button[aria-expanded=true] .group-indicator:after{opacity:0}.onyx-nav-menu .panels{display:none}.onyx-nav-menu .mobile-panel-slot{box-sizing:border-box;display:grid;grid-template-rows:0fr;width:100%;margin-inline:0;overflow:hidden;background:transparent;transition:grid-template-rows .28s ease}.onyx-nav-menu .mobile-panel-slot[data-open=true]{grid-template-rows:1fr}.onyx-nav-menu .mobile-panel-slot[hidden]{display:none}.onyx-nav-menu .mobile-panel-slot .panel{height:auto;min-height:0;overflow:hidden}.onyx-nav-menu .mobile-panel-slot .panel-body{opacity:0;transform:translateY(-8px);padding:14px 0 28px;border-top:1px solid rgb(0 0 0 / 12%);transition:opacity .18s ease,transform .28s ease}.onyx-nav-menu .mobile-panel-slot[data-open=true] .panel-body{opacity:1;transform:translateY(0)}.onyx-nav-menu .mobile-panel-slot .child-list li{padding-inline:0}.onyx-nav-menu .panel-body{flex-direction:column;gap:16px}.onyx-nav-menu .panel-body>*{flex:0 0 auto}.onyx-nav-menu .banner-callout{aspect-ratio:4 / 3;height:auto;min-height:175px}.onyx-nav-menu .mobile-banner-overlay{display:block}}
/*# sourceMappingURL=/cdn/shop/t/31/assets/onyx-nav.css.map */