@font-face { font-family: "Literata"; src: url(fonts/literata-400-700.woff2) format("woff2"); font-weight: 400 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Literata"; src: url(fonts/literata-400-700-italic.woff2) format("woff2"); font-weight: 400 700; font-style: italic; font-display: swap; }
:root { --ink: #1A1F1C; --ink2: #3E4942; --paper: #F6F1E6; --line: #DED6C2; --box: #ECE4D2; --accent: #A85A2E; --dark: #1F3A2E; --dark2: #152A20; --op-donker: #DDD9C9; --koop: #8F3F1F; }
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: "Literata", Georgia, serif; color: var(--ink); background: var(--paper); line-height: 1.6; font-size: 18px; }
a { color: var(--accent); }
.container { max-width: 760px; margin: 0 auto; padding: 0 24px; }
.legal-top { background: linear-gradient(165deg, var(--dark2), var(--dark)); padding: 18px 0; }
.legal-top a { color: var(--paper); text-decoration: none; font-weight: bold; font-size: 19px; }
.legal { padding: 48px 0 64px; }
.eyebrow { font-size: 15px; letter-spacing: .4em; color: var(--accent); margin-bottom: 8px; text-transform: uppercase; }
h1 { font-size: 38px; line-height: 1.15; margin-bottom: 18px; }
h2 { font-size: 22px; margin: 30px 0 8px; }
p { margin-bottom: 14px; color: var(--ink2); }
.card { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 22px 26px; margin: 10px 0 26px; }
.card p { margin: 0; color: var(--ink); font-size: 20px; }
.mailto { margin: 18px 0 6px; }
.btn { display: inline-block; background: var(--koop); color: #fff; text-decoration: none; font-weight: bold; font-size: 19px; padding: 14px 28px; border-radius: 10px; }
.checklist { margin: 0 0 14px 22px; color: var(--ink2); }
.checklist li { margin-bottom: 6px; }
.updated { margin-top: 36px; font-size: 16px; color: var(--ink2); border-top: 1px solid var(--line); padding-top: 18px; }
.colophon { background: linear-gradient(160deg, var(--dark2), #1A2F24); color: var(--op-donker); padding: 36px 0; font-size: 15px; }
.colophon__row { display: flex; flex-wrap: wrap; gap: 10px 24px; justify-content: space-between; align-items: baseline; }
.colophon__brand { color: var(--paper); font-weight: bold; }
.colophon__brand em { font-weight: normal; color: var(--op-donker); }
.colophon__nav a { color: var(--paper); margin-right: 16px; }
@media (max-width: 640px) { body { font-size: 17px; } h1 { font-size: 30px; } .container { padding: 0 18px; } .card p { font-size: 18px; } }