.deliver-scroll-wrapper{
    overflow:hidden;
    position:relative;
    padding:20px 0;
}

.deliver-track{
    display:flex;
    gap:25px;
    width:max-content;
    animation:scrollLoop 30s linear infinite;
}

.deliver-scroll-wrapper:hover .deliver-track{
    animation-play-state:paused;
}

.deliver-card{
    width:280px;
    height:320px;
    flex:0 0 auto;
    perspective:1000px;
}

.deliver-inner{
    width:100%;
    height:100%;
    position:relative;

    transform-style:preserve-3d;
    transition:transform .8s ease;
}

/* Desktop hover */
.deliver-card:hover .deliver-inner{
    transform:rotateY(180deg);
}

/* Mobile click */
.deliver-card.flipped .deliver-inner{
    transform:rotateY(180deg);
}

.deliver-front,
.deliver-back{
    position:absolute;
    width:100%;
    height:100%;

    background:#fff;

    border-radius:20px;

    box-shadow:0 10px 25px rgba(0,0,0,.08);

    backface-visibility:hidden;

    display:flex;
    flex-direction:column;

    justify-content:center;
    align-items:center;

    text-align:center;

    padding:25px;
}

.deliver-front h5,
.deliver-back h5{
    margin-top:20px;
    margin-bottom:20px;
    font-weight:700;
}

.deliver-back{
    transform:rotateY(180deg);
}

.deliver-back p{
    color:#666;
    line-height:1.6;
}

.deliver-icon{
    width:80px;
    height:80px;
    object-fit:contain;
}

.see-more-btn{
    border:none;

    background:#00A651;
    color:white;

    padding:10px 24px;

    border-radius:30px;

    font-size:.9rem;
    font-weight:600;

    cursor:pointer;

    transition:.3s;
}

.see-more-btn:hover{
    background:#008b44;
}

@keyframes scrollLoop{
    from{
        transform:translateX(0);
    }

    to{
        transform:translateX(-50%);
    }
}