.anchor-underline {
  text-decoration-line: underline !important;
  text-decoration-color: #f53e4c !important;
  text-decoration-thickness: 3px;
}

.button {
  font-weight: bold;
  cursor: pointer;
}

.button.button-normal {
  color: #222222;
  background: #f6ece0;
  padding: 0.5rem 1em;
  border-radius: 0.5em;
  border: 1px solid #f6ece0;
  box-shadow: 2px 4px 2px rgba(0, 0, 0, 0.25), inset 6px 5px 2px rgba(255, 255, 255, 0.25), inset -2px -3px 2px rgba(0, 0, 0, 0.25), inset -5px -6px 2px rgba(221, 212, 202, 0.25);
  transition: box-shadow 100ms;
}
.button.button-normal:hover {
  box-shadow: 2px 4px 2px rgba(0, 0, 0, 0.25), inset 3px 4px 4px rgba(0, 0, 0, 0.25), inset -2px -3px 10px rgba(0, 0, 0, 0.25), inset -5px -6px 2px rgba(221, 212, 202, 0.25);
}

.button.button-cta {
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none !important;
  transform: skew(10deg);
  min-height: 2.5rem;
  padding-inline: 0.9em 0.5em;
  background-color: #f53e4c;
  border: 0 solid rgb(159.25, 40.3, 49.4);
  border-block-width: 2px;
  border-inline-width: 2px;
  box-shadow: 2px 2px 10px rgb(246.5, 90.95, 102.85);
  transition: box-shadow 200ms, background-color 300ms;
}
.button.button-cta:hover {
  box-shadow: 2px 2px 20px rgb(246.5, 90.95, 102.85);
  background-color: rgb(122.5, 31, 38);
}
.button.button-cta::before {
  content: "";
  position: absolute;
  width: 10px;
  right: 0px;
  height: 100%;
  background-color: rgb(220.5, 55.8, 68.4);
  border: 0 solid rgb(208.25, 52.7, 64.6);
  border-inline-end-width: 2px;
}
.button.button-cta a, .button.button-cta span, .button.button-cta p, .button.button-cta svg {
  transform: skew(-10deg);
}

.button.button-icon {
  display: grid;
  grid-template-columns: 2rem 1fr;
  align-items: center;
  gap: 0.5em;
}
.button.button-icon svg, .button.button-icon img {
  width: 2rem;
  height: 2rem;
}

.button-gradient-primary {
  background: linear-gradient(to bottom, rgba(7.5, 33, 33.5, 0) 20%, rgb(7.5, 33, 33.5));
  border: 0 solid #0f4243;
  border-block-end-width: 2px;
  transition: background-color 100ms;
}
.button-gradient-primary:hover {
  background-color: rgba(10.5, 46.2, 46.9, 0.5);
}

.button-gradient-accent-tint-80 {
  background: linear-gradient(to bottom, rgba(250, 158.5, 165.5, 0) 80%, rgb(250, 158.5, 165.5));
  border: 0 solid #f53e4c;
  border-block-end-width: 2px;
  transition: background-color 100ms;
  text-decoration: none !important;
  font-weight: normal;
  color: #222222;
  padding: 0.5em 1em;
}
.button-gradient-accent-tint-80:hover {
  background-color: rgba(248, 119.9, 129.7, 0.5);
}

.button-gradient-accent {
  background: linear-gradient(to bottom, rgba(122.5, 31, 38, 0) 20%, rgb(122.5, 31, 38));
  border: 0 solid #f53e4c;
  border-block-end-width: 2px;
  transition: background-color 100ms;
}
.button-gradient-accent:hover {
  background-color: rgba(171.5, 43.4, 53.2, 0.5);
}