/* Login: a etiqueta da pasta sobre o campo Oxford com o símbolo cortado. */
.lg { position: relative; min-height: 100dvh; display: grid; grid-template-rows: auto 1fr auto; background: var(--capa); color: var(--capa-ink); isolation: isolate; overflow: hidden; }
.lg__marca { position: absolute; right: -14%; top: -12%; width: 62%; height: 80%; color: var(--capa-ink-faint); z-index: -1; }
.lg__topo { display: flex; align-items: center; justify-content: space-between; gap: var(--s-4); padding: var(--s-4) var(--gutter); }
.lg-lockup { display: inline-flex; align-items: center; gap: var(--s-2); color: var(--capa-ink); text-decoration: none; }
.lg-lockup__wordmark b, .lg-lockup__mf8 b, .lg__gold { color: var(--gold); }
.lg-lockup__div { width: 1px; height: 18px; background: var(--capa-ink-soft); margin: 0 var(--s-1); }
.lg-lockup__mf8 { letter-spacing: 0.04em; }
.lg__meio { display: grid; place-items: center; padding: var(--s-6) var(--gutter); }
.lg__coluna { width: min(100%, 440px); display: grid; gap: var(--s-4); justify-items: center; }
.lg__h1 { font-size: var(--fs-48); line-height: var(--lh-48); letter-spacing: var(--track-display); color: var(--capa-ink); text-align: center; }
.lg__byline { margin-top: calc(-1 * var(--s-2)); }
.lg-card { width: 100%; margin-top: var(--s-3); display: grid; gap: var(--s-4); }
.lg-card > * + * { margin-top: 0; }
.lg-card__h { font-size: var(--fs-28); line-height: var(--lh-28); }
.lg-card__sub { color: var(--ink-soft); margin-top: calc(-1 * var(--s-2)); }
.lg-card__nota { text-align: center; }
.lg-submit { margin-top: var(--s-2); }
.lg-erro { color: var(--alert); background: rgba(168, 84, 63, 0.08); border-radius: var(--radius-control); padding: var(--s-3) var(--s-4); }
.lg-lab { border: 1px solid var(--rule); border-radius: var(--radius-figure); padding: var(--s-4); margin: 0; display: grid; gap: var(--s-3); }
.lg-lab legend { padding: 0 var(--s-2); }
.lg-lab__cliente[hidden] { display: none; }
.lg__modos { text-align: center; font-size: var(--fs-12); }
.lg__modos a { color: var(--capa-ink-soft); text-decoration-color: var(--capa-ink-soft); }
.lg__modos a:hover { color: var(--capa-ink); text-decoration-color: var(--gold); }
.lg__rodape { display: flex; justify-content: center; padding: var(--s-4) var(--gutter); color: var(--capa-ink-soft); font-size: var(--fs-12); }
@media (max-width: 599px) {
  .lg__topo { flex-wrap: wrap; }
  .lg__h1 { font-size: var(--fs-28); }
}
