/* ===========================
   HEADER
   =========================== */
/* ===========================
   Ajuste de padding en grid-child
   =========================== */
.container-header .grid-child {
  padding: 0 !important; /* o el valor que prefieras */
}

.container-header {
  background-color: rgb(242, 242, 242) !important;
  background-image: none !important;
  box-shadow: 0 2px 0 rgba(0,0,0,0.25);
  display: flex;
  flex-direction: column;   /* logo arriba, menú debajo */
  align-items: center;      /* centrados horizontalmente */
}

/* Logo */
.container-header .navbar-brand {
  display: flex !important;
  justify-content: center !important; /* centra el logo */
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

.container-header .navbar-brand img {
  max-height: 64px !important; /* reducción del 20% */
  height: auto !important;
  width: auto !important;
  display: block;
}

@media (max-width: 768px) {
  .container-header .navbar-brand img {
    max-height: 48px !important; /* reducción del 40% */
  }
}

/* MENU */
/* Centrar el menú */
.container-header .container-nav {
  display: flex !important;
  justify-content: center !important;
}

/* Texto del menú en negro */
.container-header .container-nav .mod-menu li a {
  color: #000 !important;
  font-weight: 500 !important; /* medium */
  font-size: medium !important;
}

/* Forzar estilo en los botones de menú con hijos */
.container-header .container-nav .mod-menu__heading {
  color: #000 !important;
  font-weight: 500 !important; /* medium */
  font-size: medium !important;
  background: rgb(242, 242, 242) !important;
  border: none !important; /* opcional, limpia borde si aparece */
}

/* Fondo gris en menú principal y submenús */
.container-header .container-nav .mod-menu,
.container-header .container-nav .mod-menu ul {
  background-color: rgb(242, 242, 242) !important;
  background-image: none !important;
}