/** Shopify CDN: Minification failed

Line 16:17 Unexpected "{"
Line 16:26 Expected ":"
Line 16:33 Unexpected "{"
Line 170:17 Unexpected "{"
Line 170:26 Expected ":"
Line 170:33 Unexpected "{"

**/
/* SHOPIFY_STYLESHEETS_VERSION: 1.0 */


/* CSS from section stylesheet tags */
/* START_SECTION:shop-by-color (INDEX:152) */
.shop-by-color--{{ section.id }} {
background:
radial-gradient(circle at 15% 20%, rgba(244, 222, 215, 0.55) 0%, transparent 24%),
radial-gradient(circle at 85% 30%, rgba(232, 224, 245, 0.55) 0%, transparent 22%),
linear-gradient(180deg, #fffdfc 0%, #faf7f4 100%);
padding: 64px 0;
overflow: hidden;
}

.shop-by-color__header {
text-align: center;
margin: 0 auto 38px;
max-width: 620px;
}

.shop-by-color__heading {
margin: 0 0 10px;
font-size: clamp(30px, 4vw, 46px);
line-height: 1;
letter-spacing: -0.04em;
color: #171717;
}

.shop-by-color__text {
color: #6f6a65;
}

.shop-by-color__grid {
display: grid;
grid-template-columns: repeat(6, minmax(0, 1fr));
gap: 28px 22px;
max-width: 860px;
margin: 0 auto;
}

.shop-by-color__item {
display: flex;
justify-content: center;
}

.shop-by-color__card {
display: flex;
flex-direction: column;
align-items: center;
gap: 12px;
text-decoration: none;
color: inherit;
padding: 10px 8px;
width: 100%;
border-radius: 24px;
transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
}

.shop-by-color__swatch-wrap {
position: relative;
width: 56px;
height: 56px;
display: flex;
align-items: center;
justify-content: center;
}

.shop-by-color__glow {
position: absolute;
inset: -7px;
border-radius: 50%;
background: radial-gradient(circle, rgba(245, 213, 201, 0.9) 0%, rgba(255,255,255,0) 72%);
opacity: .55;
filter: blur(10px);
transform: scale(.9);
transition: transform .25s ease, opacity .25s ease;
pointer-events: none;
}

.shop-by-color__swatch {
position: relative;
z-index: 1;
width: 56px;
height: 56px;
border-radius: 50%;
overflow: hidden;
background: #fff;
border: 2px solid #fff;
box-shadow:
0 8px 18px rgba(0,0,0,.08),
inset 0 1px 0 rgba(255,255,255,.9);
transition: transform .25s ease, box-shadow .25s ease;
}

.shop-by-color__image,
.shop-by-color__placeholder svg {
width: 100%;
height: 100%;
display: block;
}

.shop-by-color__image {
object-fit: cover;
border-radius: 50%;
transition: transform .3s ease, filter .3s ease;
}

.shop-by-color__placeholder {
width: 100%;
height: 100%;
}

.shop-by-color__placeholder .placeholder-svg {
background: #f3f3f3;
fill: rgba(0,0,0,.12);
}

.shop-by-color__label {
font-size: 13px;
line-height: 1.15;
text-align: center;
color: #202020;
letter-spacing: -0.01em;
}

.shop-by-color__card:hover,
.shop-by-color__card:focus-visible {
transform: translateY(-4px);
}

.shop-by-color__card:hover .shop-by-color__swatch,
.shop-by-color__card:focus-visible .shop-by-color__swatch {
transform: scale(1.06);
box-shadow:
0 14px 26px rgba(0,0,0,.12),
inset 0 1px 0 rgba(255,255,255,.9);
}

.shop-by-color__card:hover .shop-by-color__image,
.shop-by-color__card:focus-visible .shop-by-color__image {
transform: scale(1.08);
filter: saturate(1.04);
}

.shop-by-color__card:hover .shop-by-color__glow,
.shop-by-color__card:focus-visible .shop-by-color__glow {
opacity: .95;
transform: scale(1.05);
}


@media screen and (max-width: 989px) {
.shop-by-color__grid {
grid-template-columns: repeat(4, minmax(0, 1fr));
max-width: 620px;
}
}

@media screen and (max-width: 749px) {
.shop-by-color--{{ section.id }} {
padding: 44px 0;
}

.shop-by-color__header {
margin-bottom: 28px;
}

.shop-by-color__grid {
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 20px 12px;
max-width: 100%;
}

.shop-by-color__swatch-wrap,
.shop-by-color__swatch {
width: 48px;
height: 48px;
}

.shop-by-color__label {
font-size: 12px;
}

.shop-by-color__item:nth-child(2),
.shop-by-color__item:nth-child(8),
.shop-by-color__item:nth-child(3),
.shop-by-color__item:nth-child(9),
.shop-by-color__item:nth-child(5),
.shop-by-color__item:nth-child(11) {
transform: none;
}
}
/* END_SECTION:shop-by-color */