/* =========================================================
   STICKY CTA / LIVE CHAT
========================================================= */

.sticky-cta {
  position: fixed;

  right: 24px;
  bottom: 24px;

  z-index: 2000;

  min-width: 190px;
  min-height: 62px;

  display: flex;
  align-items: center;

  gap: 12px;

  padding: 10px 17px 10px 10px;

  border: 1px solid rgba(217, 168, 92, 0.45);
  border-radius: 50px;

  background: linear-gradient(135deg, #18140e, #0e1116);

  color: var(--text);

  box-shadow:
    0 12px 35px rgba(0, 0, 0, 0.45),
    0 0 0 1px rgba(255, 255, 255, 0.03);

  transition:
    transform 0.25s ease,
    border-color 0.25s ease,
    box-shadow 0.25s ease;
}

.sticky-cta:hover {
  transform: translateY(-3px);

  border-color: var(--accent);

  box-shadow:
    0 16px 40px rgba(0, 0, 0, 0.55),
    0 0 25px rgba(217, 168, 92, 0.12);
}

/* ICON */

.sticky-cta-icon {
  width: 42px;
  height: 42px;

  flex: 0 0 42px;

  display: grid;
  place-items: center;

  border-radius: 50%;

  background: var(--accent);
  color: #111;
}

.sticky-cta-icon svg {
  width: 23px;
  height: 23px;
}

/* TEXT */

.sticky-cta-text {
  display: flex;
  flex-direction: column;

  line-height: 1.25;
}

.sticky-cta-text strong {
  font-size: 14px;
  font-weight: 800;
}

.sticky-cta-text small {
  margin-top: 2px;

  color: var(--text-muted);

  font-size: 11px;
}

/* ONLINE DOT */

.sticky-cta-dot {
  position: absolute;

  top: 7px;
  left: 43px;

  width: 10px;
  height: 10px;

  border: 2px solid #12161c;
  border-radius: 50%;

  background: #49d17d;

  box-shadow: 0 0 0 3px rgba(73, 209, 125, 0.08);

  animation: stickyPulse 2s infinite;
}

@keyframes stickyPulse {
  0% {
    box-shadow: 0 0 0 0 rgba(73, 209, 125, 0.35);
  }

  70% {
    box-shadow: 0 0 0 6px rgba(73, 209, 125, 0);
  }

  100% {
    box-shadow: 0 0 0 0 rgba(73, 209, 125, 0);
  }
}

/* MOBILE */

@media (max-width: 600px) {
  .sticky-cta {
    right: 14px;
    bottom: 14px;

    min-width: auto;
    min-height: 54px;

    padding: 7px 15px 7px 7px;

    gap: 9px;
  }

  .sticky-cta-icon {
    width: 40px;
    height: 40px;

    flex-basis: 40px;
  }

  .sticky-cta-text strong {
    font-size: 13px;
  }

  .sticky-cta-text small {
    font-size: 10px;
  }

  .sticky-cta-dot {
    top: 5px;
    left: 38px;

    width: 9px;
    height: 9px;
  }
}

/* EXTRA SMALL PHONE */

@media (max-width: 380px) {
  .sticky-cta {
    right: 10px;
    bottom: 10px;
  }

  .sticky-cta-text {
    display: none;
  }

  .sticky-cta {
    width: 52px;
    height: 52px;

    min-width: 52px;
    min-height: 52px;

    padding: 5px;

    justify-content: center;
  }

  .sticky-cta-icon {
    width: 42px;
    height: 42px;

    flex-basis: 42px;
  }

  .sticky-cta-dot {
    top: 3px;
    left: 35px;
  }
}