.popup-toggle {position: fixed; bottom: 20px; right: 20px; width: 50px; height: 50px; background-color: #e60012; color: white; border-radius: 50%;}
.popup-toggle {display: flex; align-items: center; justify-content: center; font-size: 22px; cursor: pointer; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);}
.popup-toggle {z-index: 1001; transition: all 0.3s; animation: floatUpDown .8s ease-in-out infinite;}

.popup-toggle:hover {background-color: #aa010f;}
.popup-toggle .icon, .popup-toggle .close {position: absolute; transition: opacity 0.3s ease, transform 0.3s ease;}

.popup-toggle .icon {opacity: 1; transform: scale(1); font-size: 30px; font-weight: bold;}
.popup-toggle .close {opacity: 0;transform: scale(0); font-size: 30px; font-weight: bold;}

.popup-toggle.active .icon {opacity: 0; transform: scale(0);}
.popup-toggle.active .close {opacity: 1; transform: scale(1);}

@keyframes floatUpDown {
    0% {transform: translateY(0);}
    50% {transform: translateY(-6px);}
    100% {transform: translateY(0);}
}

.bottom-popup {position: fixed; bottom: -300px; right: 20px; background: white; border-radius: 12px; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);}
.bottom-popup {border: 1px solid #ddd; padding: 40px; opacity: 0; transition: bottom 0.4s ease, opacity 0.4s ease; z-index: 1000; }
.bottom-popup h2 {margin-bottom: 30px;}
.bottom-popup a {padding: 8px 20px 10px 20px; margin-right: 22px; font-size: 20px; border-color: transparent;}
.bottom-popup.show {bottom: 100px; opacity: 1;}

@media screen and (max-width: 1024px) {
    .bottom-popup {right: 0; padding: 20px; margin: 0 20px;}
    .bottom-popup a {display: block; margin: 20px 0;}
}