/* Estilos generales para el footer */
.main-footer {
    background-color: #000000; /* Color de fondo */
    color: #929292; /* Color del texto */
    padding: 50px 0; /* Espaciado interno arriba y abajo */
    font-size: 14px; /* Tamaño de fuente base para el footer */
}

.main-footer .container {
    max-width: 1200px; /* Ancho máximo del contenido */
    margin: 0 auto; /* Centrar el contenido horizontalmente */
    padding: 0 20px; /* Espacio interno con márgenes laterales */
    box-sizing: border-box; /* Asegura que el padding no afecte el ancho total */
}

.main-footer .brand-footer {
    text-align: center; /* Centra el contenido dentro de brand-footer */
}

.main-footer .brand-footer img {
    width: 160px; /* Ancho del logo */
    height: auto; /* Altura automática */
    max-width: 100%; /* Imagen no puede ser más ancha que su contenedor */
    display: inline-block; /* Alinea la imagen como un bloque en línea */
    margin-bottom: 20px; /* Espaciado inferior para el logo */
}

.main-footer h5 {
    font-size: 1.4em; /* Tamaño de fuente para los títulos */
    color: #ffffff; /* Color del título */
    margin-bottom: 15px; /* Espaciado inferior */
}

.main-footer ul {
    list-style: none; /* Eliminar viñetas de la lista */
    padding: 0; /* Eliminar el espacio interno de la lista */
}

.main-footer ul li {
    margin-bottom: 10px; /* Espaciado entre elementos de la lista */
}

.main-footer ul li a {
    color: #ffffff; /* Color de enlace */
    text-decoration: none; /* Eliminar subrayado de enlaces */
    transition: color 0.3s ease; /* Transición suave para el color */
}

.main-footer ul li a:hover {
    color: #0088b6; /* Cambio de color al pasar el mouse */
}

.main-footer .copyright {
    margin-top: 30px; /* Espaciado superior para el texto de derechos de autor */
    font-size: 0.9em; /* Tamaño de fuente para el texto de derechos de autor */
    text-align: center; /* Centrar el texto de derechos de autor */
}





.main-footer .row {
    margin-bottom: 10px;
}


.main-footer .social-icons {
    display: flex;
    gap: 16px; /* Ajusta el espacio entre los iconos según sea necesario */
    padding-top: 10px;
}

.main-footer .social-icons a {
    color: #ffffff;
    font-size: 2.0em;
}

.main-footer .social-icons a:hover {
    color: #007bff; /* Cambia el color al pasar el cursor si lo deseas */
}





@media (max-width: 767px) {
    .main-footer .col-lg-3 {
        margin-bottom: 20px;
    }
    .main-footer .social-icons {
        justify-content: center;
    }
}