/* Contenedor principal */
.header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 20px; /* Espacio mínimo entre logo y menú */
}

/* Espacio para el logo: 20% del total o máximo 200px */
.header .navbar-brand {
    flex: 0 0 200px; /* No crece, no se encoge, se mantiene en 200px */
    margin: 0;
}

/* El menú ocupa todo el espacio restante (80%) */
.header .container-nav {
    flex: 1; 
    display: flex;
  width:100%;
    min-width: 350px;
    justify-content: flex-end; /* Alinea el menú a la derecha */
}

/* Ajuste para que el menú interno no se rompa */
.header .container-nav .navbar {
    justify-content: flex-end;
}

.header .grid-child {
    width: 0;
}