body {
  font-family: "Poppins", sans-serif;
  color: rgb(36 36 36);
  font-size: 1.6rem;
  line-height: 1.7;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

main {
    padding: 30px 50px;
}

h1 {
  font-family: "Montserrat", sans-serif;
  color: rgb(126 126 126);
  font-size: 3.2rem;
  font-weight: 700;
  text-decoration: none;
  margin-bottom: 10px;
}

a {
  text-decoration: inherit;
}

/* ------------------------- Contact Form ---------------------------- */

#contact-form {
    max-width: 600px;
    display: grid;
    gap: 20px;
    grid-template-columns: auto 1fr;

    label, input:not([type="submit"]), select {
        padding: 5px;
    }

    #category {
        width: 100%;
        background: transparent;
        border: 1px solid rgb(78 94 107);
        border-radius: 4px;
    }

    input:focus-visible, select:focus-visible, textarea:focus-visible {
        outline-color: rgb(7 121 231);
    }

    .btn {
        grid-column: 1 / -1;
        justify-self: center;
    }
}

.server-msg {
    font-size: 1.2rem;
    font-weight: 500;
    background-color: rgb(235 235 235);
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.27);
    max-width: 600px;
    margin: 0 auto;
}