/* ---------------------------------------------------------
   PAGINE LEGALI — sulla carta
   Un'informativa si legge, non si guarda: qui il bancone scuro
   lascia il posto a .on-paper, l'altra superficie del design
   system, che finora stava solo nella style guide. Nessun colore
   scritto a mano: i token cambiano, i componenti non se ne accorgono.
   --------------------------------------------------------- */
.legale{
  padding:clamp(130px,20vh,220px) 0 clamp(60px,10vh,110px);
}
.legale__foglio{
  max-width:74ch; margin:0 auto;
  padding:clamp(28px,5vw,64px);
  border-radius:var(--r-lg);
  box-shadow:0 30px 90px rgb(0 0 0 /.45);
}
.legale__occhiello{
  font-family:var(--ff-mono); font-size:.72rem; letter-spacing:.3em;
  text-transform:uppercase; color:var(--ink-dim); margin:0 0 1.2em;
}
.legale h1{
  font-family:var(--ff-display); font-weight:400; text-transform:uppercase;
  letter-spacing:-.02em; line-height:.95;
  font-size:clamp(1.9rem,5.4vw,3.2rem); margin:0 0 .5em;
}
.legale h2{
  font-size:clamp(1.05rem,2.4vw,1.3rem); margin:2.4em 0 .6em;
  letter-spacing:-.01em;
}
.legale h2 .legale__n{
  font-family:var(--ff-mono); font-size:.72em; color:var(--juice);
  margin-right:.7em;
}
.legale p, .legale li{ color:var(--ink-dim); line-height:1.65; }
.legale b, .legale strong{ color:var(--ink); }
.legale a{ color:var(--juice-deep); text-decoration:underline; text-underline-offset:3px; }
.legale ul{ padding-left:1.1em; margin:.6em 0; }
.legale li{ margin:.35em 0; }
.legale__agg{
  font-family:var(--ff-mono); font-size:.76rem; color:var(--ink-dim);
  border-top:1px solid var(--line); margin-top:2.6em; padding-top:1.2em;
}

/* La riga che l'agenzia deve completare: deve dare fastidio finche' c'e'. */
.daCompletare{
  background:rgb(var(--juice-glow)/.16);
  border-bottom:2px dashed var(--juice-deep);
  color:var(--ink); font-weight:600; padding:0 .25em;
}

/* una tabella non ci sta nel telefono: righe impilate */
.legale__voci{ list-style:none; padding:0; margin:1em 0; display:grid; gap:.9em; }
.legale__voci li{
  display:grid; grid-template-columns:minmax(0,13ch) 1fr; gap:.2em 1.4em;
  padding-bottom:.9em; border-bottom:1px solid var(--line); margin:0;
}
.legale__voci b{
  font-family:var(--ff-mono); font-size:.74rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--ink-dim); padding-top:.25em;
}
@media (max-width:620px){
  .legale__voci li{ grid-template-columns:1fr; }
}
