html.intro-play,html.intro-play body{overflow:hidden}html.intro-play .nav__logo img{opacity:0}html.intro-done .nav__logo img{transition:opacity .2s ease}.hp-intro{--ink: #151311;--red: #E8352B;--yellow: #FFC633;--cream: #FFF8EB;--ease-pop: cubic-bezier(.34, 1.56, .64, 1);--ease-out: cubic-bezier(.16, 1, .3, 1);position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;display:none;overflow:hidden;background:var(--yellow);cursor:pointer;user-select:none;-webkit-user-select:none}html.intro-play .hp-intro{display:block}.hp-intro__burst{position:absolute;left:50%;top:50%;width:260vmax;height:260vmax;translate:-50% -50%;background:repeating-conic-gradient(from 0deg,#FFD45C 0deg 9deg,var(--yellow) 9deg 18deg);opacity:0;scale:.6}.hp-intro__dots{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;background-image:radial-gradient(rgba(21,19,17,.16) 1.6px,transparent 1.9px);background-size:18px 18px;-webkit-mask-image:radial-gradient(circle at 50% 50%,transparent 30%,#000 85%);mask-image:radial-gradient(circle at 50% 50%,transparent 30%,#000 85%)}.hp-intro__stage{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center}.hp-intro__center{position:relative;width:min(78vw,600px);display:grid;justify-items:center;translate:0 -4vh}.hp-intro__cards{position:absolute;left:50%;top:48%;width:0;height:0}.hp-intro__cards i{position:absolute;left:0;top:0;width:clamp(80px,16vw,130px);aspect-ratio:5 / 7;translate:-50% -50%;border:3px solid var(--ink);border-radius:12px;box-shadow:5px 5px 0 var(--ink);opacity:0;scale:.3}.hp-intro__cards i:after{content:"";position:absolute;top:7px;right:7px;bottom:7px;left:7px;border:2px solid rgba(255,255,255,.7);border-radius:7px}.hp-intro__cards i:nth-child(1){background:var(--red)}.hp-intro__cards i:nth-child(2){background:#2f7de1}.hp-intro__cards i:nth-child(3){background:#fff}.hp-intro__cards i:nth-child(3):after{border-color:#15131140}.hp-intro__logo{position:relative;width:100%;aspect-ratio:600 / 269;transform-origin:0 0;will-change:transform}.hp-intro__logo img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;opacity:0;-webkit-user-drag:none}.p-mark{transform-origin:19.3% 52%}.p-happy{transform-origin:65.9% 35%}.p-picks{transform-origin:65% 70%}.hp-intro__shine{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.85) 48%,rgba(255,255,255,.2) 56%,transparent 66%);-webkit-mask:url(mark.png) center / 100% 100% no-repeat,url(happy.png) center / 100% 100% no-repeat,url(picks.png) center / 100% 100% no-repeat;mask:url(mark.png) center / 100% 100% no-repeat,url(happy.png) center / 100% 100% no-repeat,url(picks.png) center / 100% 100% no-repeat;background-size:250% 100%;background-position:120% 0}.hp-intro__sparks{position:absolute;left:50%;top:48%;width:0;height:0}.hp-intro__sparks i{position:absolute;left:0;top:0;font-style:normal;line-height:1;translate:-50% -50%;font-size:var(--s, 22px);color:var(--c, var(--red));opacity:0;text-shadow:2px 2px 0 var(--ink)}.hp-intro__tag{margin:clamp(10px,2.4vh,22px) 0 0;font:800 clamp(26px,5.4vw,48px)/1 "Bricolage Grotesque",system-ui,sans-serif;letter-spacing:-.02em;color:var(--ink);opacity:0}.hp-intro__tag span{color:var(--red)}.hp-intro__skip{position:absolute;right:18px;bottom:18px;padding:9px 16px;border-radius:999px;cursor:pointer;border:2px solid var(--ink);background:#ffffffbf;color:var(--ink);font:700 13px/1 DM Sans,system-ui,sans-serif;opacity:0;transition:opacity .3s,background .2s}.hp-intro__skip:hover{background:#fff}.hp-intro.can-skip .hp-intro__skip{opacity:1}.hp-intro.is-running .hp-intro__burst{animation:hpBurstIn .7s var(--ease-out) forwards,hpSpin 24s linear infinite}.hp-intro.is-running .hp-intro__dots{animation:hpFade .8s ease .1s forwards}.hp-intro.is-running .p-mark{animation:hpPop .75s var(--ease-pop) .15s forwards}.hp-intro.is-running .p-happy{animation:hpRise .6s var(--ease-pop) .55s forwards}.hp-intro.is-running .p-picks{animation:hpRise .6s var(--ease-pop) .72s forwards}.hp-intro.is-running .hp-intro__cards i:nth-child(1){animation:hpCardL .7s var(--ease-pop) .95s forwards}.hp-intro.is-running .hp-intro__cards i:nth-child(2){animation:hpCardM .7s var(--ease-pop) 1.02s forwards}.hp-intro.is-running .hp-intro__cards i:nth-child(3){animation:hpCardR .7s var(--ease-pop) 1.09s forwards}.hp-intro.is-running .hp-intro__sparks i{animation:hpSpark .9s var(--ease-out) var(--d, 1.05s) forwards}.hp-intro.is-running .hp-intro__shine{animation:hpShine .8s ease-in-out 1.3s forwards}.hp-intro.is-running .hp-intro__tag{animation:hpRise .55s var(--ease-pop) 1.5s forwards}@keyframes hpFade{to{opacity:1}}@keyframes hpBurstIn{to{opacity:1;scale:1}}@keyframes hpSpin{to{rotate:360deg}}@keyframes hpPop{0%{opacity:0;transform:scale(0) rotate(-35deg)}55%{opacity:1;transform:scale(1.16,1.1) rotate(8deg)}75%{transform:scale(.94,1.04) rotate(-3deg)}to{opacity:1;transform:none}}@keyframes hpRise{0%{opacity:0;transform:translateY(45%) scale(.7)}60%{opacity:1;transform:translateY(-6%) scale(1.05)}to{opacity:1;transform:none}}@keyframes hpCardL{0%{opacity:0;scale:.3}to{opacity:1;scale:1;transform:translate(-150%,-42%) rotate(-22deg)}}@keyframes hpCardM{0%{opacity:0;scale:.3}to{opacity:1;scale:1;transform:translateY(-78%) rotate(-3deg)}}@keyframes hpCardR{0%{opacity:0;scale:.3}to{opacity:1;scale:1;transform:translate(150%,-40%) rotate(20deg)}}@keyframes hpSpark{0%{opacity:0;transform:translate(0) scale(.2) rotate(0)}30%{opacity:1}to{opacity:0;transform:translate(var(--x),var(--y)) scale(1) rotate(160deg)}}@keyframes hpShine{0%{opacity:1;background-position:120% 0}to{opacity:1;background-position:-60% 0}}.hp-intro.is-leaving{pointer-events:none}.hp-intro.is-leaving .hp-intro__burst,.hp-intro.is-leaving .hp-intro__dots{transition:opacity var(--leave, .7s) ease,scale var(--leave, .7s) var(--ease-out);opacity:0!important;scale:1.25}.hp-intro.is-leaving{transition:background-color var(--leave, .7s) ease;background-color:transparent}.hp-intro.is-leaving .hp-intro__cards,.hp-intro.is-leaving .hp-intro__tag,.hp-intro.is-leaving .hp-intro__sparks,.hp-intro.is-leaving .hp-intro__skip{transition:opacity calc(var(--leave, .7s) * .5) ease,transform var(--leave, .7s) var(--ease-out);opacity:0;transform:scale(.85)}.hp-intro.is-reduced .hp-intro__burst{opacity:1;scale:1}.hp-intro.is-reduced .hp-intro__logo img{opacity:1;animation:none}.hp-intro.is-reduced .hp-intro__logo{animation:hpFade .25s ease both}
/*# sourceMappingURL=/cdn/shop/t/5/assets/intro.css.map */