/* Pantalla de acceso — dos columnas: marca en verde, formulario en blanco */

.acceso-body { min-height: 100vh; }

.acceso {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 100vh;
}
@media (max-width: 900px) { .acceso { grid-template-columns: 1fr; } }

/* ---------- lado de marca ---------- */
.acceso__lado {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 40px;
  padding: clamp(34px, 5vw, 60px);
  background: var(--verde-hondo);
  color: #fff;
  overflow: hidden;
}
.acceso__lado::before {
  content: "";
  position: absolute; inset: auto -30% -40% -10%; height: 80%;
  background: radial-gradient(50% 50% at 30% 50%, rgba(18,163,150,.28) 0%, transparent 70%);
  pointer-events: none;
}
@media (max-width: 900px) {
  .acceso__lado { gap: 24px; padding: 28px 24px; }
  .acceso__discurso, .acceso__lista { display: none; }
}

.logo--claro { color: #fff; }
.logo--claro .logo__icono { background: rgba(255,255,255,.14); }
.logo--claro span em { color: var(--verde-vivo); }

.acceso__discurso { margin-top: auto; position: relative; }
.acceso__cita {
  font-size: clamp(1.4rem, 1rem + 1.4vw, 2rem);
  line-height: 1.24;
  letter-spacing: -.022em;
  font-weight: 600;
  max-width: 20ch;
}
.acceso__firma { margin-top: 14px; font-size: .88rem; color: #8fc3bc; }

.acceso__lista { position: relative; list-style: none; margin: 0; padding: 0; display: grid; gap: 11px; }
.acceso__lista li {
  font-size: .93rem; color: #bcdcd8; padding-left: 26px; position: relative;
}
.acceso__lista li::before {
  content: ""; position: absolute; left: 0; top: .52em;
  width: 13px; height: 7px; border-left: 2px solid var(--verde-vivo); border-bottom: 2px solid var(--verde-vivo);
  transform: rotate(-45deg);
}

/* ---------- lado del formulario ---------- */
.acceso__panel {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 22px;
  padding: clamp(34px, 5vw, 60px) 24px;
  background: var(--papel);
}
.acceso__caja { width: 100%; max-width: 430px; }

.acceso__titulo { font-size: clamp(1.6rem, 1.2rem + 1.3vw, 2.1rem); margin-bottom: 8px; }
.acceso__sub { color: var(--tinta-suave); margin-bottom: 26px; font-size: .97rem; }

.acceso__pie {
  margin-top: 20px;
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
  font-size: .89rem; color: var(--tinta-tenue);
}
.enlace-bot {
  background: none; border: 0; padding: 0;
  font: inherit; color: var(--verde); cursor: pointer;
  text-decoration: underline; text-underline-offset: 3px;
}
.enlace-bot:hover { color: var(--verde-claro); }
.enlace-bot:focus-visible { outline: 2px solid var(--verde); outline-offset: 3px; border-radius: 3px; }

.acceso__legal {
  max-width: 430px; width: 100%;
  font-size: .8rem; color: var(--tinta-tenue); line-height: 1.55;
}

.aviso { margin-bottom: 18px; }

/* estado de carga del botón */
.btn.cargando { position: relative; color: transparent !important; pointer-events: none; }
.btn.cargando::after {
  content: ""; position: absolute; width: 17px; height: 17px;
  border: 2px solid rgba(255,255,255,.4); border-top-color: #fff;
  border-radius: 50%; animation: girar .7s linear infinite;
}
@keyframes girar { to { transform: rotate(360deg); } }