.color-nav{--cn-color-dark: #18171C;--cn-circle-bg: #FFFFFF;--cn-cols-mobile: 3;--cn-cols-desktop: 6;--cn-gap-mobile: 8px;--cn-gap-desktop: 24px}.color-nav{margin:0;padding:0}.color-nav__container{display:flex;flex-direction:column;gap:24px;padding-block:32px}@media(min-width:750px){.color-nav__container{gap:48px;padding-block:72px}}.color-nav__heading{margin:0;font-family:var(--font-heading--family, "Gilda Display", serif);font-size:2.1875rem;font-weight:400;line-height:1.2;color:var(--color-foreground, var(--cn-color-dark));text-align:center}@media(min-width:750px){.color-nav__heading{font-size:3.4375rem;line-height:1.1}}.color-nav__grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(var(--cn-cols-mobile),1fr);gap:24px var(--cn-gap-mobile)}@media(min-width:750px){.color-nav__grid{grid-template-columns:repeat(var(--cn-cols-desktop),1fr);gap:var(--cn-gap-desktop)}}.color-nav__link{display:flex;flex-direction:column;align-items:center;gap:8px;text-decoration:none}@media(min-width:750px){.color-nav__link{gap:24px}}.color-nav__circle{width:100%;aspect-ratio:1 / 1;border-radius:var(--dc-radius-pill, 999px);background-color:var(--cn-circle-bg);overflow:hidden;position:relative;flex-shrink:0;box-shadow:0 0 0 0 transparent;transition:transform var(--dc-transition-base, .25s ease-out),box-shadow var(--dc-transition-base, .25s ease-out)}.color-nav__link:hover .color-nav__circle,.color-nav__link:focus-visible .color-nav__circle{transform:scale(1.04);box-shadow:0 0 0 3px var(--color-primary)}.color-nav__image{display:block;width:100%;height:100%;object-fit:cover;object-position:center;position:absolute;top:0;right:0;bottom:0;left:0}.color-nav__image-placeholder{width:100%;height:100%;background-color:var(--cn-circle-bg)}.color-nav__label{display:block;width:100%;font-family:var(--font-heading--family, "Gilda Display", serif);font-size:1.125rem;font-weight:400;line-height:1.1;color:var(--color-foreground, var(--cn-color-dark));text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color var(--dc-transition-base, .25s ease-out)}.color-nav__link:hover .color-nav__label,.color-nav__link:focus-visible .color-nav__label{color:var(--color-primary)}@media(min-width:750px){.color-nav__label{font-size:1.5rem}}.color-nav__link:focus-visible{outline:2px solid var(--color-foreground, var(--cn-color-dark));outline-offset:4px;border-radius:4px}@media(prefers-reduced-motion:reduce){.color-nav__circle,.color-nav__label{transition:none}}.color-nav__viewport{position:relative;display:block}.color-nav__grid--slider{display:flex;grid-template-columns:none;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none;padding-block-end:4px;scroll-padding-inline:4px}.color-nav__grid--slider::-webkit-scrollbar{display:none}.color-nav__grid--slider .color-nav__item{flex:0 0 calc((100% - 32px) / 3);scroll-snap-align:start}@media(min-width:750px){.color-nav__grid--slider{gap:24px}.color-nav__grid--slider .color-nav__item{flex:0 0 calc((100% - 120px) / 6)}}.color-nav__arrow{position:absolute;top:calc(50% - 22px);transform:translateY(-50%);z-index:2;display:none;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:1px solid rgba(24,23,28,.14);border-radius:var(--dc-radius-pill,999px);background:#fff;color:var(--cn-color-dark,#18171C);cursor:pointer;box-shadow:0 2px 10px #18171c1f;transition:background var(--dc-transition-fast,.15s ease-out),box-shadow var(--dc-transition-fast,.15s ease-out)}.color-nav__viewport[data-scrollable] .color-nav__arrow{display:flex}.color-nav__arrow[hidden]{display:none}.color-nav__arrow:hover{background:#f6f6f7;box-shadow:0 4px 14px #18171c2e}.color-nav__arrow:focus-visible{outline:2px solid var(--color-foreground,#18171C);outline-offset:2px}.color-nav__arrow--prev{inset-inline-start:-8px}.color-nav__arrow--next{inset-inline-end:-8px}@media(min-width:750px){.color-nav__arrow--prev{inset-inline-start:-22px}.color-nav__arrow--next{inset-inline-end:-22px}}@media(prefers-reduced-motion:reduce){.color-nav__grid--slider{scroll-behavior:auto}}.color-nav__link:hover .color-nav__circle,.color-nav__link:focus-visible .color-nav__circle{transform:none;box-shadow:inset 0 0 0 3px var(--color-primary)}.color-nav__circle{isolation:isolate;-webkit-mask-image:-webkit-radial-gradient(white,black)}.color-nav__image{border-radius:inherit;transition:transform var(--dc-transition-base, .25s ease-out)}.color-nav__link:hover .color-nav__image,.color-nav__link:focus-visible .color-nav__image{transform:scale(1.06)}@media(prefers-reduced-motion:reduce){.color-nav__image{transition:none}.color-nav__link:hover .color-nav__image,.color-nav__link:focus-visible .color-nav__image{transform:none}}
/*# sourceMappingURL=/cdn/shop/t/9/assets/section-color-navigation.css.map */