/* Le pagine scritte dal server: quella di un profilo, di una zona, degli
   eventi. Stessa palette dell'app, ma pensate per essere lette e collegate,
   non per essere usate col pollice. Ereditano tutto da stile.css: qui c'è
   solo quello che nell'app non esiste. */

body.pagina { padding-bottom: 2rem }
body.pagina .testata { position: static; padding-bottom: 1rem }
body.pagina .testata-riga { max-width: 34rem; margin-inline: auto }
body.pagina .marchio { text-decoration: none }
body.pagina .apri {
  font-size: 0.82rem; font-weight: 600; color: #0b2b34; background: var(--ambra);
  padding: 0.42rem 0.8rem; border-radius: 999px; white-space: nowrap;
}
body.pagina .schermo { max-width: 34rem; margin-inline: auto; padding-bottom: 2rem }

.titolo-pagina {
  font-size: clamp(1.7rem, 7vw, 2.2rem); font-weight: 800; letter-spacing: -0.035em;
  color: #fff; line-height: 1.1; margin: 0.4rem 0 0.5rem; text-wrap: balance;
}
.riassunto { color: var(--su-scuro); font-size: 0.95rem; line-height: 1.55; margin-bottom: 1.5rem; max-width: 46ch }

/* ── scheda di un profilo ──────────────────────────────────────────── */

.profilo { background: var(--carta); color: var(--inchiostro); border-radius: var(--raggio); padding: 1.3rem 1.2rem 1.4rem }
.profilo .occhiello {
  font-size: 0.73rem; font-weight: 600; letter-spacing: 0.11em; text-transform: uppercase;
  color: var(--bronzo); margin-bottom: 0.35rem;
}
.profilo h1 { font-size: clamp(1.5rem, 6.4vw, 1.95rem); font-weight: 800; letter-spacing: -0.033em; line-height: 1.12; text-wrap: balance }
.profilo .dove-testo { font-size: 0.9rem; color: var(--grigio); margin-top: 0.3rem }
.profilo .striscia { color: var(--grigio); margin: 1.7rem 0 0.2rem }
.profilo .rimando { color: var(--grigio) }
/* Su una pagina intera la frase si legge tutta: il taglio a due righe serve
   in una lista che scorre, non qui. */
.profilo .citazione { -webkit-line-clamp: none; display: block; overflow: visible; margin-top: 0.7rem }

.voce-pagina { border-top: 1px solid var(--linea); padding: 0.95rem 0 0.3rem }
.voce-pagina h3 { font-size: 1.1rem; font-weight: 800; letter-spacing: -0.022em; line-height: 1.2 }
.voce-pagina .quando-testo { font-size: 0.87rem; color: var(--petrolio); font-weight: 600; margin-top: 0.4rem }
.voce-pagina .dettaglio { font-size: 0.88rem; color: var(--grigio); margin-top: 0.25rem; line-height: 1.45 }
.voce-pagina a { color: var(--petrolio); font-weight: 600 }

.apri-app { margin-top: 1.6rem }
.apri-app .azione { display: block }

/* ── piede ─────────────────────────────────────────────────────────── */

.piede {
  max-width: 34rem; margin: 2.4rem auto 0; padding: 1.5rem 1.1rem 0;
  border-top: 1px solid rgba(255, 255, 255, 0.09);
  font-size: 0.83rem; color: var(--su-scuro-tenue); line-height: 1.55;
}
.piede p { margin-bottom: 0.7rem; max-width: 58ch }
.piede a { color: var(--su-scuro); text-decoration: underline }
.piede .societa { color: #5f7d88; font-size: 0.78rem }