/* Match the main site's menu without loading its second application runtime. */
@font-face {
  font-family: TuklogicNav;
  src: url('/offline/fonts/LDIxapCSOBg7S-QT7q4A.ttf') format('truetype');
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: TuklogicMenu;
  src: url('/offline/fonts/LDI2apCSOBg7S-QT7pb0EMOs.ttf') format('truetype');
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: TuklogicMenuArabic;
  src: url('/offline/fonts/SLXgc1nY6HkvangtZmpQdkhzfH5lkSs2SgRjCAGMQ1z0hNI-W1Q.ttf') format('truetype');
  font-weight: 500;
  font-display: swap;
}
#site-menu-panel {
  position: fixed;
  inset: 0;
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  height: 100dvh;
  max-height: none;
  margin: 0;
  padding: 80px 0 0;
  border: 0;
  color: #fff;
  background: transparent;
  font: 500 .8333vw / 1 TuklogicMenu, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-kerning: none;
  text-rendering: optimizeLegibility;
  overflow: auto;
  overscroll-behavior: contain;
  touch-action: pan-y;
}
#site-menu-panel[open] { display: flex; align-items: center; justify-content: center; }
#site-menu-panel::backdrop { background: transparent; }
#site-menu-panel .site-menu-layers { position: fixed; inset: 0; pointer-events: none; }
#site-menu-panel .site-menu-layers i {
  position: absolute;
  inset: 0;
  background: #ff498b;
  transform: scaleY(0);
  transform-origin: bottom;
  transition: transform .5s cubic-bezier(.76, 0, .24, 1) .6s;
}
#site-menu-panel .site-menu-layers i:nth-child(2) { background: #3d1276; transition-delay: .5s; }
#site-menu-panel .site-menu-layers i:nth-child(3) { background: #0b042a; transition-delay: .4s; }
#site-menu-panel.is-open .site-menu-layers i { transform: scaleY(1); transition-delay: 0s; }
#site-menu-panel.is-open .site-menu-layers i:nth-child(2) { transition-delay: .1s; }
#site-menu-panel.is-open .site-menu-layers i:nth-child(3) { transition-delay: .2s; }
#site-menu-panel nav { position: relative; flex: none; width: max-content; max-width: calc(100% - 40px); text-align: start; }
#site-menu-panel ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 1.5em; }
#site-menu-panel li {
  opacity: 0;
  transform: translateX(1vw);
  transition: opacity .5s cubic-bezier(.22, .61, .36, 1), transform .5s cubic-bezier(.22, .61, .36, 1);
  transition-delay: calc((6 - var(--menu-index)) * .05s);
}
#site-menu-panel.is-open li { opacity: 1; transform: translateX(0); transition-delay: calc(.3s + var(--menu-index) * .05s); }
#site-menu-panel a {
  display: block;
  width: max-content;
  max-width: 100%;
  color: rgb(255 255 255 / 50%);
  font: inherit;
  font-size: 2.5em;
  text-decoration: none;
  text-transform: uppercase;
  transition: color .4s cubic-bezier(.22, .61, .36, 1);
}
#site-menu-panel .site-menu-link-label { position: relative; display: block; overflow: hidden; padding-block: .14em; white-space: nowrap; }
#site-menu-panel .site-menu-link-face { position: absolute; inset: .14em 0 auto; }
#site-menu-panel .site-menu-link-face>span { display: inline-block; transition: transform .4s cubic-bezier(.22, .61, .36, 1), opacity .4s, filter .4s; transition-delay: calc(var(--word-index) * .025s); }
#site-menu-panel .site-menu-link-face+.site-menu-link-face>span { opacity: 0; transform: translateY(100%) rotateX(-90deg); filter: blur(4px); }
#site-menu-panel .site-menu-link-measure { display: block; opacity: 0; }
#site-menu-panel a:is(:hover,:focus-visible,[aria-current='page']) { color: #fff; }
#site-menu-panel a:is(:hover,:focus-visible) .site-menu-link-face:first-child>span { opacity: 0; transform: translateY(-100%) rotateX(90deg); filter: blur(4px); }
#site-menu-panel a:is(:hover,:focus-visible) .site-menu-link-face+.site-menu-link-face>span { opacity: 1; transform: translateY(0) rotateX(0); filter: blur(0); }
#site-menu-panel a:focus-visible { outline: 2px solid #b3d7ff; outline-offset: 5px; }
#site-menu-panel[lang='ar'] { font-family: TuklogicMenuArabic, TuklogicMenu, sans-serif; }
@media(max-width:1200px) { #site-menu-panel { font-size: 1.3vw; } }
@media(max-height:879px) { #site-menu-panel ul { gap: 1em; margin-top: 12%; } }
@media(max-width:600px) {
  #site-menu-panel { font-size: 2.7vw; }
  #site-menu-panel ul { margin-top: -30%; }
}
/* Short landscape windows keep every destination reachable below the header. */
@media(max-height:500px) {
  #site-menu-panel { padding: 96px 24px 32px; }
  #site-menu-panel[open] { align-items: flex-start; }
  #site-menu-panel ul { margin-top: 0; gap: 12px; }
  #site-menu-panel a { font-size: 24px; }
}
@media(prefers-reduced-motion:reduce) { #site-menu-panel * { transition: none!important; } }