/* Btns */

.btn, button.btn, input[type="submit"].btn, input[type="button"].btn {
  -webkit-appearance: none; text-decoration: none; cursor: pointer; display: inline-block; box-sizing: border-box; text-align: center;
  line-height: 1;
  padding: .25em 1em .25em 0;
  border: 0;
  border-radius: 0;
  color: currentColor;
  background: none;
  position: relative;
}
.btn:not(.plain), button.btn:not(.plain), input[type="submit"].btn:not(.plain), input[type="button"].btn:not(.plain) {
  text-transform: uppercase;
  letter-spacing: .0125em;
}
.btn:hover {
  text-decoration: none;
  color: var(--gray);
}
.btn:active {
  opacity: .75;
  transition: none;
  transform: translateY(1px);
}
.btn:after {
  content: '';
  display: block;
  height: 1px;
  background-color: currentColor;
  position: absolute;
  bottom: 0; left: 0; right: 0;
}
@media (hover: hover) {
  .btn:after {
    transition: all 120ms ease-in-out;
  }
  .btn:hover:after {
    right: -1em;
  }
}
.btn:focus {
  outline: 0;
  -webkit-tap-highlight-color: transparent;
}
::-moz-focus-inner {
  border: 0;
  padding: 0;
}
.btn:disabled,
.btn.disabled {
  opacity: .5;
  pointer-events: none;
  cursor: default;
}