@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap";
@theme{--color-primary-50: #faf5ff; --color-primary-100: #f3e8ff; --color-primary-200: #e9d5ff; --color-primary-300: #d8b4fe; --color-primary-400: #c084fc; --color-primary-500: #a855f7; --color-primary-600: #9333ea; --color-primary-700: #7c3aed; --color-primary-800: #6b21a8; --color-primary-900: #581c87;}*{box-sizing:border-box;margin:0;padding:0}body{color:#1f2937;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(#faf5ff 0%,#f3e8ff 30%,#fff 100%);min-height:100vh;font-family:Inter,-apple-system,BlinkMacSystemFont,system-ui,sans-serif}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:linear-gradient(#c084fc 0%,#a855f7 100%) padding-box padding-box;border:2px solid #0000;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:linear-gradient(#a855f7 0%,#9333ea 100%) padding-box padding-box}.doelgroep-dropdown::-webkit-scrollbar{width:12px}.doelgroep-dropdown::-webkit-scrollbar-track{background:#f3e8ff;border-radius:0 16px 16px 0}.doelgroep-dropdown::-webkit-scrollbar-thumb{background:linear-gradient(#c084fc 0%,#a855f7 100%);border:3px solid #f3e8ff;border-radius:10px}.doelgroep-dropdown::-webkit-scrollbar-thumb:hover{background:linear-gradient(#a855f7 0%,#9333ea 100%)}.doelgroep-categories{grid-template-columns:repeat(4,1fr);gap:10px;display:grid}.doelgroep-levels{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.doelgroep-levels-small{grid-template-columns:repeat(4,1fr);gap:10px;display:grid}.doelgroep-summary{flex-wrap:wrap;align-items:center;gap:8px;display:flex}@media (max-width:640px){.doelgroep-categories,.doelgroep-levels,.doelgroep-levels-small{grid-template-columns:repeat(2,1fr)}}.header-container{justify-content:space-between;align-items:center;gap:24px;max-width:1600px;margin:0 auto;padding:12px 24px;display:flex}.header-logo-text{display:block}.header-nav{flex:1;justify-content:center;gap:4px;display:flex}.header-nav-label{display:inline}@media (max-width:640px){.header-container{gap:12px;padding:10px 16px}.header-logo-text{display:none}.header-nav{flex:0;gap:6px}.header-nav-label{display:none}}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:none;box-shadow:0 0 0 3px #a855f74d}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes pulse-soft{0%,to{opacity:1}50%{opacity:.7}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}.animate-fadeIn{animation:.4s ease-out forwards fadeIn}.animate-slideUp{animation:.5s ease-out forwards slideUp}.animate-scaleIn{animation:.3s ease-out forwards scaleIn}.glass{-webkit-backdrop-filter:blur(20px);background:#ffffffd9;border:1px solid #fff9}.glass-subtle{-webkit-backdrop-filter:blur(12px);background:#fff9}.gradient-text{background:linear-gradient(135deg,#7c3aed 0%,#9333ea 50%,#6366f1 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.card-premium{background:#fff;border:1px solid #0000000a;border-radius:20px;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 1px 2px #00000005,0 4px 8px #00000005,0 8px 16px #00000005}.card-premium:hover{transform:translateY(-2px);box-shadow:0 2px 4px #00000005,0 8px 16px #0000000a,0 16px 32px #7c3aed14}.btn-premium{color:#fff;cursor:pointer;background:linear-gradient(135deg,#9333ea 0%,#7c3aed 50%,#6366f1 100%) 0 0/200% 200%;border:none;border-radius:12px;padding:12px 24px;font-size:.9375rem;font-weight:600;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 12px #9333ea4d,0 2px 4px #9333ea33}.btn-premium:hover{background-position:100% 0;transform:translateY(-1px);box-shadow:0 6px 20px #9333ea66,0 3px 6px #9333ea4d}.btn-premium:active{transform:translateY(0)}.selection-btn{cursor:pointer;background:#fff;border:2px solid #e5e7eb;border-radius:16px;padding:16px;transition:all .25s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.selection-btn:before{content:"";opacity:0;background:linear-gradient(135deg,#9333ea0d 0%,#6366f10d 100%);transition:opacity .25s;position:absolute;inset:0}.selection-btn:hover{border-color:#c084fc;box-shadow:0 4px 12px #9333ea1a}.selection-btn:hover:before{opacity:1}.selection-btn.selected{background:linear-gradient(135deg,#faf5ff 0%,#f3e8ff 100%);border-color:#9333ea;box-shadow:0 0 0 3px #9333ea1a,0 4px 12px #9333ea26}.input-premium{resize:none;background:#fff;border:2px solid #e5e7eb;border-radius:14px;width:100%;padding:14px 18px;font-size:.9375rem;transition:all .25s cubic-bezier(.4,0,.2,1)}.input-premium:hover{border-color:#d8b4fe}.input-premium:focus{border-color:#9333ea;outline:none;box-shadow:0 0 0 3px #9333ea1a}.input-premium::placeholder{color:#9ca3af}.section-purple{background:linear-gradient(135deg,#faf5ff 0%,#f3e8ff 100%);border-color:#e9d5ff}.section-amber{background:linear-gradient(135deg,#fffbeb 0%,#fef3c7 100%);border-color:#fde68a}.section-blue{background:linear-gradient(135deg,#eff6ff 0%,#dbeafe 100%);border-color:#bfdbfe}.section-pink{background:linear-gradient(135deg,#fdf2f8 0%,#fce7f3 100%);border-color:#fbcfe8}.section-green{background:linear-gradient(135deg,#ecfdf5 0%,#d1fae5 100%);border-color:#a7f3d0}.tooltip{position:relative}.tooltip:after{content:attr(data-tooltip);color:#fff;white-space:nowrap;opacity:0;pointer-events:none;background:#1f2937;border-radius:8px;padding:6px 12px;font-size:.75rem;font-weight:500;transition:all .2s;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%)scale(.9)}.tooltip:hover:after{opacity:1;transform:translate(-50%)scale(1)}.copy-success{animation:.5s pulse-soft}.hover-lift{transition:all .3s cubic-bezier(.4,0,.2,1)}.hover-lift:hover{transform:translateY(-4px);box-shadow:0 8px 25px #00000014,0 4px 12px #9333ea1a}.image-hover-zoom{position:relative;overflow:hidden}.image-hover-zoom:hover img{transform:scale(1.03)}.image-hover-zoom:hover .zoom-overlay{background:#0000004d!important}.image-hover-zoom:hover .zoom-icon{opacity:1!important;transform:scale(1)!important}.animate-spin{animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}