/* Pagine legali: privacy e termini.
   Testo lungo da leggere davvero, non da scorrere: misura di riga contenuta,
   interlinea generosa, titoli che si distinguono senza urlare. Si appoggia
   ai token già definiti in style.css. */

.legale {
    max-width: 760px;
    margin: 0 auto;
    padding: 0 24px 64px;
}

/* `.legale-corpo` è un <main>, e in style.css `main` è stretto a misura di
   telefono per il flusso di prenotazione. Qui quella larghezza rientrerebbe
   il testo di un centinaio di pixel rispetto al titolo: annulliamo la regola
   generica invece di rinunciare al tag semantico. */
.legale main,
.legale-corpo {
    max-width: none;
    margin: 0;
    padding: 0;
}

/* --- testata ------------------------------------------------------------- */

.legale-testata {
    padding: 32px 0 28px;
    border-bottom: 1px solid var(--bordo);
    margin-bottom: 40px;
}

.legale-testata .marchio {
    display: inline-block;
    margin-bottom: 28px;
    font-family: var(--serif);
    font-size: 1.15rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--oro);
    text-decoration: none;
}

.legale-testata h1 {
    font-size: 2rem;
    line-height: 1.2;
    text-transform: none;
    letter-spacing: 0.01em;
    margin: 0 0 10px;
}

.legale-testata .aggiornata {
    margin: 0;
    font-size: 0.85rem;
    color: var(--tenue);
}

/* --- corpo --------------------------------------------------------------- */

.legale-corpo section {
    margin-bottom: 40px;
}

.legale-corpo h2 {
    font-size: 1.25rem;
    line-height: 1.3;
    text-transform: none;
    letter-spacing: 0.01em;
    color: var(--oro);
    margin: 0 0 14px;
}

.legale-corpo p {
    color: #cdc6bc;
    font-size: 0.97rem;
    line-height: 1.75;
    margin: 0 0 14px;
}

.legale-corpo ul {
    margin: 0 0 16px;
    padding-left: 22px;
}

.legale-corpo li {
    color: #cdc6bc;
    font-size: 0.97rem;
    line-height: 1.7;
    margin-bottom: 9px;
}

.legale-corpo strong { color: var(--testo); }

.legale-corpo em {
    font-style: normal;
    color: var(--oro-chiaro);
}

.legale-corpo a {
    color: var(--oro);
    text-underline-offset: 3px;
}

/* Riquadro per i punti che è meglio non saltare leggendo in diagonale. */
.nota-riquadro {
    padding: 18px 20px;
    background: var(--superficie);
    border: 1px solid var(--bordo);
    border-left: 2px solid var(--oro);
    border-radius: var(--raggio);
    margin: 0 0 16px !important;
}

/* --- piè di pagina -------------------------------------------------------- */

.legale-pie {
    padding: 32px 0 0;
    border-top: 1px solid var(--bordo);
    text-align: center;
}

.legale-pie .link-footer {
    display: flex;
    justify-content: center;
    gap: 20px;
    flex-wrap: wrap;
    margin-bottom: 14px;
    font-size: 0.85rem;
}

.legale-pie a {
    color: var(--tenue);
    text-decoration: none;
}

.legale-pie a:hover { color: var(--oro); }

.legale-pie p {
    color: #6f675e;
    font-size: 0.8rem;
    margin: 0;
}

@media (min-width: 700px) {
    .legale-testata h1 { font-size: 2.4rem; }
}