/* Menú móvil lateral — GS Producciones */
.nav-toggle{
  display:none;
  width:44px;
  height:44px;
  border:0;
  background:transparent;
  padding:10px;
  cursor:pointer;
  z-index:220;
  flex-direction:column;
  justify-content:center;
  gap:6px;
  position:relative;
}
/* Con el menú abierto, el hamburguesa no intercepta clics del panel */
body.nav-open .nav-toggle{
  pointer-events:none;
  opacity:0;
}
.nav-toggle span{
  display:block;
  width:100%;
  height:2px;
  background:#fff;
  border-radius:2px;
  transition:transform .25s ease,opacity .2s ease;
}
.nav-toggle.is-open span:nth-child(1){transform:translateY(8px) rotate(45deg);}
.nav-toggle.is-open span:nth-child(2){opacity:0;}
.nav-toggle.is-open span:nth-child(3){transform:translateY(-8px) rotate(-45deg);}

.nav-backdrop{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.55);
  z-index:900;
  opacity:0;
  transition:opacity .25s ease;
  pointer-events:auto;
}
.nav-backdrop.is-visible{
  display:block;
  opacity:1;
}
/* El nav del sitio suele tener z-index:200; al abrir hay que subirlo
   para que el panel no quede debajo del backdrop */
body.nav-open nav{
  z-index:1100 !important;
  position:sticky;
}

.nav-drawer-head{
  display:none;
}

@media (max-width:900px){
  nav{
    padding:.7rem 1rem !important;
  }

  .nav-toggle{display:flex;}

  .nav-links{
    position:fixed !important;
    top:0 !important;
    right:0 !important;
    left:auto !important;
    width:min(320px,86vw) !important;
    height:100vh !important;
    height:100dvh !important;
    margin:0 !important;
    padding:5.5rem 1.2rem 2rem !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:.35rem !important;
    list-style:none !important;
    background:#6d1414 !important;
    box-shadow:-12px 0 32px rgba(0,0,0,.35) !important;
    transform:translateX(105%);
    transition:transform .3s ease;
    z-index:1200 !important;
    overflow-y:auto;
    pointer-events:auto !important;
  }

  .nav-links.is-open{
    transform:translateX(0);
  }

  .nav-drawer-head{
    display:flex;
    position:fixed;
    top:0;
    right:0;
    width:min(320px,86vw);
    align-items:center;
    justify-content:space-between;
    padding:1rem 1.2rem;
    background:#821919;
    border-bottom:1px solid rgba(255,255,255,.1);
    z-index:1300;
    transform:translateX(105%);
    transition:transform .3s ease;
    pointer-events:auto;
  }
  .nav-drawer-head.is-open{transform:translateX(0);}
  .nav-drawer-head strong{
    color:#fff;
    font-family:Montserrat,Arial,sans-serif;
    font-size:.95rem;
    letter-spacing:.06em;
    text-transform:uppercase;
  }
  .nav-close{
    width:40px;
    height:40px;
    border:0;
    border-radius:8px;
    background:rgba(255,255,255,.1);
    color:#fff;
    font-size:1.5rem;
    line-height:1;
    cursor:pointer;
  }

  .nav-links > li{width:100%;}
  .nav-links > li > a{
    display:block !important;
    padding:.9rem .85rem !important;
    font-size:1rem !important;
    text-decoration:none !important;
    border-radius:8px;
    color:#fff !important;
  }
  .nav-links > li > a:hover,
  .nav-links > li > a:active{
    background:rgba(255,255,255,.08);
  }

  .nav-services{position:static !important;}
  .nav-services > a{
    display:flex !important;
    align-items:center;
    justify-content:space-between;
  }
  .nav-services .arrow{transition:transform .2s ease;}
  .nav-services.is-open .arrow{transform:rotate(180deg);}

  /* Desactivar hover en móvil */
  .nav-services:hover .nav-dropdown{display:none !important;}

  .nav-dropdown{
    position:static !important;
    display:none !important;
    min-width:0 !important;
    margin:.15rem 0 .4rem !important;
    padding:.2rem 0 !important;
    background:rgba(0,0,0,.2) !important;
    box-shadow:none !important;
    border-radius:8px !important;
  }
  .nav-services.is-open .nav-dropdown{
    display:block !important;
  }
  .nav-dropdown a{
    padding:.7rem 1rem !important;
    font-size:.92rem !important;
    text-decoration:none !important;
  }

  body.nav-open{overflow:hidden;}
}