#block-dynamicmenu {
  background-color: var(--bg-light);
  padding: 20px;
  z-index: 100;
  transition: background-color 0.3s ease; /* Opcional: suaviza el cambio */
}

/* Estado fijo (activado por el JS) */
#block-dynamicmenu.fixed {
  position: fixed !important;
  top: 0;
  left: 0;
  width: 100%;
}
ul.dynamic-menu {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  align-items: center;
  gap: 4rem;
}
ul.dynamic-menu li a {
  color: var(--black);
  font-weight: 500;
  transition: 0.3s;
}
.dynamic-menu li.active a,
ul.dynamic-menu li:hover a {
  color: var(--bg-red);
}
ul.dynamic-menu li:first-child {
  padding-right: 10rem;
}