/* House style from curriculumontwerp.nl. Shared by scan, introduction and announcement. */
:root {
--bg: #f8faff;
--surface: rgba(255, 255, 255, .78);
--surface-strong: rgba(255, 255, 255, .94);
--surface-accent: #f2f6ff;
--surface-soft: #fbfcff;
--text: #1d2433;
--muted: #6e6e75;
--line: rgba(110, 110, 117, .12);
--line-strong: rgba(110, 110, 117, .24);
--brand: #9fc3fa;
--brand-dark: #6f9ef0;
--brand-strong: #7faff7;
--brand-soft: rgba(159, 195, 250, .16);
--mint: #8de0c8;
--mint-soft: rgba(141, 224, 200, .18);
--amber: #faca8e;
--amber-soft: rgba(250, 202, 142, .2);
--purple: #c294f8;
--purple-soft: rgba(194, 148, 248, .18);
--rose: #fbb7b8;
--rose-soft: rgba(251, 183, 184, .22);
--pink: #ed80ee;
--shadow: 0 24px 80px rgba(64, 83, 135, .1);
--radius-xl: 32px;
--radius-lg: 24px;
--radius-md: 18px;
--max-width: 1180px;
--sticky-menu-offset: 5.35rem;
  --page: var(--bg); --panel: var(--surface); --ink: var(--text);
  --brand-border: rgba(159,195,250,.4); --section-soft: rgba(242,246,255,.65);
  --warm: #f2f1ef; --danger: #a53b4d; --danger-soft: #fff1f3;
  --ok: #28684c; --ok-soft: #edf8f2;
  --shadow-hover: 0 24px 60px rgba(64,83,135,.16);
  --radius: var(--radius-xl); --card-radius: var(--radius-md); --button-radius: .9rem;
  --font-editorial: "Vollkorn", Georgia, serif;
  --font-heading: "Plus Jakarta Sans", sans-serif;
  --font-ui: "Poppins", sans-serif; --font-body: "Poppins", sans-serif;
  --blue: #9fc3fa; --green: #8de0c8; --orange: #faca8e;
  --indigo: #6f88ff; --red: #fbb7b8;
}
* { box-sizing: border-box; }
body {margin:0;min-width:0;min-height:100vh;display:flex;flex-direction:column;font-family:Poppins,sans-serif;font-size:15px;font-weight:400;color:var(--text);background:radial-gradient(circle at top left,rgba(159,195,250,.28),transparent 22%),radial-gradient(circle at top right,rgba(141,224,200,.2),transparent 20%),radial-gradient(circle at bottom left,rgba(250,202,142,.18),transparent 22%),radial-gradient(circle at bottom right,rgba(194,148,248,.16),transparent 24%),radial-gradient(circle,rgba(110,110,117,.12) 1px,transparent 1px),linear-gradient(180deg,#ffffff 0%,var(--bg) 100%);background-size:auto,auto,auto,auto,20px 20px,auto;background-position:0 0,100% 0,0 100%,100% 100%,center center,0 0;line-height:1.7;}

.co-header { width: min(calc(100% - 2rem), var(--max-width)); margin: .7rem auto 0; }
.co-header-inner { display:flex; align-items:center; gap:1rem; min-height:76px; padding:.58rem .95rem; border:1px solid rgba(255,255,255,.72); border-radius:999px; background:rgba(255,255,255,.76); backdrop-filter:blur(24px); box-shadow:0 16px 50px rgba(100,121,173,.08); }
.co-brand { display:inline-flex; flex:0 0 auto; line-height:0; }
.co-brand img { display:block; width:clamp(10.8rem,17vw,14.2rem); height:auto; }
.co-tool-name { margin-left:clamp(1rem,4vw,4rem); font-size:16px; font-weight:500; color:#090d26; }
.co-header-actions { display:flex; align-items:center; gap:1rem; margin-left:auto; }
.co-back { color:var(--muted); font-size:14px; text-decoration:none; }
.co-back:hover { color:var(--text); }
.co-footer { width:min(calc(100% - 2rem),var(--max-width)); margin:3rem auto 0; padding:1.5rem 0 2rem; border-top:1px solid var(--line); display:flex; flex-wrap:wrap; justify-content:space-between; gap:1rem; color:var(--muted); font-size:.86rem; }
.co-footer a { color:inherit; text-decoration:none; }
.co-footer a:hover { color:var(--text); }
:where(a,button,input,summary):focus-visible { outline:3px solid #1e49bb; outline-offset:4px; }
@media(max-width:860px) {
 .co-header-inner { border-radius:28px; padding:.65rem .85rem; flex-wrap:wrap; gap:.6rem; }
 .co-brand img { width:clamp(9.8rem,48vw,12.4rem); }
 .co-tool-name { margin-left:0; font-size:14px; }
 .co-header-actions { gap:.6rem; }
 .co-back { display:none; }
}
@media(max-width:560px) {
 .co-header-inner { justify-content:space-between; }
 .co-tool-name { flex-basis:100%; order:3; padding:.5rem .25rem 0; border-top:1px solid var(--line); }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; animation:none!important; } }
