/* Ask HenQ - stijl voor de juridische pagina's. Zelfde tokens als index.html. */
:root{
  --bg:#FAF7F1; --bg-card:#FFFFFF;
  --ink:#17130D; --ink-dim: rgba(23,19,13,0.68); --ink-faint: rgba(23,19,13,0.45);
  --line: rgba(23,19,13,0.10); --line-strong: rgba(23,19,13,0.18);
  --orange:#F5A623; --orange-deep:#D9840F;
  --wrap: 760px;
}
@font-face{font-family:'Anton';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/anton-latin-400-normal.woff2') format('woff2');}
@font-face{font-family:'Archivo';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/archivo-latin-400-normal.woff2') format('woff2');}
@font-face{font-family:'Archivo';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/archivo-latin-600-normal.woff2') format('woff2');}
@font-face{font-family:'Archivo';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/archivo-latin-700-normal.woff2') format('woff2');}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/jetbrains-mono-latin-400-normal.woff2') format('woff2');}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/jetbrains-mono-latin-600-normal.woff2') format('woff2');}

*{box-sizing:border-box;}
body{ margin:0; background:var(--bg); color:var(--ink); font-family:'Archivo',sans-serif; line-height:1.65; -webkit-font-smoothing:antialiased; }
img{max-width:100%;display:block;}
::selection{ background:var(--orange); color:var(--ink); }
.wrap{ max-width:var(--wrap); margin:0 auto; padding:0 28px; }

header{ border-bottom:1px solid var(--line); background:rgba(250,247,241,0.92); position:sticky; top:0; z-index:10; backdrop-filter:blur(10px); }
header .wrap{ max-width:1100px; height:78px; display:flex; align-items:center; justify-content:space-between; }
header .logo img{ height:36px; width:auto; }
header a{ text-decoration:none; color:var(--ink-dim); font-size:13.5px; font-weight:500; }
header a:hover{ color:var(--orange-deep); }

.doc-head{ padding:64px 0 26px; }
.eyebrow{ font-family:'JetBrains Mono',monospace; font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--orange-deep); display:flex; align-items:center; gap:10px; margin-bottom:16px; }
.eyebrow::before{ content:""; width:16px; height:1px; background:var(--orange-deep); }
h1{ font-family:'Anton',sans-serif; font-weight:400; text-transform:uppercase; line-height:0.95; font-size:clamp(34px,6vw,58px); margin:0 0 16px; letter-spacing:.005em; }
.lede{ font-size:18px; color:var(--ink-dim); margin:0 0 8px; max-width:60ch; }
.meta{ font-family:'JetBrains Mono',monospace; font-size:11.5px; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.08em; margin-top:18px; padding-top:18px; border-top:1px solid var(--line); }

main{ padding-bottom:80px; }
h2{ font-size:20px; margin:44px 0 12px; line-height:1.3; }
h2 span.n{ font-family:'JetBrains Mono',monospace; color:var(--orange-deep); font-size:15px; margin-right:10px; }
h3{ font-size:16px; margin:26px 0 8px; }
p{ margin:0 0 14px; color:var(--ink-dim); }
ul{ margin:0 0 16px; padding-left:20px; color:var(--ink-dim); }
li{ margin-bottom:8px; }
strong{ color:var(--ink); font-weight:600; }
a{ color:var(--orange-deep); text-underline-offset:3px; }
table{ border-collapse:collapse; width:100%; margin:12px 0 20px; font-size:14.5px; }
th,td{ border:1px solid var(--line-strong); padding:10px 12px; text-align:left; vertical-align:top; color:var(--ink-dim); }
th{ background:rgba(245,166,35,0.10); color:var(--ink); font-weight:600; }

.callout{ border-left:3px solid var(--orange); background:rgba(245,166,35,0.08); padding:18px 20px; margin:24px 0; }
.callout p:last-child{ margin-bottom:0; }
.callout strong{ display:block; margin-bottom:6px; }

footer{ border-top:1px solid var(--line); padding:34px 0; font-size:12.5px; color:var(--ink-faint); }
footer .wrap{ max-width:1100px; display:flex; flex-wrap:wrap; gap:12px; justify-content:space-between; }
footer a{ color:var(--ink-faint); text-decoration:none; }
footer a:hover{ color:var(--orange-deep); }
