.site-btn {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: clamp(10rem, 22vw, 13rem);
  height: var(--btn-h);
  border-radius: var(--btn-r);
  font-weight: 700;
  cursor: pointer;
  transition: transform 0.15s, box-shadow 0.25s, background 0.2s;
  border: 1px solid #ffffff30;
  background: #fff;
  color: #2b2140;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.25);
  font-family: var(--font);
}
.site-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 34px rgba(0, 0, 0, 0.35);
  background: var(--aqua);
}
.site-btn--aqua {
  background: var(--aqua);
  color: #2b2140;
  border-color: transparent;
}
.site-btn--ghost {
  background: #fff;
  color: #2b2140;
}


.btn-aqua {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 0.6rem 1.1rem;
  border-radius: 10px;
  background: var(--aqua);
  color: #2b2140;
  font-weight: 700;
  border: none;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.15);
  transition: transform 0.15s, box-shadow 0.25s, background 0.2s;
}
.btn-aqua:hover {
  transform: translateY(-2px);
  background: #2b2140;
  color: #fff;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.25);
}


@media (max-width: 860px) {
  .btn-aqua {
    min-width: 50%;
  }

  .btn-outline-light {
    min-width: 50%;
  }
}


@media (max-width: 768px) {
  .btn-aqua {
    min-width: 100%;
  }

  .btn-outline-light {
    min-width: 100%;
  }
}