:root {
  --logo-width: 8rem;
  --logo-spacing: 10rem !important;
  --transition-time: 0.5s;
  --transition-easing: ease;
}
@media (min-width: 990px) {
  [data-menu-links="4"] ul li {
    margin-left: 0 !important;
    transition: margin var(--transition-time) var(--transition-easing);
  }
  [data-menu-links="4"] ul {
    gap: 1.5rem;
    transition: gap var(--transition-time) var(--transition-easing);
  }
  [data-menu-links="4"] ul li:nth-child(2) {
    margin-right: var(--logo-spacing);
    transition: margin-right var(--transition-time) var(--transition-easing);
  }
  [data-menu-links="4"] ul li:nth-child(3) {
    margin-left: var(--logo-spacing);
    transition: margin-left var(--transition-time) var(--transition-easing);
  }
}
@media (min-width: 990px) {
  [data-menu-links="6"] ul li {
    margin-left: 0 !important;
    transition: margin var(--transition-time) var(--transition-easing);
  }
  [data-menu-links="6"] ul {
    gap: 1.5rem;
    transition: gap var(--transition-time) var(--transition-easing);
  }
  [data-menu-links="6"] ul li:nth-child(3) {
    margin-right: var(--logo-spacing);
    transition: margin-right var(--transition-time) var(--transition-easing);
  }
  [data-menu-links="6"] ul li:nth-child(4) {
    margin-left: var(--logo-spacing);
    transition: margin-left var(--transition-time) var(--transition-easing);
  }
}
@media (min-width: 990px) {
  [data-menu-links="8"] ul li {
    margin-left: 0 !important;
    transition: margin var(--transition-time) var(--transition-easing);
  }
  [data-menu-links="8"] ul {
    gap: 1.5rem;
    transition: gap var(--transition-time) var(--transition-easing);
  }
  [data-menu-links="8"] ul li:nth-child(4) {
    margin-right: var(--logo-spacing);
    transition: margin-right var(--transition-time) var(--transition-easing);
  }
  [data-menu-links="8"] ul li:nth-child(5) {
    margin-left: var(--logo-spacing);
    transition: margin-left var(--transition-time) var(--transition-easing);
  }
}
header#brx-header {
  --logo-width: 8rem;
  --logo-spacing: 10rem !important;
  transition: all var(--transition-time) var(--transition-easing);
}
@media (min-width: 990px) {
  header#brx-header.sticky:not(.scrolling) {
    --logo-width: 16rem;
    --logo-spacing: 0.2rem !important;
  }
  header#brx-header.sticky.scrolling {
    --logo-width: 8rem;
    --logo-spacing: 10rem !important;
  }
}
@media (max-width: 989px) {
  header#brx-header {
    --logo-width: 8rem;
    --logo-spacing: 10rem !important;
  }
}
.header__logo {
  position: absolute;
  width: var(--logo-width);
  transition: width var(--transition-time) var(--transition-easing), left var(--transition-time) var(--transition-easing), top var(--transition-time) var(--transition-easing), transform var(--transition-time) var(--transition-easing);
}
@media (min-width: 990px) {
  header#brx-header.sticky:not(.scrolling) .header__logo {
    left: 50%;
    top: 10rem;
    transform: translateX(-50%);
  }
  header#brx-header.sticky.scrolling .header__logo {
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
  }
}
@media (max-width: 989px) {
  header#brx-header .header__logo {
    position: static;
    transform: translate(0, 0);
  }
}
.header__logo img {
  width: 100%;
  height: auto;
  display: block;
  transition: all var(--transition-time) var(--transition-easing);
}
.menu--centered nav {
  transition: all var(--transition-time) var(--transition-easing);
}
.menu--centered nav ul {
  transition: all var(--transition-time) var(--transition-easing);
}
.menu--centered nav ul li {
  transition: margin-left var(--transition-time) var(--transition-easing), margin-right var(--transition-time) var(--transition-easing);
}