.crc{position:relative;container-type:inline-size;--crc-ease: cubic-bezier(.2, .7, .2, 1)}.crc__track{position:relative;display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px}.crc .crc__col{position:relative;flex:1 0 124px;min-width:0;display:flex;flex-direction:column;padding:0;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:var(--radius);scroll-snap-align:start}.crc .crc__fill{display:block;flex:0 0 auto;width:auto;height:10px;border:0;border-radius:0}.crc .crc__col.is-sold-out .crc__fill{opacity:.45}.crc__label{display:none}.crc__body{display:flex;flex-direction:column;flex:1 1 auto;min-width:0;padding:10px}.crc .colour-rail__image-box{margin-bottom:10px}.crc .colour-rail__meta{margin-top:auto}.crc .colour-rail__meta h3{font-size:12px;gap:6px}.crc .colour-rail__meta .swatch-dot{width:14px;height:14px}.crc .colour-rail__price{font-size:13px;margin-bottom:8px}.crc .btn--small{padding:8px 6px;font-size:11px}.crc__cursor,.crc__bar{display:none}.crc__live{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.crc .crc__col:focus-visible{outline:none}.crc .crc__col:focus-visible:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;border:3px solid var(--color-ink);box-shadow:inset 0 0 0 2px #fff;border-radius:inherit;pointer-events:none}@media(max-width:600px){.crc .crc__col{flex-basis:46%}}.crc__ink-body{fill:var(--crc-paint, #111);stroke:var(--crc-paint, #111);transition:fill .25s ease,stroke .25s ease}.crc__ink-handle{fill:none;stroke:var(--crc-paint, #111);transition:stroke .25s ease}html .crc.crc--motion .crc__col{transition:flex-grow .6s var(--crc-ease),flex-basis .4s var(--crc-ease),opacity .7s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1);transition-delay:0s,0s,calc(var(--reveal-i, 0) * 70ms),calc(var(--reveal-i, 0) * 70ms)}@media(prefers-reduced-motion:no-preference){.crc--motion .crc__col{display:block;border:0;background:#fff;overflow:hidden;overflow:clip}.crc--motion .crc__fill{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;height:auto;transition:opacity .45s ease}.crc--motion .crc__col.is-active .crc__fill{opacity:.14}.crc--motion .crc__col.is-sold-out .crc__fill{opacity:.45}.crc--motion .crc__col.is-sold-out.is-active .crc__fill{opacity:.08}.crc--motion .crc__label{display:block;position:absolute;z-index:2;left:50%;bottom:22px;transform:translate(-50%) rotate(180deg);writing-mode:vertical-rl;white-space:nowrap;font-family:var(--font-heading);font-weight:800;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#fff;transition:opacity .25s ease;pointer-events:none}.crc--motion .crc__col[data-tone=light] .crc__label{color:var(--color-ink)}.crc--motion .crc__col.is-active .crc__label{opacity:0}.crc--motion .crc__body{position:absolute;z-index:2;top:0;bottom:0;left:50%;width:var(--crc-open);transform:translate(-50%);align-items:center;justify-content:center;gap:14px;opacity:0;pointer-events:none;transition:opacity .2s ease;mix-blend-mode:multiply}.crc--motion .crc__col.is-active .crc__body{opacity:1;pointer-events:auto;transition:opacity .35s ease .15s}.crc--motion .colour-rail__image-box{flex:1 1 auto;min-height:0;width:100%;max-width:400px;margin:0;aspect-ratio:auto;transform:scale(.86);transition:transform .6s var(--crc-ease)}.crc--motion .crc__col.is-active .colour-rail__image-box{transform:none}.crc--motion .colour-rail__meta{flex:0 0 auto;width:100%;max-width:300px;margin:0;text-align:center}.crc--motion .colour-rail__meta h3{display:block;font-size:18px;text-wrap:balance}.crc--motion .colour-rail__meta .swatch-dot{display:inline-block;width:18px;height:18px;margin-right:10px;vertical-align:-2px}.crc--motion .colour-rail__price{font-size:16px;margin-bottom:12px}.crc--motion .btn--small{min-height:44px;padding:10px 16px;font-size:12px}.crc--motion .colour-rail__notify{font-size:11px}}@media(prefers-reduced-motion:no-preference)and (hover:hover)and (pointer:fine)and (min-width:768px){.crc--motion{--crc-g: max(2, calc(var(--crc-n, 6) * .66));--crc-open: calc(100cqi * var(--crc-g) / (var(--crc-g) + var(--crc-n, 6) - 1))}.crc--motion .crc__track{gap:0;padding:0;height:clamp(440px,40vw,560px);overflow:hidden;overflow:clip;scroll-snap-type:none;border-radius:var(--radius-lg, 16px);background:#fff}.crc--motion .crc__col{flex:1 1 0;border-radius:0;scroll-snap-align:none}.crc--motion .crc__col.is-active{flex-grow:var(--crc-g)}.crc--motion .crc__body{padding:28px clamp(20px,2.4cqi,40px)}.crc--motion .crc__cursor{display:block;position:absolute;left:0;top:0;z-index:6;width:58px;height:51px;margin:-6px 0 0 -29px;pointer-events:none;opacity:0;transform:translate3d(-300px,-300px,0);transition:opacity .15s ease;will-change:transform;filter:drop-shadow(0 6px 8px rgba(0,0,0,.28))}.crc--motion .crc__bag{display:block;width:100%;height:100%;overflow:visible;transform:scale(.6);transform-origin:50% 12%;transition:transform .25s var(--crc-ease)}.crc.is-pointer .crc__cursor{opacity:1}.crc.is-pointer .crc__bag{transform:none}.crc.is-pointer.is-over-control .crc__bag{transform:scale(.85) rotate(-14deg)}.crc.is-pointer.is-press .crc__bag{transform:scale(.75) rotate(-14deg)}.crc.is-pointer .crc__track,.crc.is-pointer .crc__track *{cursor:none!important}}@media(prefers-reduced-motion:no-preference)and (hover:none),(prefers-reduced-motion:no-preference)and (pointer:coarse),(prefers-reduced-motion:no-preference)and (pointer:none),(prefers-reduced-motion:no-preference)and (max-width:767px){.crc--motion{--crc-chip-h: 56px;--crc-sel: clamp(84px, calc(100vw - 48px - (var(--crc-n, 6) - 1) * 26px), 168px);padding-top:calc(var(--crc-chip-h) + 22px)}@supports (width: 1cqi){.crc--motion{--crc-sel: clamp(84px, calc(100cqi - 8px - (var(--crc-n, 6) - 1) * 26px), 168px)}}.crc--motion .crc__bar{display:flex;gap:4px;position:absolute;top:0;left:0;right:0;height:calc(var(--crc-chip-h) + 10px);padding:6px 4px 4px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior-x:contain}.crc--motion .crc__bar::-webkit-scrollbar{display:none}.crc__chip{position:relative;flex:1 1 0;min-width:20px;height:100%;margin:0;padding:0;border:0;border-radius:10px;background:none;color:var(--color-ink);cursor:pointer;-webkit-tap-highlight-color:transparent;transition:flex-grow .34s var(--crc-ease),flex-basis .34s var(--crc-ease)}.crc__chip[aria-checked=true]{flex:0 0 var(--crc-sel)}.crc__chip:focus-visible{outline:2px solid var(--color-ink);outline-offset:1px}.crc .crc__chip-fill{position:absolute;top:0;right:0;bottom:0;left:0;width:auto;height:auto;border:0;border-radius:inherit;box-shadow:inset 0 0 0 1px #0000001f}.crc__chip.is-sold-out .crc__chip-fill{opacity:.4}.crc__chip.is-sold-out:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;border-radius:inherit;background:linear-gradient(to top right,transparent calc(50% - 1px),rgba(11,11,12,.55) calc(50% - 1px),rgba(11,11,12,.55) calc(50% + 1px),transparent calc(50% + 1px))}.crc__chip-name{position:absolute;z-index:2;left:50%;top:50%;max-width:calc(100% - 10px);padding:4px 8px;border-radius:999px;background:#fffffff0;font-family:var(--font-heading);font-size:10px;font-weight:800;line-height:1.2;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0;transform:translate(-50%,-50%) scale(.85);transition:opacity .12s ease,transform .12s ease;pointer-events:none}.crc__chip[aria-checked=true] .crc__chip-name{opacity:1;transform:translate(-50%,-50%);transition:opacity .18s ease .12s,transform .22s var(--crc-ease) .12s}.crc__chip-name small{display:block;font-size:8px;letter-spacing:.1em;color:var(--color-text-muted)}.crc--motion .crc__track{display:flex;gap:8px;height:auto;margin:0 -20px;padding:0;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}.crc--motion .crc__track:before,.crc--motion .crc__track:after{content:"";flex:0 0 26px;flex:0 0 calc(12px + 4cqi)}.crc--motion .crc__track::-webkit-scrollbar{display:none}.crc--motion .crc__col{flex:0 0 calc(100% - 68px);flex:0 0 92cqi;border-radius:var(--radius-lg, 16px);scroll-snap-align:center;scroll-snap-stop:always;-webkit-tap-highlight-color:transparent}.crc--motion .crc__col:not(.is-active) .crc__body{visibility:hidden;transition:opacity .2s ease,visibility 0s linear .2s}.crc--motion .crc__col :is(.colour-rail__image-box,.colour-rail__meta){pointer-events:none}.crc--motion .crc__col.is-active :is(.colour-rail__image-box,.colour-rail__meta){pointer-events:auto}.crc--motion .crc__fill{transition:opacity .34s ease}.crc--motion .crc__label{display:none}.crc--motion .crc__body{position:relative;top:auto;bottom:auto;left:auto;width:auto;transform:none;padding:18px 18px 20px;gap:12px}.crc--motion .crc__col.is-active .crc__body{visibility:visible;transition:opacity .3s ease .05s}.crc--motion .colour-rail__image-box{flex:none;height:230px;height:min(66cqi,300px);transform:none;transition:none}.crc--motion .colour-rail__meta h3{font-size:16px}@container (min-width: 600px){.crc--motion .crc__body{flex-direction:row;padding:24px 32px;gap:32px}.crc--motion .colour-rail__image-box{flex:1 1 0;height:min(46cqi,420px)}.crc--motion .colour-rail__meta{flex:0 0 min(320px,40%)}}}
/*# sourceMappingURL=/cdn/shop/t/160/assets/colour-rail-cascade.css.map */