/* Shared vertical-page navigation. The HOME keeps its own composition. */
body:not(.home) {
  --nav-type: clamp(17px, calc(12px + .4vw), 22px);
  --nav-logo: clamp(184px, calc(126px + 4.5vw), 240px);
  --nav-height: clamp(88px, calc(64px + 2vw), 112px);
  --nav-inset: clamp(24px, 3vw, 64px);
  --nav-padding: clamp(10px, .6vw, 16px);
  --nav-target: clamp(48px, calc(36px + 1vw), 60px);
  --nav-gap: clamp(4px, .5vw, 12px);
}

body:not(.home) .horizon-header > .wp-block-group {
  width: calc(100% - 2 * var(--nav-inset));
  max-width: 1560px;
  min-height: var(--nav-height);
  gap: clamp(24px, 2vw, 48px);
  margin-inline: auto;
  padding-block: 10px !important;
  /* Scrolling changes the surface, not the size of its controls. */
  transition: none;
}

body:not(.home) .horizon-header .horizon-brand { flex: 0 0 auto; }
body:not(.home) .horizon-header .horizon-brand-logo {
  width: var(--nav-logo);
  transition: none;
}
body:not(.home) .horizon-header .wp-block-navigation__container { gap: var(--nav-gap); }
body:not(.home) .horizon-header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__container { flex-wrap: nowrap; }
body:not(.home) .horizon-header .wp-block-navigation-item__content {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: var(--nav-target);
  padding: 10px var(--nav-padding);
  font-size: var(--nav-type);
  font-weight: 650;
  line-height: 1.35;
  white-space: nowrap;
}
body:not(.home) .horizon-header .horizon-nav-join .wp-block-navigation-item__content {
  padding-inline: calc(var(--nav-padding) + 6px);
  border-radius: 6px;
}
body:not(.home) .horizon-header .horizon-nav-login .wp-block-navigation-item__content {
  border-color: #c8c2d5;
  border-radius: 6px;
}
body:not(.home) .horizon-header .wp-block-navigation .has-child > .wp-block-navigation__submenu-container {
  min-width: 320px;
  width: max-content;
  max-width: min(440px, calc(100vw - 48px));
  padding: 10px;
  border: 1px solid #d4cfdf;
  border-radius: 8px;
  background: #fbfaf7;
  color: #20205f;
  box-shadow: 0 14px 32px #20205f1a;
}
body:not(.home) .horizon-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
  justify-content: flex-start;
  width: 100%;
  font-size: clamp(17px, calc(13px + .3vw), 20px);
  white-space: normal;
}
body:not(.home) .horizon-header .wp-block-navigation__responsive-container-open,
body:not(.home) .horizon-header .wp-block-navigation__responsive-container-close {
  width: 48px;
  height: 48px;
  min-width: 48px;
  min-height: 48px;
}

/* One composition threshold for both the trigger and the opened panel. */
@media (max-width: 1279px), (max-width: 1439px) and (any-pointer: coarse) {
  body:not(.home) .horizon-header { --nav-logo: clamp(150px, 20vw, 184px); --nav-height: 80px; --nav-inset: clamp(8px, 2vw, 24px); }
  body:not(.home) .horizon-header .wp-block-navigation__responsive-container:not(.is-menu-open) { display: none !important; }
  body:not(.home) .horizon-header .wp-block-navigation__responsive-container-open { display: flex !important; }
  body:not(.home) .horizon-header { backdrop-filter: none; -webkit-backdrop-filter: none; }
  body:not(.home) .horizon-header .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open {
    position: fixed !important;
    inset: 0 !important;
    height: 100dvh !important;
    min-height: 100dvh !important;
    overflow-y: auto;
    padding: 20px clamp(24px, 5vw, 64px) 32px;
    background: #f7f6f2;
    color: #20205f;
    z-index: 10000;
  }
  body:not(.home) .horizon-header .is-menu-open .wp-block-navigation__responsive-container-content { width: 100%; max-width: 760px; margin-inline: auto; padding-top: 72px; }
  body:not(.home) .horizon-header .is-menu-open .wp-block-navigation__container { width: 100%; align-items: stretch; gap: 0; }
  body:not(.home) .horizon-header .is-menu-open .wp-block-navigation-item { width: 100%; }
  body:not(.home) .horizon-header .is-menu-open .wp-block-navigation-item__content {
    width: 100%;
    min-height: 56px;
    padding: 14px 0;
    justify-content: flex-start;
    font-size: clamp(18px, calc(16px + .6vw), 23px);
    white-space: normal;
    border-radius: 0;
    border-bottom: 1px solid #d4cfdf;
  }
  body:not(.home) .horizon-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .has-child { align-items: stretch; }
  body:not(.home) .horizon-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .has-child .wp-block-navigation__submenu-container {
    min-width: 0;
    width: 100%;
    max-width: none;
    padding: 0 0 0 16px;
    background: transparent;
    border: 0;
    border-left: 2px solid #d4cfdf;
    border-radius: 0;
    box-shadow: none;
  }
  body:not(.home) .horizon-header .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content { font-size: clamp(17px, calc(15px + .4vw), 20px); }
  body:not(.home) .horizon-header .is-menu-open .horizon-nav-join { margin-top: 24px; }
  body:not(.home) .horizon-header .is-menu-open .horizon-nav-join .wp-block-navigation-item__content,
  body:not(.home) .horizon-header .is-menu-open .horizon-nav-login .wp-block-navigation-item__content { justify-content: center; border-radius: 6px; }
  body:not(.home) .horizon-header .is-menu-open .horizon-nav-login { margin-top: 10px; }
}
