/* ============================================================
   Navegación compartida — GV Pets-eat S.A.
   Archivo de override para mantener el nav igual en todas las páginas
   ============================================================ */
#main-nav{
  position:sticky;
  top:0;
  z-index:1000;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(234,234,234,.95);
  box-shadow:0 10px 28px -26px rgba(43,39,32,.45);
}
#main-nav .wrap.nav{
  width:min(1280px,calc(100% - 40px));
  height:76px;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
}
#main-nav .brand{
  display:flex;
  align-items:center;
  flex:0 0 auto;
  text-decoration:none;
  min-width:128px;
}
#main-nav .brand img{
  display:block;
  height:48px;
  width:auto;
  object-fit:contain;
}
#main-nav .links{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  flex:1 1 auto;
  min-width:0;
}
#main-nav .links > a,
#main-nav .dropdown-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:38px;
  padding:9px 13px;
  border-radius:999px;
  font-family:var(--cond), Impact, sans-serif;
  font-size:clamp(15px,1.35vw,18px);
  line-height:1;
  letter-spacing:.065em;
  text-transform:uppercase;
  color:var(--ink);
  text-decoration:none;
  white-space:nowrap;
  transition:background .22s ease,color .22s ease,transform .22s ease,box-shadow .22s ease;
}
#main-nav .links > a::after,
#main-nav .dropdown-toggle::after{
  display:none!important;
}
#main-nav .links > a:hover,
#main-nav .dropdown:hover .dropdown-toggle,
#main-nav .dropdown-toggle:hover{
  background:var(--cream);
  color:var(--orange);
  transform:translateY(-1px);
}
#main-nav .links > a.active,
#main-nav .dropdown-toggle.active{
  background:var(--orange);
  color:#fff;
  box-shadow:0 12px 26px -18px rgba(212,122,59,.75);
}
#main-nav .dropdown{
  position:relative;
  display:flex;
  align-items:center;
  padding:19px 0;
}
#main-nav .caret{
  font-size:.75em;
  opacity:.85;
  transition:transform .2s ease;
}
#main-nav .dropdown:hover .caret{
  transform:rotate(180deg);
}
#main-nav .dropdown-menu{
  position:absolute;
  top:calc(100% - 8px);
  left:0;
  min-width:250px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  box-shadow:0 28px 58px -32px rgba(43,39,32,.55);
  padding:8px;
  opacity:0;
  visibility:hidden;
  transform:translateY(10px);
  transition:opacity .2s ease,visibility .2s ease,transform .2s ease;
  z-index:1100;
}
#main-nav .dropdown-menu::before{
  content:'';
  position:absolute;
  left:0;
  right:0;
  top:-14px;
  height:14px;
}
#main-nav .dropdown:hover .dropdown-menu,
#main-nav .dropdown:focus-within .dropdown-menu{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}
#main-nav .dropdown-menu a{
  display:block;
  padding:11px 14px;
  border-radius:12px;
  font-family:var(--cond), Impact, sans-serif;
  font-size:17px;
  line-height:1;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--ink);
  text-decoration:none;
  transition:background .2s ease,color .2s ease,transform .2s ease;
}
#main-nav .dropdown-menu a::after{display:none!important;}
#main-nav .dropdown-menu a:hover{
  background:var(--cream);
  color:var(--orange);
  transform:translateX(3px);
}
#main-nav .nav-toggle{
  display:none;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  width:44px;
  height:44px;
  border:0;
  border-radius:50%;
  background:var(--cream);
  cursor:pointer;
  padding:0;
  flex:0 0 auto;
}
#main-nav .nav-toggle span{
  display:block;
  width:24px;
  height:2.5px;
  background:var(--ink);
  border-radius:4px;
  transition:.25s ease;
}
@media(max-width:1080px){
  #main-nav .wrap.nav{width:min(100% - 28px,1280px);gap:14px;}
  #main-nav .links{gap:3px;}
  #main-nav .links > a,#main-nav .dropdown-toggle{padding:8px 9px;font-size:15.5px;letter-spacing:.045em;}
  #main-nav .brand img{height:44px;}
}
@media(max-width:900px){
  #main-nav .wrap.nav{height:68px;position:relative;}
  #main-nav .brand img{height:40px;}
  #main-nav .nav-toggle{display:flex;}
  #main-nav .links{
    position:absolute;
    top:100%;
    left:-14px;
    right:-14px;
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    max-height:0;
    overflow:hidden;
    background:#fff;
    border-bottom:1px solid var(--line);
    box-shadow:0 24px 44px -30px rgba(43,39,32,.55);
    transition:max-height .32s ease;
  }
  #main-nav.open .links{max-height:82vh;overflow:auto;}
  #main-nav .links > a,
  #main-nav .dropdown-toggle{
    width:100%;
    justify-content:flex-start;
    min-height:0;
    padding:15px 26px;
    border-radius:0;
    border-top:1px solid var(--line);
    font-size:20px;
    letter-spacing:.06em;
    background:#fff;
    color:var(--ink);
    box-shadow:none;
    transform:none;
  }
  #main-nav .links > a.active,
  #main-nav .dropdown-toggle.active{
    color:var(--orange);
    background:#fff7f1;
    box-shadow:inset 4px 0 0 var(--orange);
  }
  #main-nav .dropdown{display:block;padding:0;}
  #main-nav .dropdown-toggle{
    cursor:pointer;
  }
  #main-nav .dropdown-toggle .caret{
    display:inline-block;
    margin-left:auto;
    font-size:14px;
    opacity:.75;
    transition:transform .25s ease;
  }
  #main-nav .dropdown.open .dropdown-toggle .caret{
    transform:rotate(180deg);
  }
  #main-nav .dropdown-menu{
    position:static;
    min-width:0;
    max-height:0;
    overflow:hidden;
    opacity:1;
    visibility:visible;
    transform:none;
    box-shadow:none;
    border:0;
    border-radius:0;
    padding:0;
    background:#fffaf6;
    transition:max-height .28s ease,padding .28s ease;
  }
  #main-nav .dropdown:hover .dropdown-menu,
  #main-nav .dropdown:focus-within .dropdown-menu{
    transform:none;
  }
  #main-nav .dropdown.open .dropdown-menu{
    max-height:360px;
    padding:4px 0 10px;
    border-top:1px solid rgba(230,222,201,.65);
  }
  #main-nav .dropdown-menu::before{display:none;}
  #main-nav .dropdown-menu a{
    padding:12px 42px;
    border-radius:0;
    font-size:17px;
    color:var(--muted);
    background:transparent;
  }
  #main-nav .dropdown-menu a:hover,
  #main-nav .dropdown-menu a.active{
    color:var(--orange);
    background:#fff3ea;
    transform:none;
  }
  #main-nav.open .nav-toggle span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
  #main-nav.open .nav-toggle span:nth-child(2){opacity:0}
  #main-nav.open .nav-toggle span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
}


/* Agrupación del menú Productos por marca */
#main-nav .dropdown-section-label{
  display:block;
  padding:10px 14px 5px;
  font-family:var(--cond), Impact, sans-serif;
  font-size:14px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--orange);
  opacity:.9;
}
#main-nav .dropdown-section-label + a{margin-top:2px;}
@media(max-width:900px){
  #main-nav .dropdown-section-label{
    padding:13px 42px 6px;
    background:#fff6ef;
    border-top:1px solid rgba(230,222,201,.65);
    font-size:15px;
  }
  #main-nav .dropdown.open .dropdown-menu{max-height:520px;}
}
