.oo-hw-banner{padding-top:clamp(14px,2.4vw,26px)}.oo-hw-banner__card{position:relative;display:flex;flex-direction:column;overflow:hidden;isolation:isolate;border:1px solid rgb(139 92 246 / 28%);border-radius:var(--oo-radius-hero);background:radial-gradient(120% 90% at 78% 30%,rgb(124 58 237 / 38%) 0%,transparent 55%),radial-gradient(80% 70% at 10% 110%,rgb(255 122 26 / 16%) 0%,transparent 60%),linear-gradient(165deg,#1f1038,#130a24 52%,#200a1c);box-shadow:0 40px 80px -50px #000000f2,0 0 60px -30px #8b5cf699}.oo-hw-banner__scene{position:relative;height:270px;overflow:hidden;pointer-events:none}.oo-hw-banner__scene>*{position:absolute}.oo-hw-banner__scene svg{display:block;width:100%;height:auto}.oo-hw-banner__stars{top:0;right:0;bottom:0;left:0;background:radial-gradient(circle,rgb(255 255 255 / 85%) 0 1px,transparent 1.6px) 0 0 / 97px 83px,radial-gradient(circle,rgb(216 204 255 / 70%) 0 1.2px,transparent 2px) 31px 47px / 151px 127px,radial-gradient(circle,rgb(255 210 168 / 70%) 0 1px,transparent 1.8px) 63px 19px / 211px 173px;opacity:.7}.oo-hw-banner__moon{top:22px;left:50%;width:210px;aspect-ratio:1;margin-left:-40px;border-radius:50%;background:radial-gradient(circle at 38% 36%,#fff6e0,#ffe2a8 34%,#ffb565 72%,#f08a3a);box-shadow:0 0 40px 6px #ffb56573,0 0 120px 40px #ff7a1a33,0 0 220px 90px #8b5cf638}.oo-hw-banner__moon:before,.oo-hw-banner__moon:after{content:"";position:absolute;border-radius:50%;background:#d6783238}.oo-hw-banner__moon:before{top:24%;left:58%;width:18%;height:18%}.oo-hw-banner__moon:after{top:58%;left:30%;width:12%;height:12%;box-shadow:70px 18px 0 -4px #d6783233}.oo-hw-banner__cloud{height:46px;background:radial-gradient(closest-side,rgb(88 62 150 / 62%),rgb(88 62 150 / 30%) 55%,transparent)}.oo-hw-banner__cloud--a{top:112px;left:38%;width:260px}.oo-hw-banner__cloud--b{top:168px;left:58%;width:200px;height:34px;opacity:.8}.oo-hw-banner__torii{right:2%;bottom:10px;width:58%;max-width:330px;filter:drop-shadow(0 0 18px rgb(255 122 26 / 25%))}.oo-hw-banner__figure{left:50%;bottom:0;height:92%;margin-left:0;filter:drop-shadow(0 0 22px rgb(139 92 246 / 55%)) drop-shadow(0 18px 24px rgb(0 0 0 / 60%))}.oo-hw-banner__img{display:block;width:auto;height:100%;object-fit:contain}.oo-hw-banner--media .oo-hw-banner__torii{opacity:.85}.oo-hw-banner__bat{width:34px;color:#120a1f}.oo-hw-banner__bat svg{fill:currentcolor}.oo-hw-banner__bat--1{top:30px;left:44%}.oo-hw-banner__bat--2{top:70px;left:82%;width:26px}.oo-hw-banner__bat--3{top:16px;left:70%;width:20px}.oo-hw-banner__string{top:-40px;left:-10%;width:120%;height:90px;border-bottom:2px solid rgb(20 12 32 / 90%);border-radius:0 0 50% 50%}.oo-hw-banner__lantern{top:34px;width:52px;transform-origin:50% 0;filter:drop-shadow(0 0 16px rgb(255 120 60 / 65%))}.oo-hw-banner__lantern--1{left:8%}.oo-hw-banner__lantern--2{left:30%;top:46px;width:42px}.oo-hw-banner__ghost{top:120px;left:18%;width:54px;filter:drop-shadow(0 0 14px rgb(216 204 255 / 55%))}.oo-hw-banner__spirit{width:16px;height:22px;border-radius:50%/62% 62% 38% 38%;background:radial-gradient(circle at 50% 70%,#f3eeff,#a78bfa 40%,#7c3aed00 74%)}.oo-hw-banner__spirit--1{top:150px;left:40%}.oo-hw-banner__spirit--2{top:96px;left:92%;width:12px;height:17px}.oo-hw-banner__ground{left:-5%;right:-5%;bottom:-30px;height:80px;border-radius:50% 50% 0 0/100% 100% 0 0;background:linear-gradient(180deg,#170c26,#0d0816);box-shadow:0 -1px #8b5cf640}.oo-hw-banner__pumpkin{bottom:4px;filter:drop-shadow(0 0 18px rgb(255 140 40 / 45%))}.oo-hw-banner__pumpkin--1{left:4%;width:92px}.oo-hw-banner__pumpkin--2{left:24%;width:60px}.oo-hw-banner__pumpkin--3{right:4%;width:54px}.oo-hw-banner__fog{left:-20%;bottom:-20px;width:140%;height:120px;background:radial-gradient(closest-side at 20% 60%,rgb(196 181 253 / 30%),transparent),radial-gradient(closest-side at 55% 70%,rgb(167 139 250 / 24%),transparent),radial-gradient(closest-side at 85% 55%,rgb(196 181 253 / 26%),transparent)}.oo-hw-banner__web{top:-2px;right:-2px;width:120px;color:#d8ccff73;transform:scaleX(-1)}.oo-hw-banner__content{position:relative;z-index:2;display:flex;flex-direction:column;align-items:flex-start;gap:16px;padding:8px clamp(22px,5vw,64px) clamp(26px,5vw,56px)}.oo-hw-banner__eyebrow{display:inline-flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin:0;padding:7px 14px;border:1px solid rgb(255 122 26 / 40%);border-radius:var(--oo-radius-pill);background:#ff7a1a1a;color:#ffb47a;font-size:.75rem;font-weight:800;letter-spacing:.03em;text-transform:uppercase}@media(min-width:600px){.oo-hw-banner__eyebrow{font-size:.8125rem}}.oo-hw-banner__jp{color:#c4b5fd;letter-spacing:.12em;text-transform:none}.oo-hw-banner__title{margin:0;max-width:13ch;color:#fbf7ff;font-size:clamp(2.25rem,5.2vw,4.25rem);font-weight:800;line-height:1.04;letter-spacing:-.01em;text-wrap:balance}.oo-hw-banner__accent{display:block;background:linear-gradient(95deg,#ffb347,#ff7a1a 38%,#f472b6 72%,#a78bfa);background-clip:text;color:transparent;filter:drop-shadow(0 0 18px rgb(255 122 26 / 35%))}.oo-hw-banner__lead{max-width:46ch;color:var(--oo-ink-2);font-size:1.0625rem}.oo-hw-banner__lead p{margin:0}.oo-hw-banner__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:4px}.oo-hw-banner__actions .oo-btn{min-height:50px;padding-inline:26px}.oo-hw-banner__code{display:inline-flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:0;padding:10px 16px;border:1.5px dashed rgb(255 122 26 / 60%);border-radius:var(--oo-radius-small);color:var(--oo-ink-2);font-size:.9375rem}.oo-hw-banner__code strong{color:#ffd2a8;font-size:1.0625rem;letter-spacing:.08em}.oo-hw-banner__toggle-btn{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px 0 10px;border:1px solid rgb(167 139 250 / 30%);border-radius:var(--oo-radius-pill);background:#0d0a1473;color:var(--oo-ink-2);font:inherit;font-size:.8125rem;font-weight:700;cursor:pointer}.oo-hw-banner__toggle-btn:hover{border-color:#ff7a1a8c;color:var(--oo-ink)}.oo-hw-banner__toggle-icon{display:inline-flex}.oo-hw-banner__toggle-icon svg{width:18px;height:18px}.oo-hw-banner__toggle-icon--play,.oo-hw-paused .oo-hw-banner__toggle-icon--pause{display:none}.oo-hw-paused .oo-hw-banner__toggle-icon--play{display:inline-flex}@media(prefers-reduced-motion:reduce){.oo-hw-banner__toggle{display:none}}@media(min-width:860px){.oo-hw-banner__card{min-height:520px;justify-content:center}.oo-hw-banner--compact .oo-hw-banner__card{min-height:420px}.oo-hw-banner__scene{position:absolute;top:0;right:0;bottom:0;left:0;height:auto;z-index:0}.oo-hw-banner__scene:after{content:"";top:0;right:0;bottom:0;left:0;position:absolute;background:linear-gradient(90deg,rgb(15 8 28 / 88%) 0%,rgb(15 8 28 / 55%) 38%,transparent 62%)}.oo-hw-banner__content{width:min(100%,620px);padding:clamp(40px,5vw,72px)}.oo-hw-banner__moon{top:9%;left:auto;right:9%;width:clamp(260px,28vw,380px);margin:0}.oo-hw-banner__cloud--a{top:30%;left:52%;width:340px}.oo-hw-banner__cloud--b{top:46%;left:70%;width:280px}.oo-hw-banner__torii{right:5%;bottom:26px;width:40%;max-width:470px}.oo-hw-banner__figure{left:auto;right:14%;height:90%}.oo-hw-banner__lantern--1{left:54%;width:64px}.oo-hw-banner__lantern--2{left:auto;right:3%;top:40px;width:54px}.oo-hw-banner__ghost{top:26%;left:50%;width:70px}.oo-hw-banner__bat--1{top:9%;left:62%;width:42px}.oo-hw-banner__bat--2{top:20%;left:90%;width:30px}.oo-hw-banner__bat--3{top:5%;left:78%;width:24px}.oo-hw-banner__spirit--1{top:56%;left:46%}.oo-hw-banner__spirit--2{top:40%;left:96%}.oo-hw-banner__pumpkin--1{left:auto;right:40%;width:120px}.oo-hw-banner__pumpkin--2{left:auto;right:33%;width:72px}.oo-hw-banner__pumpkin--3{right:3%;width:84px}.oo-hw-banner__web{top:-2px;right:auto;left:-2px;width:150px;transform:none;z-index:1}.oo-hw-banner__ground{height:110px;bottom:-44px}.oo-hw-banner__fog{height:170px}}@media(prefers-reduced-motion:no-preference){.oo-motion .oo-hw-banner__cloud--a{animation:oo-hwb-drift 38s ease-in-out infinite alternate}.oo-motion .oo-hw-banner__cloud--b{animation:oo-hwb-drift 52s ease-in-out infinite alternate-reverse}.oo-motion .oo-hw-banner__fog{animation:oo-hwb-drift 30s ease-in-out infinite alternate}.oo-motion .oo-hw-banner__lantern{animation:oo-hwb-sway 5.5s ease-in-out infinite alternate}.oo-motion .oo-hw-banner__lantern--2{animation-duration:4.6s;animation-delay:-2s}.oo-motion .oo-hw-banner__ghost{animation:oo-hwb-bob 4.8s ease-in-out infinite alternate}.oo-motion .oo-hw-banner__bat{animation:oo-hwb-loop 9s ease-in-out infinite}.oo-motion .oo-hw-banner__bat--2{animation-duration:11s;animation-delay:-4s}.oo-motion .oo-hw-banner__bat--3{animation-duration:13s;animation-delay:-7s}.oo-motion .oo-hw-banner__bat svg{animation:oo-hw-flap .28s ease-in-out infinite alternate}.oo-motion .oo-hw-banner__spirit{animation:oo-hwb-wisp 6s ease-in-out infinite alternate}.oo-motion .oo-hw-banner__spirit--2{animation-duration:7.5s;animation-delay:-3s}.oo-motion .oo-hw-banner__pumpkin .oo-hw-face{animation:oo-hwb-flicker 3.2s steps(1,end) infinite}.oo-motion .oo-hw-banner__pumpkin--2 .oo-hw-face{animation-delay:-1.3s}.oo-motion .oo-hw-banner__moon{animation:oo-hwb-glow 7s ease-in-out infinite alternate}}.oo-hw-banner.is-offscreen *{animation-play-state:paused!important}@keyframes oo-hwb-drift{0%{transform:translate(-7%)}to{transform:translate(7%)}}@keyframes oo-hwb-sway{0%{transform:rotate(-5deg)}to{transform:rotate(5deg)}}@keyframes oo-hwb-bob{0%{transform:translateY(0) rotate(-3deg)}to{transform:translateY(-14px) rotate(3deg)}}@keyframes oo-hwb-loop{0%,to{transform:translate(0)}25%{transform:translate(22px,-10px)}50%{transform:translate(40px,6px)}75%{transform:translate(14px,14px)}}@keyframes oo-hwb-wisp{0%{transform:translate(0) scale(1);opacity:.9}to{transform:translate(8px,-18px) scale(.85);opacity:.45}}@keyframes oo-hwb-flicker{0%,to{opacity:1}42%{opacity:.72}46%{opacity:1}71%{opacity:.85}}@keyframes oo-hwb-glow{0%{opacity:.94}to{opacity:1}}
/*# sourceMappingURL=/cdn/shop/t/18/assets/oo-halloween-banner.css.map */