.order-btn {
    display: inline-block;
    padding: 0.9rem 1.8rem;
    font: 600 1rem / 1 system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    color: #fff;
    text-decoration: none;
    position: relative;
    z-index: 1;
    overflow: hidden;
    transition: transform 1ms ease;
    border-radius: 5px;
    padding: 15px 38px;
    font-size: 18px;
}

/* animated gradient border */
.order-btn::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 3px; /* border thickness */
  border-radius: inherit;

  background: linear-gradient(
    90deg,
    #007BFF,
    #FFD700,
    #007BFF
  );
  background-size: 300% auto;
  animation: borderFlow 4s linear infinite;

  /* show only border, hide fill */
  -webkit-mask: 
    linear-gradient(#000 0 0) content-box, 
    linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask: 
    linear-gradient(#000 0 0) content-box, 
    linear-gradient(#000 0 0);
          mask-composite: exclude;

  z-index: -1;
}

/* hover scale effect */
.order-btn:hover {
  transform: scale(1.07);
}

/* border gradient animation */
@keyframes borderFlow {
  0%   { background-position: 0% center; }
  100% { background-position: 300% center; }
}
