@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;600;700&display=swap";*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--kleur-achtergrond:#0a0a1a;--kleur-achtergrond-2:#060612;--kleur-oppervlak:#12122a;--kleur-oppervlak-2:#181838;--kleur-oppervlak-hover:#1e1e42;--kleur-rand:#2a2a4a;--kleur-rand-licht:#3a3a5a;--kleur-accent:#0f8;--kleur-accent-dim:#00cc6a;--kleur-accent-glow:#00ff8826;--kleur-accent-glow-sterk:#00ff884d;--kleur-accent-2:#7c3aed;--kleur-accent-2-dim:#6d28d9;--kleur-accent-2-glow:#7c3aed26;--kleur-accent-3:#00d4ff;--kleur-accent-3-glow:#00d4ff26;--kleur-tekst:#e8e8f8;--kleur-tekst-secundair:#b0b0d0;--kleur-tekst-dim:#7878a0;--kleur-tekst-accent:var(--kleur-accent);--kleur-succes:#0f8;--kleur-waarschuwing:#fa0;--kleur-fout:#f46;--kleur-info:#00d4ff;--kleur-beginner:#0f8;--kleur-intermediate:#fa0;--kleur-advanced:#f46;--font-hoofd:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-code:"JetBrains Mono", "Fira Code", "Consolas", monospace;--tekst-xs:.75rem;--tekst-sm:.875rem;--tekst-base:1rem;--tekst-lg:1.125rem;--tekst-xl:1.25rem;--tekst-2xl:1.5rem;--tekst-3xl:1.875rem;--tekst-4xl:2.25rem;--tekst-5xl:3rem;--tekst-6xl:3.75rem;--tekst-7xl:4.5rem;--ruimte-1:.25rem;--ruimte-2:.5rem;--ruimte-3:.75rem;--ruimte-4:1rem;--ruimte-5:1.25rem;--ruimte-6:1.5rem;--ruimte-8:2rem;--ruimte-10:2.5rem;--ruimte-12:3rem;--ruimte-16:4rem;--ruimte-20:5rem;--ruimte-24:6rem;--ruimte-32:8rem;--radius-sm:.375rem;--radius-md:.5rem;--radius-lg:.75rem;--radius-xl:1rem;--radius-2xl:1.5rem;--radius-vol:9999px;--schaduw-sm:0 2px 8px #0000004d;--schaduw-md:0 4px 16px #0006;--schaduw-lg:0 8px 32px #00000080;--schaduw-xl:0 16px 48px #0009;--schaduw-glow:0 0 20px var(--kleur-accent-glow);--schaduw-glow-sterk:0 0 40px var(--kleur-accent-glow-sterk);--overgang-snel:.15s ease;--overgang-normaal:.25s ease;--overgang-langzaam:.4s ease;--overgang-traag:.6s ease;--z-achtergrond:-1;--z-normaal:1;--z-verhoogd:10;--z-navigatie:100;--z-overlay:1000;--z-modal:10000;--max-breedte:1280px;--nav-hoogte:72px;--sidebar-breedte:280px}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px}body{font-family:var(--font-hoofd);background-color:var(--kleur-achtergrond);color:var(--kleur-tekst);min-height:100vh;line-height:1.7;overflow-x:hidden}h1,h2,h3,h4,h5,h6{color:var(--kleur-tekst);letter-spacing:-.02em;font-weight:700;line-height:1.2}h1{font-size:var(--tekst-5xl);margin-bottom:var(--ruimte-6)}h2{font-size:var(--tekst-4xl);margin-bottom:var(--ruimte-5)}h3{font-size:var(--tekst-2xl);margin-bottom:var(--ruimte-4)}h4{font-size:var(--tekst-xl);margin-bottom:var(--ruimte-3)}p{margin-bottom:var(--ruimte-4);color:var(--kleur-tekst-secundair);line-height:1.8}a{color:var(--kleur-accent);transition:color var(--overgang-snel);text-decoration:none}a:hover{color:var(--kleur-accent-dim);text-decoration:underline}code,pre{font-family:var(--font-code)}code{background:var(--kleur-oppervlak);padding:var(--ruimte-1) var(--ruimte-2);border-radius:var(--radius-sm);font-size:var(--tekst-sm);color:var(--kleur-accent);border:1px solid var(--kleur-rand)}pre{background:var(--kleur-achtergrond-2);border:1px solid var(--kleur-rand);border-radius:var(--radius-lg);padding:var(--ruimte-6);margin-bottom:var(--ruimte-6);position:relative;overflow-x:auto}pre code{font-size:var(--tekst-sm);color:var(--kleur-accent);background:0 0;border:none;padding:0}::selection{background:var(--kleur-accent);color:var(--kleur-achtergrond)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--kleur-achtergrond)}::-webkit-scrollbar-thumb{background:var(--kleur-rand);border-radius:var(--radius-vol)}::-webkit-scrollbar-thumb:hover{background:var(--kleur-rand-licht)}.container{max-width:var(--max-breedte);padding:0 var(--ruimte-6);margin:0 auto}.container-smal{max-width:960px;padding:0 var(--ruimte-6);margin:0 auto}.sectie{padding:var(--ruimte-24) 0}.sectie-klein{padding:var(--ruimte-16) 0}.tekst-accent{color:var(--kleur-accent)}.tekst-accent-2{color:var(--kleur-accent-2)}.tekst-accent-3{color:var(--kleur-accent-3)}.tekst-dim{color:var(--kleur-tekst-dim)}.tekst-centrum{text-align:center}.tekst-rechts{text-align:right}.flex{display:flex}.flex-centrum{justify-content:center;align-items:center;display:flex}.flex-tussen{justify-content:space-between;align-items:center;display:flex}.flex-kolom{flex-direction:column;display:flex}.flex-wrap{flex-wrap:wrap}.gap-1{gap:var(--ruimte-1)}.gap-2{gap:var(--ruimte-2)}.gap-3{gap:var(--ruimte-3)}.gap-4{gap:var(--ruimte-4)}.gap-6{gap:var(--ruimte-6)}.gap-8{gap:var(--ruimte-8)}.grid{gap:var(--ruimte-6);display:grid}.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}@media (width<=1024px){.grid-4,.grid-3{grid-template-columns:repeat(2,1fr)}h1{font-size:var(--tekst-4xl)}h2{font-size:var(--tekst-3xl)}}@media (width<=768px){.grid-4,.grid-3,.grid-2{grid-template-columns:1fr}h1{font-size:var(--tekst-3xl)}h2{font-size:var(--tekst-2xl)}.container{padding:0 var(--ruimte-4)}.sectie{padding:var(--ruimte-16) 0}:root{--nav-hoogte:64px}.verberg-mobiel{display:none!important}}@media (width>=769px){.verberg-desktop{display:none!important}}img{max-width:100%;height:auto;display:block}ul,ol{padding-left:var(--ruimte-6);margin-bottom:var(--ruimte-4)}li{margin-bottom:var(--ruimte-2);color:var(--kleur-tekst-secundair)}li::marker{color:var(--kleur-accent)}.nav-stats{align-items:center;gap:var(--ruimte-4);margin-left:var(--ruimte-6);padding-left:var(--ruimte-6);border-left:1px solid var(--kleur-rand);display:flex}.xp-container{flex-direction:column;gap:4px;width:120px;display:flex}.xp-label{font-size:10px;font-family:var(--font-code);color:var(--kleur-tekst-dim);justify-content:space-between;display:flex}.xp-bar-bg{background:var(--kleur-achtergrond-2);border:1px solid var(--kleur-rand);border-radius:3px;width:100%;height:6px;overflow:hidden}.xp-bar-fill{background:var(--kleur-accent);width:0%;height:100%;box-shadow:0 0 10px var(--kleur-accent-glow);transition:width .5s ease-out}.level-badge{background:var(--kleur-accent-glow);border:1px solid var(--kleur-accent);color:var(--kleur-accent);font-family:var(--font-code);border-radius:4px;padding:2px 8px;font-size:12px;font-weight:700}@media (width<=1024px){.nav-stats{display:none}}.navigatie{height:var(--nav-hoogte);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--kleur-rand);z-index:var(--z-navigatie);transition:background var(--overgang-normaal);background:#0a0a1ad9;position:fixed;top:0;left:0;right:0}.navigatie-inner{max-width:var(--max-breedte);padding:0 var(--ruimte-6);justify-content:space-between;align-items:center;height:100%;margin:0 auto;display:flex}.navigatie-logo{align-items:center;gap:var(--ruimte-3);font-weight:800;font-size:var(--tekst-xl);color:var(--kleur-tekst);letter-spacing:-.02em;text-decoration:none;display:flex}.navigatie-logo:hover{color:var(--kleur-tekst);text-decoration:none}.navigatie-logo .logo-icoon{background:linear-gradient(135deg, var(--kleur-accent), var(--kleur-accent-3));border-radius:var(--radius-md);width:36px;height:36px;font-size:var(--tekst-lg);color:var(--kleur-achtergrond);justify-content:center;align-items:center;font-weight:900;display:flex}.navigatie-logo .logo-tekst-accent{color:var(--kleur-accent)}.navigatie-links{align-items:center;gap:var(--ruimte-1);margin:0;padding:0;list-style:none;display:flex}.navigatie-links li{margin:0}.navigatie-link{align-items:center;gap:var(--ruimte-2);padding:var(--ruimte-2) var(--ruimte-4);border-radius:var(--radius-md);color:var(--kleur-tekst-secundair);font-size:var(--tekst-sm);transition:all var(--overgang-snel);white-space:nowrap;font-weight:500;text-decoration:none;display:flex}.navigatie-link:hover{color:var(--kleur-tekst);background:var(--kleur-oppervlak);text-decoration:none}.navigatie-link.actief{color:var(--kleur-accent);background:var(--kleur-accent-glow)}.navigatie-streak{align-items:center;gap:var(--ruimte-2);padding:var(--ruimte-2) var(--ruimte-3);border-radius:var(--radius-vol);font-size:var(--tekst-sm);color:var(--kleur-waarschuwing);background:#ffaa001a;border:1px solid #fa03;font-weight:600;display:flex}.hamburger{cursor:pointer;padding:var(--ruimte-2);background:0 0;border:none;flex-direction:column;gap:5px;display:none}.hamburger span{background:var(--kleur-tekst);width:24px;height:2px;transition:all var(--overgang-normaal);border-radius:2px}.hamburger.actief span:first-child{transform:translateY(7px)rotate(45deg)}.hamburger.actief span:nth-child(2){opacity:0}.hamburger.actief span:nth-child(3){transform:translateY(-7px)rotate(-45deg)}@media (width<=768px){.hamburger{display:flex}.navigatie-links{top:var(--nav-hoogte);background:var(--kleur-achtergrond);padding:var(--ruimte-8) var(--ruimte-6);gap:var(--ruimte-2);transition:transform var(--overgang-normaal);flex-direction:column;position:fixed;bottom:0;left:0;right:0;transform:translate(100%)}.navigatie-links.open{transform:translate(0)}.navigatie-link{font-size:var(--tekst-lg);padding:var(--ruimte-4)}}.knop{justify-content:center;align-items:center;gap:var(--ruimte-2);padding:var(--ruimte-3) var(--ruimte-6);border-radius:var(--radius-md);font-family:var(--font-hoofd);font-size:var(--tekst-sm);cursor:pointer;transition:all var(--overgang-normaal);white-space:nowrap;border:none;font-weight:600;text-decoration:none;display:inline-flex}.knop:hover{text-decoration:none;transform:translateY(-2px)}.knop-primair{background:linear-gradient(135deg, var(--kleur-accent), var(--kleur-accent-dim));color:var(--kleur-achtergrond);box-shadow:0 4px 20px var(--kleur-accent-glow)}.knop-primair:hover{box-shadow:0 8px 30px var(--kleur-accent-glow-sterk);color:var(--kleur-achtergrond)}.knop-secundair{color:var(--kleur-tekst);border:1px solid var(--kleur-rand);background:0 0}.knop-secundair:hover{border-color:var(--kleur-accent);color:var(--kleur-accent);background:var(--kleur-accent-glow)}.knop-groot{padding:var(--ruimte-4) var(--ruimte-8);font-size:var(--tekst-base);border-radius:var(--radius-lg)}.knop-klein{padding:var(--ruimte-2) var(--ruimte-4);font-size:var(--tekst-xs)}.kaart{background:var(--kleur-oppervlak);border:1px solid var(--kleur-rand);border-radius:var(--radius-xl);padding:var(--ruimte-8);transition:all var(--overgang-normaal);position:relative;overflow:hidden}.kaart:hover{border-color:var(--kleur-rand-licht);box-shadow:var(--schaduw-lg);transform:translateY(-4px)}.kaart-glas{-webkit-backdrop-filter:blur(12px);background:#12122a99;border:1px solid #ffffff0d}.kaart-glow:hover{border-color:var(--kleur-accent);box-shadow:var(--schaduw-glow)}.kaart-icoon{border-radius:var(--radius-lg);width:56px;height:56px;font-size:var(--tekst-2xl);margin-bottom:var(--ruimte-5);background:var(--kleur-accent-glow);border:1px solid #00ff881a;justify-content:center;align-items:center;display:flex}.kaart-titel{font-size:var(--tekst-xl);margin-bottom:var(--ruimte-3);color:var(--kleur-tekst);font-weight:700}.kaart-beschrijving{color:var(--kleur-tekst-secundair);font-size:var(--tekst-sm);margin-bottom:0;line-height:1.7}.badge{align-items:center;gap:var(--ruimte-1);padding:var(--ruimte-1) var(--ruimte-3);border-radius:var(--radius-vol);font-size:var(--tekst-xs);text-transform:uppercase;letter-spacing:.05em;font-weight:600;display:inline-flex}.badge-beginner{color:var(--kleur-beginner);background:#00ff881a;border:1px solid #0f83}.badge-intermediate{color:var(--kleur-intermediate);background:#ffaa001a;border:1px solid #fa03}.badge-advanced{color:var(--kleur-advanced);background:#ff44661a;border:1px solid #f463}.voortgangsbalk{background:var(--kleur-oppervlak);border-radius:var(--radius-vol);width:100%;height:8px;position:relative;overflow:hidden}.voortgangsbalk-vulling{background:linear-gradient(90deg, var(--kleur-accent), var(--kleur-accent-3));border-radius:var(--radius-vol);height:100%;transition:width var(--overgang-langzaam);position:relative}.voortgangsbalk-vulling:after{content:"";filter:blur(4px);background:#ffffff4d;width:20px;animation:2s infinite voortgang-glans;position:absolute;top:0;bottom:0;right:0}@keyframes voortgang-glans{0%,to{opacity:0}50%{opacity:1}}.terminal{background:var(--kleur-achtergrond-2);border:1px solid var(--kleur-rand);border-radius:var(--radius-lg);margin-bottom:var(--ruimte-6);overflow:hidden}.terminal-header{align-items:center;gap:var(--ruimte-2);padding:var(--ruimte-3) var(--ruimte-4);background:var(--kleur-oppervlak);border-bottom:1px solid var(--kleur-rand);display:flex}.terminal-dot{border-radius:50%;width:12px;height:12px}.terminal-dot.rood{background:#ff5f56}.terminal-dot.geel{background:#ffbd2e}.terminal-dot.groen{background:#27c93f}.terminal-titel{font-family:var(--font-code);font-size:var(--tekst-xs);color:var(--kleur-tekst-dim);margin-left:var(--ruimte-3);margin-bottom:0}.terminal-body{padding:var(--ruimte-5);font-family:var(--font-code);font-size:var(--tekst-sm);color:var(--kleur-accent);line-height:1.8}.terminal-body .prompt{color:var(--kleur-accent-3)}.terminal-body .commando{color:var(--kleur-tekst)}.terminal-body .uitvoer{color:var(--kleur-tekst-dim)}.footer{background:var(--kleur-achtergrond-2);border-top:1px solid var(--kleur-rand);padding:var(--ruimte-16) 0 var(--ruimte-8);margin-top:var(--ruimte-24)}.footer-grid{gap:var(--ruimte-12);margin-bottom:var(--ruimte-12);grid-template-columns:2fr 1fr 1fr 1fr;display:grid}.footer-merk h3{font-size:var(--tekst-xl);margin-bottom:var(--ruimte-4)}.footer-merk p{font-size:var(--tekst-sm);color:var(--kleur-tekst-dim);max-width:300px}.footer-kolom h4{font-size:var(--tekst-sm);text-transform:uppercase;letter-spacing:.1em;color:var(--kleur-tekst-dim);margin-bottom:var(--ruimte-5)}.footer-kolom ul{padding:0;list-style:none}.footer-kolom li{margin-bottom:var(--ruimte-3)}.footer-kolom a{color:var(--kleur-tekst-secundair);font-size:var(--tekst-sm);transition:color var(--overgang-snel)}.footer-kolom a:hover{color:var(--kleur-accent);text-decoration:none}.footer-onder{padding-top:var(--ruimte-8);border-top:1px solid var(--kleur-rand);font-size:var(--tekst-sm);color:var(--kleur-tekst-dim);justify-content:space-between;align-items:center;display:flex}@media (width<=768px){.footer-grid{gap:var(--ruimte-8);grid-template-columns:1fr}.footer-onder{gap:var(--ruimte-4);text-align:center;flex-direction:column}}.module-kaart{background:var(--kleur-oppervlak);border:1px solid var(--kleur-rand);border-radius:var(--radius-xl);padding:var(--ruimte-6);transition:all var(--overgang-normaal);color:inherit;flex-direction:column;text-decoration:none;display:flex;position:relative;overflow:hidden}.module-kaart:hover{border-color:var(--kleur-accent);box-shadow:var(--schaduw-glow);color:inherit;text-decoration:none;transform:translateY(-4px)}.module-kaart-header{margin-bottom:var(--ruimte-4);justify-content:space-between;align-items:center;display:flex}.module-nummer{font-family:var(--font-code);font-size:var(--tekst-xs);color:var(--kleur-tekst-dim);font-weight:600}.module-kaart h3{font-size:var(--tekst-lg);margin-bottom:var(--ruimte-3)}.module-kaart p{font-size:var(--tekst-sm);color:var(--kleur-tekst-dim);flex:1}.module-kaart-footer{margin-top:var(--ruimte-4);padding-top:var(--ruimte-4);border-top:1px solid var(--kleur-rand);justify-content:space-between;align-items:center;display:flex}.module-duur{font-size:var(--tekst-xs);color:var(--kleur-tekst-dim);align-items:center;gap:var(--ruimte-1);display:flex}.sectie-header{text-align:center;margin-bottom:var(--ruimte-16)}.sectie-header .sectie-label{align-items:center;gap:var(--ruimte-2);padding:var(--ruimte-2) var(--ruimte-4);background:var(--kleur-accent-glow);border-radius:var(--radius-vol);font-size:var(--tekst-xs);text-transform:uppercase;letter-spacing:.1em;color:var(--kleur-accent);margin-bottom:var(--ruimte-6);border:1px solid #00ff8826;font-weight:600;display:inline-flex}.sectie-header h2{font-size:var(--tekst-4xl);margin-bottom:var(--ruimte-4);font-weight:800}.sectie-header p{font-size:var(--tekst-lg);color:var(--kleur-tekst-dim);max-width:600px;margin:0 auto}.statistieken{gap:var(--ruimte-12);justify-content:center;display:flex}.statistiek{text-align:center}.statistiek-waarde{font-size:var(--tekst-4xl);color:var(--kleur-accent);margin-bottom:var(--ruimte-2);font-weight:800;line-height:1;display:block}.statistiek-label{font-size:var(--tekst-sm);color:var(--kleur-tekst-dim)}@media (width<=768px){.statistieken{gap:var(--ruimte-8);flex-wrap:wrap}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeInOmhoog{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInLinks{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}@keyframes fadeInRechts{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:translate(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.animeer{opacity:0;transition:opacity .6s,transform .6s;transform:translateY(30px)}.animeer.zichtbaar{opacity:1;transform:translateY(0)}.animeer-links{opacity:0;transition:opacity .6s,transform .6s;transform:translate(-40px)}.animeer-links.zichtbaar{opacity:1;transform:translate(0)}.animeer-rechts{opacity:0;transition:opacity .6s,transform .6s;transform:translate(40px)}.animeer-rechts.zichtbaar{opacity:1;transform:translate(0)}.vertraging-1{transition-delay:.1s}.vertraging-2{transition-delay:.2s}.vertraging-3{transition-delay:.3s}.vertraging-4{transition-delay:.4s}.vertraging-5{transition-delay:.5s}.vertraging-6{transition-delay:.6s}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes pulseGlow{0%,to{box-shadow:0 0 20px var(--kleur-accent-glow)}50%{box-shadow:0 0 40px var(--kleur-accent-glow-sterk)}}@keyframes zweven{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.zwevend{animation:3s ease-in-out infinite zweven}@keyframes typemachine{0%{width:0}to{width:100%}}@keyframes knipperCursor{0%,to{border-color:var(--kleur-accent)}50%{border-color:#0000}}.typemachine-tekst{white-space:nowrap;border-right:3px solid var(--kleur-accent);animation:3s steps(40,end) typemachine,.75s step-end infinite knipperCursor;display:inline-block;overflow:hidden}@keyframes gloeien{0%,to{text-shadow:0 0 10px var(--kleur-accent-glow), 0 0 20px var(--kleur-accent-glow), 0 0 40px var(--kleur-accent-glow)}50%{text-shadow:0 0 20px var(--kleur-accent-glow-sterk), 0 0 40px var(--kleur-accent-glow-sterk), 0 0 60px var(--kleur-accent-glow-sterk)}}.gloeiend{animation:2s ease-in-out infinite gloeien}.deeltjes-achtergrond{width:100%;height:100%;z-index:var(--z-achtergrond);pointer-events:none;position:fixed;top:0;left:0;overflow:hidden}.deeltjes-achtergrond canvas{width:100%;height:100%}.grid-achtergrond{z-index:var(--z-achtergrond);pointer-events:none;background-image:linear-gradient(#00ff8808 1px,#0000 1px),linear-gradient(90deg,#00ff8808 1px,#0000 1px);background-size:60px 60px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(80% 60% at 50% 0,#000 40%,#0000 100%);mask-image:radial-gradient(80% 60% at 50% 0,#000 40%,#0000 100%)}.glow-achtergrond{filter:blur(100px);pointer-events:none;z-index:var(--z-achtergrond);border-radius:50%;position:absolute}.glow-groen{background:radial-gradient(circle,#00ff881f,#0000 70%)}.glow-paars{background:radial-gradient(circle,#7c3aed1f,#0000 70%)}.glow-blauw{background:radial-gradient(circle,#00d4ff1f,#0000 70%)}@keyframes confetti-val{0%{opacity:1;transform:translateY(-100vh)rotate(0)}to{opacity:0;transform:translateY(100vh)rotate(720deg)}}.confetti-stuk{width:10px;height:10px;z-index:var(--z-overlay);pointer-events:none;animation:3s ease-in forwards confetti-val;position:fixed}@keyframes roteren{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.laden{border:3px solid var(--kleur-rand);border-top-color:var(--kleur-accent);border-radius:50%;width:40px;height:40px;animation:.8s linear infinite roteren}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.knop-primair:after{content:"";background:linear-gradient(90deg,#0000,#ffffff26,#0000);transition:none;position:absolute;inset:0;transform:translate(-100%)}.knop-primair{position:relative;overflow:hidden}.knop-primair:hover:after{animation:.6s shimmer}@keyframes telOp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes toastIn{0%{opacity:0;transform:translateY(20px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes toastUit{0%{opacity:1;transform:translateY(0)scale(1)}to{opacity:0;transform:translateY(-20px)scale(.95)}}.toast{bottom:var(--ruimte-8);right:var(--ruimte-8);padding:var(--ruimte-4) var(--ruimte-6);background:var(--kleur-oppervlak);border:1px solid var(--kleur-rand);border-radius:var(--radius-lg);box-shadow:var(--schaduw-xl);z-index:var(--z-overlay);align-items:center;gap:var(--ruimte-3);font-size:var(--tekst-sm);animation:.3s forwards toastIn;display:flex;position:fixed}.toast.verdwijnen{animation:.3s forwards toastUit}.toast-succes{border-color:var(--kleur-succes)}.toast-fout{border-color:var(--kleur-fout)}.toast-info{border-color:var(--kleur-info)}.hero{min-height:100vh;padding-top:var(--nav-hoogte);align-items:center;display:flex;position:relative;overflow:hidden}.hero-inner{z-index:var(--z-normaal);max-width:var(--max-breedte);padding:var(--ruimte-20) var(--ruimte-6);gap:var(--ruimte-16);grid-template-columns:1fr 1fr;align-items:center;margin:0 auto;display:grid;position:relative}.hero-content{animation:.8s fadeInOmhoog}.hero-badge{align-items:center;gap:var(--ruimte-2);padding:var(--ruimte-2) var(--ruimte-4);background:var(--kleur-accent-glow);border-radius:var(--radius-vol);font-size:var(--tekst-xs);color:var(--kleur-accent);text-transform:uppercase;letter-spacing:.08em;margin-bottom:var(--ruimte-8);border:1px solid #0f83;font-weight:600;display:inline-flex}.hero-badge .puls-dot{background:var(--kleur-accent);border-radius:50%;width:8px;height:8px;animation:2s ease-in-out infinite pulse}.hero h1{font-size:var(--tekst-6xl);margin-bottom:var(--ruimte-6);letter-spacing:-.03em;font-weight:900;line-height:1.05}.hero h1 .gradient-tekst{background:linear-gradient(135deg, var(--kleur-accent), var(--kleur-accent-3));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.hero-beschrijving{font-size:var(--tekst-xl);color:var(--kleur-tekst-secundair);margin-bottom:var(--ruimte-10);max-width:540px;line-height:1.7}.hero-acties{gap:var(--ruimte-4);margin-bottom:var(--ruimte-12);display:flex}.hero-stats{gap:var(--ruimte-10);display:flex}.hero-stat{flex-direction:column;display:flex}.hero-stat-waarde{font-size:var(--tekst-2xl);color:var(--kleur-tekst);font-weight:800}.hero-stat-label{font-size:var(--tekst-xs);color:var(--kleur-tekst-dim);text-transform:uppercase;letter-spacing:.05em}.hero-visueel{justify-content:center;align-items:center;animation:.8s .2s both fadeInRechts;display:flex}.hero-terminal{background:var(--kleur-achtergrond-2);border:1px solid var(--kleur-rand);border-radius:var(--radius-xl);width:100%;max-width:520px;box-shadow:var(--schaduw-xl);overflow:hidden}.hero-terminal .terminal-body{padding:var(--ruimte-6);min-height:280px}.hero-terminal .terminal-regel{margin-bottom:var(--ruimte-3);font-family:var(--font-code);font-size:var(--tekst-sm);gap:var(--ruimte-2);display:flex}.hero-glow-1{width:500px;height:500px;top:-100px;right:-100px}.hero-glow-2{width:400px;height:400px;bottom:-50px;left:-100px}@media (width<=1024px){.hero-inner{gap:var(--ruimte-12);text-align:center;grid-template-columns:1fr}.hero h1{font-size:var(--tekst-5xl)}.hero-beschrijving{margin:0 auto var(--ruimte-10)}.hero-acties,.hero-stats{justify-content:center}.hero-visueel{order:-1}.hero-terminal{max-width:480px}}@media (width<=768px){.hero h1{font-size:var(--tekst-4xl)}.hero-beschrijving{font-size:var(--tekst-lg)}.hero-acties{flex-direction:column;align-items:center}.hero-stats{gap:var(--ruimte-6);flex-wrap:wrap;justify-content:center}}.features{padding:var(--ruimte-24) 0;position:relative}.features-grid{gap:var(--ruimte-8);grid-template-columns:repeat(3,1fr);display:grid}.feature-kaart{padding:var(--ruimte-8);background:var(--kleur-oppervlak);border:1px solid var(--kleur-rand);border-radius:var(--radius-xl);transition:all var(--overgang-normaal)}.feature-kaart:hover{border-color:var(--kleur-accent);box-shadow:var(--schaduw-glow);transform:translateY(-4px)}.feature-icoon{border-radius:var(--radius-lg);width:64px;height:64px;font-size:var(--tekst-3xl);margin-bottom:var(--ruimte-6);justify-content:center;align-items:center;display:flex}.feature-icoon.groen{background:var(--kleur-accent-glow)}.feature-icoon.paars{background:var(--kleur-accent-2-glow)}.feature-icoon.blauw{background:var(--kleur-accent-3-glow)}.feature-kaart h3{font-size:var(--tekst-xl);margin-bottom:var(--ruimte-3)}.feature-kaart p{color:var(--kleur-tekst-dim);font-size:var(--tekst-sm);line-height:1.7}@media (width<=1024px){.features-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=768px){.features-grid{grid-template-columns:1fr}}.roadmap-preview{padding:var(--ruimte-24) 0;position:relative}.roadmap-tijdlijn{max-width:800px;margin:0 auto;position:relative}.roadmap-tijdlijn:before{content:"";background:linear-gradient(to bottom, var(--kleur-accent), var(--kleur-accent-2), var(--kleur-fout));width:2px;position:absolute;top:0;bottom:0;left:50%;transform:translate(-50%)}.roadmap-item{padding:var(--ruimte-8);width:45%;margin-bottom:var(--ruimte-8);position:relative}.roadmap-item:nth-child(odd){padding-left:var(--ruimte-10);margin-left:auto}.roadmap-item:nth-child(2n){padding-right:var(--ruimte-10);text-align:right;margin-right:auto}.roadmap-item:before{content:"";top:var(--ruimte-10);background:var(--kleur-achtergrond);border:3px solid var(--kleur-accent);z-index:2;border-radius:50%;width:16px;height:16px;position:absolute}.roadmap-item:nth-child(odd):before{left:-8px}.roadmap-item:nth-child(2n):before{right:-8px}.roadmap-item.intermediate:before{border-color:var(--kleur-waarschuwing)}.roadmap-item.advanced:before{border-color:var(--kleur-fout)}.roadmap-fase{font-size:var(--tekst-xs);text-transform:uppercase;letter-spacing:.1em;margin-bottom:var(--ruimte-2);font-weight:700}.roadmap-fase.beginner{color:var(--kleur-beginner)}.roadmap-fase.intermediate{color:var(--kleur-intermediate)}.roadmap-fase.advanced{color:var(--kleur-advanced)}.roadmap-item h3{font-size:var(--tekst-lg);margin-bottom:var(--ruimte-2)}.roadmap-item p{font-size:var(--tekst-sm);color:var(--kleur-tekst-dim);margin-bottom:0}@media (width<=768px){.roadmap-tijdlijn:before{left:20px}.roadmap-item,.roadmap-item:nth-child(odd),.roadmap-item:nth-child(2n){text-align:left;width:100%;margin-left:0;margin-right:0;padding-left:50px;padding-right:0}.roadmap-item:before,.roadmap-item:nth-child(odd):before,.roadmap-item:nth-child(2n):before{left:12px;right:auto}}.cta-sectie{padding:var(--ruimte-24) 0;text-align:center;position:relative}.cta-kaart{border-radius:var(--radius-2xl);padding:var(--ruimte-20) var(--ruimte-12);background:linear-gradient(135deg,#00ff880d,#7c3aed0d);border:1px solid #00ff8826;position:relative;overflow:hidden}.cta-kaart h2{font-size:var(--tekst-4xl);margin-bottom:var(--ruimte-4);font-weight:800}.cta-kaart p{font-size:var(--tekst-lg);color:var(--kleur-tekst-dim);max-width:500px;margin:0 auto var(--ruimte-10)}.modules-preview{padding:var(--ruimte-24) 0;position:relative}.modules-preview-grid{gap:var(--ruimte-6);grid-template-columns:repeat(auto-fill,minmax(300px,1fr));display:grid}.module-header{background:var(--kleur-oppervlak);border-bottom:1px solid var(--kleur-rand);padding:var(--ruimte-12) 0;margin-top:var(--nav-hoogte)}.module-meta{align-items:center;gap:var(--ruimte-4);margin-bottom:var(--ruimte-4);font-family:var(--font-code);font-size:var(--tekst-sm);color:var(--kleur-tekst-dim);display:flex}.module-content{gap:var(--ruimte-12);padding:var(--ruimte-12) 0;grid-template-columns:1fr 300px;display:grid}@media (width<=1024px){.module-content{grid-template-columns:1fr}}.artikel-body{color:var(--kleur-tekst-secundair);font-size:1.125rem;line-height:1.8}.artikel-body h2{font-size:var(--tekst-3xl);color:var(--kleur-tekst);margin:var(--ruimte-10) 0 var(--ruimte-4);padding-bottom:var(--ruimte-2);border-bottom:1px solid var(--kleur-rand)}.artikel-body h3{font-size:var(--tekst-xl);color:var(--kleur-tekst);margin:var(--ruimte-8) 0 var(--ruimte-3)}.artikel-body p{margin-bottom:var(--ruimte-6)}.artikel-body ul,.artikel-body ol{margin-bottom:var(--ruimte-6);padding-left:var(--ruimte-8)}.artikel-body li{margin-bottom:var(--ruimte-2)}.artikel-body strong{color:var(--kleur-tekst);font-weight:600}.info-blok{border-left:4px solid var(--kleur-info);padding:var(--ruimte-4) var(--ruimte-6);border-radius:0 var(--radius-md) var(--radius-md) 0;margin:var(--ruimte-8) 0;background:#00d4ff0d}.waarschuwing-blok{border-left:4px solid var(--kleur-waarschuwing);padding:var(--ruimte-4) var(--ruimte-6);border-radius:0 var(--radius-md) var(--radius-md) 0;margin:var(--ruimte-8) 0;background:#ffaa000d}.praktijk-lijst{margin:var(--ruimte-6) 0;padding:0;list-style:none}.praktijk-item{align-items:flex-start;gap:var(--ruimte-4);background:var(--kleur-achtergrond-2);border:1px solid var(--kleur-rand);padding:var(--ruimte-4);border-radius:var(--radius-md);margin-bottom:var(--ruimte-3);transition:background var(--overgang-snel);display:flex}.praktijk-item:hover{background:var(--kleur-oppervlak)}.checkbox-custom{appearance:none;border:2px solid var(--kleur-rand-licht);border-radius:var(--radius-sm);cursor:pointer;width:24px;height:24px;transition:all var(--overgang-snel);flex-shrink:0;margin-top:2px;position:relative}.checkbox-custom:checked{background:var(--kleur-accent);border-color:var(--kleur-accent)}.checkbox-custom:checked:after{content:"✓";color:var(--kleur-achtergrond);font-size:16px;font-weight:900;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.praktijk-tekst{color:var(--kleur-tekst)}.praktijk-tekst p{color:var(--kleur-tekst-secundair);font-size:var(--tekst-sm);margin:0}.quiz-container{background:var(--kleur-oppervlak);border:1px solid var(--kleur-rand);border-radius:var(--radius-xl);padding:var(--ruimte-8);margin:var(--ruimte-12) 0}.quiz-vraag{display:none}.quiz-vraag.actief{animation:.3s fadeIn;display:block}.quiz-opties{gap:var(--ruimte-3);margin:var(--ruimte-6) 0;flex-direction:column;display:flex}.quiz-optie{align-items:center;gap:var(--ruimte-3);padding:var(--ruimte-4);background:var(--kleur-achtergrond-2);border:1px solid var(--kleur-rand);border-radius:var(--radius-md);cursor:pointer;transition:all var(--overgang-snel);display:flex}.quiz-optie:hover{background:var(--kleur-oppervlak-hover);border-color:var(--kleur-rand-licht)}.quiz-optie.geselecteerd{border-color:var(--kleur-accent);background:var(--kleur-accent-glow)}.quiz-optie.goed{border-color:var(--kleur-succes);color:var(--kleur-succes);background:#00ff881a}.quiz-optie.fout{border-color:var(--kleur-fout);color:var(--kleur-fout);background:#ff44661a}.quiz-feedback{margin-top:var(--ruimte-4);padding:var(--ruimte-4);border-radius:var(--radius-md);display:none}.quiz-feedback.zichtbaar{display:block}.module-sidebar{top:calc(var(--nav-hoogte) + var(--ruimte-8));height:max-content;position:sticky}.sidebar-blok{background:var(--kleur-oppervlak);border:1px solid var(--kleur-rand);border-radius:var(--radius-lg);padding:var(--ruimte-6);margin-bottom:var(--ruimte-6)}.sidebar-blok h4{font-size:var(--tekst-sm);text-transform:uppercase;letter-spacing:.1em;color:var(--kleur-tekst-dim);margin-bottom:var(--ruimte-4)}.inhoudsopgave-lijst{margin:0;padding:0;list-style:none}.inhoudsopgave-lijst li{margin-bottom:var(--ruimte-2)}.inhoudsopgave-lijst a{color:var(--kleur-tekst-secundair);font-size:var(--tekst-sm);transition:color var(--overgang-snel)}.inhoudsopgave-lijst a:hover{color:var(--kleur-accent)}.interactieve-taak{background:var(--kleur-achtergrond-2);border:1px solid var(--kleur-rand);border-radius:var(--radius-lg);padding:var(--ruimte-6);margin:var(--ruimte-8) 0;box-shadow:inset 0 0 20px #00000080}.taak-header{align-items:center;gap:var(--ruimte-3);margin-bottom:var(--ruimte-4);font-family:var(--font-code);color:var(--kleur-tekst-dim);border-bottom:1px solid var(--kleur-rand-licht);padding-bottom:var(--ruimte-3);display:flex}.taak-header .dot{border-radius:50%;width:12px;height:12px}.taak-header .dot.rood{background:#ff5f56}.taak-header .dot.geel{background:#ffbd2e}.taak-header .dot.groen{background:#27c93f}.taak-vraag{color:var(--kleur-tekst);margin-bottom:var(--ruimte-4);font-weight:600}.terminal-input-wrapper{border-radius:var(--radius-sm);padding:var(--ruimte-3) var(--ruimte-4);font-family:var(--font-code);color:var(--kleur-accent);border:1px solid var(--kleur-rand);background:#000;align-items:center;display:flex}.terminal-input-wrapper .prompt{color:var(--kleur-tekst-dim);margin-right:var(--ruimte-2)}.terminal-input-veld{color:var(--kleur-tekst);font-family:var(--font-code);background:0 0;border:none;outline:none;width:100%;font-size:1rem}.terminal-input-veld::placeholder{color:var(--kleur-rand)}.taak-feedback{margin-top:var(--ruimte-4);padding:var(--ruimte-4);border-radius:var(--radius-sm);animation:.3s fadeIn;display:none}.taak-feedback.goed{border-left:4px solid var(--kleur-succes);color:var(--kleur-tekst);background:#00ff881a;display:block}.taak-feedback.fout{border-left:4px solid var(--kleur-fout);color:var(--kleur-tekst);background:#ff44661a;display:block}.shake{animation:.4s cubic-bezier(.36,.07,.19,.97) both shake}@keyframes shake{10%,90%{transform:translate(-1px)}20%,80%{transform:translate(2px)}30%,50%,70%{transform:translate(-4px)}40%,60%{transform:translate(4px)}}