.encabezado__container {
    position: relative;
    width: 100%; /* Asegura que el contenedor ocupa todo el ancho disponible */
    height: auto; /* Ajusta la altura automáticamente */
    min-height: 250px; /* Define una altura mínima para pantallas pequeñas */
    overflow: hidden; /* Asegura que el contenido que sobresalga no sea visible */
}

#canvas {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    object-fit: cover; /* Asegura que el contenido del canvas se ajuste bien sin distorsión */
    z-index: -1; /* Coloca el canvas detrás de otros contenidos */
}

/* Media Query para pantallas pequeñas */
@media (max-width: 768px) {
    .encabezado__container {
        min-height: 200px; /* Ajusta la altura mínima para pantallas más pequeñas si es necesario */
    }
}

@media (max-width: 480px) {
    .encabezado__container {
        min-height: 150px; /* Ajusta la altura mínima para dispositivos muy pequeños */
    }
}