/* urenverantwoording.be */
@font-face { font-family: 'League Spartan Variable'; font-style: normal; font-display: swap; font-weight: 100 900; src:url(fonts/league-spartan-latin-wght-normal.woff2) format('woff2-variations'); }
@font-face { font-family: 'Red Hat Text Variable'; font-style: normal; font-display: swap; font-weight: 300 700; src:url(fonts/red-hat-text-latin-wght-normal.woff2) format('woff2-variations'); }
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
body{margin:0;overflow-x:clip}
a{transition:color .2s,background-color .2s,border-color .2s,transform .2s,box-shadow .2s}
h1,h2,strong{overflow-wrap:break-word;hyphens:auto}
:focus-visible{outline:3px solid currentColor;outline-offset:3px}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
/* Bauhaus BE — geometrie in zwart/geel/rood, League Spartan + Red Hat Text */
:root{--ink:#121212;--bg:#f0ebe1;--yellow:#fdd000;--red:#e3002b;--muted:#5f5a51;--head:'League Spartan Variable',system-ui,sans-serif;--font:'Red Hat Text Variable',system-ui,sans-serif}
body{background:var(--bg);color:var(--ink);font-family:var(--font);font-size:17.5px;line-height:1.7;overflow-x:clip}
a{color:var(--ink);text-decoration-color:var(--red);text-decoration-thickness:2px;text-underline-offset:3px;font-weight:600}
a:hover{color:var(--red)}
nav{display:flex;align-items:center;gap:28px;flex-wrap:wrap;padding:20px max(20px,calc((100% - 1180px)/2));background:var(--bg);border-top:10px solid;border-image:linear-gradient(90deg,var(--ink) 33.3%,var(--yellow) 33.3% 66.6%,var(--red) 66.6%) 1;border-bottom:0}
nav a{text-decoration:none;font-weight:700;font-size:.92rem;text-transform:uppercase;letter-spacing:.08em}
nav a:hover{color:var(--red)}
nav a:first-child{margin-right:auto;font-family:var(--head);font-weight:800;font-size:1.3rem;text-transform:none;letter-spacing:-.02em;display:flex;align-items:center;gap:6px}
nav a:first-child::before{content:"";width:22px;height:22px;background:var(--red);border-radius:50%;box-shadow:26px 0 0 -2px var(--yellow);margin-right:30px}
main{max-width:1180px;margin:0 auto;padding:0 20px}
.kicker{display:inline-block;font-weight:800;font-size:.8rem;text-transform:uppercase;letter-spacing:.14em;background:var(--ink);color:var(--yellow);padding:6px 12px}
h1,h2{font-family:var(--head);font-weight:800;letter-spacing:-.03em;line-height:.98}
.hero{position:relative;padding:90px 0 90px;min-height:620px;border-bottom:3px solid var(--ink)}
.hero::before{content:"";position:absolute;right:0;bottom:40px;width:400px;height:400px;transform:scale(.78);transform-origin:100% 100%;background:
  radial-gradient(circle at 70% 30%,var(--yellow) 0 110px,transparent 111px),
  conic-gradient(from 90deg at 0 100%,var(--red) 0 25%,transparent 0) 0 100%/200px 200px no-repeat,
  linear-gradient(var(--ink),var(--ink)) 210px 210px/190px 190px no-repeat}
.hero h1{position:relative;z-index:1;font-size:clamp(2rem,8.4vw,6rem);margin:.3em 0 .3em}
.hero p{font-size:1.25rem;color:var(--muted);margin:0;max-width:560px}
.cards{counter-reset:c;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-bottom:3px solid var(--ink)}
.card{counter-increment:c;display:flex;flex-direction:column;padding:32px 28px 36px;text-decoration:none;color:var(--ink);border-right:3px solid var(--ink)}
.card:last-child{border-right:0}
.card::before{content:"";width:64px;height:64px;margin-bottom:28px;background:var(--yellow);border-radius:50%}
.card:nth-child(2)::before{background:var(--red);border-radius:0}
.card:nth-child(3)::before{background:var(--ink);border-radius:0;clip-path:polygon(50% 0,100% 100%,0 100%)}
.card strong{font-family:var(--head);font-weight:800;font-size:1.6rem;letter-spacing:-.02em;line-height:1.08}
.card span{margin-top:12px;color:var(--muted);font-size:.95rem}
.card:hover{background:var(--yellow);color:var(--ink)}
.card:nth-child(1):hover::before{background:var(--ink)}
.linkbox{margin-top:0;display:grid;grid-template-columns:1fr 1fr;gap:0}
.linkbox h2{grid-row:1;font-size:1.3rem;margin:0;padding:32px 28px 10px}
.linkbox p{grid-row:2;margin:0;padding:0 28px 34px;line-height:2}
.linkbox h2:first-child,.linkbox h2:first-child+p{background:var(--ink);color:#e9e4da}
.linkbox h2:first-child+p a{color:var(--yellow);text-decoration-color:var(--red)}
.linkbox h2:first-child+p a:hover{color:#fff}
article{max-width:840px;margin:72px auto 0;position:relative;padding-left:96px}
article::before{content:"";position:absolute;left:0;top:6px;width:56px;height:56px;border-radius:50%;background:var(--red);box-shadow:0 70px 0 var(--yellow)}
article::after{content:"";position:absolute;left:0;top:146px;width:56px;height:56px;background:var(--ink)}
article h1{font-size:clamp(2rem,6vw,4.2rem);margin:.4em 0 .45em}
.lead{font-size:1.3rem;line-height:1.55;font-weight:500;border-top:3px solid var(--ink);border-bottom:3px solid var(--ink);padding:22px 0}
article h2{font-size:1.9rem;margin:2em 0 .55em;display:flex;gap:14px;align-items:center}
article h2::before{content:"";flex:none;width:18px;height:18px;background:var(--red)}
article h2:nth-of-type(2)::before{background:var(--yellow);border-radius:50%}
article h2:nth-of-type(3)::before{background:var(--ink);clip-path:polygon(50% 0,100% 100%,0 100%)}
article ul{list-style:none;padding:0;border-left:3px solid var(--ink)}
article li{padding:8px 0 8px 24px;margin:0}
article li:nth-child(odd){background:linear-gradient(90deg,rgba(253,208,0,.35),transparent)}
aside{margin-top:48px;padding:30px 32px;background:var(--ink);color:#e9e4da;line-height:2;border-left:14px solid var(--yellow)}
aside strong{font-family:var(--head);font-size:1.3rem;color:var(--yellow)}
aside a{color:#fff;text-decoration-color:var(--red)}aside a:hover{color:var(--yellow)}
footer{max-width:1180px;margin:80px auto 0;padding:26px 20px 56px;display:flex;justify-content:space-between;gap:20px;font-weight:600;font-size:.92rem;border-top:3px solid var(--ink)}
footer span:first-child{font-family:var(--head);font-weight:800}
@media(max-width:900px){.hero{padding:56px 0 48px;min-height:0}.hero::before,.hero::after{display:none}}
@media(max-width:820px){nav a:first-child{flex-basis:100%;font-size:1.1rem}nav{gap:18px}.cards{grid-template-columns:1fr}.card{border-right:0;border-bottom:3px solid var(--ink)}.card:last-child{border-bottom:0}.linkbox{grid-template-columns:1fr}.linkbox h2,.linkbox p{grid-row:auto}article{padding-left:0;margin-top:40px}article::before,article::after{display:none}footer{flex-direction:column}}