.ff-navbar {
  background-color: transparent;
  box-shadow: 0 .5rem 1rem rgba(0, 0, 0, 0.15), inset 0 -1px 0 rgba(255, 255, 255, 0.15);
}

@media (min-width: 992px) {
  .ff-navbar {
    --bs-navbar-padding-y: 0.25rem;
  }
}

.ff-navbar::after {
  position: absolute;
  inset: 0;
  z-index: -1;
  display: block;
  content: "";
  background-image: linear-gradient(rgba(var(--ff-scarlet-rgb), 1), rgba(var(--ff-scarlet-rgb), 0.9));
}

@media (min-width: 992px) {
  #header-nav {
    display: grid !important;
    grid: "header-nav";
    justify-content: stretch !important;
  }
}

.navbar-toggler {
  --bs-navbar-color: rgba(255, 255, 255, 0.85);
}

.navbar-toggler:hover,
.navbar-toggler:focus {
  --bs-navbar-color: rgba(255, 255, 255, 1);
}

#navbar-toggler-header {
  min-width: 48px;
}

#navbar-toggler-footer {
  min-width: 48px;
}

#navbar-brand {
  grid-area: header-nav;
  justify-self: center;
}

#navbar-brand-logo {
  width: auto;
  height: 40px;
}

#offcanvas-logo {
  width: auto;
  height: 60px;
}

.ff-navbar .navbar-nav {
  --bs-nav-link-padding-y: 0.75rem;
}

.navbar-primary .nav-link {
  --bs-nav-link-color: rgba(255, 255, 255, 0.85);
}

.navbar-primary .nav-link:hover,
.navbar-primary .nav-link:focus {
  --bs-nav-link-hover-color: rgba(255, 255, 255, 1);
}

.navbar-secondary .nav-link {
  --bs-nav-link-color: rgba(255, 255, 255, 0.7);
}

.navbar-secondary .nav-link:hover,
.navbar-secondary .nav-link:focus {
  --bs-nav-link-hover-color: rgba(255, 255, 255, 0.85);
}

@media (min-width: 992px) {
  #navbar-lang {
    grid-area: header-nav;
    justify-self: end;
  }
}

#navbar-lang .nav-item:not(:first-child)::before {
  content: "|";
  color: rgba(255, 255, 255, 0.7);
  padding: 0 .75ch;
}

#navbar-social {
  grid-area: header-nav;
  justify-self: start;
}

.ff-navbar .dropdown-menu {
  --bs-dropdown-padding: .25rem;
  --bs-dropdown-padding-x: var(--bs-dropdown-padding);
  --bs-dropdown-padding-y: var(--bs-dropdown-padding);
  --bs-dropdown-border-radius: calc(var(--bs-dropdown-item-border-radius) + var(--bs-dropdown-padding));
  --bs-dropdown-link-hover-color: var(--bs-body-color);
  --bs-dropdown-link-hover-bg: rgba(var(--ff-glacier-rgb), .5);
  --bs-dropdown-link-active-color: var(--bs-body-color);
  --bs-dropdown-link-active-bg: rgba(var(--ff-glacier-rgb), 1);
  --bs-dropdown-item-padding-x: 1.25rem;
  --bs-dropdown-item-padding-y: .75rem;
  --bs-dropdown-item-border-radius: 1rem;
  --bs-dropdown-header-padding-x: 1.25rem;
  --bs-dropdown-header-padding-y: .75rem;
}

.ff-navbar .dropdown-menu li+li {
  margin-top: .25rem;
}