.scroll-text {
    width: 100%; /* O ajusta el ancho que necesites */
    overflow: hidden;
    white-space: nowrap;
    box-sizing: border-box;
    display: inline-flex;
    gap: 4rem;
    
    /* Aplicar el borde con gradiente */
   
}
.marquee-container{
    border: 2px solid;
    border-image-source: linear-gradient(89.93deg, #FF5704 0.02%, rgba(255, 87, 4, 0) 13.51%, #FF5704 25.5%, rgba(255, 87, 4, 0) 36.99%, #FF5704 51.48%, rgba(255, 87, 4, 0) 63.97%, #FF5704 74.46%, rgba(255, 87, 4, 0) 83.95%, #FF5704 94.45%);
    border-image-slice: 1; /* Para que el borde aplique a todo el contorno */
    z-index: 999 !important;
    color: var(--primary--color);
    padding: .5rem 0;
    border-right: none !important;
    border-left: none !important;;

    /* Opcional: Si deseas mantener el contenido visible dentro de los límites del div */
}

.scroll-text::after {
    content: " ";
    display: inline-block;
    width: 100%;
}

.scroll-text {
    animation: scroll-left 5s linear infinite;
}

@keyframes scroll-left {
    from {
        transform: translateX(-100%);
    }
    to {
        transform: translateX(100%);
    }
}
.swiper-slide a{
  border: none;
  text-decoration: none;
  color: var(--primary--color);
}
