/* ========================= */
/*          NAVBAR           */
/* ========================= */

.navbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 20px;
    background-color: #333;
    color: #fff;
    position: relative;
    z-index: 1100;
}

.navbar .logo img {
    height: 50px;
}

/* ========================= */
/*      MENU PRINCIPAL       */
/* ========================= */

.nav-links {
    list-style: none;
    display: flex;
    margin: 0;
    padding: 20;

}

.nav-links li {
    position: relative;
}

/* Estilos de enlaces */
.nav-links a {
    text-decoration: none;
    color: #fff;
    padding: 20px 15px;
    display: block;
}

.nav-links a:hover {
    background-color: #555;
    transition: 0.3s;
}

/* ========================= */
/*      SUBMENÚ SERVICIOS    */
/* ========================= */

.dropdown {
    position: relative;
}

/* Submenú oculto en escritorio */
.dropdown-menu {
    display: none;
    position: absolute;
    background-color: #444;
    list-style: none;
    padding: 0;
    margin: 0;
    z-index: 1000;
    top: 100%;
    left: 0;
    border-radius: 4px;
    width: 180px;
}

/* Mostrar submenú en escritorio al pasar el mouse */
.dropdown:hover .dropdown-menu {
    display: block;
}

/* **SIEMPRE desplegado en móviles** */
@media (max-width: 768px) {
    .dropdown-menu {
        display: block !important;
        position: relative;
        background-color: #333;
        padding-left: 20px;
        width: 100%;
    }

    .dropdown-menu li {
        padding: 5px 0;
    }

    .dropdown-menu li a {
        padding: 8px 20px;
        display: block;
        font-size: 14px;
    }
}

/* ========================= */
/*      BOTÓN "ENGLISH"      */
/* ========================= */

.language-switcher {
	
    text-align: center;


}

.language-switcher a {
	
    display: inline-block;
    width: auto;

    background-color: #c52825;
    color: #fff;
    text-align: center;
    border-radius: 5px;
	

}



/* ========================= */
/*      MENU HAMBURGUESA     */
/* ========================= */

.menu-toggle {
    display: none;
}

/* ESTILOS PARA MENÚ MOVIL */
@media (max-width: 768px) {
	
    .menu-toggle {
        display: block;
        font-size: 24px;
        cursor: pointer;
        color: #fff;
        position: absolute;
        top: 15px;
        right: 20px;
        z-index: 1101;
    }

    /* Menú lateral desde la derecha */
    .nav-links {
        display: flex;
        flex-direction: column;
        background-color: #333;
        width: 270px;
        height: 100vh;
        position: fixed;
        top: 0;
        right: -270px; /* Inicialmente oculto */
        transition: right 0.3s ease-in-out;
        padding-top: 40px;
        box-shadow: -2px 0 5px rgba(0, 0, 0, 0.5);
        z-index: 1100;
    }

    /* Mostrar menú */
    .nav-links.active {
        right: 0;
    }

    /* Submenú de Servicios alineado correctamente */
    .dropdown {
        display: flex;
        flex-direction: column;

    }

    .dropdown-menu {
        display: block !important;
        padding-left: 30px;
		margin-top: -70px
    }
	
	    .nav-links li {
        padding: 2px 0; /* Aumenta el espacio vertical entre opciones */
    }

    .dropdown-menu li a {
        font-size: 14px;

    }
}

/* ========================= */
/*   CINTILLO CONTACTO       */
/* ========================= */

.contact-bar {
    background-color: #c52825;
    color: #fff;
    padding: 8px 20px;
    font-size: 14px;
    text-align: right;
    width: 320px;
    position: relative;
    float: right;
	z-index: 1;
}

.contact-bar a {
    color: #fff;
    text-decoration: none;
}

.contact-bar a:hover {
    text-decoration: underline;
}

/* Ocultar cintillo cuando el menú está abierto */
@media (max-width: 768px) {
    .contact-bar.hidden {
        display: none;
    }
}