/* Aanvullende layouts voor de privacy- en supportpagina. */
.legal { max-width: 850px; padding-block: 90px 120px; }
.legal header { margin-bottom: 65px; }
.legal h1 { max-width: 800px; }
.legal-lead { max-width: 760px; color: var(--muted); font-size: 21px; }
.update { color: var(--muted); font-size: 14px; }
.legal aside { margin-bottom: 55px; border-radius: 20px; background: var(--warm); padding: 22px 25px; }
.legal aside p { margin: 6px 0 0; }
.legal section { border-top: 1px solid var(--line); padding: 42px 0 20px; }
.legal section h2 { font-size: clamp(27px, 4vw, 38px); }
.legal section p { color: var(--muted); }
.legal mark { border-radius: 4px; background: var(--warm); padding: 2px 5px; color: var(--ink); }
.contact-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; margin: -20px 0 75px; }
.contact-grid a { min-height: 190px; display: flex; flex-direction: column; border-radius: 20px; background: var(--surface); padding: 22px; text-decoration: none; }
.contact-grid a:hover strong { color: var(--accent); }
.contact-grid span { color: var(--muted); font-size: 13px; }
.contact-grid strong { margin: 12px 0; word-break: break-word; }
.contact-grid small { margin-top: auto; color: var(--muted); }
@media (max-width: 700px) { .legal { padding-top: 60px; } .contact-grid { grid-template-columns: 1fr; } }