<button class="btn-merc">Initiate</button>

.btn-merc {
  position: relative;
  padding: 16px 38px;
  border: none;
  border-radius: 60px;
  background: linear-gradient(135deg, #e8e0d5 0%, #c8bfb0 50%, #a89f94 100%);
  color: #0c0c0f;
  font-family: ui-sans-serif, system-ui, sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  cursor: pointer;
  overflow: hidden;
  user-select: none;
  box-shadow:
    0 2px 20px rgba(200,191,176,0.15),
    inset 0 1px 0 rgba(255,255,255,0.4),
    inset 0 -1px 0 rgba(0,0,0,0.15);
  transition: transform 0.15s cubic-bezier(.34,1.56,.64,1), box-shadow 0.3s ease;
}
.btn-merc::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(ellipse 80% 60% at 50% -20%, rgba(255,255,255,0.6) 0%, transparent 60%);
  pointer-events: none;
}
.btn-merc:hover {
  transform: scale(1.04) translateY(-2px);
  box-shadow:
    0 8px 40px rgba(200,191,176,0.25),
    inset 0 1px 0 rgba(255,255,255,0.5),
    inset 0 -1px 0 rgba(0,0,0,0.1);
}
.btn-merc:active { transform: scale(0.94); }
.btn-merc-ripple {
  position: absolute;
  border-radius: 50%;
  transform: scale(0);
  background: rgba(255,255,255,0.4);
  pointer-events: none;
  animation: btn-merc-ripple 0.7s cubic-bezier(.22,1,.36,1) forwards;
}
@keyframes btn-merc-ripple {
  to { transform: scale(4); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .btn-merc-ripple { animation: none; display: none; }
}

document.querySelectorAll('.btn-merc').forEach(function (btn) {
  btn.addEventListener('click', function (e) {
    var r = btn.getBoundingClientRect();
    var size = Math.max(r.width, r.height) * 1.5;
    var ripple = document.createElement('span');
    ripple.className = 'btn-merc-ripple';
    ripple.style.width = size + 'px';
    ripple.style.height = size + 'px';
    ripple.style.left = (e.clientX - r.left - size / 2) + 'px';
    ripple.style.top = (e.clientY - r.top - size / 2) + 'px';
    btn.appendChild(ripple);
    ripple.addEventListener('animationend', function () { this.remove(); });
  });
});