/* Estilos para el contenedor del banner */
.banner-container {
    width: 100% !important; /* Asegura que el contenedor ocupe todo el ancho del contenedor padre */
   
    background: background: rgb(2,0,36); background: linear-gradient(90deg, rgba(228,121,35,1) 0%, rgba(228,121,35,1) 48%, rgba(206,52,79,1) 100%);
    display: flex; /* Usa flexbox para centrar el contenido */
    justify-content: center; /* Centra horizontalmente */
    align-items: center; /* Centra verticalmente */
    color: white; /* Color blanco para el texto */
    font-size: 24px; /* Tamaño del texto */
    text-align: center; /* Centra el texto */
    padding: 30px; /* Elimina el padding extra */
    margin: 0; /* Elimina los márgenes */
}

/* Ajustes para el tamaño del h1 */
.banner-container h1 {
    margin: 0; /* Elimina el margen por defecto */
    font-size: 36px; /* Tamaño por defecto del título */
    color : #FFFFFF;
}

/* Media queries para pantallas más pequeñas */
@media (max-width: 768px) {
    .banner-container {
        height: 120px; /* Reduce la altura en pantallas más pequeñas */
    }

}

@media (max-width: 480px) {
    .banner-container {
        height: 100px; /* Ajusta la altura aún más en dispositivos móviles */
    }

    .banner-container h1 {
        font-size: 16px; /* Ajusta el tamaño del título en dispositivos móviles */
    }
}