.cb-explainer-section{position:relative}.cb-explainer{position:relative;color:var(--cb-navy);background:linear-gradient(180deg,#ffffff 0%,var(--cb-sky-wash) 100%)}.cb-explainer__stage{--sc-p: 0;--cbx-gap: clamp(1.4rem, 2.2svh, 2.4rem);--cbx-pad: clamp(2.4rem, 5.5svh, 6.4rem);display:grid;grid-template-columns:minmax(30rem,38rem) minmax(0,1fr);grid-template-rows:1fr auto 1fr;column-gap:clamp(3.2rem,4.4vw,8rem);padding:clamp(7.2rem,10vw,12rem) max(var(--cb-gutter),calc((100% - 152rem)/2))}.cb-explainer__copy{grid-column:1;grid-row:2;align-self:start}.cb-explainer__eyebrow{margin:0 0 1.4rem;color:var(--cb-sky-deep)}.cb-explainer__title{margin:0;color:var(--cb-navy);font:800 clamp(3.8rem,3.7vw,6rem)/.98 var(--cb-font-display);letter-spacing:-.03em;text-wrap:balance}.cb-explainer__title .cb-script{font-size:1.12em;line-height:.8;padding-right:.04em}.cb-explainer__deck{margin-top:clamp(2.4rem,4.2svh,4.8rem)}.cb-explainer__pips{display:none}.cb-explainer__steps{display:grid;gap:var(--cbx-gap);margin:0;padding:0;list-style:none}.cb-explainer__step{--cb-k: 1;--cb-f: 1;position:relative;display:grid;grid-template-columns:3.2rem minmax(0,1fr);column-gap:1.6rem}.cb-explainer__step:not(:last-child):before,.cb-explainer__step:not(:last-child):after{content:"";position:absolute;left:1.5rem;top:3.8rem;bottom:calc(var(--cbx-gap) * -1 + .6rem);width:2px;border-radius:2px;background:#0b22361a}.cb-explainer__step:not(:last-child):after{background:var(--cb-sky-deep);transform-origin:50% 0;transform:scaleY(var(--cb-f))}.cb-explainer__mark{position:relative;display:grid;place-items:center;width:3.2rem;height:3.2rem;border-radius:50%;background:var(--cb-sky-deep);color:#fff;font:700 1.4rem/1 var(--cb-font-text);box-shadow:0 4px 12px -5px #0f8fc4b3;transition:background-color .26s var(--cb-ease),box-shadow .26s var(--cb-ease),color .26s var(--cb-ease)}.cb-explainer__num{transition:opacity .2s var(--cb-ease)}.cb-explainer__tick{position:absolute;width:1.8rem;height:1.8rem;opacity:0;transition:opacity .22s var(--cb-ease),transform .32s var(--cb-ease)}.cb-explainer__count{display:none}.cb-explainer__place{margin:.3rem 0 0;color:var(--cb-navy);font:700 clamp(1.9rem,1.45vw,2.2rem)/1.15 var(--cb-font-display);letter-spacing:-.015em;transition:opacity .26s var(--cb-ease)}.cb-explainer__cap{margin:.5rem 0 0;max-width:34ch;color:var(--cb-ink-soft);font:400 1.6rem/1.45 var(--cb-font-text);text-wrap:pretty}.cb-explainer__end{--cb-e: 1;margin-top:clamp(2.8rem,4.4svh,4.4rem)}.cb-explainer__end-line{margin:0 0 2rem;max-width:36ch;color:var(--cb-navy);font:500 1.7rem/1.45 var(--cb-font-text);text-wrap:pretty}.cb-explainer__plate{grid-column:2;grid-row:2;align-self:center;position:relative;width:100%;aspect-ratio:1.3;border-radius:2.8rem;overflow:hidden;isolation:isolate;background:#f5fafd;box-shadow:0 1px 2px #0b22360f,0 18px 40px -18px #0b223647,0 60px 90px -50px #0f8fc459;transform-origin:50% 100%}.cb-explainer__plate:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:6;border-radius:inherit;box-shadow:inset 0 0 0 1px #0b223612;pointer-events:none}.cb-explainer__room,.cb-explainer__fx,.cb-explainer__bottle,.cb-explainer__haze,.cb-explainer__glow,.cb-explainer__glints,.cb-explainer__pins{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;max-width:none;pointer-events:none}.cb-explainer__room,.cb-explainer__bottle{overflow:visible;transform-origin:0 0}.cb-explainer__room{z-index:0}.cb-explainer__sun{opacity:.85}.cb-explainer__beams{opacity:.7}.cb-explainer__haze{z-index:1;background:radial-gradient(120% 100% at 50% 35%,#e9d7b6,#dcc49e);mix-blend-mode:multiply;opacity:0}.cb-explainer__glow{z-index:2;background:radial-gradient(70% 55% at 38% 26%,#fff8e26b,#fff8e200 72%),radial-gradient(36% 50% at 90% 36%,#e8f8ff80,#e8f8ff00 72%);opacity:1}.cb-explainer__fx,.cb-explainer__glints{z-index:3}.cb-explainer__bottle{z-index:4}.cb-explainer__pins{z-index:5}.cb-explainer__glint{position:absolute;left:0;top:0;width:6.4rem;height:6.4rem;margin:-3.2rem 0 0 -3.2rem;color:var(--cb-sky);opacity:0;will-change:transform,opacity}.cb-explainer__glint--sun{color:var(--cb-sun)}.cb-explainer__glint>span{display:block;width:100%;height:100%;border-radius:50%;background:radial-gradient(closest-side,#fffc,#fff0);opacity:.85}.cb-explainer__glint svg{display:block;width:100%;height:100%}@keyframes cbx-twinkle{0%,to{opacity:.85;transform:scale(.985)}25%{opacity:1;transform:scale(1)}75%{opacity:.44;transform:scale(.944)}}.cb-explainer.is-live.is-end .cb-explainer__glint>span{animation:cbx-twinkle 2.86s ease-in-out 3 both}.cb-explainer.is-live.is-end .cb-explainer__glint:nth-child(2)>span{animation-delay:-.77s}.cb-explainer.is-live.is-end .cb-explainer__glint:nth-child(3)>span{animation-delay:-1.55s}.cb-explainer.is-live.is-end .cb-explainer__glint:nth-child(4)>span{animation-delay:-2.32s}.cb-explainer.is-live.is-end .cb-explainer__glint:nth-child(5)>span{animation-delay:-.23s}.cb-explainer.is-live.is-end .cb-explainer__glint:nth-child(6)>span{animation-delay:-1s}.cb-explainer.is-live.is-end .cb-explainer__glint:nth-child(7)>span{animation-delay:-1.78s}.cb-explainer.is-live.is-end .cb-explainer__glint:nth-child(8)>span{animation-delay:-2.55s}.cb-explainer.is-live.is-end .cb-explainer__glint:nth-child(9)>span{animation-delay:-.46s}.cb-explainer__pin{position:absolute;left:0;top:0;display:grid;place-items:center;width:2.8rem;height:2.8rem;margin:-1.4rem 0 0 -1.4rem;border-radius:50%;background:var(--cb-sky-deep);color:#fff;font:700 1.3rem/1 var(--cb-font-text);box-shadow:0 3px 10px -3px #0b223659;transition:background-color .26s var(--cb-ease),color .26s var(--cb-ease),box-shadow .26s var(--cb-ease);will-change:transform}.cb-explainer__pin-num{transition:opacity .2s var(--cb-ease)}.cb-explainer__pin svg{position:absolute;width:1.5rem;height:1.5rem;opacity:0;transition:opacity .22s var(--cb-ease),transform .32s var(--cb-ease)}.cb-explainer:not(.is-placed) .cb-explainer__pin,.cb-explainer:not(.is-placed) .cb-explainer__glints{display:none}.cb-explainer:not(.is-live){height:auto!important}.cb-explainer:not(.is-live) .cb-explainer__stage{height:auto;overflow:visible}.cb-explainer.is-live{height:calc(var(--cbx-span, 3.5) * 100vh)}.cb-explainer.is-live .cb-explainer__stage{position:sticky;top:0;height:100vh;height:100svh;overflow:clip;padding-block:var(--cbx-pad);background:linear-gradient(180deg,#ffffff 0%,#f7fbfe 55%,var(--cb-sky-wash) 100%)}.cb-explainer.is-live .cb-explainer__plate{max-height:calc(100svh - var(--cbx-pad) * 2)}.cb-explainer.is-live .cb-explainer__step{--cb-k: 0;--cb-f: 0;--cb-show: 0}.cb-explainer.is-live .cb-explainer__mark{background:#fff;color:var(--cb-ink-soft);box-shadow:inset 0 0 0 1.5px #0b223629}.cb-explainer.is-live .cb-explainer__num{opacity:1}.cb-explainer.is-live .cb-explainer__tick{opacity:0;transform:scale(.5) rotate(-12deg)}.cb-explainer.is-live .cb-explainer__place{opacity:.42}.cb-explainer.is-live .cb-explainer__cap{opacity:var(--cb-k);transform:translate3d(0,calc((1 - var(--cb-k)) * .8rem),0)}.cb-explainer.is-live .is-active .cb-explainer__mark{color:var(--cb-navy);box-shadow:inset 0 0 0 2px var(--cb-sky-deep),0 0 0 .5rem #2bb8ee29}.cb-explainer.is-live .is-active .cb-explainer__place,.cb-explainer.is-live .is-done .cb-explainer__place{opacity:1}.cb-explainer.is-live .is-done .cb-explainer__mark{background:var(--cb-sky-deep);color:#fff;box-shadow:0 4px 12px -5px #0f8fc4b3}.cb-explainer.is-live .is-done .cb-explainer__num{opacity:0}.cb-explainer.is-live .is-done .cb-explainer__tick{opacity:1;transform:none}.cb-explainer.is-live .cb-explainer__end{--cb-e: 0;opacity:var(--cb-e);transform:translate3d(0,calc((1 - var(--cb-e)) * 1.6rem),0);visibility:hidden}.cb-explainer.is-live.is-end .cb-explainer__end{visibility:visible}.cb-explainer.is-live .cb-explainer__pin{background:#fff;color:var(--cb-navy);box-shadow:0 3px 10px -3px #0b22364d,inset 0 0 0 1.5px #0b22361f}.cb-explainer.is-live .cb-explainer__pin-num{opacity:1}.cb-explainer.is-live .cb-explainer__pin svg{opacity:0;transform:scale(.5)}.cb-explainer.is-live .cb-explainer__pin.is-active{box-shadow:0 3px 10px -3px #0b22364d,inset 0 0 0 2px var(--cb-sky-deep),0 0 0 .6rem #2bb8ee38}.cb-explainer.is-live .cb-explainer__pin.is-done{background:var(--cb-sky-deep);color:#fff;box-shadow:0 4px 12px -4px #0f8fc4bf}.cb-explainer.is-live .cb-explainer__pin.is-done .cb-explainer__pin-num{opacity:0}.cb-explainer.is-live .cb-explainer__pin.is-done svg{opacity:1;transform:none}@media screen and (max-width:989px){.cb-explainer__stage{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;row-gap:clamp(2.4rem,4vw,3.2rem);padding-block:clamp(6.4rem,12vw,9.6rem)}.cb-explainer__copy{display:contents}.cb-explainer__head{grid-column:1;grid-row:1}.cb-explainer__plate{grid-column:1;grid-row:2;aspect-ratio:1.3;border-radius:2rem}.cb-explainer__deck{grid-column:1;grid-row:3;margin-top:0}.cb-explainer__title{font-size:clamp(3.2rem,8.4vw,5.2rem)}.cb-explainer__eyebrow{margin-bottom:1rem}.cb-explainer.is-live .cb-explainer__stage{grid-template-rows:auto minmax(0,min(60rem,118vw)) auto;align-content:center;row-gap:clamp(1.4rem,2.2svh,2.4rem);padding-block:clamp(1.6rem,3svh,3.2rem)}.cb-explainer.is-live .cb-explainer__plate{aspect-ratio:auto;height:100%;max-height:none}}@media screen and (max-width:989px),screen and (orientation:landscape)and (max-height:500px){.cb-explainer.is-live .cb-explainer__deck{position:relative;height:15.6rem}.cb-explainer.is-live .cb-explainer__pips{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.6rem}.cb-explainer__pip{--cb-k: 0;height:.4rem;border-radius:999px;background:#0b22361a;overflow:hidden}.cb-explainer__pip>span{display:block;height:100%;border-radius:inherit;background:var(--cb-sky-deep);transform-origin:0 50%;transform:scaleX(var(--cb-k))}.cb-explainer.is-live .cb-explainer__steps{display:block}.cb-explainer.is-live .cb-explainer__step{position:absolute;inset:2.2rem 0 auto 0;display:block;opacity:var(--cb-show);transform:translate3d(0,calc((1 - var(--cb-show)) * .6rem),0)}.cb-explainer.is-live .cb-explainer__step:before,.cb-explainer.is-live .cb-explainer__step:after,.cb-explainer.is-live .cb-explainer__mark{display:none}.cb-explainer.is-live .cb-explainer__count{display:block;margin:0 0 .6rem;color:var(--cb-sky-deep);font:700 1.25rem/1.2 var(--cb-font-text);letter-spacing:.08em}.cb-explainer__count span{color:var(--cb-ink-soft);opacity:.7}.cb-explainer.is-live .cb-explainer__place{opacity:1;font-size:2.4rem}.cb-explainer.is-live .cb-explainer__cap{font-size:1.6rem;opacity:calc(var(--cb-show) * 1.6 - .6);transform:translate3d(0,calc((1 - var(--cb-show)) * .8rem),0)}.cb-explainer.is-live .cb-explainer__end{position:absolute;inset:2.2rem 0 auto 0;margin:0}.cb-explainer.is-live .cb-explainer__end-line{margin-bottom:1.4rem;font-size:1.6rem}}@media screen and (orientation:landscape)and (max-height:500px){.cb-explainer.is-live .cb-explainer__stage{grid-template-columns:minmax(23rem,30rem) minmax(0,1fr);grid-template-rows:1fr auto auto 1fr;column-gap:clamp(2.4rem,3.4vw,4.8rem);row-gap:0;align-content:stretch;padding-block:clamp(1.2rem,4svh,2.4rem)}.cb-explainer.is-live .cb-explainer__copy{display:contents}.cb-explainer.is-live .cb-explainer__head{grid-column:1;grid-row:2}.cb-explainer.is-live .cb-explainer__deck{grid-column:1;grid-row:3;margin-top:1.4rem}.cb-explainer.is-live .cb-explainer__plate{grid-column:2;grid-row:1 / -1;align-self:stretch;height:auto;aspect-ratio:auto;max-height:none;border-radius:2rem}.cb-explainer.is-live .cb-explainer__eyebrow{margin-bottom:.8rem}.cb-explainer.is-live .cb-explainer__title{font-size:clamp(2.6rem,3.4vw,3.6rem)}}@media screen and (max-width:749px){.cb-explainer.is-live .cb-explainer__pin{width:2.4rem;height:2.4rem;margin:-1.2rem 0 0 -1.2rem;font-size:1.15rem}.cb-explainer__pin svg{width:1.3rem;height:1.3rem}}@media(prefers-reduced-motion:reduce){.cb-explainer__mark,.cb-explainer__num,.cb-explainer__tick,.cb-explainer__place,.cb-explainer__pin,.cb-explainer__pin svg{transition:none}.cb-explainer__glint>span{animation:none!important}}
/*# sourceMappingURL=/cdn/shop/t/5/assets/cb-explainer.css.map */