.custom-btn-1,
.custom-btn-2,
.custom-btn-3,
.custom-btn-4 {
    position: relative;
    overflow: hidden;
    display: block;
    font-family: "Inter";
    font-size: var(--wp--preset--font-size--p);
    font-weight: 700;
    border-radius: 360px;
    line-height: normal !important;
    transition: all 0.3s ease-out;
}

.custom-btn-1 {
  padding: 12px 24px;
  color: #fff;
  background: transparent;
}

.custom-btn-1::before {
  position: absolute;
  z-index: -1;
  content: "";
  inset: 0;
  width: 100%;
  height: 100%;
  transition: all 0.3s ease-out;
}

.custom-btn-1::before {
    background: conic-gradient(from 269deg at 50% 50%, #89BF46 0deg, #5D822F 360deg);
    transform: rotate(0);
    transform-origin: left;
}

.custom-btn-1:hover {
  background: #5D822F;
}

.custom-btn-2 {
  padding: 12px 24px;
  color: #fff;
  background: transparent;
  border: solid 1px #fff;
}

.custom-btn-2:hover {
  background: #fff;
  color: #221F1F;
}

.custom-btn-3 {
  padding: 6px 12px;
  padding-left: 44px;
  color: #221F1F;
  font-weight: 700;
  background: transparent;
}

.custom-btn-3::before {
  position: absolute;
  content: "";
  top: 50%;
  left: 12px;
  width: 24px;
  height: 24px !important;
  background: url(/wp-content/uploads/2026/04/fi_80942.svg) no-repeat center center;
  background-size: contain;
  transform: translateY(-50%);
}

.custom-btn-3:hover {
  background: rgba(20, 19, 19, 0.10);
}

.custom-btn-4 {
  padding: 12px 24px;
  color: #221F1F;
  background: transparent;
  border: solid 1px #221F1F;
}

.custom-btn-4:hover {
  background: #221F1F;
  color: #fff;
}