/* Gedeelde opmaak voor voorwaarden.html en privacy.html */
:root {
  --cream: #FDF8F2;
  --cream-deep: #E7DDCF;
  --ink: #1D2521;
  --ink-soft: #33403A;
  --green: #1F3A32;
  --muted: #56625B;
  --line: #D9D2C4;
  --serif: "Newsreader", "Iowan Old Style", Georgia, serif;
  --sans: "Hanken Grotesk", "Helvetica Neue", Arial, sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0; background: var(--cream); color: var(--ink-soft);
  font: 400 17px/1.7 var(--sans); -webkit-font-smoothing: antialiased;
}
a { color: var(--green); text-underline-offset: 3px; }
:focus-visible { outline: 2px solid var(--green); outline-offset: 3px; border-radius: 4px; }

.wrap { max-width: 760px; margin: 0 auto; padding: 0 clamp(18px, 4vw, 40px); }

header { border-bottom: 1px solid var(--line); padding: 18px 0; }
header .wrap { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.brand { font: 500 22px/1 var(--serif); color: var(--ink); text-decoration: none; }
.back { font: 500 15px/1 var(--sans); text-decoration: none; }
.back:hover { text-decoration: underline; }

main { padding: clamp(40px, 7vw, 80px) 0 clamp(56px, 8vw, 96px); }
h1, h2 { font-family: var(--serif); font-weight: 500; color: var(--ink); letter-spacing: -.01em; margin: 0; }
h1 { font-size: clamp(36px, 6vw, 52px); line-height: 1.08; }
.meta { margin: 14px 0 0; font-size: 15px; color: var(--muted); }
.intro { margin: 28px 0 0; font-size: 18px; }
h2 { font-size: 26px; line-height: 1.2; margin-top: 52px; padding-top: 28px; border-top: 1px solid var(--line); }
h2 span { color: var(--muted); font-size: .8em; margin-right: 8px; }
p { margin: 14px 0 0; }
ul { margin: 14px 0 0; padding-left: 22px; }
li { margin-bottom: 8px; }
strong { color: var(--ink); font-weight: 600; }

/* Nog in te vullen gegevens */
mark { background: #F4DDBD; color: var(--ink); padding: 1px 6px; border-radius: 4px; font-weight: 600; }
.note { margin-top: 28px; padding: 18px 22px; background: var(--cream-deep); border-radius: 8px; font-size: 15.5px; }

.table-wrap { overflow-x: auto; margin-top: 18px; border: 1px solid var(--line); border-radius: 8px; }
table { border-collapse: collapse; width: 100%; min-width: 560px; font-size: 15.5px; line-height: 1.5; }
th, td { text-align: left; vertical-align: top; padding: 12px 16px; border-bottom: 1px solid var(--line); }
th { background: var(--cream-deep); color: var(--ink); font-weight: 600; font-size: 14px; }
tr:last-child td { border-bottom: 0; }

footer { border-top: 1px solid var(--line); padding: 28px 0 40px; font-size: 15px; color: var(--muted); }
footer .wrap { display: flex; flex-wrap: wrap; gap: 8px 20px; justify-content: space-between; }
footer a { color: var(--ink); }
.link-btn { background: none; border: 0; padding: 0; font: inherit; color: var(--ink); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }

@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
