/* Зона наведения в правом нижнем углу */
@media (hover: hover) and (pointer: fine) and (min-width: 769px) {

.corner-hotspot {
  position: fixed;
  bottom: 0;
  right: 0;
  width: 250px;      /* зона наведения, можно подстроить */
  height: 250px;
  z-index: 9998;
}

/* Панель с картинкой, по умолчанию спрятана */
.corner-trigger {
  position: fixed;
  bottom: 0;
  right: 0;
  width: 220px;     /* размер панели/картинки */
  height: 220px;
  transform: translate(100%, 100%);
  opacity: 0;                         /* невидимая */
  transition: transform .35s ease, opacity .35s ease;
  pointer-events: none;               /* чтобы не мешала клику */
  z-index: 9999;
  will-change: transform, opacity;
}

.corner-trigger img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

/* Появление при наведении */
.corner-hotspot:hover + .corner-trigger,
.corner-trigger:hover {
  opacity: 1;
  transform: translate(0, 0);
  pointer-events: auto;
}

@media (hover: hover) and (pointer: fine) {
  .corner-hotspot-mobile,
  .corner-trigger-mobile {
    display: none !important;
  }
}

}