/* Five aligned slices assemble the existing photograph before the menu arrives. */
.navigation.architectural-nav {
  --menu-close-ms: 980;
  --menu-open-ms: 1050;
  background: transparent;
  opacity: 1;
  transition: none;
}
.navigation.architectural-nav::backdrop { background: transparent; transition: none; }
.architectural-nav__scene::after { display: none; }
.architectural-nav__scene .menu-shutter {
  position: absolute;
  left: 0;
  top: calc(var(--band) * 20%);
  width: 100%;
  height: calc(20% + 1px);
  overflow: hidden;
  transform: translate3d(-102%, 0, 0);
  transition: transform .735s cubic-bezier(.76, 0, .24, 1);
  transition-delay: calc(var(--band) * 65ms);
}
.architectural-nav__scene .menu-shutter:nth-child(even) { transform: translate3d(102%, 0, 0); }
.architectural-nav__scene .menu-shutter img {
  position: absolute;
  left: 0;
  top: calc(var(--band) * -20dvh);
  width: 100%;
  height: 100dvh;
  max-width: none;
  object-fit: cover;
  object-position: center;
}
.architectural-nav__scene .menu-shutter::after {
  content: '';
  position: absolute;
  inset: 0;
  background: #16100b40;
}
.navigation.architectural-nav.is-open .menu-shutter { transform: translate3d(0, 0, 0); }
.navigation.architectural-nav.is-closing .menu-shutter {
  transition-duration: .6s;
  transition-delay: calc(100ms + (4 - var(--band)) * 65ms);
}
.navigation.architectural-nav nav a.menu-panel {
  transition: opacity .3s ease, transform .65s cubic-bezier(.16, 1, .3, 1);
  transition-delay: 0s;
}
.navigation.architectural-nav.is-open nav a.menu-panel {
  transition-delay: calc(.73s + var(--delay));
}
.navigation.architectural-nav.is-open nav a.menu-panel:hover,
.navigation.architectural-nav.is-open nav a.menu-panel:focus-visible { transition-delay: 0s; }
.navigation.architectural-nav .menu-gallery { transition-delay: 0s; }
.navigation.architectural-nav.is-open .menu-gallery { transition-delay: .8s; }
.navigation.architectural-nav.is-closing nav a.menu-panel,
.navigation.architectural-nav.is-closing .menu-gallery {
  transition-duration: .18s;
  transition-delay: 0s;
  pointer-events: none;
}
@media (prefers-reduced-motion: reduce) {
  .architectural-nav__scene .menu-shutter,
  .navigation.architectural-nav nav a.menu-panel,
  .navigation.architectural-nav .menu-gallery {
    transition: none !important;
  }
}

/* Clipping the root leaves sticky descendants tied to the viewport. */
html.is-navigation-locked { overflow: clip; }
.navigation.architectural-nav.is-page-transition nav a.menu-panel,
.navigation.architectural-nav.is-page-transition .menu-gallery {
  opacity: 0;
  transform: translateY(18px);
  transition-duration: .18s;
  transition-delay: 0s;
  pointer-events: none;
}
.navigation.architectural-nav.is-page-transition > .menu-toggle {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

/* Treat the assembled photograph uniformly; overscan keeps blurred edges offscreen. */
.navigation.architectural-nav .architectural-nav__scene {
  filter:brightness(1) blur(0);
  transform:scale(1);
  transform-origin:center;
  transition:filter .3s ease,transform .3s ease;
}
.navigation.architectural-nav.is-open:not(.is-page-transition) .architectural-nav__scene {
  filter:brightness(.75) blur(2.6px);
  transform:scale(1.06);
  transition:filter .7s ease 1.05s,transform .7s ease 1.05s;
}
@media(prefers-reduced-motion:reduce) {
  .navigation.architectural-nav .architectural-nav__scene,
  .navigation.architectural-nav.is-open .architectural-nav__scene {transition:none;}
}
