/* =============================================================
   Parea Sons — documenti legali

   Informativa privacy e condizioni d'uso. Sono testi che si leggono
   davvero solo se si possono leggere: colonna stretta, riga alta,
   e niente di più grande del necessario. L'impalcatura .blocco e
   .cop arriva da collezione.css: qui c'è solo il testo lungo.
   ============================================================= */

.legale {
  max-width: 68ch;
}

.legale p,
.legale li {
  font-size: var(--t-16);
  line-height: 1.7;
  color: color-mix(in srgb, var(--inchiostro) 82%, transparent);
}

.legale p { margin: 0 0 var(--s-16); }
.legale p:last-child { margin-bottom: 0; }

.legale .blocco__titolo { margin-bottom: var(--s-24); }

.legale__voce {
  font-family: var(--font-dato);
  font-size: var(--t-12);
  letter-spacing: var(--tracking-dato);
  text-transform: uppercase;
  color: var(--greige);
  margin: var(--s-32) 0 var(--s-8);
}

.legale__elenco {
  margin: 0 0 var(--s-16);
  padding-left: var(--s-24);
}

.legale__elenco li { margin-bottom: var(--s-8); }

.legale strong { font-weight: 500; }

/* Il nome tecnico di un cookie o di una chiave, dentro la prosa.
   NON monospace: in questo sito il monospace non esiste, e alla stessa
   misura in punti accanto al Cormorant sembra più grande e stacca come
   un errore. La lingua dei dati qui è il Jost, la stessa dei prezzi e
   delle micro-etichette. */
.legale code {
  font-family: var(--font-dato);
  font-size: 0.85em;
  letter-spacing: var(--tracking-dato);
}

.legale a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  text-decoration-color: var(--oro);
}

.legale a:hover { color: var(--rosso); text-decoration-color: currentColor; }

/* Il richiamo in cima: è una bozza, e finché lo è deve dirlo forte.
   Il filetto a sinistra è l'unico segno che si concede. */
.legale__avviso {
  border-left: 2px solid var(--rosso-araldico);
  padding-left: var(--s-24);
  margin: 0;
}

.legale__data {
  font-family: var(--font-dato);
  font-size: var(--t-12);
  letter-spacing: var(--tracking-dato);
  color: var(--greige);
  margin-top: var(--s-32);
}

/* --- Il modulo di recesso tipo ----------------------------------- */

/* È il testo dell'Allegato I, parte B, del Codice del Consumo, e va
   dato così com'è: un modello riscritto con parole nostre è un modello
   diverso. Quindi <pre>, con i suoi puntini di sospensione allineati —
   sono righe da riempire a penna, e in prosa proporzionale non si
   allineano.

   Scorre per conto suo se non ci sta: la pagina non deve scorrere in
   orizzontale, mai. */
.legale__modulo {
  font-family: var(--font-dato);
  font-size: var(--t-13);
  line-height: 1.7;
  white-space: pre;
  overflow-x: auto;
  margin: var(--s-24) 0 0;
  padding: var(--s-24);
  border: 1px solid var(--filetto);
  /* Il fondo pagina dentro una sezione «chiara»: il riquadro rientra
     invece di sporgere, che è quello che un modulo da compilare deve
     fare. `--lino` non esiste fra i token — cercato, e non c'era. */
  background: var(--tortora-chiaro);
  color: var(--inchiostro);
}

.recesso__modulo {
  display: grid;
  gap: var(--s-24);
  width: 100%;
  max-width: 44ch;
  margin-top: var(--s-16);
}