/* ============================================================
   HuurKompas — Legal pages (Privacyverklaring · Algemene Voorwaarden)
   Clean, readable, printable. Reuses the landing design tokens
   (--ink, --orange, --font-serif) defined in landing.css.
   ============================================================ */
body.legal-page {
    background: var(--cream);
    color: var(--t-body);
    font-family: var(--font-sans);
    overflow-x: hidden;
}

/* (legal pages reuse landing tokens) */

/* slim header */
.legal-nav {
    position: sticky; top: 0; z-index: 100;
    background: rgba(245, 241, 234, 0.92);
    -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--hair);
}
.legal-nav-inner {
    max-width: 980px; margin: 0 auto; padding: 13px 24px;
    display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.legal-nav .brand-word { color: var(--ink); text-shadow: none; }
.legal-nav-actions { display: flex; align-items: center; gap: 16px; }
.legal-back { font-size: 14px; font-weight: 500; color: var(--t-body); text-decoration: none; white-space: nowrap; }
.legal-back:hover { color: var(--ink); }
.legal-print { padding: 10px 18px; font-size: 14px; }

/* article */
.legal-main { max-width: 760px; margin: 0 auto; padding: 56px 24px 88px; }
.legal-eyebrow { display: inline-block; font-size: 12px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--orange-deep); margin-bottom: 14px; }
.legal-main h1 { font-family: var(--font-serif); font-style: italic; font-weight: 400; font-size: clamp(32px, 5vw, 46px); line-height: 1.1; color: var(--ink); margin-bottom: 12px; }
.legal-lead { font-size: 16.5px; line-height: 1.7; color: var(--t-body); margin-bottom: 8px; }
.legal-updated { font-size: 13px; color: var(--t-muted); margin-bottom: 8px; }

.legal-main section { margin-top: 38px; }
.legal-main h2 { font-family: var(--font-serif); font-style: italic; font-weight: 400; font-size: clamp(22px, 3vw, 29px); line-height: 1.2; color: var(--ink); margin-bottom: 12px; }
.legal-main h2 .legal-num { color: var(--orange-deep); font-style: normal; margin-right: 8px; }
.legal-main h3 { font-size: 16px; font-weight: 700; color: var(--t-strong); margin: 22px 0 8px; }
.legal-main p { font-size: 15.5px; line-height: 1.75; color: var(--t-body); margin-bottom: 12px; }
.legal-main ul, .legal-main ol { margin: 10px 0 14px 22px; }
.legal-main li { font-size: 15.5px; line-height: 1.7; color: var(--t-body); margin-bottom: 7px; }
.legal-main a { color: var(--orange-deep); text-decoration: underline; }
.legal-main strong { color: var(--t-strong); }

.legal-note { background: rgba(255, 255, 255, 0.7); border: 1px solid var(--hair); border-left: 3px solid var(--orange); border-radius: 12px; padding: 18px 20px; margin: 20px 0; }
.legal-note p:last-child { margin-bottom: 0; }

/* print: strip chrome, full-width black-on-white */
@media print {
    .legal-nav, .site-footer, .legal-print, .legal-back { display: none !important; }
    body.legal-page { background: #fff; }
    .legal-main { padding: 0; max-width: 100%; }
    .legal-note { background: none; }
    a { color: #000; }
}