:root{--groen:#1e4d0a;--groen-licht:#4a9020;--groen-zacht:#c4d8a0;--donker:#0f1a0a;--surface:rgba(58,107,26,0.04);--rand:#dde8c8;--wit:#ffffff;--tekst:#1a2410;--licht:#f4f8ee;}
    *,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
    body{font-family:'DM Sans',-apple-system,BlinkMacSystemFont,sans-serif;background:var(--licht);color:var(--tekst);line-height:1.7;}
    .progress-bar{position:fixed;top:0;left:0;height:3px;background:var(--groen-licht);width:0%;z-index:200;transition:width 0.1s linear;}
    .nav{position:sticky;top:0;z-index:100;background:#1e4d0a;padding:0 5%;height:64px;display:flex;align-items:center;justify-content:space-between;}
    .nav-logo{font-family:'DM Sans',sans-serif;font-size:1.4rem;font-weight:800;color:#ffffff;text-decoration:none;}
    .nav-logo span{color:#7dc94a;}
    .nav-links{display:flex;align-items:center;list-style:none;}
    .nav-links a{font-family:'DM Sans',sans-serif;color:#a8c490;text-decoration:none;font-size:0.88rem;margin-left:1.8rem;transition:color 0.2s;}
    .nav-links a:hover,.nav-links a.nav-active{color:#ffffff;}
    .hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:none;padding:4px;}
    .hamburger span{display:block;width:24px;height:2px;background:white;border-radius:2px;transition:all 0.3s;}
    .hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
    .hamburger.open span:nth-child(2){opacity:0;}
    .hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
    @media(max-width:680px){.hamburger{display:flex;}.nav-links{display:none;position:absolute;top:64px;left:0;right:0;background:#1e4d0a;flex-direction:column;padding:1.5rem 5% 2rem;gap:0.2rem;border-top:1px solid rgba(255,255,255,0.1);}.nav-links.open{display:flex;}.nav-links a{margin-left:0;padding:0.7rem 0;font-size:1rem;}}
    .artikel{max-width:720px;margin:0 auto;padding:72px 6% 100px;background:#fff;border:1px solid var(--rand);border-radius:16px;box-shadow:0 4px 20px rgba(30,77,10,0.05);}
    @media(max-width:760px){.artikel{border-radius:0;border-left:none;border-right:none;box-shadow:none;}}
    .artikel p{font-size:1.05rem;line-height:1.85;color:#2a3a1a;margin-bottom:24px;}
    .artikel ul{margin:0 0 24px;padding-left:2px;list-style:none;}
    .artikel li{position:relative;font-size:1.05rem;line-height:1.7;color:#2a3a1a;padding-left:26px;margin-bottom:10px;}
    .artikel li::before{content:"";position:absolute;left:2px;top:11px;width:7px;height:7px;border-radius:50%;background:#4a9020;}
    .artikel strong{font-weight:700;color:#1a2e0a;}
    .artikel p.intro{font-size:1.15rem;line-height:1.8;font-weight:600;color:#1a2410;margin-bottom:40px;padding-bottom:40px;border-bottom:1px solid var(--rand);}
    .artikel h2{font-family:'DM Sans',-apple-system,sans-serif;font-size:1.65rem;font-weight:800;color:#1a2e0a;margin:60px 0 16px;letter-spacing:-0.8px;padding-left:18px;border-left:4px solid #4a9020;}
    .artikel blockquote{margin:40px 0;padding:28px 32px;background:#1e4d0a;border-radius:10px;border:none;}

    .artikel blockquote p{font-style:normal;font-family:'DM Sans',-apple-system,sans-serif;font-size:1.1rem;line-height:1.6;color:#ffffff;font-weight:700;margin:0;}
    .artikel blockquote a{color:#ffffff;text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px;}
    .terug-link{display:inline-flex;align-items:center;gap:8px;font-family:'DM Sans',sans-serif;font-size:0.88rem;font-weight:700;color:#3a7016;text-decoration:none;margin-top:48px;transition:gap 0.2s;}
    .terug-link:hover{gap:12px;}
    .artikel-afsluiter{margin-top:40px;padding-top:28px;border-top:1px solid var(--rand);color:rgba(26,46,10,0.82);font-size:0.95rem;line-height:1.75;}.artikel-afsluiter a{color:#3a7016;text-decoration:none;border-bottom:1px solid rgba(74,144,32,0.25);transition:border-color 0.2s;}.artikel-afsluiter a:hover{border-bottom-color:var(--groen-licht);}.lees-ook{margin-top:56px;padding-top:32px;border-top:1px solid var(--rand);}
    .lees-ook h3{font-family:'DM Sans',sans-serif;font-size:0.75rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:#3a7016;margin-bottom:16px;}
.lees-ook-links{display:flex;flex-direction:column;gap:8px;}
    .lees-ook-links a{font-family:'DM Sans',sans-serif;font-size:0.92rem;font-weight:600;color:var(--donker);text-decoration:none;padding:12px 16px;background:#fff;border-radius:8px;border:1px solid var(--rand);transition:border-color 0.2s,transform 0.15s;}
    .lees-ook-tijd{display:block;margin-top:4px;font-size:0.76rem;font-weight:500;color:#5a7048;}
.lees-ook-links a:hover{border-color:var(--groen-licht);transform:translateX(4px);}
    .artikel-hero{background:#1e4d0a;background:radial-gradient(circle at 84% 50%, rgba(125,201,74,0.16), transparent 46%), linear-gradient(115deg, #163807 0%, #1e4d0a 52%, #235810 100%);padding:52px 5% 60px;}
    .artikel-hero-inner{max-width:720px;margin:0 auto;}
    .artikel-tags{display:flex;align-items:center;gap:10px;margin-bottom:16px;}.artikel-hero .artikel-tag{font-family:'DM Mono',monospace;font-size:0.72rem;letter-spacing:3px;text-transform:uppercase;color:#7dc94a;opacity:1;}.d-badge{display:inline-flex;align-items:center;justify-content:center;padding:3px 10px;background:rgba(74,144,32,0.18);border:1px solid rgba(74,144,32,0.4);color:#7dc94a;font-family:'DM Sans',sans-serif;font-size:0.72rem;font-weight:800;border-radius:4px;letter-spacing:1px;}
    .artikel-subtitle{font-family:'DM Sans',sans-serif;font-size:1.15rem;font-weight:500;line-height:1.55;color:rgba(255,255,255,0.92);margin:-12px 0 9px;max-width:640px;}
    .artikel-hero h1{font-family:'DM Sans',sans-serif;font-size:clamp(1.8rem,4vw,2.8rem);font-weight:800;letter-spacing:-1px;color:#ffffff;line-height:1.1;margin-bottom:20px;}
    .artikel-hero .artikel-meta{font-family:'DM Mono',monospace;font-size:0.72rem;opacity:0.7;letter-spacing:1px;color:#ffffff;margin-bottom:0;padding-bottom:0;border-bottom:none;}
    .breadcrumb{font-size:0.7rem;font-family:'DM Mono',monospace;color:rgba(255,255,255,0.4);margin-bottom:20px;letter-spacing:0.5px;display:flex;align-items:center;gap:6px;}
    .breadcrumb a{color:rgba(255,255,255,0.65);text-decoration:none;transition:color 0.2s;}
    .breadcrumb a:hover{color:rgba(255,255,255,0.75);}
    .breadcrumb span{opacity:0.6;}
    .breadcrumb .breadcrumb-current{opacity:1;color:rgba(255,255,255,0.85);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;}
    .artikel-grafiek{margin:40px 0;padding:28px 24px 20px;background:var(--licht);border-radius:12px;border:1px solid var(--rand);}.artikel-grafiek figcaption{font-family:'DM Mono',monospace;font-size:0.69rem;letter-spacing:0.2px;color:#5a7048;margin-top:12px;text-align:center;}
    .skip-link{position:absolute;top:-40px;left:0;background:#1e4d0a;color:#fff;padding:8px 16px;font-size:0.9rem;font-weight:600;text-decoration:none;z-index:9999;border-radius:0 0 6px 0;transition:top 0.2s;}
    .skip-link:focus{top:0;}

/* ===== Component-stijlen (samengevoegd uit de losse artikelen) ===== */
/* --- Voorbeeld/scene-kader --- */
.artikel-voorbeeld{background:var(--surface);border:1px solid var(--rand);border-left:3px solid var(--groen-licht);border-radius:0 10px 10px 0;padding:20px 24px;margin:28px 0;}
.artikel-voorbeeld .voorbeeld-label{display:block;font-size:0.68rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:#3a7016;margin-bottom:9px;}
.artikel-voorbeeld p{margin:0;}
.artikel-voorbeeld p:last-child{margin-bottom:0;}
/* --- Inhoudsopgave (blog-toc) --- */
.blog-toc { background:#f5f8f2; border:1px solid #dde8cc; border-left:3px solid #4a9020; border-radius:8px; padding:18px 22px; margin:28px 0; }
.blog-toc .blog-toc-titel { font-family:'DM Mono',monospace; font-size:0.7rem; font-weight:500; letter-spacing:1.5px; text-transform:uppercase; color:#3a7016; margin:0 0 10px; }
.blog-toc ol { list-style:none; margin:0; padding:0; counter-reset:toc; }
.blog-toc li { margin:0 0 8px; counter-increment:toc; }
.blog-toc a { color:#1a2e0a; text-decoration:none; font-size:0.9rem; line-height:1.4; border-bottom:1px solid transparent; }
.blog-toc a::before { content:counter(toc) ". "; color:#4a9020; font-weight:700; }
.blog-toc a:hover { color:#3a7016; border-bottom-color:#3a7016; }
/* --- Samenvatting-kader --- */
.blog-samenvatting { background:#1e4d0a; border-radius:12px; padding:24px 28px; margin:40px 0 0; }
.blog-samenvatting .blog-samenvatting-titel { font-family:'DM Mono',monospace; font-size:0.7rem; font-weight:500; letter-spacing:1.5px; text-transform:uppercase; color:#bce589; margin:0 0 12px; }
.blog-samenvatting ul { margin:0; padding:0; list-style:none; }
.blog-samenvatting li { color:rgba(255,255,255,0.9); font-size:0.95rem; line-height:1.6; padding:5px 0 5px 28px; position:relative; }
.blog-samenvatting li strong { color:#fff; }
.blog-samenvatting li::before { content:"\2713"; position:absolute; left:0; top:5px; color:#bce589; font-weight:700; font-size:1rem; line-height:1.6; }
/* --- Maturity-tabel --- */
.tabel-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:32px 0;}
.maturity-tabel{width:100%;min-width:440px;border-collapse:collapse;margin:0;font-size:0.92rem;}
.maturity-tabel th{background:#1e4d0a;color:#fff;font-weight:700;padding:10px 14px;text-align:left;font-size:0.8rem;letter-spacing:0.5px;}
.maturity-tabel td{padding:10px 14px;border-bottom:1px solid var(--rand);vertical-align:top;line-height:1.6;color:#2a3a1a;}
.maturity-tabel tr:last-child td{border-bottom:none;}
.maturity-tabel tr:nth-child(even) td{background:#f9fbf6;}
.niveau-label{display:inline-block;font-size:0.72rem;font-weight:800;padding:2px 8px;border-radius:4px;letter-spacing:0.5px;}
.niveau-starter{background:#fef3c7;color:#92400e;}
.niveau-groeiend{background:#dbeafe;color:#1e40af;}
.niveau-bekwaam{background:#d1fae5;color:#065f46;}
.niveau-gevorderd{background:#ede9fe;color:#5b21b6;}

/* Bodem-schema (energie-is-je-bodem): blokken op een basisbalk.
   Bewust HTML i.p.v. SVG, zodat de tekst niet meeschaalt met de breedte
   en ook op mobiel leesbaar blijft. */
.bodem-schema{max-width:520px;margin:0 auto;}
.bodem-blokken{display:flex;gap:8px;}
.bodem-blokken span{flex:1;background:#8fbf63;color:#0a1a04;font-family:'DM Sans',sans-serif;font-size:0.85rem;font-weight:700;line-height:1.3;text-align:center;padding:10px 6px;border-radius:4px;}
.bodem-basis{margin:6px 0 0;background:#1e4d0a;color:#ffffff;font-family:'DM Sans',sans-serif;font-size:0.85rem;font-weight:700;letter-spacing:3px;text-align:center;padding:11px 6px;border-radius:4px;}
.bodem-onder{margin:10px 0 0;font-family:'DM Sans',sans-serif;font-size:0.8rem;color:#5a7048;text-align:center;line-height:1.4;}
@media(max-width:430px){.bodem-blokken{gap:6px;}.bodem-blokken span{font-size:0.78rem;padding:9px 3px;}.bodem-basis{letter-spacing:2px;}}

/* Deel-knoppen: op muisbreedte compact, op touch minstens 44px hoog (WCAG). */
@media(max-width:740px){.deel-blok .ds-kanaal,.deel-blok #ds-deel-native{min-height:44px;}}
