/*
 * V10.2 — correzione mirata di quattro pagine pubbliche.
 * Mission Control e Piazza usano il medesimo spazio protetto del Diario:
 * il testo non attraversa più l'area della mascotte. Regali e Incarichi
 * rendono invece leggibile la loro unica scheda su tutta la larghezza.
 */

.route-mission-control .world-hero,
.route-piazza .world-hero {
  min-height: 350px;
  padding-right: clamp(280px, 31vw, 450px);
  padding-left: var(--site-gutter);
  text-align: left;
}

/* Un vecchio foglio di stile trattava per errore il titolo, il testo e il
 * sopracciglio di Mission Control come tre colonne separate. Questa pagina
 * usa ora lo stesso flusso lineare e leggibile del Diario. */
.route-mission-control .mission-hero {
  display: block;
  gap: 0;
  max-width: none;
  margin-right: auto;
  margin-left: auto;
}

.route-mission-control .mission-hero > *,
.route-piazza .piazza-hero > * {
  margin-left: 0;
}

.route-mission-control .world-hero > *,
.route-piazza .world-hero > * {
  max-width: 36rem;
}

.route-piazza .world-hero h1 {
  max-width: 12.5ch;
}

.route-mission-control .world-hero .lead,
.route-piazza .world-hero .lead {
  max-width: 52ch;
}

/* Le collezioni con una sola voce non devono sembrare una scheda persa a
 * sinistra: mantengono il contenuto ma usano l'intera riga disponibile. */
.route-regali .collection-grid,
.route-incarichi .collection-grid {
  grid-template-columns: minmax(0, 1fr);
  gap: 22px;
}

.route-regali .collection-grid .content-card,
.route-incarichi .collection-grid .content-card {
  display: grid;
  grid-template-columns: minmax(235px, .72fr) minmax(0, 1.55fr);
  min-height: 286px;
  border-color: rgba(101, 224, 255, .35);
  background: linear-gradient(118deg, rgba(10, 46, 94, .92), rgba(9, 18, 51, .94));
}

.route-regali .collection-grid .card-visual,
.route-incarichi .collection-grid .card-visual {
  min-height: 100%;
  aspect-ratio: auto;
  border-right: 1px solid rgba(102, 221, 255, .24);
  border-bottom: 0;
}

.route-regali .collection-grid .card-content,
.route-incarichi .collection-grid .card-content {
  justify-content: center;
  padding: clamp(27px, 4vw, 52px);
}

.route-regali .collection-grid .card-content h2,
.route-incarichi .collection-grid .card-content h2 {
  max-width: 24ch;
  font-size: clamp(1.55rem, 2.5vw, 2.25rem);
}

@media (max-width: 800px) {
  .route-mission-control .world-hero,
  .route-piazza .world-hero {
    min-height: 310px;
    padding-right: clamp(190px, 34vw, 270px);
  }

  .route-mission-control .world-hero > *,
  .route-piazza .world-hero > * {
    max-width: 29rem;
  }
}

@media (max-width: 620px) {
  .route-mission-control .world-hero,
  .route-piazza .world-hero {
    min-height: 0;
    padding-right: 132px;
  }

  .route-mission-control .world-hero > *,
  .route-piazza .world-hero > *,
  .route-piazza .world-hero h1,
  .route-mission-control .world-hero .lead,
  .route-piazza .world-hero .lead {
    max-width: none;
  }

  .route-regali .collection-grid .content-card,
  .route-incarichi .collection-grid .content-card {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .route-regali .collection-grid .card-visual,
  .route-incarichi .collection-grid .card-visual {
    min-height: 170px;
    aspect-ratio: 16 / 7;
    border-right: 0;
    border-bottom: 1px solid rgba(102, 221, 255, .24);
  }

  .route-regali .collection-grid .card-content,
  .route-incarichi .collection-grid .card-content {
    padding: 27px 22px 30px;
  }
}
