/* Animated Overlay Header Styles */
#brx-header.sticky {
  position: fixed;
}
.scrolling #header {
  padding-top: calc(var(--space-xs) * 0.6);
  padding-bottom: calc(var(--space-xs) * 0.6);
}
#header::before {
  position: absolute;
  inset: 0;
  content: "";
  width: 100%;
  transform: translateY(-67px);
  transition: all 0.6s ease-in-out;
}
:root {
  --logo-size: 6rem;
}
/* Test Animation to make it more seamless */
.scrolling .fr-logo {
  width: 4.5rem;
  filter: invert(1);
  -webkit-filter: drop-shadow(5px 5px 5px var(--base-trans-30));
  filter: drop-shadow(5px 5px 5px var(--base-trans-30));
}