.scroll-btn{
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:10px 16px;

    font-family:Arial, sans-serif;
    font-size:14px;
    font-weight:bold;
    letter-spacing:.3px;

    color:white;
    background:linear-gradient(135deg, rgb(77,165,127), rgb(38,120,95));

    border:none;
    border-radius:10px;

    cursor:pointer;

    box-shadow:
        0 4px 10px rgba(0,0,0,0.12),
        inset 0 1px 0 rgba(255,255,255,0.2);

    transition:all .25s ease;
}

/* hover lift */
.scroll-btn:hover{
    transform:translateY(-2px);
    box-shadow:
        0 8px 18px rgba(0,0,0,0.18),
        0 0 12px rgba(77,165,127,0.35);
}

/* click press */
.scroll-btn:active{
    transform:translateY(0px);
    box-shadow:0 3px 8px rgba(0,0,0,0.2);
}

/* icon animation */
.scroll-icon{
    font-size:18px;
    transition:transform .25s ease;
}

.scroll-btn:hover .scroll-icon{
    transform:translateY(3px);
}