@charset "utf-8";

/* NAVBAR */
.topnav{
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 999;
  display: flex;
  align-items: center;
  gap: .5rem;
  min-height: 100px;
  padding: 10px .75rem;
  background: #f8f7f2; /* ✅ FIX */
}



 /* LOGO NAV */
.nav-logo {
  display: flex;
  align-items: center;
  margin-right: 10px; /* spinge menu a destra */
   flex: 0 0 auto;
}

.nav-logo img {
  height: 80px;
  width: auto;
  display: block;
}


  .topnav a{
    display: inline-flex;
    align-items: center;
    padding: 0 .75rem;
    height: 40px;
    color: #000000;
    text-decoration: none;
    border-radius: 50px;
    font-family: 'Poppins', sans-serif;
  font-size: 20px;
  
  }
  .topnav a:hover{color:#098d3f;}
  
  .topnav a.active:hover {
  background: transparent; /* nessun effetto hover sulla voce attiva */
}

  /* Toggle */
  .topnav .icon{
    margin-left: auto;
    display: inline-flex;
    font-size: 22px;
    line-height: 1;
    height: 40px;
    align-items: center;
    padding: 0 .5rem;
    cursor: pointer;
    user-select: none;
	background: transparent;
	border:none;
  }

  /* Contenitore voci: collassato su mobile, espanso su desktop */
  .menu{
    width: 100%;
    display: grid;
    grid-template-columns: 1fr;
    gap: .5rem;
    overflow: hidden;
    max-height: 0;                 /* chiuso di default */
    transition: max-height .3s ease;
  }
  /* Quando .topnav ha .open, il JS setta max-height dinamica */

  /* Desktop */
 @media (min-width: 768px){
  .topnav{
    flex-wrap: nowrap;
  }
  .topnav .icon{ display: none; }
  .menu{
    display: flex;
    gap: .25rem;
    max-height: none !important; /* sempre aperto */
    overflow: visible;
    /* tolto margin-left:auto */
    width: auto;
  }
  .menu a{ height: 40px; }
  
  
}

@media (max-width: 767.98px){
  .topnav a.active{
    box-shadow: none;
  }
  
  .nav-logo img {
    height: 75px; /* un po’ più piccolo per nav bassa */
  }
}



  /* Accessibilità focus */
  .topnav a:focus-visible, .topnav .icon:focus-visible{
    outline: 2px solid #0b5; outline-offset: 2px;
  }
  
  /* Stile link personalizzato */
.decor-link a {
  color: #7c7328;          /* colore base (oro elegante) */
  text-decoration: none;   /* niente sottolineatura */
  font-weight: 600;        /* leggero grassetto */
  transition: color 0.3s, border-bottom 0.3s;
}

/* Stato visitato */
.decor-link a:visited {
  color: #7c7328;          /* variante più scura */
}

/* Stato hover */
.decor-link a:hover {
  color: #a18c2a;        /* colore più luminoso */
  text-decoration:underline;
 /* sottolineatura elegante */
}

/* Stato attivo (clic) */
.decor-link a:active {
  color: #7c7328;             /* più scuro */
}