.cg-call-wrapper{
    position:fixed;
    right:18px;
    bottom:22px;
    z-index:99999;
    font-family:Inter,sans-serif;
}

.cg-call-btn{

    --glass:rgba(35,35,38,.42);
    --glass2:rgba(255,255,255,.06);
    --border:rgba(255,255,255,.18);
    --shine:rgba(255,255,255,.45);
    --shadow:rgba(0,0,0,.45);
    --accent:#0099ff;

    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;

    width:170px;
    height:64px;

    overflow:hidden;

    text-decoration:none;
    color:#fff;

    border-radius:24px;

    background:
        linear-gradient(145deg,
        rgba(255,255,255,.09),
        rgba(255,255,255,.03));

    backdrop-filter:blur(22px) saturate(180%);
    -webkit-backdrop-filter:blur(22px) saturate(180%);

    border:1px solid var(--border);

    box-shadow:

        0 10px 35px var(--shadow),

        inset 1px 1px 1px rgba(255,255,255,.15),

        inset -2px -2px 4px rgba(0,0,0,.18);

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}

/* Shine */
.cg-call-btn::before{

    content:"";

    position:absolute;

    inset:1px;

    border-radius:22px;

    background:

        linear-gradient(120deg,
        rgba(255,255,255,.20),
        transparent 30%,
        transparent 70%,
        rgba(255,255,255,.05));

    pointer-events:none;
}

/* Animated border */
.cg-call-btn::after{
    content:"";
    position:absolute;
    inset:-2px;
    border-radius:26px;
    background:linear-gradient(
        135deg,
        transparent,
        rgba(255,255,255,.18),
        transparent);
    opacity:.35;
    filter:blur(6px);
    animation:borderFlow 6s linear infinite;
}

.cg-glow{
    position:absolute;
    width:120px;
    height:120px;
    border-radius:50%;
    background:radial-gradient(circle,
    rgba(0,229,255,.28),
    transparent 70%);
    animation:glowFloat 5s ease-in-out infinite;
}

.cg-icon{
    width:26px;
    height:26px;
    position:relative;
    z-index:2;
    flex-shrink:0;
    transition:transform .35s;
}

.cg-text{

    white-space:nowrap;

    opacity:1;

    transform:translateX(0);

    font-size:15px;
    font-weight:600;
    letter-spacing:.3px;

    position:relative;
    z-index:2;
}

/* Hover Desktop */
.cg-call-btn:hover{

    transform:translateY(-4px) scale(1.03);

    box-shadow:
        0 18px 45px rgba(0,0,0,.5),
        0 0 22px rgba(0,229,255,.18),
        inset 1px 1px 1px rgba(255,255,255,.2);
}

.cg-call-btn:hover .cg-icon{
    transform:rotate(-12deg) scale(1.08);
}

/* Active */

.cg-call-btn:active{

    transform:scale(.95);
}

/* Floating animation */

@keyframes glowFloat{

    0%,100%{

        transform:translateY(0px) scale(1);
    }

    50%{

        transform:translateY(-8px) scale(1.08);
    }

}

@keyframes borderFlow{

    from{

        transform:rotate(0deg);
    }

    to{

        transform:rotate(360deg);
    }

}

/* Floating idle */

.cg-call-wrapper{

    animation:floatButton 4.5s ease-in-out infinite;
}

@keyframes floatButton{

    0%,100%{

        transform:translateY(0px);
    }

    50%{

        transform:translateY(-7px);
    }

}

/* Tablet */

@media (min-width:768px){

    .cg-call-btn{

        width:180px;
        height:70px;
    }

    .cg-icon{

        width:28px;
        height:28px;
    }

}

/* Reduce motion */

@media (prefers-reduced-motion:reduce){

    *,
    *::before,
    *::after{

        animation:none!important;
        transition:none!important;
    }

}