/*==================================================
    HERO BUTTONS
==================================================*/
#heroButtons{
    display:flex;
    justify-content:center;
    align-items:center;
    flex-wrap:wrap;
    gap:18px;
    margin-top:45px;
}

/*==================================================
    BUTTON SIZE
==================================================*/
#heroButtons .primaryButton{
    display:flex;
    justify-content:center;
    align-items:center;
    width:220px;
    min-height:58px;
    padding:0 20px;
    white-space:nowrap;
    text-align:center;
    flex-shrink:0;
}

/*==================================================
    MOBILE HERO BUTTONS
==================================================*/
@media (max-width:768px){

    #heroButtons{
        gap:10px;
        margin-top:30px;
    }

    #heroButtons .primaryButton{
        width:160px;
        min-height:46px;
        padding:0 16px;
        font-size:.82rem;
        letter-spacing:.02em;
    }

}