.finish-showcase{container-type:inline-size;margin-top:1.2rem;border:.1rem solid #e6ddcf;background-color:rgb(var(--color-background));color:rgb(var(--color-foreground))}.finish-showcase__inner{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"swatches" "text" "button";align-items:center;gap:0;padding:1.6rem}.finish-showcase__swatches{grid-area:swatches}.finish-showcase__text{grid-area:text;margin-top:2rem}.finish-showcase__button{grid-area:button;justify-self:start}@container (min-width: 560px){.finish-showcase__inner{grid-template-columns:minmax(0,3fr) minmax(0,2fr);grid-template-rows:1fr auto auto 1fr;grid-template-areas:"swatches ." "swatches text" "swatches button" "swatches .";gap:0 3.2rem;padding:2rem 2.4rem}.finish-showcase__text{margin-top:0}}.finish-showcase__swatches{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:1rem;margin:0;padding:0}.finish-showcase__swatch{display:block;width:100%;aspect-ratio:1;padding:0;border:.1rem solid rgba(0,0,0,.1);border-radius:50%;overflow:hidden;background-color:#e9e4dc;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}.finish-showcase__swatch:hover{transform:scale(1.06);box-shadow:0 .3rem .8rem #00000026}.finish-showcase__swatch:focus-visible{outline:.2rem solid rgb(var(--color-foreground));outline-offset:.2rem}.finish-showcase__swatch img{display:block;width:100%;height:100%;object-fit:cover}.finish-showcase__text{display:flex;flex-direction:column;align-items:flex-start;gap:.8rem}.finish-showcase__eyebrow{margin:0;font-size:1.4rem;line-height:1.2;letter-spacing:.18em;text-transform:uppercase;color:#8a6a2f}.finish-showcase__heading{margin:0;font-family:var(--font-heading-family);font-weight:300;font-size:2.6rem;line-height:1.25}.finish-showcase__body{margin:0;font-size:1.4rem;line-height:1.5;letter-spacing:normal;color:#625a4f}.finish-showcase__button{--buttons-radius: 2.3rem;--buttons-radius-outset: 2.3rem;margin-top:1.6rem;min-height:4.6rem;padding:0 2.4rem;font-size:1.4rem;font-weight:500;letter-spacing:.02em}@media screen and (max-width:749px){.finish-showcase__inner{grid-template-columns:minmax(0,1fr);grid-template-rows:none;grid-template-areas:"text" "swatches" "button";gap:0}.finish-showcase__text{margin-top:0}.finish-showcase__swatches{margin-top:2rem}.finish-showcase__button{justify-self:center;margin-top:2rem}}
/*# sourceMappingURL=/cdn/shop/t/8/assets/component-finish-showcase.css.map */
