/* ===== Scroll To Top (car) ===== */

.scrollToTop {
    position: fixed;
    left: 20px;
    bottom: 30px;
    z-index: 350;
    width: 41px;

    opacity: 0;
    pointer-events: none;

    transform: translateY(20px);
    transition: opacity 0.3s ease, transform 0.3s ease;

    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

/* Появление кнопки */
.scrollToTop.button-show {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

/* Эффект при наведении (оставляем) */
.scrollToTop:before,
.scrollToTop:after {
    content: "";
    position: absolute;
    transition: 0.2s;
    opacity: 0;
}

.scrollToTop:hover:before,
.scrollToTop:hover:after,
.wd-search-opened .scrollToTop:before,
.wd-search-opened .scrollToTop:after {
    opacity: 1;
}

/* Огонёк */
.scrollToTop.button-show:before {
top: -45px;
    left: -32px;
    width: 104px;
    height: 93px;
    background: url(../../../../../img/car-focus.svg) no-repeat 0 0;
}

/* Мобильная коррекция */
@media (max-width: 782px) {

.scrollToTop.button-show:before
 {
    top: -28px;
    left: -20px;
    width: 69px;
    height: 95px;
}

.scrollToTop {
    width: 30px;
}
}

/* Скрываем при поиске */
.wd-search-opened .scrollToTop {
    display: none;
}

/* ===== Анимация "машинка уехала вверх" ===== */

@keyframes carDriveUp {
    0% {
                transform: translateY(0) scale(1);
                opacity: 1;
        }
        60% {
                transform: translateY(-40vh) scale(1.05);
                opacity: 1;
        }
        100% {
                transform: translateY(-120vh) scale(0.9);
                opacity: 0;
        }
}


.scrollToTop.car-go {
    animation: carDriveUp 0.8s ease-in forwards;
    pointer-events: none;
}
