/* Shared site header + overlay menus */
#php-nav-host {
  display: block;
}

#nav.site-header,
#nav.site-header.fixed,
.site-header[data-php-header] {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 110 !important;
  position: fixed !important;
  pointer-events: none;
}

#nav.site-header .tr__container,
#nav.site-header .logo,
#nav.site-header .header-controls,
#nav.site-header .header-controls > * {
  pointer-events: auto;
}

[data-php-mobile-menu],
.php-desktop-menu,
.php-desktop-menu.menu-wrapper.fixed {
  z-index: 40 !important;
}

html[data-php-menu="open"] .php-desktop-menu,
html[data-php-menu="open"] .php-desktop-menu.menu-wrapper.fixed,
html[data-offline-menu="open"] .php-desktop-menu,
html[data-offline-menu="open"] .php-desktop-menu.menu-wrapper.fixed,
html[data-php-menu="open"] [data-php-mobile-menu],
html[data-offline-menu="open"] [data-php-mobile-menu] {
  z-index: 40 !important;
}

html[data-php-menu="open"] .main__humburger span:first-child,
html[data-offline-menu="open"] .main__humburger span:first-child {
  transform: translateY(0) rotate(45deg) !important;
}

html[data-php-menu="open"] .main__humburger span:last-child,
html[data-offline-menu="open"] .main__humburger span:last-child {
  transform: translateY(0) rotate(-45deg) !important;
}

.main__humburger span {
  transform-origin: center;
  transition: transform 0.35s ease, background-color 0.35s ease;
}

html[data-php-menu="open"] #sound-toggle,
html[data-php-menu="open"] .main-toggle,
html[data-php-menu="open"] .menu-toggle,
html[data-offline-menu="open"] #sound-toggle,
html[data-offline-menu="open"] .main-toggle,
html[data-offline-menu="open"] .menu-toggle {
  color: #111 !important;
  border-color: #111 !important;
}

html[data-php-menu="open"] #sound-toggle,
html[data-offline-menu="open"] #sound-toggle {
  background: rgba(17, 17, 17, 0.08) !important;
}

html[data-php-menu="open"] .main__humburger span,
html[data-offline-menu="open"] .main__humburger span {
  background-color: #111 !important;
}

.site-header .nav-link .text-layer,
.php-desktop-menu .nav-link .text-layer,
[data-php-mobile-menu] .nav-link .text-layer {
  transition: opacity 0.35s ease, transform 0.35s ease, filter 0.35s ease;
}

.site-header .nav-link:hover .text-layer.original,
.site-header .nav-link:focus-visible .text-layer.original,
.php-desktop-menu .nav-link:hover .text-layer.original,
[data-php-mobile-menu] .nav-link:hover .text-layer.original {
  opacity: 0;
  transform: translateY(-0.35em);
  filter: blur(4px);
}

.site-header .nav-link:hover .text-layer.clone,
.site-header .nav-link:focus-visible .text-layer.clone,
.php-desktop-menu .nav-link:hover .text-layer.clone,
[data-php-mobile-menu] .nav-link:hover .text-layer.clone {
  opacity: 1;
  transform: translateY(0);
  filter: blur(0);
}

.site-header .nav-link .text-layer.clone,
.php-desktop-menu .nav-link .text-layer.clone,
[data-php-mobile-menu] .nav-link .text-layer.clone {
  transform: translateY(0.35em);
  filter: blur(4px);
}

[data-php-mobile-menu] {
  transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

html[data-php-menu="open"] [data-php-mobile-menu],
html[data-offline-menu="open"] [data-php-mobile-menu] {
  transform: translateX(0) !important;
  visibility: visible !important;
  pointer-events: auto !important;
  opacity: 1 !important;
}

#desktopMenuRef {
  transition:
    clip-path 1.1s cubic-bezier(0.16, 1, 0.3, 1),
    opacity 0.45s ease,
    visibility 0.45s ease,
    transform 1.1s cubic-bezier(0.16, 1, 0.3, 1);
}

html[data-php-menu="open"] .php-desktop-menu,
html[data-offline-menu="open"] .php-desktop-menu {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  display: flex !important;
}

.desktop-menu-inner .group\/menu .menu-item {
  transition: opacity 0.45s ease;
}

.desktop-menu-inner .group\/menu:hover .menu-item {
  opacity: 0.4;
}

.desktop-menu-inner .group\/menu .menu-item:hover {
  opacity: 1;
}

html[data-php-menu="open"] .menu-toggle path:nth-child(1),
html[data-php-menu="open"] .menu-toggle path:nth-child(2),
html[data-offline-menu="open"] .menu-toggle path:nth-child(1),
html[data-offline-menu="open"] .menu-toggle path:nth-child(2) {
  opacity: 0;
}

html[data-php-menu="open"] .menu-toggle path:nth-child(3),
html[data-php-menu="open"] .menu-toggle path:nth-child(4),
html[data-offline-menu="open"] .menu-toggle path:nth-child(3),
html[data-offline-menu="open"] .menu-toggle path:nth-child(4) {
  opacity: 1 !important;
}

.php-nav-list {
  gap: calc(0.5rem * 1.5);
}

.php-desktop-menu .php-nav-list .menu-item {
  line-height: 1.5;
}

[data-php-mobile-menu] .php-nav-list .menu-item {
  line-height: 1.5;
}

@media (max-width: 767px) {
  html[data-php-menu="open"] body,
  html[data-offline-menu="open"] body {
    overflow: hidden;
  }
}
