/* ==========================================================================
   QUOTC — Log in / Sign up pages
   Form components live in main.css
   ========================================================================== */

.auth {
  padding: 24px 0 var(--q-section-space);
}

.auth__box {
  max-width: 520px;
  margin: 56px auto 0;
}

.auth__lead {
  margin-top: 16px;
  font-size: 22px;
  line-height: 32px;
  color: var(--q-muted);
}

.auth__form {
  margin-top: 32px;
}

.auth__legal {
  margin-top: 24px;
  color: var(--q-muted);
  font-size: 12px;
  line-height: 18px;
}

.auth__legal a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.auth__forgot,
.auth__switch,
.auth__back {
  text-align: center;
  color: var(--q-muted);
}

.auth__back {
  margin-top: 32px;
}

.auth__back .text-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.auth__forgot {
  margin-top: 24px;
}

.auth__switch {
  margin-top: 32px;
}

@media (max-width: 767px) {
  .auth__box {
    max-width: none;
    margin-top: 32px;
  }

  .auth__lead {
    font-size: 18px;
    line-height: 28px;
  }

  .auth__form {
    margin-top: 24px;
  }
}