/* ============================================================
   OFFSEE — legal.css
   Stili condivisi delle pagine informative:
   /termini · /privacy · /spedizioni
   Caricato dopo base.css. Nessun override dei token.
   ============================================================ */

/* Colonna di lettura: le pagine informative sono un foglio,
   non un layout — misura da bollettino, a sinistra. */
.legal {
  max-width: 46em;
}

.legal-head {
  margin-bottom: var(--space-7);
}
.legal-head .mono {
  display: block;
  margin-bottom: var(--space-3);
  color: var(--ink-muted);
}

/* Corpo: paragrafi con respiro, link sottolineati a filetto */
.legal p {
  margin-bottom: var(--space-4);
}
.legal p:last-child {
  margin-bottom: 0;
}
.legal a {
  border-bottom: 1px solid var(--line);
  transition: border-color var(--dur) var(--ease), color var(--dur) var(--ease);
}
.legal a:hover {
  color: var(--navy);
  border-bottom-color: var(--brass);
}

/* Titoli di paragrafo: righe tecniche mono, come i kicker */
.legal h2 {
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink);
  margin: var(--space-7) 0 var(--space-3);
}

/* Riquadro dati (titolare / riepilogo): superficie sabbia,
   angoli vivi, un filetto d'inchiostro a sinistra */
.legal-panel {
  background: var(--sand-tint);
  border-left: 3px solid var(--ink);
  padding: var(--space-5);
  margin-bottom: var(--space-6);
}
.legal-panel h2 {
  margin: 0 0 var(--space-3);
}
.legal-panel p {
  margin: 0;
}

/* Riepilogo a definizioni (spedizioni): dato = mono */
.legal-panel dl {
  display: grid;
  gap: var(--space-2);
}
.legal-panel dl > div {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: var(--space-4);
  border-bottom: 1px solid var(--line-soft);
  padding-bottom: var(--space-2);
}
.legal-panel dl > div:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}
.legal-panel dt {
  font-size: var(--text-s);
}
.legal-panel dd {
  margin: 0;
  font-family: var(--font-mono);
  font-size: var(--text-s);
  letter-spacing: 0.04em;
  text-align: right;
  white-space: nowrap;
}

/* Nota di stato (bozza da completare / ultimo aggiornamento) */
.legal-note {
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  letter-spacing: 0.06em;
  color: var(--ink-muted);
  border-left: 2px solid var(--brass);
  padding-left: var(--space-3);
  margin-bottom: var(--space-6);
}

.legal-updated {
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  letter-spacing: 0.06em;
  color: var(--ink-muted);
  margin-top: var(--space-7);
}

/* CTA finale verso Instagram, dove serve */
.legal-cta {
  margin-top: var(--space-6);
}