:root{--blou:#1f3b5c;--turkoois:#22a7c4;--geel:#f6c33b;--pienk:#e8566f;--room:#fffaf1;--teks:#2b2b2b}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:70px}
body{margin:0;font:17px/1.6 "Nunito","Segoe UI",system-ui,sans-serif;color:var(--teks);background:var(--room)}
img{max-width:100%;height:auto}a{color:var(--turkoois)}
.houer{max-width:1100px;margin:0 auto;padding:0 20px}
section{padding:56px 0}section.houer{padding:56px 20px}
h1,h2,h3{color:var(--blou);line-height:1.2;font-family:"Baloo 2","Comic Neue","Trebuchet MS",sans-serif}
h2{font-size:2rem;margin:0 0 24px}h2:after{content:"";display:block;width:60px;height:6px;border-radius:3px;margin-top:10px;background:linear-gradient(90deg,var(--turkoois) 33%,var(--geel) 33% 66%,var(--pienk) 66%)}
.kop{position:sticky;top:0;z-index:10;background:#fff;box-shadow:0 2px 10px #0001}
.kop-binne{display:flex;align-items:center;justify-content:space-between;height:64px}
.handelsmerk{display:flex;gap:10px;align-items:center;text-decoration:none;color:var(--blou);font-weight:800;font-size:1.25rem;line-height:1}
.handelsmerk small{display:block;font-size:.75rem;font-weight:600;color:#666}
.nav a{margin-left:22px;text-decoration:none;color:var(--blou);font-weight:700}.nav a:hover{color:var(--pienk)}
.menu-knop{display:none;background:none;border:0;font-size:1.8rem;color:var(--blou);cursor:pointer}
.held{background:radial-gradient(circle at 85% 20%,#fff3c4,transparent 40%),linear-gradient(180deg,#e8f7fb,var(--room))}
.held-binne{display:grid;grid-template-columns:1.1fr .9fr;gap:30px;align-items:center}
.held h1{font-size:2.7rem;margin:.2em 0}.held h1 span{color:var(--pienk)}
.etiket{display:inline-block;background:#fff;border-radius:99px;padding:4px 14px;font-weight:700;color:var(--turkoois);font-size:.9rem;margin:0}
.lei{font-size:1.15rem}
.knoppe{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}
.knop{display:inline-block;padding:12px 22px;border-radius:99px;background:var(--blou);color:#fff;text-decoration:none;font-weight:800;margin-top:12px}
.knop.hoof{background:var(--pienk);box-shadow:0 6px 16px #e8566f55}.knop.wa{background:#25d366}.knop:hover{filter:brightness(1.1)}
.twee{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:start}
.punte{list-style:none;padding:0;margin:0;display:grid;gap:10px}.punte li{background:#fff;padding:12px 16px;border-radius:14px;box-shadow:0 2px 8px #0000000d}
.band{background:#fff}
.kaarte{display:grid;grid-template-columns:repeat(5,1fr);gap:20px}
.kaart-k{background:var(--room);border-radius:20px;overflow:hidden;box-shadow:0 4px 14px #0000001a;transition:transform .2s}.kaart-k:hover{transform:translateY(-4px)}
.kaart-k img{display:block;aspect-ratio:16/10;object-fit:cover;width:100%;background:#fff}.kaart-k div{padding:12px 16px}.kaart-k h3{margin:0 0 4px}.kaart-k p{margin:0}
.pil{background:var(--geel);border-radius:99px;padding:1px 10px;font-size:.85rem;font-weight:700;color:var(--blou)}
table.fooie{width:100%;border-collapse:collapse;background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 2px 10px #00000010}
.fooie th{background:var(--blou);color:#fff;text-align:left}.fooie th,.fooie td{padding:12px 14px}.fooie tr:nth-child(even) td{background:#f4fbfd}
.kassie{background:#fff;padding:20px 24px;border-radius:16px;border-left:6px solid var(--geel)}.kassie ul{padding-left:20px;margin-top:0}
.bank{margin:4px 0}.klein{font-size:.9rem;color:#666;margin:4px 0}
.aflaai-lys{display:grid;gap:14px;max-width:720px}
.aflaai{display:flex;align-items:center;gap:14px;padding:16px 20px;background:var(--room);border-radius:16px;text-decoration:none;color:var(--teks);border:2px solid #e9e2d3}
.aflaai:hover{border-color:var(--turkoois)}.aflaai small{display:block;color:#666}.ikoon{font-size:1.8rem}.pyl{margin-left:auto;background:var(--turkoois);color:#fff;border-radius:99px;padding:6px 14px;font-weight:800;white-space:nowrap}
.kontak-lys{display:grid;gap:10px}
.ry{display:flex;gap:12px;align-items:flex-start;padding:12px 16px;background:#fff;border-radius:14px;text-decoration:none;color:var(--teks);font-weight:700;font-size:1.05rem}
.ry small{display:block;font-weight:600;color:#777;font-size:.85rem}
.kaart{width:100%;height:320px;border:0;border-radius:16px;background:#e8f0f2}
.voet{background:var(--blou);color:#dfe8f0;padding:24px 0;font-size:.9rem;text-align:center}
.wa-sweef{position:fixed;right:18px;bottom:18px;width:58px;height:58px;border-radius:50%;background:#25d366;display:grid;place-items:center;font-size:1.7rem;text-decoration:none;box-shadow:0 6px 16px #0003}
@media(max-width:800px){
 .kaarte{grid-template-columns:repeat(2,1fr);gap:14px}
 .menu-knop{display:block}
 .nav{display:none;position:absolute;top:64px;left:0;right:0;background:#fff;flex-direction:column;padding:10px 20px;box-shadow:0 8px 12px #0001}
 .nav.oop{display:flex}.nav a{margin:0;padding:12px 0;border-bottom:1px solid #eee}
 .held-binne,.twee{grid-template-columns:1fr}.held h1{font-size:2rem}.held-prent{max-width:340px;margin:auto;order:-1}
 h2{font-size:1.6rem}section,section.houer{padding:40px 20px}.fooie th,.fooie td{padding:10px 8px;font-size:.95rem}
}
@media(max-width:1000px) and (min-width:801px){.kaarte{grid-template-columns:repeat(3,1fr)}}
/* ===== Variant A: Speels & kleurvol ===== */
:root{--blou:#3b3a7a;--turkoois:#4cc3d9;--geel:#ffd166;--pienk:#ff6f91;--room:#fff7fb;--pers:#b388ff;--groen:#7bd389}
body{font-family:"Nunito",system-ui,sans-serif}
h1,h2,h3,.handelsmerk{font-family:"Fredoka","Nunito",sans-serif}
h2{font-size:2.3rem;text-align:center}h2:after{margin:12px auto 0;width:120px;height:10px;border-radius:10px;background:linear-gradient(90deg,var(--pienk) 20%,var(--geel) 20% 40%,var(--groen) 40% 60%,var(--turkoois) 60% 80%,var(--pers) 80%)}
.kop{border-bottom:5px dashed var(--geel)}
.nav a{padding:6px 14px;border-radius:99px;margin-left:6px}.nav a:nth-child(1){background:#ffe3ea}.nav a:nth-child(2){background:#fff1c9}.nav a:nth-child(3){background:#dcf6e2}.nav a:nth-child(4){background:#d9f3f8}.nav a:nth-child(5){background:#eee3ff}
.held{background:radial-gradient(circle at 10% 20%,#ffe3ea 0 120px,transparent 121px),radial-gradient(circle at 90% 85%,#d9f3f8 0 160px,transparent 161px),radial-gradient(circle at 60% 5%,#fff1c9 0 90px,transparent 91px),#fff;padding:64px 0}
.held h1{font-size:3rem}.held h1 span{color:var(--pienk);background:linear-gradient(transparent 60%,#ffe3a0 60%)}
.etiket{background:var(--pers);color:#fff}
.held-collage{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.held-collage img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:50%;border:6px solid #fff;box-shadow:0 8px 20px #3b3a7a22;grid-column:span 2}
.held-collage img:nth-child(1){border-color:#ffd1dc}.held-collage img:nth-child(2){border-color:#c9f0d3;transform:translateY(24px)}.held-collage img:nth-child(3){border-color:#fff1c9}
.held-collage img:nth-child(4){grid-column:2/span 2;border-color:#cdeff6}.held-collage img:nth-child(5){border-color:#e4d6ff;transform:translateY(-10px)}
.knop{border-radius:22px;box-shadow:0 5px 0 #0002}.knop:active{transform:translateY(3px)}
.band{background:#f2fbff}
.kaart-k{border-radius:30px;border:4px solid #fff;background:#fff}
.kaart-k:nth-child(5n+1){background:#ffe3ea}.kaart-k:nth-child(5n+2){background:#dcf6e2}.kaart-k:nth-child(5n+3){background:#fff1c9}.kaart-k:nth-child(5n+4){background:#d9f3f8}.kaart-k:nth-child(5n+5){background:#eee3ff}
.kaart-k img{aspect-ratio:1/1;border-radius:26px 26px 0 0}.kaart-k h3{font-size:1.35rem}
.kaart-k:hover{transform:rotate(-2deg) scale(1.03)}
.punte li{border-radius:22px;border-left:8px solid var(--pienk)}.punte li:nth-child(2n){border-color:var(--turkoois)}.punte li:nth-child(3n){border-color:var(--geel)}
table.fooie{border-radius:26px}.fooie th{background:var(--pers)}.kassie{border-radius:26px;border:4px dashed var(--geel)}
.aflaai{border-radius:26px;border:3px solid #ffd1dc;background:#fff}.pyl{background:var(--pienk)}
.ry{border-radius:22px}.voet{background:var(--blou)}
@media(max-width:800px){.held-collage{max-width:340px;margin:0 auto;order:-1}.held h1{font-size:2.1rem}h2{font-size:1.8rem}.nav a{margin:4px 0}}
/* Groter skoolnaam */
.kop-binne{height:76px}html{scroll-padding-top:84px}
.handelsmerk{font-size:1.75rem;gap:12px}.handelsmerk img{width:72px;height:50px}
.handelsmerk span{color:var(--pienk);letter-spacing:.5px}.handelsmerk small{font-size:.95rem;color:var(--blou);font-weight:700;margin-top:2px}
.skoolnaam{font-family:"Fredoka",sans-serif;font-weight:700;font-size:4.2rem;line-height:1;margin:14px 0 6px;color:var(--pienk);text-shadow:3px 3px 0 #ffd16699}
.skoolnaam span{display:inline-block}.skoolnaam span+span{color:var(--blou)}
.held h1{font-size:2.2rem;margin-top:.3em}
@media(max-width:800px){.kop-binne{height:68px}.nav{top:68px}.handelsmerk{font-size:1.5rem}.handelsmerk img{width:60px;height:42px}.handelsmerk small{font-size:.85rem}
 .skoolnaam{font-size:3rem}.skoolnaam span{display:block}.held h1{font-size:1.7rem}}

/* ===== Fotogalery ===== */
.galery-lei{text-align:center;margin-top:-8px}
.galery{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px}
.galery button{padding:0;border:5px solid #fff;border-radius:24px;overflow:hidden;cursor:pointer;background:#fff;box-shadow:0 6px 16px #3b3a7a22;transition:transform .2s;display:block;width:100%}
.galery button:nth-child(5n+1){border-color:#ffd1dc}.galery button:nth-child(5n+2){border-color:#c9f0d3}.galery button:nth-child(5n+3){border-color:#fff1c9}.galery button:nth-child(5n+4){border-color:#cdeff6}.galery button:nth-child(5n+5){border-color:#e4d6ff}
.galery button:hover,.galery button:focus-visible{transform:rotate(-2deg) scale(1.04)}
.galery img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.galery-filter{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:0 0 22px}
.galery-filter .filter{font:inherit;font-weight:700;padding:8px 18px;border-radius:999px;border:3px solid #e4d6ff;background:#fff;color:var(--blou);cursor:pointer}
.galery-filter .filter:hover,.galery-filter .filter:focus-visible{border-color:var(--turkoois)}
.galery-filter .filter.aktief{background:var(--turkoois);border-color:var(--turkoois);color:#fff}
.galery-fb{text-align:center;margin-top:24px}
.ligkas{position:fixed;inset:0;z-index:50;background:#1d1c40ee;display:flex;align-items:center;justify-content:center;padding:20px}
.ligkas[hidden]{display:none}
.ligkas figure{margin:0;max-width:min(1100px,86vw);text-align:center}
.ligkas img{max-height:78vh;width:auto;border-radius:18px;border:6px solid #fff}
.ligkas figcaption{color:#fff;font-family:"Fredoka",sans-serif;font-size:1.2rem;margin-top:10px}
.ligkas button{background:var(--geel);color:var(--blou);border:0;border-radius:50%;width:52px;height:52px;font-size:2rem;line-height:1;cursor:pointer;box-shadow:0 4px 0 #0003;flex:none}
.lk-toe{position:absolute;top:16px;right:16px;background:var(--pienk)!important;color:#fff!important;font-size:1.4rem!important}
.lk-vorige{margin-right:12px}.lk-volgende{margin-left:12px}
@media(max-width:600px){.galery{grid-template-columns:repeat(2,1fr);gap:10px}.galery button{border-width:3px;border-radius:16px}.ligkas{padding:8px}.ligkas button{width:42px;height:42px;font-size:1.5rem}.lk-vorige,.lk-volgende{position:absolute;bottom:20px}.lk-vorige{left:30%}.lk-volgende{right:30%}.ligkas figure{max-width:96vw}}
.nav a:nth-child(6){background:#ffe3ea}

/* ===== Aanlyn inskrywingsvorm ===== */
.nav a:nth-child(7){background:#fff1c9}
.aanlyn-knop{max-width:720px;margin-top:18px;font-weight:700;display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px}.aanlyn-knop .knop{margin-top:0}
.vorm-lei{text-align:center;max-width:760px;margin:-8px auto 24px}
.nodig{color:var(--pienk);font-weight:800}
.vorm{max-width:900px;margin:0 auto;display:grid;gap:20px}
.versteek{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.v-blok{margin:0;background:#fff;border:4px solid #ffd1dc;border-radius:26px;padding:18px 22px 22px;min-width:0}
.v-blok:nth-of-type(5n+2){border-color:#c9f0d3}.v-blok:nth-of-type(5n+3){border-color:#fff1c9}.v-blok:nth-of-type(5n+4){border-color:#cdeff6}.v-blok:nth-of-type(5n+5){border-color:#e4d6ff}
.v-blok legend{font-family:"Fredoka",sans-serif;font-weight:600;font-size:1.3rem;color:var(--blou);background:#fff;padding:2px 14px;border-radius:99px}
.v-rooster{display:grid;grid-template-columns:1fr 1fr;gap:14px 18px}
.v-rooster .vol,.v-rooster .keuse{grid-column:1/-1}
.vorm label{display:block;font-weight:700;color:var(--blou);font-size:.95rem}
.vorm input:not([type=radio]):not([type=checkbox]),.vorm select,.vorm textarea{display:block;width:100%;margin-top:4px;padding:11px 14px;font:inherit;font-weight:400;color:var(--teks);background:var(--room);border:2px solid #e6dcef;border-radius:14px}
.vorm input:focus,.vorm select:focus,.vorm textarea:focus{outline:none;border-color:var(--turkoois);box-shadow:0 0 0 4px #4cc3d933}
.vorm textarea{resize:vertical}
.keuse{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center}
.keuse-kop{width:100%;font-weight:700;color:var(--blou);font-size:.95rem}
.keuse label{display:inline-flex;align-items:center;gap:8px;font-weight:600;background:var(--room);border:2px solid #e6dcef;border-radius:99px;padding:6px 16px;cursor:pointer}
.vorm input[type=radio],.vorm input[type=checkbox]{accent-color:var(--pienk);width:20px;height:20px;flex:none}
.verklaring ul{padding-left:20px;margin-top:0}
.vorm label.merk{display:flex;gap:12px;align-items:flex-start;background:#fff7d6;border-radius:18px;padding:12px 16px;margin:10px 0 16px;font-weight:700}
.handtek{font-family:"Fredoka",cursive!important;font-size:1.25rem!important}
.vorm-stuur{text-align:center;margin:0}.vorm-stuur .knop{border:0;font:inherit;font-weight:800;font-size:1.15rem;padding:14px 34px;cursor:pointer}
@media(max-width:640px){.v-rooster{grid-template-columns:1fr}.v-blok{padding:14px 14px 18px;border-radius:20px}.v-blok legend{font-size:1.1rem}}
/* Dankie-blad */
.dankie{min-height:70vh;display:grid;place-items:center;text-align:center;padding:56px 20px}
.dankie-kaart{background:#fff;border:5px dashed var(--geel);border-radius:34px;padding:36px 28px;max-width:620px;box-shadow:0 10px 30px #3b3a7a1a}
.dankie-kaart .groot{font-size:4rem;margin:0}