.shop-by-color.no-heading .shop-by-color__header{display:none}.shop-by-color__header .buttons{margin-left:auto;gap:10px}.shop-by-color__header .buttons .btn{min-width:280px}.shop-by-color__heading{margin:0;flex-shrink:0}.shop-by-color__grid{display:grid;grid-template-columns:1fr;gap:var(--grid-mobile-vertical-spacing, 1.5rem) var(--grid-mobile-horizontal-spacing, 1.5rem);list-style:none;margin:0;padding:0}.shop-by-color__grid.count-1{display:block}.shop-by-color__grid.count-1 .shop-by-color__item:nth-child(1){height:225px;min-height:unset}.shop-by-color__grid.count-1 .shop-by-color__item:nth-child(1) .shop-by-color__label .description{display:none!important}.shop-by-color__item{position:relative;aspect-ratio:4 / 3}@media screen and (min-width:1240px){.shop-by-color__grid{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);grid-auto-flow:row dense;gap:10px 10px}.shop-by-color__grid.count-7{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(4,1fr);grid-auto-flow:row dense;gap:10px 10px}.shop-by-color__item{aspect-ratio:auto}.shop-by-color__item:nth-child(2){grid-column:3;grid-row:1;min-height:225px}.shop-by-color__item:nth-child(3){grid-column:1;grid-row:3}.shop-by-color__item:nth-child(4){grid-column:2;grid-row:3}.shop-by-color__item:nth-child(5){grid-column:3;grid-row:2 / span 2;min-height:450px}.shop-by-color__grid.count-7 .shop-by-color__item:nth-child(2){grid-column:3;grid-row:1;min-height:225px}.shop-by-color__grid.count-7 .shop-by-color__item:nth-child(3){grid-column:1;grid-row:3/ 5;min-height:450px}.shop-by-color__grid.count-7 .shop-by-color__item:nth-child(4){grid-column:2;grid-row:3}.shop-by-color__grid.count-7 .shop-by-color__item:nth-child(5){grid-column:3;grid-row:2 / span 2;min-height:450px}.shop-by-color__item:nth-child(6){grid-column:2;grid-row:4 / 5;min-height:225px}.shop-by-color__item:nth-child(7){grid-column:3;grid-row:4 / 5;min-height:225px}.shop-by-color__grid.count-8 .shop-by-color__item:nth-child(6){grid-column:1;grid-row:4 / span 1}.shop-by-color__grid.count-8 .shop-by-color__item:nth-child(7){grid-column:2;grid-row:4 / span 1}.shop-by-color__grid.count-8 .shop-by-color__item:nth-child(8){grid-column:3;grid-row:4 / span 1}.shop-by-color__item--wide{grid-column:1 / span 2;grid-row:1 / span 2;min-height:450px}}.shop-by-color__link{display:block;position:relative;height:100%;color:inherit;text-decoration:none}.shop-by-color__media{height:100%}.shop-by-color__media .placeholder-svg{height:100%;width:100%}.media>.shop-by-color__image,.shop-by-color__image{transition:all var(--duration-long, .5s) ease}@media(prefers-reduced-motion:no-preference){.shop-by-color__link:hover .shop-by-color__image,.shop-by-color__link:focus-visible .shop-by-color__image{transform:scale(1.04)}}.shop-by-color__scrim{background:linear-gradient(to top,#0009,#0000 55%);z-index:1}.shop-by-color__label{z-index:2;display:flex!important;align-items:flex-end;align-content:flex-end;justify-content:flex-start;padding:2rem;flex-wrap:wrap}.shop-by-color__label .description{font-weight:400;font-size:16px;line-height:140%;letter-spacing:.01em;width:100%;color:#fff;margin-top:3px}.shop-by-color__label-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-top:1rem;border-top:1px solid #fff;transition:all linear .33s;flex-grow:0}a:hover .shop-by-color__label-inner{flex-grow:1}.shop-by-color__label-text{font-family:var(--second-family);font-weight:400;font-size:20px;line-height:140%;color:#fff}.shop-by-color__label-icon{flex-shrink:0;color:#fff}.shop-by-color__link[aria-disabled=true]{cursor:default}@media screen and (max-width:1239px){.shop-by-color__item:nth-child(1) .media>.shop-by-color__image{object-position:right top}.shop-by-color__item:nth-child(2) .media>.shop-by-color__image{object-position:20% top}.shop-by-color__item:nth-child(3) .media>.shop-by-color__image{object-position:right top}.shop-by-color__item:nth-child(4) .media>.shop-by-color__image{object-position:center top}.shop-by-color__item:nth-child(5) .media>.shop-by-color__image{object-position:right top}.shop-by-color__item:nth-child(6) .media>.shop-by-color__image{object-position:right top}.shop-by-color__item:nth-child(7) .media>.shop-by-color__image{object-position:right top}.shop-by-color__item:nth-child(8) .media>.shop-by-color__image{object-position:right top}}
/*# sourceMappingURL=/cdn/shop/t/2/assets/component-shop-by-color.css.map */
