#fc-floating-contact{
    position:fixed;
    right:24px;
    bottom:24px;
    z-index:999999;
    display:flex;
    flex-direction:column;
    align-items:flex-end;
}

#fc-items{
    display:flex;
    flex-direction:column;
    gap:12px;
    margin-bottom:14px;

    opacity:0;
    visibility:hidden;
    pointer-events:none;

    transform:translateY(12px);

    transition:
        opacity .25s ease,
        transform .25s ease,
        visibility .25s;
}

#fc-floating-contact.active #fc-items{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateY(0);
}

.fc-item{
    width:56px;
    height:56px;

    border-radius:50%;

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

    text-decoration:none;

    color:#fff;

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

    transform:translateY(10px) scale(.9);

    opacity:0;

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

#fc-floating-contact.active .fc-item{
    opacity:1;
    transform:translateY(0) scale(1);
}

.fc-item:nth-child(1){
    transition-delay:0ms;
}

.fc-item:nth-child(2){
    transition-delay:80ms;
}

.fc-item:nth-child(3){
    transition-delay:160ms;
}

.fc-item:hover{
    transform:scale(1.08);
}

.fc-whatsapp{
    background:#25D366;
}

.fc-phone{
    background:#16a34a;
}

.fc-item svg{
    width:31px;
    height:31px;
    display:block;
    color:#fff;
}

/*==============================
Toggle
==============================*/

#fc-toggle{

    width:64px;
    height:64px;

    border:none;

    border-radius:50%;

    background:#ef4444;

    color:#fff;

    cursor:pointer;

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

    box-shadow:0 12px 30px rgba(0,0,0,.22);

    transition:.25s ease;
}

#fc-toggle:hover{
    transform:scale(1.05);
}

#fc-toggle svg{
    width:38px;
    height:38px;
    display:block;
}

.fc-menu-icon,
.fc-close-icon{
    display:flex;
    align-items:center;
    justify-content:center;
}

.fc-close-icon{
    display:none;
}

#fc-floating-contact.active .fc-menu-icon{
    display:none;
}

#fc-floating-contact.active .fc-close-icon{
    display:flex;
}

/*==============================
Responsive
==============================*/

@media (max-width:768px){

    #fc-floating-contact{
        right:16px;
        bottom:16px;
    }

    #fc-toggle{
        width:58px;
        height:58px;
    }

    .fc-item{
        width:50px;
        height:50px;
    }

    .fc-item svg{
        width:27px;
        height:27px;
    }

}
@media (max-width:768px){

    #fc-floating-contact{

        right:16px;

        bottom:calc(env(safe-area-inset-bottom, 0px) + 95px);

    }
#fc-toggle svg {
    width: 30px;
    height: 30px;
    display: block;
}

}