.hb-hw-hero{position:relative;isolation:isolate;display:grid;min-height:clamp(36rem,70vh,48rem);overflow:hidden;background-color:#000516} .hb-hw-hero__media{position:absolute;inset:0;z-index:0;display:block;width:100%;height:100%;overflow:hidden} .hb-hw-hero__image{display:block;width:100%;height:100%;object-fit:cover;object-position:72% center} .hb-hw-hero__media::after{position:absolute;inset:0;content: "";pointer-events:none;background:linear-gradient( 90deg,rgb(42 43 34 / 8%) 0%,rgb(42 43 34 / 2%) 42%,rgb(42 43 34 / 0%) 72% )} .hb-hw-hero__inner{position:relative;z-index:1;display:flex;box-sizing:border-box;width:min( 100%,100rem );margin-inline:auto;padding:clamp(2.5rem,5vw,5rem) clamp(1.25rem,4vw,3.5rem);align-items:center} .hb-hw-hero__panel{position:relative;box-sizing:border-box;width:min( 44rem,48vw );min-width:0;padding:clamp(2rem,4vw,3.75rem);background:rgb(247 245 240 / 94%);background:rgb(35 59 78 / 80%);border:0.0625rem solid rgb(255 255 255 / 52%);border-radius:0.4rem 2.5rem 2.5rem 0.4rem;box-shadow:0 1.5rem 4rem rgb(40 43 31 / 18%);backdrop-filter:blur(0.22rem);-webkit-backdrop-filter:blur(0.22rem)} .hb-hw-hero__panel::before{position:absolute;top:2.25rem;left:0;width:0.28rem;height:5.5rem;content: "";background-color:#9e4fff;border-radius:0 999rem 999rem 0} .hb-hw-hero__eyebrow{display:flex;margin:0 0 1rem;align-items:center;gap:0.75rem;color:#fe7b11;font-size:0.8125rem;font-weight:700;letter-spacing:0.1em;line-height:1.4;text-transform:uppercase} .hb-hw-hero__eyebrow::before{width:2.25rem;height:0.1875rem;flex:0 0 auto;content: "";background-color:#fe7b11;border-radius:999rem} .hb-hw-hero__title{max-width:40rem;margin:0;color:#ad78ee;font-size:clamp(2.65rem,4.8vw,4.75rem);font-weight:700;letter-spacing:-0.035em;line-height:1;overflow-wrap:break-word;text-wrap:balance} .hb-hw-hero__kicker{margin:clamp(1.4rem,2.5vw,2rem) 0 0;color:#fe7b11;font-size:clamp(1.2rem,1.8vw,1.55rem);font-weight:600;line-height:1.35} .hb-hw-hero__lead{max-width:38rem;margin:1rem 0 0;color:#b79f71;font-size:clamp(1.025rem,1.35vw,1.18rem);line-height:1.7} .hb-hw-hero__actions{display:flex;flex-wrap:wrap;width:auto;align-items:center;gap:0.85rem;margin-top:clamp(1.75rem,3vw,2.5rem)} .hb-hw-hero__actions .hb-button{width:auto;max-width:100%;flex:0 0 auto} @media (max-width:48rem){.hb-hw-hero{display:block;min-height:0;overflow:hidden} .hb-hw-hero__media{position:relative;inset:auto;z-index:0;display:block;width:100%;height:clamp(18rem,62vw,26rem)} .hb-hw-hero__image{width:100%;height:100%;object-fit:cover;object-position:50% center} .hb-hw-hero__media::after{background:linear-gradient( 180deg,rgb(42 43 34 / 0%) 55%,rgb(42 43 34 / 8%) 100% )} .hb-hw-hero__inner{position:relative;z-index:1;display:block;box-sizing:border-box;width:100%;max-width:100%;margin:-3rem 0 0;padding:0 1rem 1rem} .hb-hw-hero__panel{box-sizing:border-box;width:100%;max-width:100%;min-width:0;margin:0;padding:clamp(1.6rem,6vw,2.25rem);border-radius:1.5rem} .hb-hw-hero__panel::before{top:1.75rem;height:4.5rem} .hb-hw-hero__title{font-size:clamp(2.25rem,10vw,3.25rem)} .hb-hw-hero__actions{display:flex;width:auto;align-items:flex-start;justify-content:flex-start} .hb-hw-hero__actions .hb-button{width:fit-content;max-width:100%;flex:0 0 auto}} .hb-hw-hero__products{display:block;width:min(100%,22rem);max-height:11rem;height:auto;object-fit:contain;object-position:left center;margin:0.5rem 0 1.25rem} @media (max-width:48rem){.hb-hw-hero__products{width:min(100%,16rem);max-height:9rem;margin:.75rem 0 1rem}} .hb-hw-hero::before,.hb-hw-hero::after{content: "";position:absolute;inset:0;z-index:2;pointer-events:none} .hb-hw-hero::before{background:radial-gradient( ellipse 28% 38% at 84% 72%,rgba(255,135,30,.85) 0%,rgba(255,100,20,.35) 40%,transparent 85% );z-index:5;animation:halloween-glow 2.5s ease-in-out infinite} @keyframes halloween-glow{0%,100%{opacity:.25} 20%{opacity:.58} 40%{opacity:.28} 65%{opacity:.62} 85%{opacity:.32}} .hb-hw-hero::after{inset:-8% -16%;z-index:4;background:radial-gradient( ellipse 32% 12% at 40% 60%,rgba(235,239,255,.85) 0%,rgba(210,215,245,.48) 40%,rgba(190,190,220,.10) 75%,transparent 100% ),radial-gradient( ellipse 38% 15% at 75% 78%,rgba(205,195,240,.78) 0%,rgba(175,170,220,.42) 40%,rgba(175,170,210,.08) 75%,transparent 100% );opacity:.90;animation:halloween-fog 6s ease-in-out infinite alternate} @keyframes halloween-fog{0%{transform:translate3d(-7%,0,0)} 100%{transform:translate3d(10%,-4%,0)}} .hb-hw-hero__inner{position:relative;z-index:2} @media (max-width:48rem){.hb-hw-hero::before{bottom:auto;height:clamp(18rem,62vw,26rem)} .hb-hw-hero::after{inset:0 -16% auto;height:clamp(18rem,62vw,26rem)}} @media (prefers-reduced-motion:reduce){.hb-hw-hero::before,.hb-hw-hero::after{animation:none;transform:none}}