/* INFO in direction A (round 4, 13 Nov 2026): the old Nosotros and Contacto pages in one narrow
   centred column, as wide as the artist page's bio. Labels in the list's small caps, the manifesto
   in the mono at reading size, then the shared ending (shell.css). */

.info {
  width: min(var(--fw), calc(100% - 2.5rem));
  margin: 0 auto;
  padding-top: calc(var(--top-r) + 4.5rem);
  min-height: 100svh;
}
/* Words dissolve into black as they scroll under the logo, as on the artist page. */
.info::before {
  content: "";
  position: fixed;
  z-index: 25;
  top: 0; left: 0; right: 0;
  height: var(--top-r);
  background: linear-gradient(var(--ink) 80%, transparent);
  pointer-events: none;
}

.info__block + .info__block { margin-top: 3.4rem; }
.info__title { margin: 0 0 1.4rem; font: inherit; font-size: 0.8125rem; line-height: 1.35; letter-spacing: 0.12em; color: var(--cream); }
.info__label { margin: 0 0 0.6rem; font: inherit; color: var(--cream-dim); opacity: var(--faint); }
/* The manifesto as Sanity holds it, its blank line kept as a paragraph break. */
.info__text {
  margin: 0;
  white-space: pre-line;
  font-size: 0.875rem;
  line-height: 1.7;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--cream);
}

.info__list { list-style: none; margin: 0; padding: 0; }
.info__list li { line-height: 1.95; color: var(--cream-dim); }

.info__rows { margin: 0; }
.info__row { display: flex; gap: 1rem; line-height: 1.95; }
.info__row[hidden] { display: none; }
.info__row dt { flex: 0 0 7rem; color: var(--cream-dim); opacity: var(--faint); }
.info__row dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }

.info__go { margin-top: 1.2rem; color: var(--cream); }

/* ---------- phones and tablets ---------- */

@media (max-width: 959px) {
  /* The flyer width is too narrow for reading on a phone: the column takes the screen, as the
     artist page's bio does. */
  .info { width: auto; max-width: 34rem; padding: calc(var(--top-r) + 2.4rem) 1.25rem 0; }
  .info::before { background: var(--ink); }
  /* Each contact label sits over its value, and every tappable line is at least 44px tall. */
  .info__row { display: block; margin-top: 0.6rem; }
  .info__row dt { line-height: 1.5; }
  .info__row dd a, .info__go { min-height: 44px; line-height: 44px; }
  .info__go { margin-top: 0.6rem; }
}

/* Test link only: the body already leaves room for the MODO PRUEBA bar and --top-r counts it, so
   the page takes the body's room back rather than counting the bar twice. */
.has-pb .info { margin-top: calc(-1 * var(--pb)); }

/* You are here: the bar's INFO link carries the underline its hover shows. */

/* The contact section above already gives the phone and email, so the ending keeps only its slogan and Resident Advisor. */
.info .a-foot__line > :not(:last-child) { display: none; }