/* VersaPlay - botão Blog na área HERO
 * Blog component v1.0.4
 */
.vp-blog-hero-row{
    width:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    box-sizing:border-box;
    margin-top:16px;
}

.vp-blog-hero-button{
    width:min(100%, 330px);
    min-height:58px;
    box-sizing:border-box;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:11px;
    padding:14px 24px;

    background:#fff;
    color:#111827 !important;
    border:0;
    border-radius:18px;
    text-decoration:none !important;

    font:700 1.08rem/1.2 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
    box-shadow:0 5px 16px rgba(0,0,0,.14);

    transition:transform .16s ease, box-shadow .16s ease;
}

.vp-blog-hero-button:hover,
.vp-blog-hero-button:focus-visible{
    transform:translateY(-2px);
    box-shadow:0 9px 22px rgba(0,0,0,.20);
}

.vp-blog-hero-icon{
    font-size:1.45rem;
    line-height:1;
}

@media (max-width:640px){
    .vp-blog-hero-row{
        margin-top:14px;
    }

    .vp-blog-hero-button{
        width:min(100%, 330px);
        min-height:58px;
        border-radius:18px;
    }
}