@property --showcase-color{syntax: "<color>"; inherits: true; initial-value: #c9a3a0;}.swatch-showcase{--showcase-color: #c9a3a0;--showcase-ease: cubic-bezier(.22, 1, .36, 1);transition:--showcase-color .7s var(--showcase-ease)}.swatch-showcase__inner{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(32px,5vw,88px);align-items:center}.swatch-showcase--media-right .swatch-showcase__stage{order:2}.swatch-showcase__stage{position:relative;display:grid;place-items:center;overflow:hidden;isolation:isolate;aspect-ratio:4 / 5;background:color-mix(in srgb,var(--showcase-color) var(--showcase-tint, 28%),var(--bg));border-radius:var(--radius-xl)}.swatch-showcase--arch .swatch-showcase__stage{border-radius:999px 999px var(--radius-xl) var(--radius-xl)}.swatch-showcase--pill .swatch-showcase__stage{border-radius:999px}.swatch-showcase__blob{position:absolute;top:50%;left:50%;z-index:-1;width:74%;aspect-ratio:1;background:radial-gradient(circle at 35% 30%,color-mix(in srgb,#fff 38%,var(--showcase-color)),var(--showcase-color) 62%);border-radius:46% 54% 58% 42%/52% 44% 56% 48%;opacity:.9;transform:translate(-50%,-50%) rotate(var(--showcase-turn, 0deg));transition:transform 1.1s var(--showcase-ease)}.swatch-showcase__word{position:absolute;inset:auto 0 6%;z-index:-1;margin:0;overflow:hidden;color:color-mix(in srgb,var(--showcase-color) 55%,var(--fg));font-family:var(--font-heading-secondary, var(--font-heading));font-size:clamp(56px,9vw,150px);font-style:italic;line-height:1;letter-spacing:-.03em;text-align:center;white-space:nowrap;opacity:.22;pointer-events:none}.swatch-showcase__word span{display:inline-block}.swatch-showcase__media{position:relative;display:grid;width:82%;aspect-ratio:4 / 5;transform:perspective(900px) rotateX(var(--tilt-x, 0deg)) rotateY(var(--tilt-y, 0deg));transition:transform .5s var(--showcase-ease)}.swatch-showcase__image{grid-area:1 / 1;min-width:0;opacity:0;transform:translateY(28px) rotate(3deg) scale(.96);transition:opacity .42s ease,transform .8s var(--showcase-ease);pointer-events:none}.swatch-showcase__image.is-active{opacity:1;transform:none;pointer-events:auto}.swatch-showcase__image.is-leaving{opacity:0;transform:translateY(-18px) rotate(-3deg) scale(.98)}.swatch-showcase__image img,.swatch-showcase__placeholder{display:block;width:100%;height:100%;object-fit:contain}.swatch-showcase__image--cutout{position:relative}.swatch-showcase__image--cutout:after{position:absolute;bottom:8%;left:18%;z-index:-1;width:64%;height:7%;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--showcase-color) 30%,rgba(42,31,36,.28)),transparent);content:"";filter:blur(6px)}.swatch-showcase__image--card{align-self:center;overflow:hidden;border-radius:var(--radius-lg);box-shadow:0 24px 48px -28px #2a1f2473}.swatch-showcase__image--card img{height:auto;aspect-ratio:4 / 5;object-fit:cover}.swatch-showcase--fit-cover .swatch-showcase__blob{display:none}.swatch-showcase--fit-cover .swatch-showcase__media{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;aspect-ratio:auto;transform:none}.swatch-showcase--fit-cover .swatch-showcase__image img{object-fit:cover}.swatch-showcase--fit-cover .swatch-showcase__image{transform:scale(1.06)}.swatch-showcase--fit-cover .swatch-showcase__image.is-active{transform:none}.swatch-showcase--fit-cover .swatch-showcase__image.is-leaving{transform:scale(1.02)}.swatch-showcase__placeholder{fill:color-mix(in srgb,var(--fg) 30%,transparent);mix-blend-mode:normal}.swatch-showcase__counter{position:absolute;z-index:2;top:clamp(16px,2.4vw,28px);right:clamp(16px,2.4vw,28px);margin:0;padding:6px 12px;border-radius:999px;background:color-mix(in srgb,var(--bg) 78%,transparent);font-size:12px;font-variant-numeric:tabular-nums;letter-spacing:.08em}.swatch-showcase--arch .swatch-showcase__counter{top:auto;bottom:clamp(16px,2.4vw,28px)}.swatch-showcase__panel{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;min-width:0}.swatch-showcase__intro{display:grid;gap:12px}.swatch-showcase__title{margin:0;color:inherit;text-decoration:none}.swatch-showcase__label{margin:0 0 14px;font-size:14px;letter-spacing:.02em}.swatch-showcase__label-value{font-weight:600}.swatch-showcase__swatches{display:flex;flex-wrap:wrap;gap:12px}.swatch-showcase__swatch{position:relative;width:52px;height:52px;padding:0;border:0;border-radius:50%;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--fg) 10%,transparent);cursor:pointer;transition:transform .3s var(--showcase-ease),box-shadow .3s ease}.swatch-showcase__swatch:before{position:absolute;top:12%;right:30%;bottom:52%;left:18%;border-radius:50%;background:linear-gradient(160deg,#ffffff8c,#fff0);content:"";transform:rotate(-24deg)}.swatch-showcase__swatch:after{position:absolute;top:-5px;right:-5px;bottom:-5px;left:-5px;border:1.5px solid var(--fg);border-radius:50%;content:"";opacity:0;transform:scale(.86);transition:opacity .25s ease,transform .4s var(--showcase-ease)}.swatch-showcase__swatch:hover{transform:translateY(-3px) scale(1.06)}.swatch-showcase__swatch[aria-checked=true]:after{opacity:1;transform:none}.swatch-showcase__swatch:focus-visible{outline:2px solid var(--fg);outline-offset:6px}.swatch-showcase__swatch.is-sold-out{background-image:linear-gradient(135deg,transparent calc(50% - 1px),color-mix(in srgb,var(--bg) 85%,transparent) calc(50% - 1px),color-mix(in srgb,var(--bg) 85%,transparent) calc(50% + 1px),transparent calc(50% + 1px))}.swatch-showcase__swatch-name{position:absolute;bottom:calc(100% + 10px);left:50%;padding:4px 10px;border-radius:999px;background:var(--fg);color:var(--bg);font-size:12px;white-space:nowrap;opacity:0;pointer-events:none;transform:translate(-50%,6px);transition:opacity .2s ease,transform .3s var(--showcase-ease)}@media(hover:hover){.swatch-showcase__swatch:hover .swatch-showcase__swatch-name{opacity:1;transform:translate(-50%)}}.swatch-showcase__note{min-height:1.5em;margin:16px 0 0;color:var(--muted)}.swatch-showcase__note:empty{display:none}.swatch-showcase__actions{display:flex;flex-wrap:wrap;gap:12px}.swatch-showcase__add{min-width:200px}@media(max-width:989px){.swatch-showcase__inner{grid-template-columns:minmax(0,1fr);gap:28px}.swatch-showcase--media-right .swatch-showcase__stage{order:0}.swatch-showcase__stage{aspect-ratio:1}.swatch-showcase__media{width:70%}.swatch-showcase__swatches{flex-wrap:nowrap;margin-inline:calc(var(--page-gutter, 16px) * -1);padding:6px var(--page-gutter, 16px);overflow-x:auto;scrollbar-width:none}.swatch-showcase__swatches::-webkit-scrollbar{display:none}.swatch-showcase__swatch{flex:0 0 auto;width:46px;height:46px}.swatch-showcase__actions>*{flex:1 1 auto}}@media(prefers-reduced-motion:reduce){.swatch-showcase,.swatch-showcase__blob,.swatch-showcase__media,.swatch-showcase__image{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/3/assets/section-swatch-showcase.css.map */
