/*
 * pages/login.css — Login page layout
 *
 * Full-viewport centered card.
 * Inputs and buttons come from forms.css.
 * Hero title styling reuses the same token scale as layout.css.
 */

.login-wrap {
  position: relative;
  z-index: 1;
  min-height: 100dvh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--pad-h);
}

.login-card {
  width: 100%;
  max-width: var(--max-w);
}

.login-eyebrow { margin-bottom: 12px; }

.login-title {
  font-family: var(--font-serif);
  font-size: var(--text-display);
  font-weight: 300;
  line-height: 0.92;
  letter-spacing: -0.02em;
  margin: 0 0 14px;
}

.login-title .accent {
  font-style: italic;
  font-weight: 400;
  font-size: var(--text-display-accent);
  color: var(--accent);
  position: relative;
  top: -2px;
  margin: 0 8px;
}

.login-sub {
  font-family: var(--font-serif);
  font-size: var(--text-body);
  font-weight: 300;
  color: var(--muted);
  margin-bottom: 32px;
  max-width: 280px;
}

.login-form {
  display: flex;
  flex-direction: column;
  gap: 10px;
}