/* ============================================================
   06 · ACCESO ("Cómo iniciar sesión y empezar a apostar")
   Anatomy unlike siblings: procedimiento de dos pasos numerados
   (01 / 02) unidos por una línea de cal vertical. Cada paso lleva
   un párrafo textual del PDF. Sin foto, sin rejilla.
   ============================================================ */

.acceso {
  padding: var(--tramo) var(--calle);
  background: var(--cal);
  border-top: 1px solid var(--linea);
}
.acceso__cabe { width: var(--cancha); max-width: 1300px; margin-inline: auto; margin-bottom: clamp(2.2rem, 4vw, 3.2rem); }
.acceso__volante { margin-bottom: 1.2rem; }
.acceso__titulo { font-size: var(--t-titular); max-width: 18ch; }

.acceso__pasos {
  width: var(--cancha); max-width: 980px; margin-inline: auto;
  display: grid; gap: clamp(1.8rem, 3vw, 2.8rem); position: relative;
}
.acceso__paso {
  display: grid; grid-template-columns: auto 1fr; gap: clamp(1.2rem, 2.5vw, 2.2rem);
  align-items: start;
}
.acceso__num {
  font-family: "Gabarito", sans-serif; font-weight: 900; line-height: 0.8;
  font-size: clamp(2.6rem, 1.6rem + 3vw, 4rem);
  color: transparent; -webkit-text-stroke: 2px var(--cesped); text-stroke: 2px var(--cesped);
}
.acceso__txt { color: var(--tinta); font-size: var(--t-lead); max-width: 64ch; padding-top: 0.3rem; }

.acceso__cta {
  width: var(--cancha); max-width: 980px; margin: clamp(2rem, 4vw, 3rem) auto 0;
  display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; align-items: center;
}

@media (max-width: 1024px) {
  .acceso__titulo, .acceso__txt { max-width: none; }
  .acceso__paso { grid-template-columns: 1fr; gap: 0.4rem; }
  .acceso__num { font-size: 2.6rem; }
}
