/* AI in het onderwijs — Editorial Notebook, article edition */
:root{--paper:#f6f7f6;--ink:#182e46;--body:#3c5062;--primary:#30476f;--trace:#a3afba;--terminal:#65788b;--muted:#606f7d;--accent:#354783;--rule:#d3d9de;--wash:#e9edf0;--warm:#e6eaf0}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased}
::selection{background:#dbe2e9;color:var(--ink)}
a{color:inherit;text-underline-offset:4px}
a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
button{font:inherit;cursor:pointer}
.frame{overflow:hidden;position:relative;min-height:100vh}
.wrap{width:min(1160px,calc(100% - 100px));margin-inline:auto}
.circuit-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1;overflow:visible}
.circuit-canvas .wire,.mobile-circuit .wire{fill:none;stroke:var(--trace);stroke-width:1.7;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
.circuit-canvas .terminal,.mobile-circuit .terminal{fill:var(--paper);stroke:var(--terminal);stroke-width:1.7;vector-effect:non-scaling-stroke}
.circuit-canvas .node,.mobile-circuit .node{fill:var(--terminal)}
.site-header{height:246px;padding-top:26px;display:flex;justify-content:space-between;align-items:flex-start;position:relative;z-index:2}
.brand{width:295px;display:block;text-decoration:none;z-index:3;position:relative}
.brand-svg{display:block;width:282px;height:auto;overflow:visible}
.brand-svg .ai_letters_style{fill:var(--primary)}
.brand-svg .onderwijs_style{fill:var(--ink)}
.brand-svg .circuitlijn{fill:none;stroke:var(--primary);stroke-width:3.2;stroke-linejoin:round;stroke-linecap:round}
.brand-svg .circuitgaatje{fill:var(--paper);stroke:var(--primary);stroke-width:3.2}
.brand-caption{font-size:var(--text-caption);line-height:1.4;display:block;margin:0 0 0 9px;color:var(--muted)}
.primary-nav{display:flex;align-items:center;gap:31px;padding-top:16px}
.primary-nav a{font-size:var(--text-ui);font-weight:500;text-decoration:none;transition:color .2s ease}
.primary-nav a:hover,.back-link:hover,.text-link:hover{color:var(--accent)}
.primary-nav a[aria-current="page"]{border-bottom:1px solid var(--ink);padding-bottom:5px}
.article-grid{display:grid;grid-template-columns:minmax(0,715px) minmax(220px,290px);column-gap:clamp(70px,8vw,155px);align-items:start;position:relative;z-index:2;padding-bottom:118px}
.article-main{min-width:0}
.back-link{display:inline-flex;align-items:center;gap:12px;text-decoration:none;font-size:var(--text-meta);letter-spacing:.025em;font-weight:600;color:var(--accent);margin-bottom:39px}
.back-link svg{width:17px;height:17px;stroke:currentColor}
.article-head{margin-bottom:44px}
.meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;color:var(--muted);font-size:var(--text-meta);letter-spacing:.02em;margin:0 0 24px}
.meta .kind{font-weight:650;color:var(--accent)}
.meta .sep{height:3px;width:3px;border-radius:50%;background:#a3afba}
h1,h2,h3{font-family:'EB Garamond',Georgia,serif;font-weight:400}
h1{font-size:clamp(48.8px,5.16vw,72px);line-height:.99;letter-spacing:-.03em;max-width:15ch;margin:0 0 26px;text-wrap:balance}
.subtitle{font-family:'EB Garamond',Georgia,serif;font-size:var(--text-lead);line-height:1.36;letter-spacing:-.005em;color:var(--primary);max-width:26em;margin:0}
.article-body{max-width:675px}
.article-body p{font-family:'EB Garamond',Georgia,serif;font-size:var(--text-body);line-height:1.55;letter-spacing:-.002em;margin:0 0 23px;color:var(--body)}
.article-body strong{font-weight:600;color:var(--ink)}
.article-body h2{font-size:var(--text-section);line-height:1.12;letter-spacing:-.025em;margin:48px 0 16px;scroll-margin-top:22px}
.article-body h3{font-size:var(--text-subheading);line-height:1.15;margin:35px 0 14px}
.article-body ul{font-family:'EB Garamond',Georgia,serif;font-size:var(--text-body);line-height:1.5;padding-left:26px;color:var(--body);margin:0 0 28px}
.article-body li{padding-left:5px;margin-bottom:9px}
.article-body li::marker{color:#65788b}
.article-body a{color:var(--primary)}
.note{margin:39px 0 41px;padding:25px 28px 21px;border-top:1px solid var(--terminal);border-bottom:1px solid var(--rule);background:var(--wash)}
.note-label{color:var(--accent);font-family:Inter,system-ui,sans-serif;font-size:var(--text-meta);letter-spacing:.11em;text-transform:uppercase;font-weight:700;display:block;margin-bottom:12px}
.note p{font-size:var(--text-body);line-height:1.5;margin:0 0 14px}
.note p:last-child{margin-bottom:0}
.question-list{list-style:none!important;padding:0!important;margin:14px 0 0!important;counter-reset:check}
.question-list li{display:flex;align-items:baseline;gap:13px;padding:0!important;margin-bottom:10px!important;font-size:var(--text-body)}
.question-list li:before{counter-increment:check;content:counter(check);font:600 11px Inter,system-ui,sans-serif;color:var(--accent);min-width:16px}
.article-end{padding:33px 0 0;margin-top:50px;border-top:1px solid var(--rule)}
.article-end p{font-size:var(--text-ui);color:var(--muted);line-height:1.65;margin:0 0 19px}
.text-link{color:var(--accent);font-size:var(--text-ui);font-weight:600;text-decoration:none;border-bottom:1px solid #65788b;padding-bottom:5px}
.sidebar{position:relative;padding:103px 0 0 50px;min-width:0}
.sidebar-content{position:sticky;top:42px}
.side-heading{font-family:'EB Garamond',Georgia,serif;font-size:var(--text-section);line-height:1.08;letter-spacing:-.01em;margin:0 0 13px}
.side-description{font-size:var(--text-ui);line-height:1.7;color:var(--muted);max-width:26ch;margin:0 0 35px}
.side-links{padding:0;margin:0;list-style:none}
.side-links li{margin:0 0 28px;padding:0;position:relative}
.side-links a{display:block;color:var(--ink);font-family:'EB Garamond',Georgia,serif;font-size:var(--text-body);line-height:1.17;text-decoration:none;transition:color .16s}
.side-links a:hover,.side-links a.is-active{color:var(--accent)}
.side-links .reading-label{display:block;font-size:var(--text-meta);letter-spacing:.06em;margin-bottom:7px;color:var(--muted);font-family:Inter,system-ui,sans-serif}
.mobile-circuit,.mobile-toc{display:none}
.mobile-toc{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);margin:0 0 35px;padding:14px 0}
.mobile-toc summary{display:flex;justify-content:space-between;align-items:center;cursor:pointer;list-style:none;font:400 var(--text-subheading)/1.25 'EB Garamond',Georgia,serif;color:var(--primary)}
.mobile-toc summary::-webkit-details-marker{display:none}
.mobile-toc summary::after{content:'+';font:300 23px/1 Inter,system-ui,sans-serif;color:var(--accent)}
.mobile-toc details[open] summary::after{content:'−'}
.mobile-toc ol{margin:16px 0 0;padding-left:21px;color:var(--muted)}
.mobile-toc li{margin:0 0 12px;font-size:var(--text-ui);line-height:1.45;padding-left:4px}
.mobile-toc a{color:var(--primary);text-decoration:none;border-bottom:1px solid var(--trace)}
.footer{position:relative;z-index:2;border-top:1px solid var(--rule);padding:29px 0 37px;display:flex;justify-content:space-between;gap:24px;font-size:var(--text-meta);color:var(--muted)}
.footer a{color:var(--primary)}
.example-banner{position:relative;z-index:2;display:inline-block;padding:7px 12px;margin:0 0 10px;background:#e6eaf0;color:#354783;font-size:var(--text-meta);letter-spacing:.015em}
.long .article-grid{padding-bottom:130px}
.long .article-body blockquote{margin:41px 0 41px;padding:4px 0 4px 22px;border-left:1px solid var(--terminal);font:italic var(--text-lead)/1.45 'EB Garamond',Georgia,serif;color:var(--primary)}
@media(max-width:990px){.wrap{width:calc(100% - 70px)}.article-grid{grid-template-columns:minmax(0,1.9fr) minmax(190px,1fr);gap:65px}.sidebar{padding-left:41px}.site-header{height:230px}.article-body p{font-size:var(--text-body)}h1{font-size:clamp(48px,5.2vw,60.8px)}}
@media(max-width:720px){
 .wrap{width:calc(100% - 42px)}.site-header{height:auto;padding:17px 0 54px;display:block}
 .brand{width:253px;max-width:100%}.brand-svg{width:min(253px,100%)}.brand-caption{font-size:var(--text-caption);margin-top:-1px}
 .primary-nav{border-top:1px solid var(--rule);padding:16px 0 0;margin-top:28px;gap:25px}.primary-nav a{font-size:var(--text-ui)}
 .circuit-canvas{display:none}.article-grid{display:block;padding-bottom:83px}.back-link{margin-bottom:30px}.article-head{margin-bottom:33px}
 h1{font-size:clamp(43.2px,10.64vw,61.6px)}.subtitle{font-size:var(--text-lead)}.article-body p{font-size:var(--text-body);line-height:1.55}
 .article-body h2{font-size:var(--text-section);margin:48px 0 17px}.article-body h3{font-size:var(--text-subheading)}.article-body ul{font-size:var(--text-body)}
 .note{padding:24px 21px;margin:35px 0}.question-list li{font-size:21px}.long .mobile-toc{display:block}.long .sidebar{display:none}.sidebar{border-top:1px solid var(--rule);margin-top:70px;padding:31px 0 0 47px}
 .sidebar-content{position:static}.side-heading{font-size:var(--text-section)}.side-description{margin-bottom:31px}.side-links li{margin-bottom:25px}.side-links a{font-size:var(--text-body)}
 .mobile-circuit{display:block;position:absolute;left:3px;top:40px;width:36px;height:calc(100% - 75px);overflow:visible}
 .footer{flex-direction:column;gap:10px;padding:26px 0}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.side-links a,.primary-nav a{transition:none}}
@media print{.circuit-canvas,.mobile-circuit,.sidebar,.primary-nav,.back-link,.footer,.example-banner{display:none!important}.site-header{height:120px}.brand-svg{width:180px}.article-grid{display:block}.article-main{max-width:100%}.wrap{width:100%}body{background:white}.article-body p{font-size:14pt}h1{font-size:33.6pt}}