/* ==========================================================================
   projeto01 — Telas de acesso (login, convite, escolha de clube)
   ========================================================================== */

.acesso {
  min-height: 100vh; padding: 32px 16px 48px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 24px;
}
.acesso__marca {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  font-family: var(--fonte-titulo); font-weight: 800; font-size: 24px; letter-spacing: -0.02em;
}
.acesso__cartao { width: 100%; max-width: 440px; padding: 0 0 28px; overflow: hidden; }

/* Faixa com o desenho de quadra no topo do cartão */
.acesso__quadra {
  height: 96px; padding: 16px 22px; margin-bottom: 24px;
  border-bottom: var(--borda) solid var(--tinta-2);
  background: radial-gradient(rgba(255,255,255,.38) 1.2px, transparent 1.5px) 0 0 / 7px 7px, var(--quadra-2);
}
.acesso__quadra span { display: block; height: 100%; border: 2px solid var(--papel); position: relative; }
.acesso__quadra span::before {
  content: ''; position: absolute; top: -8px; bottom: -8px; left: 50%; width: 3px; margin-left: -1.5px; background: var(--papel);
}

.acesso__titulo { font-size: 34px; padding: 0 28px; }
.acesso__sub { margin: 6px 0 20px; padding: 0 28px; }
.acesso__cartao > .alerta, .acesso__cartao > .formulario, .acesso__clubes { margin-left: 28px; margin-right: 28px; }
.acesso__enviar { width: 100%; margin-top: 8px; }
.acesso__cartao > .acesso__enviar { width: calc(100% - 56px); margin: 8px 28px 0; }
.acesso__rodape { margin: 20px 28px 0; font-size: 13px; }
.acesso__clubes { display: flex; flex-direction: column; gap: 10px; }
.acesso__clube { width: 100%; justify-content: space-between; font-weight: 500; }


.acesso__slogan { font-family: var(--fonte-titulo); font-size: 15px; font-weight: 500; letter-spacing: .02em; color: var(--tinta-suave); }