nav.navbar {
  background-color: #c77d31;
  position: relative;
  z-index:9999;
  padding:0;
  width:  100%;
}

.hamburger {
  display: none;
  font-size: 2em;
  padding: 0.2em 0.5em;
  color: white;
  cursor: pointer;
  z-index:10001;
}

.menu {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: row;
  z-index: 10000;
  width:  100%;
}

.menu li {
  position: relative;
	list-style: none;
	margin:0;
}

.menu > li > a {
  display: block;
  padding: 0.4em 1.2em;
  color: white;
  text-decoration: none;
}


.menu li a {
  display: block;
  padding: 1em;
  color: white;
  text-decoration: none;
}

.menu li:hover > ul {
  display: block;
  border-left:1px solid #ccc;
}

.menu ul li:has(a:hover) {
  border-bottom:1px solid #ccc;
  background-color:#ad7750;
}

.menu li ul {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background: #c77d31;
  min-width: 200px;
  z-index: 1000;
  padding:0;
}

.menu li ul li {
  position: relative;
}

.menu li ul ul {
  left: 100%;
  top: 0;
}

/* Responsive */
@media (max-width: 768px) {
  .hamburger {
    display: block;
  }

  .menu {
    flex-direction: column;
    position: fixed;
    top: 0;
    left: -100%;
    width: 250px;
    height: 100%;
    background-color: #333;
    transition: left 0.3s ease;
    padding-top: 3em;
  }

  .menu.open {
    left: 0;
  }

  .menu li ul {
    position: static;
	 display: none;
  }


  .menu li.open > ul {
    display: block;
  }
	
 /* (Opzionale) stile visivo per mobile */
  .menu li.open > a {
    background-color: #444;
  }

}