/* Posición fija y centrado del ícono */
.burbuja-refiere{
  position: fixed !important;
  right: 20px !important;
  bottom: 160px !important;
  display: grid;
  text-align: center;
  z-index: 101 !important;
}
.burbuja-refiere .bur-icon-img{
  position: relative; width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center; z-index: 9;
}
.burbuja-refiere .bur-icon-img img,
.burbuja-refiere .bur-icon-img svg{ width: 60%; height: auto; display: block; }


/* ===== Burbuja Refiere y Gana ===== */
.burbuja-refiere {
    display: grid;
    position: fixed;
    right: 20px;
    bottom: 160px;        /* más arriba que Hipoteca (90px) */
    text-align: center;
    z-index: 101;
}

/* Texto */
.burbuja-refiere .bur-text-content {
    background: rgba(207, 216, 220, 0.3);
    padding: 0 56px 0 12px;
    border-radius: 20px;
    height: 45px;
    display: grid;
    align-items: center;
    align-content: center;
    text-align: center;
    border: 1px solid rgba(207, 216, 220, 0.3);
    width: 209px;
    box-sizing: border-box;
    position: absolute;
    right: 20px;
    overflow: hidden;
    transition: all 0.5s ease;
}

.burbuja-refiere .bur-txt-1 {
    font-size: 15px;
    position: relative;
    overflow: hidden;
    transition: all 0.5s ease;
}

.burbuja-refiere .bur-txt-2 {
    font-size: 15px;
    font-weight: 700;
}

/* Hover */
.burbuja-refiere:hover .bur-txt-1 {
    margin-left: -339px;
}
.burbuja-refiere .bur-txt-1::after {
    content: "Refiere y gana";
    position: absolute;
    text-align: center;
    width: 209px;
    color: #fff;
}
.burbuja-refiere:hover .bur-txt-2 { color: #fff; }
.burbuja-refiere:hover .bur-text-content { background: #245fae; }

/* Icono */
.burbuja-refiere .bur-icon-content { width: 45px; height: 45px; }
.burbuja-refiere .bur-icon-img {
    position: relative;
    width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: center;
    z-index: 9;
}
.burbuja-refiere .bur-icon-img img {
    width: 60%; height: auto; display: block;
}

/* Pulsar */
.burbuja-refiere .pulsar-content {
    display: flex; justify-content: center; align-items: center;
    height: 100%; width: 100%;
}
.burbuja-refiere .pulsar-1,
.burbuja-refiere .pulsar-2,
.burbuja-refiere .pulsar-3 {
    position: absolute;
    width: 45px; height: 45px;
    border-radius: 50%;
    animation: radial-pulsar-refiere 2.3s infinite;
}
.burbuja-refiere .pulsar-1 { background: rgba(36,95,174,1); }
.burbuja-refiere .pulsar-2 { animation-delay: 1.3333s; }
.burbuja-refiere .pulsar-3 { animation-delay: 2.6666s; }

.burbuja-refiere .bur-space-brdr {
    box-shadow: 0 0 0 1em rgba(255,255,255,0);
    height: 100%; width: 100%;
    position: absolute;
    width: 55px; height: 55px; border-radius: 50%;
}

@keyframes radial-pulsar-refiere {
    0%   { box-shadow: 0 0 0 0em rgba(36,95,174,.8); }
    50%  { box-shadow: 0 0 0 1em rgba(36,95,174,0); }
    100% { box-shadow: 0 0 0 0 rgba(36,95,174,0); }
}
