:root {

	  --peach: #f07d65;
  --purple: #902e6b;

  --gradient-tb: linear-gradient(
    to bottom,
    var(--peach),
    var(--purple)
  );

  --gradient-lr: linear-gradient(
    to right,
    var(--peach),
    var(--purple)
  );
}

.bg-gradient-tb {
  background: var(--gradient-tb);
}

.bg-gradient-lr {
  background: var(--gradient-lr);
}

.text-gradient-tb {
  background: var(--gradient-tb);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

.text-gradient-lr {
  background: var(--gradient-lr);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

.border-gradient-tb {
  border: 2px solid transparent;
  background:
    linear-gradient(#fff, #fff) padding-box,
    var(--gradient-tb) border-box;
}

.border-gradient-lr {
  border: 2px solid transparent;
  background:
    linear-gradient(#fff, #fff) padding-box,
    var(--gradient-lr) border-box;
}

.icon-gradient-tb {
  background: var(--gradient-tb);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

.icon-gradient-lr {
  background: var(--gradient-lr);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

.btn-gradient-lr {
  background: var(--gradient-lr) !important;
  color: #fff !important;
  border: none;
}

.btn-gradient-tb {
  background: var(--gradient-tb) !important;
  color: #fff !important;
  border: none;
}