:root{--cmn-size-desk: 110px;--cmn-size-mob: 88px;--cmn-size-xs: 68px;--cmn-gap-desk: 20px 16px;--cmn-gap-mob: 16px 12px;--cmn-ring: rgba(0, 96, 166, .6);--cmn-scale: 1.06;--cmn-ease: .22s cubic-bezier(.4, 0, .2, 1);--cmn-bg: #f0ece5;--cmn-title-desk: clamp(11px, 1.1vw, 13px);--cmn-title-mob: clamp(11px, 3vw, 13px);--cmn-cell-desk: calc(var(--cmn-size-desk) + 24px);--cmn-cell-mob: calc(var(--cmn-size-mob) + 16px)}.circular-nav-grid{display:grid;grid-template-columns:repeat(auto-fill,var(--cmn-cell-desk));justify-content:start;gap:var(--cmn-gap-desk);list-style:none;margin:0;padding:24px 0 8px;max-height:68vh;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.12) transparent;-webkit-mask-image:linear-gradient(to bottom,black 85%,transparent 100%);mask-image:linear-gradient(to bottom,black 85%,transparent 100%)}.circular-nav-grid::-webkit-scrollbar{width:4px}.circular-nav-grid::-webkit-scrollbar-track{background:transparent}.circular-nav-grid::-webkit-scrollbar-thumb{background:#00000024;border-radius:99px}.circular-nav-grid.is-expanded{max-height:none;-webkit-mask-image:none;mask-image:none}.circular-nav-item{display:flex;flex-direction:column;align-items:center;text-align:center;width:var(--cmn-cell-desk)}.circular-nav-item a{display:flex;flex-direction:column;align-items:center;gap:8px;text-decoration:none;color:inherit;border-radius:10px;padding:6px 4px;outline:none;-webkit-tap-highlight-color:transparent;width:calc(var(--cmn-size-desk) + 8px)}.circular-nav-item a:focus-visible{box-shadow:0 0 0 3px var(--cmn-ring)}.circular-nav-img{display:block;width:var(--cmn-size-desk);height:var(--cmn-size-desk);min-width:var(--cmn-size-desk);min-height:var(--cmn-size-desk);border-radius:50%;object-fit:cover;aspect-ratio:1 / 1;border:2.5px solid transparent;background:var(--cmn-bg);transition:transform var(--cmn-ease),box-shadow var(--cmn-ease),border-color var(--cmn-ease)}.circular-nav-item a:hover .circular-nav-img,.circular-nav-item a:focus-visible .circular-nav-img{will-change:transform;transform:scale(var(--cmn-scale));border-color:var(--cmn-ring);box-shadow:0 8px 24px #00000024}.circular-nav-item a:not(:hover):not(:focus-visible) .circular-nav-img{will-change:auto}.circular-nav-img--placeholder{display:flex;align-items:center;justify-content:center;font-size:calc(var(--cmn-size-desk) * .35);font-weight:600;color:#00000052;text-transform:uppercase;background:var(--cmn-bg)}.circular-nav-title{font-size:var(--cmn-title-desk);line-height:1.35;letter-spacing:.01em;color:inherit;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-width:var(--cmn-size-desk);background-image:linear-gradient(currentColor,currentColor);background-position:0 100%;background-repeat:no-repeat;background-size:0% 1px;transition:background-size var(--cmn-ease)}.circular-nav-item a:hover .circular-nav-title,.circular-nav-item a:focus-visible .circular-nav-title{background-size:100% 1px}.circular-nav-footer{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px 16px;padding:16px 0 20px;border-top:1px solid rgba(0,0,0,.07);margin-top:8px}.circular-nav-btn{display:inline-flex;align-items:center;gap:6px;padding:9px 18px;border-radius:999px;font-size:13px;font-weight:500;letter-spacing:.02em;cursor:pointer;text-decoration:none;transition:background var(--cmn-ease),color var(--cmn-ease),box-shadow var(--cmn-ease),transform var(--cmn-ease);white-space:nowrap;line-height:1;outline:none;border:none}.circular-nav-btn:focus-visible{box-shadow:0 0 0 3px var(--cmn-ring)}.circular-nav-btn svg{flex-shrink:0;transition:transform var(--cmn-ease)}.circular-nav-btn--expand{background:transparent;color:inherit;border:1.5px solid rgba(0,0,0,.18)}.circular-nav-btn--expand:hover{background:#0000000d;border-color:#0000004d;transform:translateY(-1px);box-shadow:0 3px 10px #0000000f}.circular-nav-btn--explore{background:#0060a6;color:#fff;border:1.5px solid transparent}.circular-nav-btn--explore:hover{background:#004f8a;transform:translateY(-1px);box-shadow:0 4px 14px #0060a64d}.circular-nav-btn--explore:hover svg{transform:translate(3px)}.circular-nav-btn--explore:active{transform:translateY(0);box-shadow:none}@media screen and (max-width:767px){.circular-nav-grid{grid-template-columns:repeat(auto-fill,var(--cmn-cell-mob));gap:var(--cmn-gap-mob);padding:16px 0 8px;max-height:none;-webkit-mask-image:none;mask-image:none;padding-left:max(0px,env(safe-area-inset-left));padding-right:max(0px,env(safe-area-inset-right))}.circular-nav-item{width:var(--cmn-cell-mob)}.circular-nav-item a{width:calc(var(--cmn-size-mob) + 8px)}.circular-nav-img{width:var(--cmn-size-mob);height:var(--cmn-size-mob);min-width:var(--cmn-size-mob);min-height:var(--cmn-size-mob)}.circular-nav-img--placeholder{font-size:calc(var(--cmn-size-mob) * .35)}.circular-nav-title{font-size:var(--cmn-title-mob);max-width:var(--cmn-size-mob)}.circular-nav-item a:active .circular-nav-img{transform:scale(.93);border-color:var(--cmn-ring)}@media(hover:none){.circular-nav-item a:hover .circular-nav-img{transform:none;border-color:transparent;box-shadow:none}.circular-nav-item a:hover .circular-nav-title{background-size:0% 1px}}.circular-nav-footer{flex-direction:row;flex-wrap:nowrap;align-items:stretch;justify-content:center;gap:10px;padding:14px 12px max(18px,env(safe-area-inset-bottom));padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}.circular-nav-btn{flex:1 1 0;max-width:190px;min-width:0;justify-content:center;font-size:12px;padding:11px 10px;white-space:normal;text-align:center;line-height:1.3}}@media screen and (max-width:359px){.circular-nav-footer{flex-direction:column;align-items:stretch}.circular-nav-btn{max-width:none;font-size:12px;padding:11px 12px}}@media screen and (max-width:359px){.circular-nav-grid{grid-template-columns:repeat(auto-fill,calc(var(--cmn-size-xs) + 12px))}.circular-nav-item{width:calc(var(--cmn-size-xs) + 12px)}.circular-nav-item a{width:calc(var(--cmn-size-xs) + 8px)}.circular-nav-img{width:var(--cmn-size-xs);height:var(--cmn-size-xs);min-width:var(--cmn-size-xs);min-height:var(--cmn-size-xs)}}@media(prefers-reduced-motion:reduce){.circular-nav-img,.circular-nav-title,.circular-nav-btn{transition:none!important;animation:none!important}}@media(forced-colors:active){.circular-nav-img{border-color:ButtonText;forced-color-adjust:none}.circular-nav-btn--explore{background:ButtonText;color:ButtonFace}}@media print{.circular-nav-grid,.circular-nav-footer{display:none}}
/*# sourceMappingURL=/cdn/shop/t/98/assets/circular-menu-images.css.map */