/* Estils de les pagines legals (avis legal, privacitat).
 * Reutilitzen les variables de color de style.css; nomes afegeixen la caixa de
 * text llarg, que la portada no necessita. */

.legal {
    background: var(--warm-white);
    padding: 48px 24px 72px;
}

.legal-container {
    max-width: 760px;
    margin: 0 auto;
    font-family: system-ui, sans-serif;
    color: var(--text-mid);
    line-height: 1.65;
}

.legal h1 {
    font-size: clamp(1.6rem, 4vw, 2.2rem);
    color: var(--forest);
    margin-bottom: 4px;
}

.legal h2 {
    font-size: 1.15rem;
    color: var(--forest);
    margin: 36px 0 10px;
}

.legal h3 {
    font-size: 1rem;
    color: var(--text-dark);
    margin: 24px 0 8px;
}

.legal p {
    margin-bottom: 12px;
}

.legal-updated {
    font-size: 0.85rem;
    color: var(--text-light);
    margin-bottom: 8px;
}

.legal-data {
    list-style: none;
    margin: 0 0 12px;
    padding: 0;
}

.legal-data li {
    padding: 6px 0 6px 14px;
    border-left: 2px solid var(--border);
    margin-bottom: 4px;
}

.legal a {
    color: var(--forest);
}

.legal-back {
    display: inline-block;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--forest);
    text-decoration: none;
    margin-bottom: 28px;
}

.legal-back:hover {
    text-decoration: underline;
}

.legal-back--bottom {
    margin: 44px 0 0;
}