.c-button {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  min-height: 59px;
  padding: 16px 24px;
  font-size: 1.25rem;
  font-weight: var(--font-weight-bold);
  line-height: 1.4;
  text-align: center;
  color: var(--color-black, #101010);
  background: var(--color-gold, #a79868);
  border: 0;
  border-radius: var(--radius-pill, 9999px);
  box-shadow: var(--shadow-gold, 0 12px 26px rgb(0 0 0 / 42%));
  transition: transform 180ms ease, background-color 180ms ease;
}

.c-button::before {
  position: absolute;
  inset: 4px;
  border: 1px solid rgb(26 20 8 / 30%);
  border-radius: inherit;
  pointer-events: none;
  content: "";
}

.c-button:hover {
  transform: translateY(-1px);
}

a.c-button[href="#entry"] {
  animation: c-button-scale-loop 1.45s cubic-bezier(0.34, 1.56, 0.64, 1) infinite;
  transform-origin: center;
}

@keyframes c-button-scale-loop {
  0% {
    scale: 1;
  }

  18% {
    scale: 1.048;
  }

  32% {
    scale: 0.995;
  }

  46%,
  100% {
    scale: 1;
  }
}

.c-button__icon {
  position: relative;
  flex: 0 0 auto;
  width: 32px;
  height: 32px;
  background: rgb(23 18 5 / 8%);
  border: 1px solid rgb(23 18 5 / 30%);
  border-radius: 50%;
  box-shadow: inset 0 1px 0 rgb(255 248 214 / 16%);
}

.c-button__icon::before {
  position: absolute;
  top: 50%;
  left: 48%;
  width: 8px;
  height: 8px;
  border-top: 1px solid currentColor;
  border-right: 1px solid currentColor;
  transform: translate(-50%, -50%) rotate(45deg);
  content: "";
}

.c-button--submit {
  color: var(--color-black, #101010);
}

@media (prefers-reduced-motion: reduce) {
  a.c-button[href="#entry"] {
    animation: none;
  }
}
