/* =========================
   WHATSAPP FLOAT
========================= */

.whatsapp-float{
    position: fixed;

    right:24px;
    bottom: 24px;

    z-index: 9999;

    display: flex;
    align-items: center;

    gap: .85rem;

    height: 62px;

    padding:
        0 1.5rem
        0 .85rem;

    border-radius: 999px;

    text-decoration: none;

    background: rgba(16,16,16,.92);

    backdrop-filter: blur(18px);

    box-shadow:
        0 12px 34px rgba(0,0,0,.18);

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

/* HOVER */

.whatsapp-float:hover{
    transform: translateY(-3px);

    background: rgba(22,22,22,.98);

    box-shadow:
        0 18px 44px rgba(0,0,0,.24);
}

/* ICON */

.whatsapp-float-icon{
    display: flex;
    align-items: center;
    justify-content: center;

    width: 42px;
    height: 42px;

    border-radius: 50%;

    background: #25D366;

    flex-shrink: 0;
}

.whatsapp-float-icon i{
    font-size: 1.3rem;

    color: #ffffff;
}

/* TEXT */

.whatsapp-float span{
    font-size: .92rem;
    font-weight: 700;
    letter-spacing: .02em;

    white-space: nowrap;

    color: #ffffff;
}

/* MOBILE */

@media (max-width: 768px){

    .whatsapp-float{
        right:16px;
        bottom: 16px;

        height: 58px;

        padding:
            0 1.2rem
            0 .75rem;
    }

    .whatsapp-float-icon{
        width: 40px;
        height: 40px;
    }

    .whatsapp-float span{
        font-size: .85rem;
    }

}