/* Auth-only stylesheet.
   Scope all selectors to `.auth-wrapper` so public/admin styles do not bleed. */

.auth-wrapper .shell {
  max-width: 720px;
  padding-top: 56px;
  padding-bottom: 104px;
}

.auth-wrapper .card {
  border-radius: var(--radius-lg);
}

.auth-wrapper .waitlist-form,
.auth-wrapper .cta-row {
  max-width: 100%;
}

.auth-wrapper .cta-btn-social {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.auth-wrapper .st-auth-provider-icon {
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.auth-wrapper .st-auth-provider-icon svg {
  width: 18px;
  height: 18px;
  display: block;
}

.auth-wrapper .st-auth-provider-label {
  display: inline-block;
  line-height: 1;
}

.auth-wrapper .subtitle + .subtitle {
  margin-top: 8px;
}

.auth-wrapper .st-auth-legal {
  margin-top: 14px;
}

.auth-wrapper .auth-stack {
  display: grid;
  gap: 12px;
  margin-top: 14px;
}

.auth-wrapper .auth-stack .waitlist-form,
.auth-wrapper .auth-stack .cta-row {
  margin: 0;
}

@media (max-width: 767px) {
  .auth-wrapper .shell {
    padding-top: 32px;
    padding-bottom: 112px;
  }

  .auth-wrapper .card {
    padding: 24px 20px 28px;
  }

  .auth-wrapper .cta-row .cta-btn,
  .auth-wrapper .waitlist-form .cta-btn {
    width: 100%;
  }
}