/* Apply Roboto as the main font for the body */
body {
  font-family: 'Roboto', sans-serif;
}

/* Use Montserrat for headings */
h2, h3, h4, h5, h6 {
  font-family: 'Montserrat', sans-serif;
  font-optical-sizing: auto;
  font-weight: 700; /* Use bold for headers */
}


/* Use Montserrat for headings */
h1  {
  font-family: "Moderustic", sans-serif;
  font-optical-sizing: auto;
  font-size: 5rem;
  font-weight: 500; /* Use bold for headers */
}

/* Customize specific Bootstrap components */
.navbar {
  font-family: 'Roboto', sans-serif;
}

.btn-primary {
  font-family: 'Montserrat', sans-serif;
  font-weight: 500; /* Slightly thicker font for buttons */
}

/* Styling for "Referred by" text */
.hm-referral .referral__label {
    color: #a0a0a0; /* Gray color for "Referred by" text */
    font-family: 'Open Sans', sans-serif; /* Use Open Sans */
    font-weight: 200; /* Regular weight */
    font-size: .6rem; /* Adjust font size if needed */
}

/* Styling for Name */
.hm-referral .referral__info {
    color: #fff; /* White color for the name */
    font-family: 'Open Sans', sans-serif; /* Use Open Sans */
    font-weight: 600; /* Bold weight */
    font-size: .7rem; /* Adjust font size if needed */
}

/* Ensure Flex Alignment for proper positioning */
.hm-referral {
    display: flex;
    justify-content: center;
    align-items: center;
}