:root{--y:#F5C518;--p:#E8508A;--n:#0B1F3A;--n2:#13305a;--bg:#FAF7F0}
*{box-sizing:border-box}body{margin:0;font:16px/1.65 Inter,system-ui,sans-serif;color:var(--n);background:var(--bg)}
h1,h2,h3,h4,.brand,.kicker,.num,.btn{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;letter-spacing:.02em}
h1{font-size:clamp(2.6rem,6vw,4.6rem);line-height:.95;margin:.2em 0 .4em;font-weight:800}h2{font-size:2.6rem;line-height:1;margin:.2em 0 .8em}h3{font-size:1.5rem;line-height:1.1;margin:.4em 0}
.wrap{max-width:1160px;margin:auto;padding:0 24px}a{color:inherit}
.nav{background:var(--n);color:#fff;position:sticky;top:0;z-index:5;border-bottom:4px solid var(--y)}.nav .wrap{display:flex;align-items:center;justify-content:space-between;min-height:72px;flex-wrap:wrap;gap:8px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-size:1.6rem;font-weight:800;color:#fff}.brand b{color:var(--y)}
nav{display:flex;gap:22px;align-items:center;flex-wrap:wrap}nav a{text-decoration:none;font-weight:600}nav a.active{color:var(--y);box-shadow:inset 0 -3px var(--y)}
.btn{display:inline-block;background:var(--y);color:var(--n);font-weight:800;font-size:1.2rem;padding:12px 26px;border:0;border-radius:4px;text-decoration:none;cursor:pointer;transform:skew(-8deg);margin:6px 0}.btn:hover{background:var(--p);color:#fff}.btn.sm{font-size:1rem;padding:8px 16px}.btn.ghost{background:transparent;color:#fff;box-shadow:inset 0 0 0 2px #fff}
.hero,.phead{background:linear-gradient(135deg,var(--n),var(--n2));color:#fff;padding:72px 0;position:relative;overflow:hidden}
.hero:after,.phead:after{content:"";position:absolute;left:0;right:0;bottom:0;height:10px;background:repeating-linear-gradient(90deg,var(--y) 0 60px,var(--p) 60px 120px)}
.hgrid{display:grid;grid-template-columns:1.2fr 1fr;gap:48px;align-items:center}.lead{font-size:1.1rem;opacity:.92;max-width:62ch}
.kicker{color:var(--y);font-weight:800;font-size:1.1rem}.kicker.dark{color:var(--p)}
.ph{display:flex;align-items:flex-end;min-height:220px;border-radius:6px;color:#fff;font-weight:600;padding:14px;background:repeating-linear-gradient(170deg,rgba(0,0,0,.18) 0 2px,transparent 2px 26px),repeating-linear-gradient(80deg,rgba(0,0,0,.18) 0 2px,transparent 2px 40px),linear-gradient(160deg,#8a8f98,#4a515c 60%,#2b3038)}
.ph span{background:rgba(11,31,58,.85);padding:4px 10px;border-left:4px solid var(--y)}.ph.tall{min-height:420px}.ph.wide{min-height:280px;border-radius:0}.ph.portrait{min-height:360px;background:linear-gradient(160deg,#d9d4c7,#a39d90);color:var(--n)}.ph.portrait span{color:#fff;border-left-color:var(--p)}
.sec{padding:72px 24px}.center{text-align:center;margin-top:32px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.card{background:#fff;padding:28px;border-top:6px solid var(--y);border-radius:6px;box-shadow:0 6px 24px rgba(11,31,58,.08)}.card:nth-child(2){border-color:var(--p)}.card:nth-child(3){border-color:var(--n)}
.ico{width:48px;height:48px;color:var(--n)}.num{color:var(--p);font-weight:800}
.band{background:var(--y);padding:56px 0;text-align:center}.band .btn{background:var(--n);color:#fff}
.two{display:grid;grid-template-columns:1.4fr 1fr;gap:48px;align-items:start}.prose p{font-size:1.08rem}.prose .quote{font-family:"Barlow Condensed";font-size:2rem;font-weight:800;text-transform:uppercase;border-left:6px solid var(--y);padding-left:16px;line-height:1.1}
.story{background:var(--n);color:#fff;padding:24px;border-radius:0 0 6px 6px}.story h3{color:var(--y)}
form{display:grid;gap:16px;background:#fff;padding:32px;border-radius:6px;box-shadow:0 6px 24px rgba(11,31,58,.08)}label{font-weight:600;display:grid;gap:6px}input,textarea{font:inherit;padding:12px;border:2px solid #d8dbe2;border-radius:4px}input:focus,textarea:focus{outline:0;border-color:var(--y)}
.cal{background:var(--n);color:#fff;padding:32px;border-radius:6px}.cal h3{color:var(--y)}.small{font-size:.85rem;opacity:.7}
footer{background:var(--n);color:#cfd6e2}.stripe{height:8px;background:repeating-linear-gradient(90deg,var(--y) 0 60px,var(--p) 60px 120px)}.fgrid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:32px;padding:48px 24px}footer h4{color:var(--y);margin:0 0 8px}footer .fgrid div>a:not(.brand){display:block;text-decoration:none}.copy{font-size:.85rem;padding-bottom:24px;opacity:.7}
@media(max-width:860px){.hgrid,.cards,.two,.fgrid{grid-template-columns:1fr}nav{gap:12px;font-size:.95rem}.ph.tall{min-height:240px}}
/* koers v2 */
:root{--r:#D7262F;--dots:radial-gradient(circle,var(--r) 22%,transparent 24%) 0 0/22px 22px,radial-gradient(circle,var(--r) 22%,transparent 24%) 11px 11px/22px 22px}
.hero:before,.phead:before{content:"";position:absolute;right:-60px;top:-60px;width:320px;height:320px;border-radius:50%;background:var(--dots),#fff;opacity:.13}
.hero .wrap,.phead .wrap{position:relative;z-index:1}
.card{border-top:0;position:relative;overflow:hidden;padding-top:40px}.card:before{content:"";position:absolute;left:0;right:0;top:0;height:14px;background:var(--dots),#fff;border-bottom:3px solid var(--y)}
.card:nth-child(2):before{background:var(--y);border-color:var(--y)}.card:nth-child(3):before{background:var(--p);border-color:var(--p)}
.jersey{display:inline-flex;align-items:center;gap:8px;float:right;font-family:"Barlow Condensed";font-weight:800;text-transform:uppercase;font-size:.95rem;background:#FAF7F0;border:1px solid #e4e0d6;border-radius:30px;padding:3px 12px 3px 4px}.jersey svg{width:28px;height:26px}
.story .jersey{float:none;margin-bottom:6px}
.km{display:flex;align-items:center;gap:14px;margin-top:40px;font-family:"Barlow Condensed";font-weight:800;text-transform:uppercase;color:var(--n);font-size:1rem}.km span{background:var(--n);color:var(--y);padding:4px 12px;border-radius:3px}.km i{flex:1;height:0;border-top:3px dashed var(--p)}
.km+.sec{padding-top:40px}
.finish{height:18px;background:repeating-conic-gradient(var(--n) 0 25%,#fff 0 50%) 0 0/18px 18px}
.rosa{background:var(--p);color:#fff;padding:64px 0;text-align:center;position:relative;overflow:hidden}.rosa:after{content:"";position:absolute;inset:auto 0 0 0;height:12px;background:var(--dots),#fff}
.rosa h2{margin-bottom:.3em}.rosa p{font-size:1.15rem;max-width:60ch;margin:0 auto 18px}.kicker.w{color:#fff;opacity:.85}.rosa .btn{background:#fff}
.band.polka{background:linear-gradient(rgba(245,197,24,.9),rgba(245,197,24,.9)),var(--dots),#fff}
.polka-strip{height:12px;background:var(--dots),#fff}
@media(max-width:860px){.jersey{float:none;margin-bottom:8px}}
.sub{font-family:"Barlow Condensed";font-size:1.6rem;font-weight:600;color:var(--y);margin:-.2em 0 .5em}
.jersey{color:var(--n)}
/* === variant bolletjestrui === */
:root{--pd:radial-gradient(circle,#D7262F 0 5px,transparent 5.5px) 0 0/34px 34px,radial-gradient(circle,#D7262F 0 5px,transparent 5.5px) 17px 17px/34px 34px,#fff}
.nav{background:#fff;color:var(--n);border-bottom:4px solid var(--y);box-shadow:0 2px 10px rgba(11,31,58,.08)}.nav .brand{color:var(--n)}.brand b{color:#D7262F}nav a.active{color:var(--n);box-shadow:inset 0 -3px var(--p)}
.hero,.phead,footer{background:var(--pd);color:var(--n)}
.hero:before,.phead:before{display:none}
.hgrid>div:first-child,.phead .wrap>*{position:relative}
.hgrid>div:first-child{background:#FFFDF7;padding:36px;border-radius:8px;box-shadow:0 10px 30px rgba(11,31,58,.15);border-top:8px solid var(--y)}
.phead .wrap{background:#FFFDF7;padding:28px 32px;border-radius:8px;box-shadow:0 10px 30px rgba(11,31,58,.15);border-left:10px solid var(--y);max-width:860px;margin-left:max(24px,calc((100% - 1160px)/2))}
.kicker{color:#D7262F}.sub{color:var(--p)}.lead{opacity:1}
.btn.ghost{color:var(--n);box-shadow:inset 0 0 0 2px var(--n)}
footer{color:var(--n)}footer .fgrid,footer .copy{background:#FFFDF7;border-radius:8px;margin-top:24px}footer .copy{padding:10px 24px;margin-bottom:0;opacity:1}footer h4{color:#D7262F}.polka-strip{background:var(--y)}
.story,.cal{background:#FFFDF7;color:var(--n);border:2px solid var(--n)}.story h3,.cal h3{color:#D7262F}.story{border-top:0}
.km span{background:#fff;color:var(--n);border:2px solid var(--n)}
.band .btn{background:var(--p);color:#fff}.ph span{background:#fff;color:var(--n)}
footer .brand{color:var(--n)}.ph.portrait span{color:var(--n)}
/* === v3: grote bolletjes + sprintgroen === */
:root{--g:#1E9E4A;--big:radial-gradient(circle,#D7262F 0 16px,transparent 17px) 0 0/80px 80px,radial-gradient(circle,#D7262F 0 16px,transparent 17px) 40px 40px/80px 80px}
.card:nth-child(2):before{background:var(--g);border-color:var(--g)}
.km span:last-child{background:var(--g);color:#fff;border-color:var(--g)}
.polka-strip{height:80px;background:var(--big),#fff}
.rosa:after{height:40px;background:var(--big),#fff;background-position:0 -20px,40px 20px}.rosa{padding-bottom:96px}
.groen{display:inline-block;background:var(--g);color:#fff;font:800 1rem "Barlow Condensed";text-transform:uppercase;padding:4px 12px;border-radius:3px;margin-bottom:8px}
.band.polka{background:linear-gradient(rgba(245,197,24,.88),rgba(245,197,24,.88)),var(--big),#fff}
:root{--pd:var(--big),#fff}
.groen-bar{background:#1E9E4A;color:#fff;font:800 1.5rem "Barlow Condensed";text-transform:uppercase;letter-spacing:.03em;padding:18px 0;text-align:center}
.groen-bar .gt{background:#fff;color:#1E9E4A;padding:2px 10px;border-radius:3px;margin-right:10px;font-size:1.1rem;vertical-align:middle}
footer .fgrid{margin-top:24px}