@layer components{[name=BurgerMenu]{width:3rem;height:3rem;position:relative;cursor:pointer;display:inline-block;left:-.75rem}@media screen and (min-width:1024px){[name=BurgerMenu]{display:none}}[name=BurgerMenu] span{background-color:var(--color-black);position:absolute;border-radius:.125rem;transition:.3s cubic-bezier(.8,.5,.2,1.4);width:1.5rem;height:.125rem;transition-duration:.5s}[name=BurgerMenu] span:nth-child(1){top:1.25rem;left:.75rem}[name=BurgerMenu] span:nth-child(2){top:1.6875rem;left:.75rem;opacity:1}[name=BurgerMenu] span:nth-child(3){top:2.125rem;left:.75rem}[name=BurgerMenu].open span:nth-child(1){transform:rotate(45deg);top:1.625rem}[name=BurgerMenu].open span:nth-child(2){opacity:0}[name=BurgerMenu].open span:nth-child(3){transform:rotate(-45deg);top:1.625rem}}