@charset "utf-8";
/* ==========================================================================
   Module: Buttons
   .btn and its modifiers (--primary, --gold, --ghost, --lg, --block).
   ========================================================================== */

/* Buttons
   ----------------------------------------------------------------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 13px 28px;
  border-radius: 999px;
  border: none;
  font-weight: 700;
  font-size: 15px;
  cursor: pointer;
  transition: background 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
  white-space: nowrap;
}

.btn--primary {
  background: var(--blue);
  color: #fff;
  box-shadow: var(--shadow-sm);
}

.btn--primary:hover {
  background: var(--blue-dark);
  transform: translateY(-2px);
}

.btn--lg {
  padding: 16px 34px;
  font-size: 16px;
}

.btn--gold {
  background: var(--gold);
  color: var(--body);
  box-shadow: var(--shadow-sm);
}

.btn--gold:hover {
  background: #e0a71f;
}

.btn--ghost {
  background: #fff;
  color: var(--blue);
  box-shadow: var(--shadow-sm);
  border: 1.5px solid #dbe1f2;
}

.btn--ghost:hover {
  background: var(--blue-light);
  transform: translateY(-2px);
}

.btn--block {
  width: 100%;
}