.menu{position:fixed;inset:0;z-index:48;overflow:hidden}
.menu[hidden]{display:none}
.menu__painel{
  position:absolute;inset:0;
  transform:translateX(100%);
  display:flex;flex-direction:column;
  padding:6.5rem var(--pad) calc(2rem + env(safe-area-inset-bottom));
  background:var(--paper);
  overflow-y:auto;
}

.menu.is-aberto .menu__painel{transform:none;transition:transform 650ms cubic-bezier(.16,1,.3,1)}

.menu:not(.is-aberto) .menu__painel{transition:transform 380ms cubic-bezier(.64,0,.78,0)}

.menu__links{display:flex;flex-direction:column;align-items:flex-end;gap:.35rem;list-style:none;margin:0;padding:0}
.menu__item{display:flex;justify-content:flex-end;overflow:hidden;line-height:1}
.menu__links a{
  display:inline-flex;padding:.55rem 0;text-align:right;
  font-family:var(--f-display);font-weight:600;
  font-size:clamp(2rem,8.6vw,3rem);line-height:1.05;letter-spacing:-.02em;
  color:var(--ink);transition:color .2s ease;
}
.menu__links a:focus-visible{outline-offset:2px}
@media (hover:hover) and (pointer:fine){ .menu__links a:hover{color:var(--champ-ink)} }

.menu__rotulo{
  display:inline-block;
  transform:translateY(140%) rotate(10deg);
  transform-origin:50% 100%;
  opacity:0;
}
.menu.is-itens .menu__rotulo{transform:none;opacity:1}
.menu.is-aberto .menu__rotulo{
  transition:transform 1s cubic-bezier(.16,1,.3,1), opacity 350ms ease-out;
  transition-delay:calc(120ms + var(--i,0) * 100ms);
}
.menu__item:nth-child(2){--i:1}
.menu__item:nth-child(3){--i:2}
.menu__item:nth-child(4){--i:3}
.menu__item:nth-child(5){--i:4}
.menu__item:nth-child(6){--i:5}
.menu__item:nth-child(7){--i:6}

.menu__pe{margin-top:auto;padding-top:2.5rem;display:flex;justify-content:flex-end}
.menu__wa{font-size:1rem;padding:1rem 1.6rem;opacity:0;transform:translateY(25px)}
.menu.is-itens .menu__wa{opacity:1;transform:none}
.menu.is-aberto .menu__wa{transition:opacity 550ms ease-out 520ms, transform 550ms cubic-bezier(.33,1,.68,1) 520ms}

.is-menu-aberto{overflow:hidden}
.is-menu-aberto .wa-float{display:none}

@media (min-width:1001px){ .menu{display:none !important} }

@media (prefers-reduced-motion:reduce){
  .menu *,.menu__painel{transition:none !important}
}

.menu__pe{justify-content:space-between;align-items:center;gap:1rem}
.menu__lingua{font-size:1rem;font-weight:500;color:var(--ink);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1.5px;
  padding:.6rem 0;opacity:0;transform:translateY(25px)}
.menu.is-itens .menu__lingua{opacity:1;transform:none}
.menu.is-aberto .menu__lingua{transition:opacity 550ms ease-out 520ms, transform 550ms cubic-bezier(.33,1,.68,1) 520ms}