.hero-card-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:18px;
}

.hero-card-nav{
    display:flex;
    gap:12px;
}

.hero-arrow{
    background:none;
    border:none;
    color:#fff;
    font-size:34px;
    line-height:1;
    cursor:pointer;
    opacity:.75;
    transition:.25s;
    padding:0;
}

.hero-arrow:hover{
    opacity:1;
    transform:scale(1.15);
}

.top-list {
    display: grid;
    gap: 12px;

    min-height: 0;
    height: auto;

    overflow-x: hidden;
}

.top-list-animated {
    animation: leadersFade 0.3s ease;
}

@keyframes leadersFade {
    from {
        opacity: 0;
        transform: translateX(10px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.top-list{

    overflow-x:auto;
    scroll-behavior:smooth;
    scrollbar-width:none;

}

.top-list::-webkit-scrollbar{
    display:none;
}

.top-list {
    display: grid;
    gap: 12px;

    min-height: 234px;
    align-content: start;

    overflow: hidden;
}