.BackToTop {
  position: fixed;
  bottom: 40px;
  left: 40px;
  width: 50px;
  height: 50px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(20px);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  cursor: pointer;
  z-index: 1020;
}
.BackToTop.visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.BackToTop.visible:hover {
  transform: translateY(-5px);
}
.BackToTop.visible:hover .progressCircle {
  transform: rotate(360deg);
}
.BackToTop .progressCircle {
  transform: rotate(-90deg);
  transition: transform 0.5s ease;
}
.BackToTop .progressPath {
  stroke: #ffc107;
  stroke-width: 4;
  fill: none;
  stroke-linecap: round;
}
.BackToTop .icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 24px;
  height: 24px;
  color: #ffc107;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color 0.3s ease;
}
.BackToTop:hover .progressPath {
  stroke: #eeb712;
}
.BackToTop:hover .icon {
  color: #eeb712;
}
.BackToTop:focus {
  outline: none;
}
.BackToTop:focus .progressPath {
  stroke: #eeb712;
}

@media (max-width: 768px) {
  .BackToTop {
    width: 50px;
    height: 50px;
    bottom: 20px;
    left: 20px;
  }
  .BackToTop .icon {
    width: 20px;
    height: 20px;
  }
}/*# sourceMappingURL=BackToTop.module.css.map */