/* Ajuste de espacio entre el hero y los filtros en catálogo */
.hero-section {
    margin-bottom: 50px !important; /* Espacio constante de ~5cm */
    padding-bottom: 20px !important;
}
.section.white {
    margin-top: 0 !important;
    padding-top: 20px !important;
}
.hero-title {
    margin-bottom: 20px !important;
}
.hero-subtitle {
    margin-bottom: 10px !important;
}

/* Asegurar espaciado consistente para el contenedor principal del catálogo */
.catalogo-main {
    margin-top: 50px !important; /* Espacio adicional si es necesario */
}

/* Responsive: ajustar espaciado en dispositivos móviles */
@media only screen and (max-width: 600px) {
    .hero-section {
        margin-bottom: 30px !important; /* Reducir espacio en móviles */
    }
    .catalogo-main {
        margin-top: 20px !important;
    }
}