/* ================================================================
   Velora Ticker
   ================================================================ */

.vticker {
    overflow: hidden;
    border-top:    1px solid #0B0C0E;
    border-bottom: 1px solid #0B0C0E;
    background: #CCFF02;
}

/* ── Track ──────────────────────────────────────────────────── */
.vticker-track {
    display: flex;
    width: max-content;
    white-space: nowrap;
    animation: vticker-scroll 30s linear infinite;
    will-change: transform;
}

@keyframes vticker-scroll {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}

/* ── Pause on hover ─────────────────────────────────────────── */
.vticker--pause-hover:hover .vticker-track {
    animation-play-state: paused;
}

/* ── Item ───────────────────────────────────────────────────── */
.vticker-item {
    display: inline-flex;
    align-items: center;
    font-family: inherit;
    font-weight: 800;
    font-stretch: 110%;
    font-size: 16px;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: #0B0C0E;
    padding: 13px 26px;
    text-decoration: none;
    cursor: default;
    transition: opacity 0.15s;
}

a.vticker-item {
    cursor: pointer;
}

a.vticker-item:hover {
    opacity: 0.7;
    text-decoration: none;
}

/* ── Separator (::after pseudo) ─────────────────────────────── */
.vticker-item::after {
    content: var(--vticker-sep, '/');
    margin-left: 26px;
    opacity: 0.4;
    font-weight: 400;
}

/* ── Tablet ─────────────────────────────────────────────────── */
@media (max-width: 1039px) {
    .vticker-item {
        font-size: 14px;
        padding: 11px 20px;
    }

    .vticker-item::after {
        margin-left: 20px;
    }
}

/* ── Mobile ─────────────────────────────────────────────────── */
@media (max-width: 767px) {
    .vticker-item {
        font-size: 12px;
        padding: 10px 16px;
        letter-spacing: 0.03em;
    }

    .vticker-item::after {
        margin-left: 16px;
    }
}

/* ── Reduced motion ─────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    .vticker-track {
        animation: none;
    }
}
