calyvi-shade-selector.cshade{--cshade-font-title: var(--font-heading-family, "Cormorant", "Cormorant Garamond", serif);--cshade-font-body: var(--font-body-family, "DM Sans", sans-serif);--cshade-line: color-mix(in srgb, var(--cshade-ink) 14%, transparent);--cshade-soft: color-mix(in srgb, var(--cshade-ink) 62%, transparent);--cshade-gutter: clamp(20px, 4.5vw, 72px);--cshade-name-size: clamp(36px, 10.4vw, 54px);--cshade-strip: 40px;--cshade-gap: 4px;--cshade-spine: 12px;--cshade-open: min(66vw, 400px);--cshade-dur: .54s;--cshade-ease: cubic-bezier(.45, .05, .35, 1);display:block;background:var(--cshade-bg);color:var(--cshade-ink);overflow:hidden}calyvi-shade-selector.cshade *,calyvi-shade-selector.cshade *:before,calyvi-shade-selector.cshade *:after{box-sizing:border-box}.cshade__inner{max-width:1560px;margin:0 auto;padding:clamp(72px,19vw,112px) var(--cshade-gutter) clamp(56px,15vw,96px)}.cshade__header{margin:0 0 clamp(26px,7vw,40px)}calyvi-shade-selector.cshade .cshade__eyebrow{margin:0 0 14px;font-family:var(--cshade-font-body);font-size:11px;font-weight:500;letter-spacing:.24em;line-height:1.4;text-transform:uppercase;color:var(--cshade-soft)}calyvi-shade-selector.cshade .cshade__heading{margin:0;font-family:var(--cshade-font-title);font-weight:var(--font-heading-weight, 400);font-style:normal;font-size:clamp(40px,11.6vw,64px);line-height:.94;letter-spacing:-.03em;text-transform:uppercase;text-wrap:balance;color:inherit}.cshade__stage{position:relative}.cshade__swatches{position:relative;display:flex;gap:var(--cshade-gap);height:clamp(360px,106vw,540px);margin:0 calc(var(--cshade-gutter) * -1);padding:6px var(--cshade-gutter);overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch}.cshade__swatches::-webkit-scrollbar{display:none}calyvi-shade-selector.cshade .cshade__swatch{position:relative;flex:0 0 var(--cshade-strip);display:block;min-width:0;height:auto;margin:0;padding:0;border:0;border-radius:2px;background:none;box-shadow:none;color:inherit;font:inherit;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-appearance:none;appearance:none;transition:flex-basis var(--cshade-dur) var(--cshade-ease),flex-grow var(--cshade-dur) var(--cshade-ease)}calyvi-shade-selector.cshade .cshade__swatch:first-child{margin-left:auto}calyvi-shade-selector.cshade .cshade__swatch:last-child{margin-right:auto}calyvi-shade-selector.cshade .cshade__swatch:before,calyvi-shade-selector.cshade .cshade__swatch:after{display:none}calyvi-shade-selector.cshade .cshade__swatch[aria-checked=true]{flex-basis:var(--cshade-open);cursor:default}calyvi-shade-selector.cshade .cshade__swatch:focus{outline:none}calyvi-shade-selector.cshade .cshade__swatch:focus-visible{outline:2px solid var(--cshade-ink);outline-offset:2px;z-index:2}.cshade__clip{position:absolute;top:0;right:0;bottom:0;left:0;display:block;overflow:hidden;border-radius:2px;background-color:transparent;transition:background-color var(--cshade-dur) var(--cshade-ease),transform .3s cubic-bezier(.3,.7,.2,1)}.cshade__swatch[aria-checked=true] .cshade__clip{background-color:#efe9e2;background-color:color-mix(in srgb,var(--sw, #b9aca0) 20%,var(--cshade-bg))}.cshade__panel{position:absolute;top:0;bottom:0;left:0;display:block;width:var(--cshade-open);container-type:size;background-image:radial-gradient(120% 70% at 18% 0%,#fff9,#fff0 62%);opacity:0;transition:opacity var(--cshade-dur) var(--cshade-ease)}.cshade__swatch[aria-checked=true] .cshade__panel{opacity:1}.cshade__ghost{position:absolute;top:5%;left:calc(var(--cshade-spine) + 7%);display:block;font-family:var(--cshade-font-title);font-weight:400;font-size:120px;font-size:min(40cqw,26cqh);line-height:.8;letter-spacing:-.04em;font-variant-numeric:lining-nums;white-space:nowrap;color:#ddd2c8;color:color-mix(in srgb,var(--cshade-ink) 7%,color-mix(in srgb,var(--sw, #b9aca0) 34%,var(--cshade-bg)));-webkit-user-select:none;user-select:none}.cshade__swatch.has-photo .cshade__ghost{display:none}.cshade__plate,.cshade__photo,.cshade__pen{display:block;transform:scale(1.06);transition:transform var(--cshade-dur) var(--cshade-ease)}.cshade__swatch[aria-checked=true] .cshade__plate,.cshade__swatch[aria-checked=true] .cshade__photo,.cshade__swatch[aria-checked=true] .cshade__pen{transform:scale(1)}.cshade__plate{position:absolute;right:8%;bottom:7%;width:74%;width:min(74cqw,56cqh);aspect-ratio:1 / 1;overflow:hidden;border-radius:2px;box-shadow:0 28px 48px -30px #1f1d1d8c}.cshade__photo{position:absolute;top:0;right:0;bottom:0;left:0}.cshade__pen{position:absolute;right:6%;bottom:5%;width:clamp(72px,27%,136px);aspect-ratio:1 / 1;overflow:hidden;border-radius:2px;box-shadow:0 16px 30px -18px #1f1d1d99,0 0 0 1px #ffffff8c}calyvi-shade-selector.cshade .cshade__panel img{display:block;width:100%;height:100%;max-width:none;margin:0;object-fit:cover}calyvi-shade-selector.cshade .cshade__photo img{object-position:var(--pos-m, var(--pos, 50% 50%))}.cshade__caption{display:none}.cshade__swatch-color{position:absolute;top:0;right:0;bottom:0;left:0;display:block;background-color:var(--sw, #d8cfc6);background-image:linear-gradient(90deg,#fff3,#fff0 60%),var(--sw-img, none);background-size:cover;background-position:center;box-shadow:inset 0 0 0 1px #1f1d1d14;clip-path:inset(0 0 0 0);transition:clip-path var(--cshade-dur) var(--cshade-ease)}.cshade__swatch[aria-checked=true] .cshade__swatch-color{clip-path:inset(0 calc(100% - var(--cshade-spine)) 0 0)}@keyframes cshade-yield{0%{transform:scaleX(1)}42%{transform:scaleX(.72)}to{transform:scaleX(1)}}.cshade__swatch.is-yielding .cshade__swatch-color{animation:cshade-yield var(--cshade-dur) var(--cshade-ease)}.cshade__swatch.is-soldout .cshade__swatch-color{background-image:repeating-linear-gradient(135deg,#f8f5f0b3 0 1.5px,#f8f5f000 1.5px 8px),var(--sw-img, none)}.cshade__tip{display:none}.cshade__col{display:block;min-width:0}.cshade__ident{margin-top:26px}calyvi-shade-selector.cshade .cshade__meta{margin:0 0 10px;font-family:var(--cshade-font-body);font-size:11px;font-weight:500;letter-spacing:.24em;line-height:1.4;text-transform:uppercase;font-variant-numeric:tabular-nums;color:var(--cshade-soft)}calyvi-shade-selector.cshade .cshade__name{margin:0;font-family:var(--cshade-font-title);font-weight:var(--font-heading-weight, 400);font-size:var(--cshade-name-size);line-height:.98;letter-spacing:-.015em;text-transform:uppercase;text-wrap:balance;color:inherit}calyvi-shade-selector.cshade .cshade__desc{max-width:34em;margin:14px 0 0;font-family:var(--cshade-font-body);font-size:15px;line-height:1.6;color:var(--cshade-soft)}calyvi-shade-selector.cshade [hidden]{display:none!important}calyvi-shade-selector.cshade--has-desc .cshade__desc{min-height:4.8em}calyvi-shade-selector.cshade--has-desc .cshade__desc[hidden]{display:block!important;visibility:hidden}calyvi-shade-selector.cshade .cshade__buy{display:block;margin:28px 0 0}calyvi-shade-selector.cshade .cshade__form{margin:0}calyvi-shade-selector.cshade .cshade__cta{position:relative;display:flex;align-items:center;justify-content:center;width:100%;min-height:60px;margin:0;padding:0 28px;border:1px solid var(--cshade-ink);border-radius:999px;background:var(--cshade-ink);color:var(--cshade-bg);font-family:var(--cshade-font-body);font-size:13px;font-weight:500;letter-spacing:.18em;line-height:1;text-transform:uppercase;white-space:nowrap;cursor:pointer;box-shadow:none;-webkit-appearance:none;appearance:none;transition:background-color .3s ease,border-color .3s ease,color .3s ease,opacity .3s ease}calyvi-shade-selector.cshade .cshade__cta:before,calyvi-shade-selector.cshade .cshade__cta:after{display:none}@media(hover:hover){calyvi-shade-selector.cshade .cshade__cta:not([disabled]):hover{background:#6b5a58;border-color:#6b5a58}}calyvi-shade-selector.cshade .cshade__cta:focus-visible{outline:2px solid var(--cshade-ink);outline-offset:3px}calyvi-shade-selector.cshade .cshade__cta[disabled]{background:transparent;border-color:var(--cshade-line);color:var(--cshade-soft);cursor:not-allowed}.cshade__cta-label{display:block;transition:opacity .2s ease}calyvi-shade-selector.cshade .cshade__cta .loading-overlay__spinner{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;width:auto;height:auto}calyvi-shade-selector.cshade .cshade__cta .loading-overlay__spinner.hidden{display:none}calyvi-shade-selector.cshade .cshade__cta .spinner{width:20px;height:20px}calyvi-shade-selector.cshade .cshade__cta .spinner .path{stroke:currentColor}calyvi-shade-selector.cshade .cshade__cta.loading .cshade__cta-label{opacity:0}calyvi-shade-selector.cshade .cshade__error{margin:0 0 12px;font-family:var(--cshade-font-body);font-size:13px;line-height:1.4;color:#9b2b2b}@keyframes cshade-text-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.cshade [data-cshade-anim].is-swapping{animation:cshade-text-in var(--cshade-dur) var(--cshade-ease) both}calyvi-shade-selector.cshade .cshade__buy.is-swapping{animation:none}@media screen and (min-width:750px){calyvi-shade-selector.cshade{--cshade-open: min(56vw, 480px);--cshade-name-size: clamp(48px, 7vw, 64px)}.cshade__swatches{height:clamp(440px,62vw,600px)}calyvi-shade-selector.cshade .cshade__photo img{object-position:var(--pos, 50% 50%)}calyvi-shade-selector.cshade .cshade__buy{max-width:420px}}@media screen and (min-width:990px){.cshade__inner{padding:clamp(104px,10vw,176px) var(--cshade-gutter) clamp(96px,9vw,152px)}.cshade__header{margin-bottom:clamp(44px,4.8vw,76px)}calyvi-shade-selector.cshade .cshade__eyebrow{margin-bottom:18px}calyvi-shade-selector.cshade .cshade__heading{font-size:clamp(60px,6.6vw,116px)}}@media screen and (min-width:1100px)and (hover:hover)and (pointer:fine){@supports (width: 1cqw){calyvi-shade-selector.cshade{--cshade-spine: 14px;--cshade-open-pct: 48%;--cshade-pad: clamp(24px, 2.6vw, 40px)}.cshade__swatches{--cshade-open: 48cqw;height:clamp(520px,74vh,720px);height:clamp(520px,74svh,720px);margin:0;padding:0;overflow:visible;container-type:inline-size}calyvi-shade-selector.cshade .cshade__swatch{flex:1 1 0%;margin:0}calyvi-shade-selector.cshade .cshade__swatch[aria-checked=true]{flex:0 0 var(--cshade-open-pct)}.cshade__swatch:not([aria-checked=true]):hover .cshade__clip{transform:translateY(-10px)}.cshade__tip{position:absolute;left:50%;bottom:calc(100% + 20px);z-index:3;display:block;font-family:var(--cshade-font-body);font-size:10px;font-weight:500;letter-spacing:.2em;line-height:1;text-transform:uppercase;white-space:nowrap;color:var(--cshade-ink);opacity:0;transform:translate(-50%,4px);pointer-events:none;transition:opacity .2s ease,transform .2s ease}.cshade__swatch:not([aria-checked=true]):hover .cshade__tip,.cshade__swatch:not([aria-checked=true]):focus-visible .cshade__tip{opacity:1;transform:translate(-50%)}.cshade__ghost{top:calc(var(--cshade-pad) * .7);left:calc(var(--cshade-spine) + var(--cshade-pad));font-size:min(36cqw,30cqh)}.cshade__plate{top:11cqh;right:var(--cshade-pad);bottom:auto;width:min(50cqw,46cqh)}.cshade__caption{position:absolute;left:calc(var(--cshade-spine) + var(--cshade-pad));right:var(--cshade-pad);bottom:calc(var(--cshade-pad) + 60px + 22px);display:block;transform:translateY(12px);transition:transform var(--cshade-dur) var(--cshade-ease)}.cshade__swatch[aria-checked=true] .cshade__caption{transform:translateY(0)}.cshade__caption-meta{display:block;margin-bottom:12px;font-family:var(--cshade-font-body);font-size:11px;font-weight:500;letter-spacing:.24em;line-height:1.4;text-transform:uppercase;font-variant-numeric:tabular-nums;color:var(--cshade-soft)}.cshade__caption-name{display:block;max-width:9em;font-family:var(--cshade-font-title);font-weight:var(--font-heading-weight, 400);font-size:clamp(34px,8.4cqw,60px);line-height:.98;letter-spacing:-.015em;text-transform:uppercase;text-wrap:balance;color:var(--cshade-ink)}.cshade__caption-desc{display:-webkit-box;max-width:30em;margin-top:12px;overflow:hidden;font-family:var(--cshade-font-body);font-size:14px;line-height:1.5;-webkit-box-orient:vertical;-webkit-line-clamp:2;color:var(--cshade-soft)}.cshade__swatch.has-photo .cshade__photo:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to top,#1812128c,#18121200 48%)}.cshade__swatch.has-photo .cshade__caption-meta,.cshade__swatch.has-photo .cshade__caption-name,.cshade__swatch.has-photo .cshade__caption-desc{color:#fff}.cshade__swatch.has-photo .cshade__pen{top:var(--cshade-pad);right:var(--cshade-pad);bottom:auto}.cshade__col{position:absolute;z-index:4;bottom:var(--cshade-pad);left:calc(var(--cshade-i) * ((100% - var(--cshade-open-pct) - var(--cshade-n) * var(--cshade-gap)) / var(--cshade-n) + var(--cshade-gap)) + var(--cshade-spine) + var(--cshade-pad));width:min(calc(var(--cshade-open-pct) - var(--cshade-spine) - 2 * var(--cshade-pad)),320px)}.cshade__text{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}calyvi-shade-selector.cshade .cshade__buy{max-width:none;margin:0}@keyframes cshade-buy-in{0%,58%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}calyvi-shade-selector.cshade .cshade__buy.is-swapping{animation:cshade-buy-in var(--cshade-dur) ease-out both}}}@media(prefers-reduced-motion:reduce){calyvi-shade-selector.cshade .cshade__swatch,.cshade__clip,.cshade__panel,.cshade__swatch-color,.cshade__plate,.cshade__photo,.cshade__pen,.cshade__caption,.cshade__tip,.cshade__cta-label,calyvi-shade-selector.cshade .cshade__cta{transition:none!important}.cshade__plate,.cshade__photo,.cshade__pen,.cshade__caption{transform:none!important}.cshade__swatch:not([aria-checked=true]):hover .cshade__clip{transform:none}.cshade [data-cshade-anim].is-swapping,calyvi-shade-selector.cshade .cshade__buy.is-swapping,.cshade__swatch.is-yielding .cshade__swatch-color{animation:none!important}}
/*# sourceMappingURL=/cdn/shop/t/22/assets/calyvi-shade-selector.css.map */
