.shared-site-nav { position: relative; width: 100%; aspect-ratio: 705 / 150; }
.shared-site-nav__art { display: block; width: 100%; height: 100%; pointer-events: none; }
.shared-site-nav__menu {
  position: absolute;
  z-index: 999;
  top: 30.13%;
  right: 13.2%;
  width: 6.81%;
  aspect-ratio: 48 / 41;
  padding: 0;
  border: 0;
  background: transparent;
  pointer-events: auto;
  cursor: pointer;
}
.shared-site-nav__menu img { display: block; width: 100%; height: 100%; object-fit: contain; pointer-events: none; }
body.is-menu-open [data-shared-nav] { visibility: hidden; pointer-events: none; }
.shared-menu-overlay {
  position: fixed;
  z-index: 300;
  inset: 0;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  overflow-y: auto;
  padding: max(16px, env(safe-area-inset-top)) 0 max(16px, env(safe-area-inset-bottom));
  background: rgb(0 0 0 / 68%);
}
.shared-menu-overlay[hidden] { display: none !important; }
.shared-menu-overlay:not([hidden]) { animation: shared-menu-backdrop-in 200ms cubic-bezier(0.23, 1, 0.32, 1) both; }
.shared-menu-drawer { position: relative; width: min(91vw, 705px); aspect-ratio: 705 / 769; margin-top: min(2vw, 15px); }
.shared-menu-overlay:not([hidden]) .shared-menu-drawer { transform-origin: top right; animation: shared-menu-drawer-in 250ms cubic-bezier(0.23, 1, 0.32, 1) both; }
.shared-menu-expanded { position: absolute; inset: 0; width: 100%; height: 100%; }
.shared-menu-close { position: absolute; z-index: 2; right: 13.1%; top: 5.7%; width: 7%; aspect-ratio: 1; padding: 0; border: 0; background: transparent; cursor: pointer; }
.shared-menu-close::before, .shared-menu-close::after { content: ""; position: absolute; left: 50%; top: 50%; width: 100%; height: min(.65vw, 5px); border-radius: 999px; background: #fff; transform-origin: center; }
.shared-menu-close::before { transform: translate(-50%, -50%) rotate(45deg); }
.shared-menu-close::after { transform: translate(-50%, -50%) rotate(-45deg); }
.shared-menu-links { position: absolute; left: 14%; right: 14%; top: 25%; display: grid; }
.shared-menu-links a { display: flex; align-items: center; justify-content: center; gap: .7em; min-height: min(15.6vw, 117px); color: white; text-decoration: none; font-size: min(5.8vw, 43px); font-weight: 400; }
.shared-menu-link-icon { width: auto; height: min(4.8vw, 36px); flex: 0 0 auto; object-fit: contain; }
.shared-menu-overlay:not([hidden]) .shared-menu-links a { animation: shared-menu-link-in 220ms cubic-bezier(0.23, 1, 0.32, 1) both; }
.shared-menu-overlay:not([hidden]) .shared-menu-links a:nth-child(1) { animation-delay: 60ms; }
.shared-menu-overlay:not([hidden]) .shared-menu-links a:nth-child(2) { animation-delay: 100ms; }
.shared-menu-overlay:not([hidden]) .shared-menu-links a:nth-child(3) { animation-delay: 140ms; }
.shared-menu-overlay:not([hidden]) .shared-menu-links a:nth-child(4) { animation-delay: 180ms; }
@keyframes shared-menu-backdrop-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes shared-menu-drawer-in { from { opacity: 0; transform: translateY(-2%) scale(.96); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes shared-menu-link-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
body.is-locked { overflow: hidden; }

@media (prefers-reduced-motion: reduce) {
  .shared-menu-overlay:not([hidden]),
  .shared-menu-overlay:not([hidden]) .shared-menu-drawer,
  .shared-menu-overlay:not([hidden]) .shared-menu-links a {
    animation: shared-menu-backdrop-in 150ms cubic-bezier(0.23, 1, 0.32, 1) both;
    animation-delay: 0ms;
  }
}