.cintillo-wrap {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    overflow: hidden;
}

.cintillo-viewport {
    display: flex;
    width: max-content;
    white-space: nowrap;
}

.cintillo-track {
    display: flex;
    align-items: center;
    white-space: nowrap;
    flex-shrink: 0;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-name: cintillo-izq;
    will-change: transform;
}

/* Dirección invertida */
.cintillo-wrap[data-direccion="derecha"] .cintillo-track {
    animation-name: cintillo-der;
}

.cintillo-item {
    font-weight: 500;
    letter-spacing: .5px;
    padding: 0 .5em;
}

.cintillo-sep {
    padding: 0 .25em;
    opacity: .7;
}

@keyframes cintillo-izq {
    from { transform: translateX(0); }
    to   { transform: translateX(-100%); }
}

@keyframes cintillo-der {
    from { transform: translateX(-100%); }
    to   { transform: translateX(0); }
}

/* Respeta preferencia de reducir movimiento */
@media (prefers-reduced-motion: reduce) {
    .cintillo-track {
        animation: none;
    }
    .cintillo-viewport {
        overflow-x: auto;
    }
}
