#back-to-top {
  display: none;

  position: fixed;
  right: 1.1rem;
  bottom: 1.1rem;
  z-index: 9999;

  /* layout */
  display: none;
  align-items: center;
  gap: 0.45rem;

  /* size (mobile-friendly) */
  padding: 0.65rem 0.85rem;

  /* stronger presence */
  background: #1f4aa8;          /* bold blue */
  color: #ffffff;
  border: 1px solid rgba(0,0,0,0.15);
  border-radius: 999px;

  cursor: pointer;

  /* subtle depth */
  box-shadow: 0 10px 24px rgba(0,0,0,0.22);

  /* smooth interaction */
  transition: transform 120ms ease, box-shadow 120ms ease, background 120ms ease;
}

#back-to-top .btt-icon {
  font-size: 1.15rem;     /* bigger arrow, not huge */
  line-height: 1;
  font-weight: 700;
}

#back-to-top .btt-label {
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1;
}

/* hover feedback (desktop) */
#back-to-top:hover {
  transform: scale(1.06);
  box-shadow: 0 14px 34px rgba(0,0,0,0.28);
  background: #1b3f93; /* slightly darker on hover */
}

/* focus (keyboard accessibility) */
#back-to-top:focus {
  outline: 2px solid #ffffff;
  outline-offset: 2px;
}

/* on very small screens: keep it compact */
@media (max-width: 420px) {
  #back-to-top {
    padding: 0.6rem 0.7rem;
  }
  #back-to-top .btt-label {
    display: none; /* icon-only on tiny phones */
  }
}

/* respect reduced-motion */
@media (prefers-reduced-motion: reduce) {
  #back-to-top {
    transition: none;
  }
}