/* Hero de la portada: el texto va a la izquierda con margen propio (en vez de centrarse
   en la columna de 1120 px), el título y el subtítulo en una sola línea, y la foto ya
   viene recortada sin la persona del extremo izquierdo. */
.hero-on-photo {
  max-width: none;
  margin: 0;
  padding-left: clamp(1.5rem, 6vw, 6rem);
  padding-right: clamp(1.5rem, 6vw, 6rem);
}
.hero-on-photo h1 {
  max-width: none;
  white-space: nowrap;
  font-size: clamp(1.9rem, 3.9vw, 4.6rem);
}
.hero-on-photo .tagline {
  max-width: none;
  white-space: nowrap;
  font-size: clamp(0.95rem, 1.75vw, 1.2rem);
}

/* En celular el título y el subtítulo vuelven a partirse en varias líneas
   (en una sola línea quedarían demasiado chicos) */
@media (max-width: 720px) {
  .hero-on-photo h1 {
    white-space: normal;
    max-width: 18ch;
    font-size: 2.4rem;
  }
  .hero-on-photo .tagline {
    white-space: normal;
    max-width: 46ch;
    font-size: 1.05rem;
  }
}

/* Próxima edición: bloque destacado debajo del hero, separado de las cifras */
.next-edition h2.next-title {
  max-width: none;
  margin-bottom: 1.2rem;
  font-family: 'Space Grotesk', sans-serif;
  font-size: clamp(1.25rem, 5vw, 1.9rem);
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink);
}
.next-dates { grid-template-columns: repeat(2, 1fr); }
.next-dates .hero-stat strong {
  font-size: clamp(1.5rem, 3.2vw, 2.2rem);
  color: var(--cian);
}
.next-dates .hero-stat:nth-child(2) strong { color: var(--naranja); }
.section-inner > p.next-soon {
  margin: 1.3rem 0 0;
  text-align: left;
  font-family: 'Space Grotesk', sans-serif;
  font-size: 0.95rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-dim);
}
@media (max-width: 720px) {
  .next-dates { grid-template-columns: 1fr; }
}