@keyframes rotate{to{transform:rotate(1turn)}}.drawer{all:unset;position:fixed;top:0;height:100%;background-color:var(--color-white);box-shadow:0 2px 30px #0000;transition:transform .3s var(--ease),box-shadow .3s var(--ease);max-width:100%;width:100%}@media only screen and (min-width: 1024px){.drawer{max-width:62.5rem;width:40%}}.drawer::backdrop{background:#ffffff1a}@media only screen and (min-width: 480px){.drawer--small{max-width:25rem}}@media only screen and (min-width: 1024px){.drawer--large{max-width:62.5rem;width:80%}}@media only screen and (min-width: 1440px){.drawer--large{max-width:109.375rem}}.drawer--left{left:0;transform:translate(-100%)}.drawer--right{right:0;transform:translate(100%)}.drawer[open]{transform:translate(0);box-shadow:0 2px 30px #0003}.drawer__close{position:absolute;top:0;width:3.625rem;height:3.625rem;color:var(--color-dark-blue);border-top:0;z-index:10}@media only screen and (min-width: 768px){.drawer__close{width:4.375rem;height:4.375rem}}.drawer--left .drawer__close{left:0;border-left:0}.drawer--right .drawer__close{right:0;border-right:0}.drawer__close i{font-size:1.5rem}.drawer__content{height:100%;width:100%;overflow:auto;padding:6rem 2rem 4rem}@media only screen and (min-width: 768px){.drawer__content{padding:6rem 3rem 4rem}}@media only screen and (min-width: 1024px){.drawer__content{padding:7rem 5rem}}@media only screen and (min-width: 1440px){.drawer__content{padding:8rem 6rem}}
