.btn-call-fixed {
    position: fixed;
    z-index: 10; /* Asegura que los botones estén por encima del video */
    display: flex;
    align-items: center;
    bottom: 20px; /* Posición inferior */
    right: 30px; /* Posición derecha */
}

.btn-call-fixed.top {
    bottom: auto; /* Anula la posición inferior */
    top: 70%; /* Posición superior */
}

.btn-call-fixed.bottom {
    bottom: 20px; /* Posición inferior */
}

.btn-call-fixed .icon-wrap {
    position: relative;
    z-index: 1;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-call-fixed .icon-wrap i.fa {
    font-size: 30px;
    color: #fff;
    background: #ebcc00;
    width: 50px;
    height: 50px;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    border-radius: 50%;
    text-align: center;
    line-height: 50px;
    animation: icon-luc-lac 1.2s infinite ease-in-out;
}

.btn-call-fixed.bottom .icon-wrap i.fa {
    background: #6b6b6b; /* Fondo negro para el segundo botón */
}

.btn-call-fixed .icon-wrap .border-1 {
    width: 100px;
    height: 100px;
    position: absolute;
    z-index: 1;
    top: -25px;
    left: -25px;
    border: solid 1px #ebcc00;
    border-radius: 50%;
    animation: vien-lon-zoom 1.2s infinite ease-in-out;
}

.btn-call-fixed.bottom .icon-wrap .border-1 {
    border: solid 1px #6b6b6b; /* Borde negro para el segundo botón */
}

.btn-call-fixed .icon-wrap .border-2 {
    width: 70px;
    height: 70px;
    position: absolute;
    z-index: 1;
    top: -11px;
    left: -11px;
    border: solid 1px #ebcc00;
    border-radius: 50%;
    animation: vien-nho-zoom 2.2s infinite ease-in-out;
}

.btn-call-fixed.bottom .icon-wrap .border-2 {
    border: solid 1px #6b6b6b; /* Borde negro para el segundo botón */
}

.btn-call-fixed .text {
    display: none; /* Ocultar el texto por defecto */
    margin-right: 10px; /* Margen a la derecha del texto */
    font-family: "Roboto";
    font-size: 13px;
    font-weight: bold;
    color: #ebcc00;
    line-height: 22px;
    order: 1; /* Asegura que el texto aparezca primero */
}

.btn-call-fixed.bottom .text {
    color: #6b6b6b; /* Color de texto negro para el segundo botón */
}

.btn-call-fixed .text span:last-child {
    font-size: 30px;
    font-family: "UtmSeagull";
}

.btn-call-fixed .icon-wrap {
    order: 2; /* Asegura que el icono aparezca después del texto */
}

.btn-call-fixed:hover .text {
    display: block; /* Mostrar el texto al pasar el puntero */
    position: absolute;
    z-index: 1;
    top: 50%;
    left: calc(100% + -250px);
    transform: translateY(-50%);
    white-space: nowrap;
    text-shadow: 1px 1px 0 #fff;
}

@keyframes icon-luc-lac {
    0% {
        transform: rotate(0) scale(1) skew(1deg);
    }

    10% {
        transform: rotate(-25deg) scale(1) skew(1deg);
    }

    20% {
        transform: rotate(25deg) scale(1) skew(1deg);
    }

    30% {
        transform: rotate(-25deg) scale(1) skew(1deg);
    }

    40% {
        transform: rotate(25deg) scale(1) skew(1deg);
    }

    50% {
        transform: rotate(0) scale(1) skew(1deg);
    }

    100% {
        transform: rotate(0) scale(1) skew(1deg);
    }
}

@keyframes vien-nho-zoom {
    0% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2;
    }

    50% {
        transform: rotate(0) scale(1) skew(1deg);
        opacity: .5;
    }

    100% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2;
    }
}

@keyframes vien-lon-zoom {
    0% {
        transform: rotate(0) scale(.5) skew(1deg);
        opacity: .1;
    }

    30% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .1;
    }

    100% {
        transform: rotate(0) scale(1) skew(1deg);
        opacity: .1;
    }
}
