/* ===========================================================================
   PRIVACY E COOKIE POLICY — impaginato
   ---------------------------------------------------------------------------
   Foglio a sé, condiviso da privacy.php e cookie.php: sono le uniche due
   pagine che sono un testo lungo (titolare, finalità, diritti…) e non uno
   schema di righe nome/descrizione. Va caricato dopo `impaginato.css` (griglia,
   campi, token, tipografia, .tick, .mini-label) e dopo `interne.css`
   (intestazione a inchiostro, .pg-hero-body).
   =========================================================================== */

.impaginato .pg-legal { padding-block: var(--s1) var(--s3); }

.impaginato .pg-legal-body {
  grid-column: col 1 / col 8;
  grid-row: 1;
}

/* Riga dati essenziali in apertura (titolare, ultimo aggiornamento): testo,
   non un riquadro — un filetto sotto basta a separarla dal corpo del testo. */
.impaginato .pg-legal-meta {
  padding-bottom: 22px;
  margin-bottom: var(--s2);
  border-bottom: 1px solid var(--rule);
  font-size: var(--fs-etichetta);
  color: var(--imp-gray);
}
.impaginato .pg-legal-meta p + p { margin-top: 4px; }
.impaginato .pg-legal-meta b { color: var(--ink); }

/* Ogni sezione è introdotta da un filetto, come le righe altrove nel sito:
   la stessa grammatica, applicata a un testo continuo invece che a righe.

   Sulla MISURA: qui l'h2 è 1.5rem contro i ~2.6rem che ha su tutte le altre
   pagine, e la differenza è voluta. Altrove un h2 è il titolo di una fascia;
   qui è la sezione di un documento lungo ("Titolare del trattamento",
   "Finalità", "Diritti dell'interessato"), che con l'h1 della pagina forma la
   gerarchia corretta di un testo giuridico. È stato valutato se dare a questi
   h2 una classe propria, per evitare che lo stesso tag valga due cose: la
   risposta è no, perché il ruolo è già scritto nel selettore — un h2 dentro
   `.pg-legal-body` non può essere altro — e una classe ripeterebbe in ogni
   titolo del documento un'informazione che il contesto porta già. */
.impaginato .pg-legal-body h2 {
  font-size: 1.5rem;
  margin-top: var(--s2);
  margin-bottom: 18px;
  padding-top: var(--s2);
  border-top: 1px solid var(--rule);
}
.impaginato .pg-legal-body h2:first-of-type { margin-top: 0; padding-top: 0; border-top: 0; }

.impaginato .pg-legal-body h3 {
  font-size: var(--fs-sottotitolo);
  margin-top: 26px;
  margin-bottom: 10px;
}

.impaginato .pg-legal-body p {
  font-size: var(--fs-corpo);
  line-height: 1.65;
  color: var(--imp-text-mid);
  max-width: 62ch;
}
.impaginato .pg-legal-body p + p { margin-top: 14px; }
.impaginato .pg-legal-body p b,
.impaginato .pg-legal-body li b { color: var(--ink); font-weight: 600; }

.impaginato .pg-legal-body ul {
  margin: 14px 0 0 0;
  padding-left: 20px;
  max-width: 62ch;
}
.impaginato .pg-legal-body li {
  font-size: var(--fs-corpo);
  line-height: 1.6;
  color: var(--imp-text-mid);
  margin-bottom: 8px;
}

.impaginato .pg-legal-body a { color: var(--ink); text-decoration: underline; text-underline-offset: 2px; }
.impaginato .pg-legal-body a:hover { color: var(--imp-orange-ink); }

/* ===========================================================================
   RESPONSIVE
   =========================================================================== */
@media (max-width: 1080px) {
  .impaginato .pg-legal-body { grid-column: col 1 / col 10; }
}
@media (max-width: 720px) {
  .impaginato .pg-legal { padding-block: var(--s2); }
  .impaginato .pg-legal-body { grid-column: col 1 / c-end; }
  .impaginato .pg-legal-body p,
  .impaginato .pg-legal-body ul { max-width: none; }
}