.btn-menu {
    position: absolute;
    left: 0;
    margin-top: 14px;
    margin-left: 30px;
}
.btn-menu label {
    color: #ffffff;
    font-size: 25px;
    cursor: pointer;
}
.directorio-menu {
  position: absolute;
  width: 100%;
  height: 100vh;
  top: 0;
  left: 0;
  transition: all 500ms ease;
  opacity: 0;
  visibility: hidden;
  z-index: 9999;
}
#btn-menu:checked ~ .directorio-menu {
  opacity: 1;
  visibility: visible;
}
#btn-menu{
  display: none;
}
.dire-menu {
  width: 100%;
  max-width: 250px;
  background: white;
  height: 100vh;
  position: fixed; 
  top: 64px;
  left: 0;
  transition: all 500ms ease;
}
#btn-menu:checked ~ .container-menu .dire-menu {
  transform: translateX(0%);
}
.dire-menu nav {
  transform: translateY(15%);
}
.dire-menu a {
  display: block;
  text-decoration: none;
  padding: 12px;
  color: black;
  border-left: 5px solid transparent;
  transition: all 400ms ease;
  font-weight: 500;
}
.dire-menu nav a:hover {
    background-color: #FFD700; /* Color oro principal */
    border-left: 5px solid #FFECB3; /* Color oro más claro */
    color: black;
}
.dire-menu label {
  position: absolute;
  right: 12px;
  top: 12px;
  color: #ffffff;
  cursor: pointer;
  font-size: 18px;
}