/* ======================
   MINIMAL BUTTON STYLES
========================= */

.btn {
  font-size: 16px;
  font-family: inherit;
  font-weight: 600;
  color: var(--color-text, #e1e1e1);
  background: none;
  border: none;
  cursor: pointer;
  position: relative;
  transition: all 0.3s ease;
  padding: 0.5rem 1rem;
}

/* Underline on hover */
.btn-underline::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 0%;
  height: 2px;
  background-color: currentColor;
  transition: all 0.4s ease;
}

.btn-underline:hover::after,
.btn-underline:focus::after {
  width: 100%;
  left: 0;
}

/* Text lift + underline */
.btn-lift::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 0%;
  height: 2px;
  background-color: currentColor;
  transition: all 0.4s ease;
}

.btn-lift:hover,
.btn-lift:focus {
  transform: translateY(-2px);
}

.btn-lift:hover::after,
.btn-lift:focus::after {
  width: 100%;
  left: 0;
}

/* Grow on hover */
.btn-grow {
  transition: transform 0.2s ease;
}

.btn-grow:hover,
.btn-grow:focus {
  transform: scale(1.1);
}

/* Glow effect */
.btn-glow {
  cursor: pointer;
  transition: box-shadow 0.3s ease, transform 0.2s ease;
}

.btn-glow:hover,
.btn-glow:focus {
  box-shadow: 0 0 12px var(--glow-color-1), 0 0 24px var(--glow-color-2);
}