/* -- The root styles must go in the element of the structure with the name "Menu". --*/

/* The styles are applying to the last menu item and giving it the button styles, you can change the background color value to the one you want instead of "var(--neutral)". */

.header-1__menu {
  /* Selecting only the children of "bricks-nav-menu". */
  .bricks-nav-menu > .menu-item {
    /* The styles will apply only to the child of the last element with the class "menu-item".  */
    &:last-child a {
      background-color: var(--neutral);
      color: var(--white);
      padding: var(--space-xs) var(--space-m);
      border-radius: var(--radius-xs);

      /* Button hover style */
      &:hover {
        background-color: var(--neutral-trans-90);
        color: var(--white);
      }
    }
  }
}


    .header-1 {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      height: 60px;
      background-color: #fff;
      display: flex;
      align-items: center;
      padding: 0 20px;
      transition: box-shadow 0.3s ease;
      z-index: 1000;
    }

    .header-1.shadow {
      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    }


@media (max-width: 991px) {
  .brxe-fusyap .bricks-mobile-menu-toggle {
    color: #0D0400;
   }
 }