body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  --s: 222px;
  --c1: #3a3137; /* Darker gray */
  --c2: #6a5060; /* Darker pink */
  --c3: #4e3d47; /* Darker mauve */

  --_g: var(--c1) 10%, var(--c2) 10.5% 19%, #0000 19.5% 80.5%,
    var(--c2) 81% 89.5%, var(--c3) 90%;
  --_c: from -90deg at 37.5% 50%, #0000 75%;
  --_l1: linear-gradient(145deg, var(--_g));
  --_l2: linear-gradient(35deg, var(--_g));
  background: var(--_l1), var(--_l1) calc(var(--s) / 2) var(--s), var(--_l2),
    var(--_l2) calc(var(--s) / 2) var(--s),
    conic-gradient(var(--_c), var(--c1) 0) calc(var(--s) / 8) 0,
    conic-gradient(var(--_c), var(--c3) 0) calc(var(--s) / 2) 0,
    linear-gradient(
      90deg,
      var(--c3) 38%,
      var(--c1) 0 50%,
      var(--c3) 0 62%,
      var(--c1) 0
    );
  background-size: var(--s) calc(2 * var(--s) / 3);
}
.logbtn {
  padding: 1.3em 3em;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 2.5px;
  font-weight: 500;
  color: #000;
  background-color: #fff;
  border: none;
  border-radius: 45px;
  box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease 0s;
  cursor: pointer;
  outline: none;
}

.logbtn:hover {
  background-color: #23c483;
  box-shadow: 0px 15px 20px rgba(46, 229, 157, 0.4);
  color: #fff;
  transform: translateY(-7px);
}

.logbtn:active {
  transform: translateY(-1px);
}