/* Legacy CSS open state (unused when `.mxd-menu--gsap` drives tweens in `mxdMenuGsap.ts`). */

.mxd-menu.mxd-menu--gsap .mxd-menu__backdrop,
.mxd-menu.mxd-menu--gsap .mxd-menu__overlay,
.mxd-menu.mxd-menu--gsap .mxd-menu__content,
.mxd-menu.mxd-menu--gsap .menu-media__wrapper {
  transition: none !important;
}

.mxd-menu .mxd-menu__backdrop {
  transition:
    background 0.5s ease,
    backdrop-filter 0.5s ease,
    -webkit-backdrop-filter 0.5s ease;
}

.mxd-menu .mxd-menu__overlay {
  transition: clip-path 1s cubic-bezier(0.87, 0, 0.13, 1);
}

.mxd-menu .mxd-menu__content {
  transition: transform 1s cubic-bezier(0.87, 0, 0.13, 1);
}

.mxd-menu .menu-media__wrapper {
  -webkit-transform: scale(1.4);
  -moz-transform: scale(1.4);
  -ms-transform: scale(1.4);
  transform: scale(1.4);
  transition: transform 0.75s cubic-bezier(0.23, 0.65, 0.74, 1.09);
}

.mxd-menu.mxd-menu--open .mxd-menu__backdrop {
  background: rgba(var(--base-rgb), 0.8);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}

@media only screen and (max-width: 1024px) {
  .mxd-menu.mxd-menu--open .mxd-menu__backdrop {
    background: rgba(var(--base-rgb), 0.6);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
  }
}

.mxd-menu.mxd-menu--open .mxd-menu__overlay {
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
}

.mxd-menu.mxd-menu--open .mxd-menu__content {
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
}

.mxd-menu.mxd-menu--open .menu-media__wrapper {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}