/home/bdqbpbxa/demo-subdomains/adaptiq.goodface.com.ua/frontend/css/ui-components/buttons.css
.default-button {
  position: relative;
  overflow: hidden;
  background: var(--white);
  border-radius: 100px;
  border: none;
  height: 56px;
  width: fit-content;
  min-width: 240px;
  padding: 18px 24px 0 24px;

  display: flex;
  justify-content: center;
  align-items: flex-start;

  font-weight: 600;
  font-size: 16px;
  text-align: center;
  letter-spacing: 0.01em;
  color: var(--background-dark);
  cursor: pointer;
  transition: background 0.5s, color 0.4s, opacity 0.4s;
}

button.default-button {
  padding: 20px 24px 0 24px;
}

.default-button:before {
  content: '';
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  border-radius: inherit;
  transform: translateY(100%);
  background-color: var(--red);
  transition: transform 0.3s cubic-bezier(.215, .61, .355, 1), -webkit-transform 0.3s cubic-bezier(.215, .61, .355, 1);
}

.default-button * {
  font-size: inherit;
  font-weight: inherit;
}

.default-button .btn-innerText {
  position: relative;
  z-index: 2;
  display: block;
}

.default-button .btn-original-text {
  display: flex;
  align-items: flex-end;
  transition: transform 0.4s, opacity 0.4s;
  height: 19px;
}

.default-button .btn-word {
  position: relative;
  z-index: 1;
  display: inline-block;
  pointer-events: none;
  opacity: 0;
  -webkit-transform: translateY(30px);
  transform: translateY(30px);
  transition: transform 0.4s;
  height: 19px;
}

.default-button span.btn-word:not(:nth-of-type(2)) {
  padding-left: 5px;
}

.default-button.-bordered {
  border: 1px solid var(--grey);
  background: rgba(0, 0, 0, 0);
  transition: background 0.4s, color 0.4s, border 0.4s;
}

.default-button.-with-arrow {
  border: 1px solid var(--grey);
  filter: drop-shadow(0px 16px 24px rgba(32, 0, 5, 0.08));
  background: rgba(0, 0, 0, 0);
  transition: background 0.4s, color 0.4s, border 0.4s;
}

.default-button.-bordered:before,
.default-button.-with-arrow:before {
  background-color: var(--grey);
}

.default-button.-with-arrow:after {
  content: '';
  position: relative;
  z-index: 2;

  display: block;
  width: 16px;
  height: 16px;
  margin-left: 8px;
  margin-top: 2.4px;
  background: no-repeat center / contain url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTciIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNyAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzM3NF8xMTkwNikiPgo8Y2lyY2xlIG9wYWNpdHk9IjAuMzIiIGN4PSI4LjUiIGN5PSI4IiByPSI4IiBmaWxsPSIjQkJCQkJCIi8+CjxwYXRoIGQ9Ik0xMiA4SDQuNU0xMiA4TDkgMTFNMTIgOEw5IDUiIHN0cm9rZT0iIzExMTExMSIvPgo8L2c+CjxkZWZzPgo8Y2xpcFBhdGggaWQ9ImNsaXAwXzM3NF8xMTkwNiI+CjxyZWN0IHg9IjAuNSIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiByeD0iOCIgZmlsbD0id2hpdGUiLz4KPC9jbGlwUGF0aD4KPC9kZWZzPgo8L3N2Zz4K');
  transition: background 0.4s;
}

.-apple .default-button.-with-arrow:after {
  margin-top: 2px;
}



.default-button.-black {
  background: var(--text-dark);
  color: var(--white);
}

.default-button.-black.-bordered {
  border: 1px solid var(--dark-grey);
  filter: drop-shadow(0px 16px 24px rgba(32, 0, 5, 0.08));
  background: rgba(0, 0, 0, 0);
  transition: background 0.4s, color 0.4s, border 0.4s;
}

.default-button.-black.-with-arrow {
  border: 1px solid var(--dark-grey);
  filter: drop-shadow(0px 16px 24px rgba(32, 0, 5, 0.08));
  background: rgba(0, 0, 0, 0);
  transition: background 0.4s, color 0.4s, border 0.4s;
}

.default-button.-black.-bordered:before,
.default-button.-black.-with-arrow:before {
  background-color: var(--white);
}

.default-button.-black.-with-arrow:after {
  content: '';

  display: block;
  width: 16px;
  height: 16px;
  margin-left: 8px;
  background: no-repeat center / contain url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTciIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNyAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzM3NV83MjUwKSI+CjxjaXJjbGUgb3BhY2l0eT0iMC4zMiIgY3g9IjguNSIgY3k9IjgiIHI9IjgiIGZpbGw9IiM1NTU1NTUiLz4KPHBhdGggZD0iTTEyIDhINC41TTEyIDhMOSAxMU0xMiA4TDkgNSIgc3Ryb2tlPSJ3aGl0ZSIvPgo8L2c+CjxkZWZzPgo8Y2xpcFBhdGggaWQ9ImNsaXAwXzM3NV83MjUwIj4KPHJlY3QgeD0iMC41IiB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHJ4PSI4IiBmaWxsPSJ3aGl0ZSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo=');
  transition: background 0.4s;
}