/* Geknipt papier: perzik grond met korrel, cirkels in de hoeken.
   De vormen zitten onder de inhoud en raken de tekst nooit. */
.knip {
    position: relative; overflow: hidden; margin: 30px 0;
    background: #fbe9e1; border-radius: 22px;
    padding: 34px 30px 58px; isolation: isolate;
}
.knip::after {
    content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='k'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .35 0 0 0 0 .25 0 0 0 0 .2 0 0 0 .2 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23k)'/%3E%3C/svg%3E");
}
.knip-vorm { position: absolute; z-index: 0; border-radius: 50%; filter: drop-shadow(0 3px 0 rgba(31,45,56,.12)); }
.knip-vorm.groot { width: 150px; height: 150px; top: -78px; right: -48px; background: #d9714a; }
.knip-vorm.klein { width: 74px; height: 74px; bottom: -30px; left: -22px; background: #7d8f7a; box-shadow: 0 0 0 7px #fbe9e1, 0 0 0 9px #2c3e4a; }
.knip-vorm.baan { border-radius: 0; width: 46%; height: 12px; top: 14px; left: -20px; background: #2c3e4a; transform: rotate(-3deg); }
.knip > :not(.knip-vorm) { position: relative; z-index: 1; }
.knip-kop { font-family: 'Space Grotesk', sans-serif; font-weight: 700; font-size: 1.15rem; color: var(--navy-deep, #1f2d38); margin: 0 0 18px; max-width: 30ch; }
.knip figcaption, .knip .knip-noot { font-size: .88rem; color: var(--slate, #5f7078); margin: 18px 0 0; max-width: 60ch; }
.knip-blad {
    background: #fff; border-radius: 16px; padding: 16px 16px 14px;
    box-shadow: 0 3px 0 rgba(31,45,56,.10);
}
.knip-blad b { font-family: 'Space Grotesk', sans-serif; display: block; font-size: 1.35rem; color: var(--navy-deep, #1f2d38); line-height: 1.2; }
.knip-blad span { display: block; font-size: .9rem; color: var(--slate, #5f7078); line-height: 1.45; margin-top: 4px; }
.knip-blad .knip-wie { font-family: 'Space Grotesk', sans-serif; font-size: .78rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: #a8452a; margin: 0 0 6px; }

/* De reis van een stuk */
.knip-reis { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: 10px; align-items: stretch; }
.knip-pijl { align-self: center; font-family: 'Space Grotesk', sans-serif; font-size: 1.6rem; font-weight: 700; color: #2c3e4a; }
.knip-blad.accent { background: #2c3e4a; }
.knip-blad.accent b { color: #fff; }
.knip-blad.accent span { color: #e3e9eb; }
.knip-blad.accent .knip-wie { color: #f0b98f; }

/* De marge als balk */
.knip-balk { display: flex; height: 54px; border-radius: 12px; overflow: hidden; box-shadow: 0 3px 0 rgba(31,45,56,.10); }
.knip-balk > div { display: flex; align-items: center; justify-content: center; color: #fff; font-family: 'Space Grotesk', sans-serif; font-weight: 700; font-size: 1rem; white-space: nowrap; }
.knip-balk .aankoop { flex: 500; background: #2c3e4a; }
.knip-balk .winst { flex: 330.58; background: #d9714a; }
.knip-balk .btw { flex: 69.42; background: repeating-linear-gradient(135deg, #a8452a 0 6px, #8f3a23 6px 12px); }
.knip-haak { display: flex; margin-top: 8px; }
.knip-haak .leeg { flex: 500; }
.knip-haak .marge { flex: 400; border: 2px solid #a8452a; border-top: 0; border-radius: 0 0 10px 10px; height: 12px; }
.knip-haak-tekst { display: flex; }
.knip-haak-tekst .leeg { flex: 500; }
.knip-haak-tekst .marge { flex: 400; text-align: center; font-family: 'Space Grotesk', sans-serif; font-weight: 700; color: #a8452a; font-size: .95rem; padding-top: 4px; }
.knip-legende { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 18px; }
.knip-legende .knip-blad { border-top: 8px solid #2c3e4a; }
.knip-legende .knip-blad.winst { border-top-color: #d9714a; }
.knip-legende .knip-blad.btw { border-top-color: #a8452a; }

/* Tijdlijn per land */
.knip-tijd { list-style: none; margin: 0; padding: 0 0 0 26px; position: relative; }
.knip-tijd::before { content: ""; position: absolute; left: 8px; top: 6px; bottom: 6px; width: 3px; background: #2c3e4a; border-radius: 2px; }
.knip-tijd li { position: relative; margin: 0 0 14px; }
.knip-tijd li::before { content: ""; position: absolute; left: -25px; top: 18px; width: 15px; height: 15px; border-radius: 50%; background: #d9714a; box-shadow: 0 0 0 3px #fbe9e1; }
.knip-tijd li.nooit::before { background: #7d8f7a; }
.knip-tijd li.termijn::before { background: #a8452a; }
.knip-vlaggen { display: inline-flex; gap: 6px; margin-bottom: 6px; }
.knip-vlaggen i { font-style: normal; font-family: 'IBM Plex Mono', monospace; font-size: .75rem; font-weight: 600; background: #fbe9e1; color: var(--navy-deep, #1f2d38); border-radius: 6px; padding: 2px 7px; }

@media (max-width: 640px) {
    .knip { padding: 30px 18px 56px; }
    .knip-vorm.groot { width: 110px; height: 110px; top: -66px; right: -44px; }
    .knip-reis { grid-template-columns: 1fr; }
    .knip-pijl { justify-self: center; transform: rotate(90deg); line-height: 1; }
    .knip-legende { grid-template-columns: 1fr; }
    .knip-balk > div { font-size: .85rem; }
}

/* Batch D: rij van kaarten, ja/nee-keuze, afvinklijst, getekend etiket en QR-maat.
   Gebruikt op stocklijst, jaarlijkse-inventaris, rekeningenschema-belgie/-vk,
   op-de-markt-staan, wettelijke-garantie-tweedehands en etiketten-printen. */
.knip.ruim { padding-bottom: 78px; }
.knip-rij { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.knip-rij.twee { grid-template-columns: repeat(2, 1fr); }
.knip-rij.vier { grid-template-columns: repeat(4, 1fr); }
.knip-rij .knip-blad { border-top: 8px solid #2c3e4a; }
.knip-rij .knip-blad.terra { border-top-color: #d9714a; }
.knip-rij .knip-blad.roest { border-top-color: #a8452a; }
.knip-rij .knip-blad.salie { border-top-color: #7d8f7a; }
.knip-rij .knip-blad.accent { border-top-color: #d9714a; }
.knip-blad b.knip-klein { font-size: 1.05rem; }
.knip .knip-tag { display: inline-block; font-family: 'IBM Plex Mono', monospace; font-size: .72rem; font-weight: 600; line-height: 1.5; letter-spacing: .02em; border-radius: 6px; padding: 2px 8px; margin: 0 0 8px; background: #fbe9e1; color: #1f2d38; }
.knip .knip-tag.moet { background: #a8452a; color: #fff; }
.knip .knip-tag.mag { background: #5e6f5b; color: #fff; }

/* Ja/nee-keuze: een vraag, een vork, twee takken */
.knip-keuze { max-width: 660px; margin: 0 auto; }
.knip-keuze > .knip-blad { text-align: center; }
.knip-vork { position: relative; height: 34px; }
.knip-vork::before { content: ""; position: absolute; left: 50%; top: 0; width: 3px; height: 14px; margin-left: -1.5px; background: #2c3e4a; }
.knip-vork::after { content: ""; position: absolute; left: 25%; right: 25%; top: 14px; height: 20px; border: 3px solid #2c3e4a; border-bottom: 0; border-radius: 10px 10px 0 0; }
.knip-takken { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.knip-tak { display: flex; flex-direction: column; align-items: center; }
.knip-tak > .knip-blad { width: 100%; flex: 1; }
.knip-tak-wat { font-family: 'IBM Plex Mono', monospace; font-weight: 600; font-size: .8rem; background: #2c3e4a; color: #fff; border-radius: 14px; padding: 3px 14px; margin-bottom: 8px; text-align: center; line-height: 1.5; max-width: 100%; }
.knip-tak.ja .knip-tak-wat { background: #a8452a; }
.knip-tak.nee .knip-tak-wat { background: #5e6f5b; }

/* Afvinklijst op een wit blad */
.knip-lijst { list-style: none; margin: 0; padding: 14px 20px; background: #fff; border-radius: 16px; box-shadow: 0 3px 0 rgba(31,45,56,.10); counter-reset: knipnr; }
.knip-lijst li { counter-increment: knipnr; position: relative; padding: 10px 0 10px 44px; border-bottom: 2px dashed #c49a86; font-size: .95rem; line-height: 1.45; color: var(--navy-deep, #1f2d38); }
.knip-lijst li:last-child { border-bottom: 0; }
.knip-lijst li::before { content: counter(knipnr); position: absolute; left: 0; top: 8px; width: 28px; height: 28px; border-radius: 50%; background: #d9714a; color: #fff; font-family: 'Space Grotesk', sans-serif; font-weight: 700; font-size: .9rem; display: flex; align-items: center; justify-content: center; }
.knip-lijst li b { font-family: 'Space Grotesk', sans-serif; }

/* Een getekend etiket met uitleg ernaast */
.knip-etiket-rij { display: grid; grid-template-columns: minmax(220px, 280px) 1fr; gap: 26px; align-items: center; }
.knip-etiket { position: relative; background: #fff; border-radius: 10px; padding: 18px 84px 16px 32px; min-height: 92px; box-shadow: 0 4px 0 rgba(31,45,56,.14); transform: rotate(-2deg); }
.knip-etiket::before { content: ""; position: absolute; left: 11px; top: 50%; width: 10px; height: 10px; margin-top: -5px; border-radius: 50%; background: #fbe9e1; box-shadow: inset 0 0 0 2px #2c3e4a; }
.knip-etiket .prijs { font-family: 'Space Grotesk', sans-serif; font-weight: 700; font-size: 2rem; color: #1f2d38; line-height: 1; display: block; }
.knip-etiket .nr { font-family: 'IBM Plex Mono', monospace; font-size: .85rem; color: #2c3e4a; margin-top: 8px; display: block; }
.knip-etiket .extra { font-size: .82rem; color: #5f7078; margin-top: 4px; display: block; }
.knip-etiket .qr { position: absolute; right: 16px; top: 18px; width: 56px; height: 56px; border-radius: 3px; box-shadow: 0 0 0 3px #fff, 0 0 0 5px #2c3e4a;
    background: repeating-conic-gradient(#2c3e4a 0 25%, #fff 0 50%) 0 0 / 14px 14px; }
.knip-uitleg { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.knip-uitleg li { background: #fff; border-radius: 12px; padding: 10px 14px; box-shadow: 0 3px 0 rgba(31,45,56,.10); font-size: .92rem; line-height: 1.45; color: var(--slate, #5f7078); }
.knip-uitleg li b { font-family: 'Space Grotesk', sans-serif; color: var(--navy-deep, #1f2d38); }
.knip-uitleg li .knip-tag { margin: 0 8px 0 0; }

/* QR-maat: twee vierkantjes in de juiste verhouding (10 en 25 mm) */
.knip-maat { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.knip-maat .knip-blad { display: flex; gap: 18px; align-items: center; }
.knip-maat .vak { flex: none; border-radius: 3px; background: repeating-conic-gradient(#2c3e4a 0 25%, #fff 0 50%) 0 0 / 20px 20px; box-shadow: 0 0 0 3px #2c3e4a; }
.knip-maat .vak.groot { width: 100px; height: 100px; }
.knip-maat .vak.klein { width: 40px; height: 40px; background-size: 8px 8px; opacity: .55; }
.knip-maat .vak.fijn { width: 100px; height: 100px; background-size: 7px 7px; }

@media (max-width: 900px) {
    .knip-rij.vier { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
    .knip-rij, .knip-rij.twee, .knip-maat { grid-template-columns: 1fr; }
    .knip-etiket-rij { grid-template-columns: 1fr; }
    .knip-etiket { width: 100%; max-width: 290px; margin: 6px auto; }
    .knip-vork { height: 26px; }
    .knip-vork::after { top: 12px; height: 14px; }
    .knip-takken { gap: 8px; }
    .knip-tak > .knip-blad { padding: 12px 12px 10px; }
}
@media (max-width: 460px) {
    .knip-rij.vier { grid-template-columns: 1fr; }
}

/* Batch E: vergelijking naast elkaar, sommen, staven, schaal, vragen en fiche (voorraad-artikels) */
.knip-duo { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.knip-drie { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.knip-vier { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.knip-blad.knip-mis { background: #fff; border: 2px dashed #a8452a; box-shadow: none; }
.knip-blad.knip-mis b { color: #a8452a; }
.knip-blad.knip-goed { border-top: 8px solid #7d8f7a; }
.knip-blad.knip-let { border-top: 8px solid #d9714a; }
.knip-blad.knip-diep { border-top: 8px solid #a8452a; }
.knip-blad b.knip-klein { font-size: 1.05rem; }
.knip-som { display: flex; flex-wrap: wrap; align-items: stretch; gap: 10px; }
.knip-som > .knip-blad { flex: 1 1 130px; }
.knip-teken { align-self: center; font-family: 'Space Grotesk', sans-serif; font-size: 1.6rem; font-weight: 700; color: #2c3e4a; line-height: 1; }
.knip-velden { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; margin: 10px 0 0; padding: 0; }
.knip-velden li { font-family: 'IBM Plex Mono', monospace; font-size: .75rem; font-weight: 600; background: #fbe9e1; color: var(--navy-deep, #1f2d38); border-radius: 6px; padding: 3px 8px; margin: 0; }
.knip-velden li.later { background: #fff; border: 2px dashed #5f7360; }
.knip-velden.los li { background: #fff; border: 2px dashed #a8452a; }
.knip-tel { display: flex; flex-wrap: wrap; gap: 5px; margin: 10px 0 2px; }
.knip-tel i { width: 22px; height: 28px; border-radius: 5px; background: #2c3e4a; display: block; }
.knip-tel i.leeg { background: #fbe9e1; border: 2px dashed #2c3e4a; }
.knip-breuk { text-align: center; margin: 8px 0 6px; font-size: .9rem; line-height: 1.35; color: var(--navy-deep, #1f2d38); }
.knip-breuk .streep { display: block; height: 3px; background: #2c3e4a; border-radius: 2px; margin: 6px 0; }
.knip-staven { display: grid; gap: 14px; }
.knip-staaf { display: grid; grid-template-columns: minmax(8rem, 12rem) 1fr; gap: 6px 14px; align-items: center; }
.knip-staaf-baan { height: 34px; background: #fff; border-radius: 10px; overflow: hidden; box-shadow: 0 3px 0 rgba(31,45,56,.10); }
.knip-staaf-baan i { display: block; height: 100%; background: #d9714a; border-radius: 10px 0 0 10px; }
.knip-staaf-baan i.lei { background: #2c3e4a; }
.knip-staaf-naam b { font-family: 'Space Grotesk', sans-serif; display: block; color: var(--navy-deep, #1f2d38); font-size: 1.1rem; }
.knip-staaf-naam span { display: block; font-size: .85rem; color: var(--slate, #5f7078); line-height: 1.4; }
.knip-schaal { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; margin-bottom: 14px; }
.knip-schaal > span { font-family: 'Space Grotesk', sans-serif; font-weight: 700; font-size: 1.3rem; text-align: center; padding: 12px 0; border-radius: 12px; background: #fff; color: var(--navy-deep, #1f2d38); box-shadow: 0 3px 0 rgba(31,45,56,.10); }
.knip-schaal > span.ok { background: #7d8f7a; color: #fff; }
.knip-schaal > span.op { background: #a8452a; color: #fff; }
.knip-schaal > p { margin: 4px 0 0; font-size: .9rem; line-height: 1.4; color: var(--navy-deep, #1f2d38); }
.knip-schaal > p.ok { grid-column: 1 / 3; }
.knip-schaal > p.op { grid-column: 4 / 7; }
.knip-vragen { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.knip-vragen li { display: grid; grid-template-columns: 1.25fr auto 1fr; gap: 10px; align-items: center; margin: 0; }
.knip-ja { font-family: 'Space Grotesk', sans-serif; font-weight: 700; color: #a8452a; white-space: nowrap; }
.knip-ja::after { content: " \2192"; }
.knip-vragen .knip-blad span { margin-top: 0; font-size: .95rem; color: var(--navy-deep, #1f2d38); }
.knip-vragen .knip-blad.accent span { color: #fff; }
.knip-blad.knip-uitkomst { margin-top: 14px; background: #7d8f7a; }
.knip-blad.knip-uitkomst b, .knip-blad.knip-uitkomst span, .knip-blad.knip-uitkomst .knip-wie { color: #fff; }
.knip-segment { display: flex; height: 54px; border-radius: 12px; overflow: hidden; box-shadow: 0 3px 0 rgba(31,45,56,.10); }
.knip-segment > div { display: flex; align-items: center; justify-content: center; color: #fff; font-family: 'Space Grotesk', sans-serif; font-weight: 700; white-space: nowrap; min-width: 0; }
.knip-segment .salie { background: #7d8f7a; }
.knip-segment .terra { background: #d9714a; }
.knip-segment .roest { background: repeating-linear-gradient(135deg, #a8452a 0 6px, #8f3a23 6px 12px); }
.knip-segment .lei { background: #2c3e4a; }
@media (max-width: 640px) {
    .knip-duo, .knip-drie { grid-template-columns: 1fr; }
    .knip-vier { grid-template-columns: 1fr 1fr; }
    .knip-som { flex-direction: column; }
    .knip-som > .knip-blad { flex: 0 0 auto; }
    .knip-teken { align-self: center; }
    .knip-staaf { grid-template-columns: 1fr; }
    .knip-schaal { gap: 6px; }
    .knip-schaal > span { font-size: 1.1rem; padding: 9px 0; }
    .knip-schaal > p.ok { grid-column: 1 / 4; }
    .knip-schaal > p.op { grid-column: 4 / 7; }
    .knip-vragen li { grid-template-columns: 1fr; gap: 6px; }
    .knip-ja { justify-self: start; }
    .knip-ja::after { content: " \2193"; }
}

/* Batch B: twee kaarten naast elkaar, rekenteken in een reis, sporen, meters met drempel, beslisboom */
.knip-twee { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.knip-blad.accent .knip-vlaggen i { background: #f0b98f; color: #1f2d38; }
.knip-reis > .knip-teken { justify-self: center; }

/* Twee sporen onder elkaar, elk met een eigen kop */
.knip-spoor + .knip-spoor { margin-top: 22px; }
.knip-spoor-kop { display: inline-block; font-family: 'IBM Plex Mono', monospace; font-size: .78rem; font-weight: 600; color: #fff; background: #2c3e4a; border-radius: 6px; padding: 3px 9px; margin: 0 0 10px; }
.knip-spoor-kop.roest { background: #a8452a; }

/* Meters: balken met een drempelstreep */
.knip-meters { background: #fff; border-radius: 16px; padding: 18px 18px 6px; box-shadow: 0 3px 0 rgba(31,45,56,.10); }
.knip-meter { display: grid; grid-template-columns: 10rem 1fr; gap: 12px; align-items: center; margin: 0 0 16px; }
.knip-meter-naam { font-size: .9rem; line-height: 1.35; color: var(--navy-deep, #1f2d38); }
.knip-meter-naam small { display: block; color: var(--slate, #5f7078); font-size: .8rem; }
.knip-meter-baan { position: relative; height: 34px; background: #f6e3da; border-radius: 9px; }
.knip-meter-vul { height: 100%; border-radius: 9px; background: #2c3e4a; color: #fff; display: flex; align-items: center; justify-content: flex-end; padding: 0 10px; box-sizing: border-box; font-family: 'Space Grotesk', sans-serif; font-weight: 700; font-size: .95rem; white-space: nowrap; min-width: 4.4rem; }
.knip-meter-vul.terra { background: #d9714a; color: #1f2d38; }
.knip-meter-vul.roest { background: #a8452a; }
.knip-meter-vul.salie { background: #7d8f7a; color: #1f2d38; }
.knip-meter-vul.links { justify-content: flex-start; }
.knip-drempel { position: absolute; top: -7px; bottom: -7px; width: 0; border-left: 3px dashed #2c3e4a; }
.knip-meter.schaal { margin-bottom: 6px; }
.knip-meter.schaal .knip-meter-baan { background: none; height: 20px; }
.knip-meter-leeg { display: flex; align-items: center; height: 100%; padding: 0 12px; font-size: .85rem; color: var(--slate, #5f7078); }
.knip-drempel-tekst { position: absolute; top: 0; transform: translateX(-50%); font-family: 'IBM Plex Mono', monospace; font-size: .75rem; font-weight: 600; color: #2c3e4a; white-space: nowrap; }

/* Beslisboom: een vraag links, de uitgang rechts, omlaag naar de volgende vraag */
.knip-vraagrij { display: grid; grid-template-columns: 1.3fr 7.5rem 1fr; gap: 12px; align-items: center; }
.knip-vraagrij .knip-blad b { font-size: 1.1rem; }
.knip-uit { font-family: 'IBM Plex Mono', monospace; font-size: .78rem; font-weight: 600; color: #2c3e4a; text-align: center; line-height: 1.2; }
.knip-uit::after { content: "\2192"; display: block; font-family: 'Space Grotesk', sans-serif; font-size: 1.5rem; font-weight: 700; }
.knip-omlaag { font-family: 'IBM Plex Mono', monospace; font-size: .78rem; font-weight: 600; color: #2c3e4a; padding: 6px 0 6px 22px; }
.knip-omlaag::before { content: "\2193"; font-family: 'Space Grotesk', sans-serif; font-size: 1.3rem; font-weight: 700; margin-right: 8px; vertical-align: -2px; }
.knip-vraagrij .knip-blad.salie { border-left: 8px solid #7d8f7a; }
.knip-vraagrij .knip-blad.roest { border-left: 8px solid #a8452a; }

@media (max-width: 640px) {
    .knip-twee { grid-template-columns: 1fr; }
    .knip-meter { grid-template-columns: 1fr; gap: 6px; }
    .knip-vraagrij { grid-template-columns: 1fr; gap: 6px; }
    .knip-vraagrij > .knip-blad:last-child { margin-left: 34px; }
    .knip-uit { text-align: left; padding-left: 34px; }
    .knip-uit::after { content: "\2193"; display: inline; margin-left: 8px; font-size: 1.3rem; vertical-align: -2px; }
}

/* Batch A: vergelijken, staven, afvinklijst en ja/nee-pad.
   Toegevoegd voor de margeartikelen; elk onderdeel staat op zichzelf. */

/* Twee (of vier) kaarten naast elkaar: twee routes, twee methodes, vier landen */
.knip-paar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.knip-paar .knip-vlaggen { display: flex; }
.knip-legende.twee { grid-template-columns: repeat(2, minmax(0, 1fr)); }

/* Rijen met een bedrag rechts, binnen een kaart */
.knip-rijen { list-style: none; margin: 10px 0 0; padding: 0; }
.knip-rijen li { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 7px 0; border-top: 2px dashed rgba(44,62,74,.55); font-size: .9rem; color: var(--slate, #5f7078); line-height: 1.4; }
.knip-rijen li span { display: inline; margin: 0; font-size: inherit; color: inherit; }
.knip-rijen li b { display: inline; font-size: 1rem; white-space: nowrap; }
.knip-rijen li.totaal { border-top: 2px solid #2c3e4a; color: var(--navy-deep, #1f2d38); font-weight: 600; }
.knip-rijen li.totaal b { font-size: 1.2rem; color: #a8452a; }
.knip-blad.accent .knip-rijen li { color: #e3e9eb; border-top-color: rgba(255,255,255,.3); }
.knip-blad.accent .knip-rijen li.totaal { border-top-color: #f0b98f; color: #fff; }
.knip-blad.accent .knip-rijen li.totaal b { color: #f0b98f; }

/* Latten: bedragen op dezelfde schaal (de breedte staat inline, in procent) */
.knip-latten { display: grid; gap: 16px; }
.knip-lat-kop { max-width: none; display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin: 0 0 6px; font-size: .92rem; color: var(--navy-deep, #1f2d38); line-height: 1.35; }
.knip-lat-kop b { font-family: 'Space Grotesk', sans-serif; font-size: 1.2rem; white-space: nowrap; }
.knip-lat-baan { display: flex; height: 30px; background: #fff; border-radius: 10px; overflow: hidden; box-shadow: 0 3px 0 rgba(31,45,56,.10); }
.knip-lat-baan i { display: block; flex: none; height: 100%; background: #a8452a; }
.knip-lat-baan i.lei { background: #2c3e4a; }
.knip-lat-baan i.terra { background: #d9714a; }
.knip-lat-baan i.salie { background: #7d8f7a; }
.knip-lat-baan i.streep { background: repeating-linear-gradient(135deg, #a8452a 0 6px, #8f3a23 6px 12px); }
.knip-sleutel { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 14px 0 0; padding: 0; list-style: none; font-size: .85rem; color: var(--navy-deep, #1f2d38); }
.knip-sleutel li { display: inline-flex; align-items: center; gap: 7px; }
.knip-sleutel li::before { content: ""; width: 14px; height: 14px; border-radius: 4px; background: #a8452a; }
.knip-sleutel li.lei::before { background: #2c3e4a; }
.knip-sleutel li.terra::before { background: #d9714a; }
.knip-sleutel li.salie::before { background: #7d8f7a; }

/* Afvinklijst: wat je bewaart, wat meetelt (li.nee = kruis) */
.knip-vink { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.knip-vink li { position: relative; background: #fff; border-radius: 14px; padding: 12px 14px 12px 52px; box-shadow: 0 3px 0 rgba(31,45,56,.10); font-size: .95rem; color: var(--navy-deep, #1f2d38); line-height: 1.45; min-height: 26px; }
.knip-vink li::before { content: ""; position: absolute; left: 14px; top: 12px; width: 26px; height: 26px; border-radius: 50%; background: #7d8f7a; }
.knip-vink li::after { content: ""; position: absolute; left: 23px; top: 17px; width: 7px; height: 12px; border: solid #fff; border-width: 0 3px 3px 0; transform: rotate(45deg); }
.knip-vink li.nee::before { background: #a8452a; }
.knip-vink li.nee::after { left: 20px; top: 18px; width: 14px; height: 14px; border: 0; transform: none; background: linear-gradient(45deg, transparent 42%, #fff 42% 58%, transparent 58%), linear-gradient(-45deg, transparent 42%, #fff 42% 58%, transparent 58%); }
.knip-vink li b { font-family: 'Space Grotesk', sans-serif; display: block; font-size: 1rem; }
.knip-vink li span { display: block; font-size: .88rem; color: var(--slate, #5f7078); margin-top: 2px; }
.knip-vink-kop { font-family: 'Space Grotesk', sans-serif; font-size: .78rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: #a8452a; margin: 0 0 8px; }
.knip-vink + .knip-vink-kop { margin-top: 18px; }

/* Ja/nee-pad: vraag links, de uitgang bij "nee" rechts, "ja" gaat naar beneden */
.knip-beslis { list-style: none; margin: 0; padding: 0; }
.knip-stap { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 12px; align-items: center; }
.knip-stap .knip-blad b { font-size: 1.1rem; }
.knip-af { background: #fff; border: 2px dashed #a8452a; border-radius: 14px; padding: 10px 12px; font-size: .88rem; color: #7a311d; line-height: 1.4; }
.knip-af em { font-style: normal; display: block; font-family: 'IBM Plex Mono', monospace; font-size: .72rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: #a8452a; margin-bottom: 2px; }
.knip-jalijn { position: relative; margin: 0; padding: 8px 0 8px 34px; font-family: 'IBM Plex Mono', monospace; font-size: .75rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: #2c3e4a; }
.knip-jalijn::before { content: ""; position: absolute; left: 18px; top: 0; bottom: 0; width: 3px; background: #2c3e4a; border-radius: 2px; }
.knip-beslis .knip-blad.accent { max-width: 60%; }

/* Met de kleine cirkel linksonder: extra ruimte onderaan, zodat de cirkel
   nooit tegen de laatste kaart of de noot komt. */
.knip:not(.ruim):has(> .knip-vorm.klein) { padding-bottom: 76px; }

@media (max-width: 640px) {
    .knip-paar, .knip-legende.twee { grid-template-columns: 1fr; }
    .knip-stap { grid-template-columns: 1fr; gap: 8px; }
    .knip-af { margin-left: 34px; }
    .knip-pijl.teken { transform: none; } /* + en = blijven rechtop */
    .knip-beslis .knip-blad.accent { max-width: none; }
    .knip-rijen li { font-size: .86rem; }
}

/* Batch C: keuzeboom, startlijst, staafjes, verdeelbalk, twee banen, jarenstrook, schijventrap */

/* Meer lucht onderaan, zodat de kleine cirkel de laatste kaart niet raakt */
.knip.knip-lucht { padding-bottom: 84px; }

/* Keuzeboom: een vraag bovenaan, twee takken eronder */
.knip-vraag { max-width: 34rem; margin: 0 auto; text-align: center; }
.knip-c-takken { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; position: relative; padding-top: 30px; margin-top: 14px; }
.knip-c-takken::before { content: ""; position: absolute; top: 12px; left: 25%; right: 25%; height: 18px; border: 3px solid #2c3e4a; border-bottom: 0; border-radius: 12px 12px 0 0; }
.knip-c-takken::after { content: ""; position: absolute; top: -14px; left: calc(50% - 1.5px); width: 3px; height: 26px; background: #2c3e4a; }
.knip-c-tak { display: flex; flex-direction: column; gap: 8px; }
.knip-c-tak .knip-blad { flex: 1; }
.knip-c-label { align-self: center; font-family: 'IBM Plex Mono', monospace; font-size: .78rem; font-weight: 600; background: #2c3e4a; color: #fff; border-radius: 999px; padding: 3px 12px; margin: 0; }
.knip-c-tak.groen .knip-c-label { background: #fff; color: #2c3e4a; box-shadow: inset 0 0 0 2px #7d8f7a; }
.knip-c-tak.rood .knip-c-label { background: #a8452a; }

/* Startlijst: wat in orde moet zijn, als vinkjes */
.knip-c-vink { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.knip-c-vink li { position: relative; background: #fff; border-radius: 14px; padding: 14px 14px 13px 50px; box-shadow: 0 3px 0 rgba(31,45,56,.10); margin: 0; }
.knip-c-vink li::before { content: ""; position: absolute; left: 14px; top: 15px; width: 22px; height: 22px; border-radius: 6px; background: #d9714a; }
.knip-c-vink li::after { content: ""; position: absolute; left: 21px; top: 18px; width: 7px; height: 12px; border: solid #fff; border-width: 0 3px 3px 0; transform: rotate(45deg); }
.knip-c-vink b { display: block; font-family: 'Space Grotesk', sans-serif; font-size: 1rem; color: var(--navy-deep, #1f2d38); line-height: 1.3; }
.knip-c-vink span { display: block; font-size: .88rem; color: var(--slate, #5f7078); line-height: 1.45; margin-top: 3px; }
.knip-c-vink li.breed { grid-column: 1 / -1; }

/* Staafjes: bedragen naast elkaar op een schaal */
.knip-c-staven { display: grid; gap: 10px; }
.knip-c-staaf { display: grid; grid-template-columns: 7.5rem 1fr; gap: 6px 14px; align-items: center; }
.knip-c-staaf-wie { font-family: 'Space Grotesk', sans-serif; font-weight: 700; color: var(--navy-deep, #1f2d38); font-size: 1.05rem; line-height: 1.2; }
.knip-c-staaf-wie small { display: block; font-family: 'IBM Plex Mono', monospace; font-size: .72rem; font-weight: 600; color: #a8452a; letter-spacing: .03em; }
.knip-c-spoor { background: rgba(255,255,255,.75); border-radius: 10px; height: 34px; position: relative; box-shadow: 0 3px 0 rgba(31,45,56,.08); }
.knip-c-vul { height: 100%; border-radius: 10px; background: #2c3e4a; min-width: 10px; }
.knip-c-vul.terra { background: #d9714a; }
.knip-c-vul.salie { background: #7d8f7a; }
.knip-c-vul.roest { background: #a8452a; }

/* Verdeelbalk: waar een bedrag naartoe gaat (vrije delen) */
.knip-ruim { margin-top: 44px; }
.knip-balk > .k-lei { background: #2c3e4a; }
.knip-balk > .k-salie { background: #7d8f7a; }
.knip-balk > .k-terra { background: #d9714a; }
.knip-balk > .k-roest { background: repeating-linear-gradient(135deg, #a8452a 0 6px, #8f3a23 6px 12px); }
.knip-legende.knip-c-vier { grid-template-columns: repeat(4, 1fr); }
.knip-legende .knip-blad.k-salie { border-top-color: #7d8f7a; }
.knip-legende .knip-blad.k-terra { border-top-color: #d9714a; }
.knip-legende .knip-blad.k-roest { border-top-color: #a8452a; }
.knip-legende.knip-c-vier .knip-blad b { font-size: 1.15rem; }

/* Twee banen: dezelfde winst, een andere weg */
.knip-banen { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.knip-baan { display: flex; flex-direction: column; align-items: stretch; }
.knip-baan > .knip-wie { font-family: 'Space Grotesk', sans-serif; font-size: .82rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: #a8452a; margin: 0 0 8px; }
.knip-neer { align-self: center; font-family: 'Space Grotesk', sans-serif; font-size: 1.4rem; font-weight: 700; color: #2c3e4a; line-height: 1; margin: 4px 0; }
.knip-blad.belast { border-left: 6px solid #a8452a; }

/* Jarenstrook: wat geldt in welk boekjaar */
.knip-jaren { display: grid; grid-template-columns: 11rem repeat(5, 1fr); gap: 8px 6px; align-items: center; }
.knip-jaren .knip-jaar { font-family: 'IBM Plex Mono', monospace; font-size: .75rem; font-weight: 600; text-align: center; color: var(--navy-deep, #1f2d38); background: rgba(255,255,255,.7); border-radius: 6px; padding: 3px 0; }
.knip-jaren .knip-rij-wie { grid-column: 1; font-family: 'Space Grotesk', sans-serif; font-weight: 700; font-size: .92rem; color: var(--navy-deep, #1f2d38); line-height: 1.25; }
.knip-strook { border-radius: 10px; padding: 9px 10px; font-size: .86rem; line-height: 1.3; color: #fff; background: #2c3e4a; text-align: center; box-shadow: 0 3px 0 rgba(31,45,56,.10); }
.knip-strook b { font-family: 'Space Grotesk', sans-serif; display: block; font-size: 1.05rem; }
.knip-strook.licht { background: #fff; color: var(--navy-deep, #1f2d38); }
.knip-strook.terra { background: #d9714a; }
.knip-strook.roest { background: #a8452a; }
.knip-jaren .k-j12 { grid-column: 2 / 4; }
.knip-jaren .k-j14 { grid-column: 2 / 6; }
.knip-jaren .k-j35 { grid-column: 4 / 7; }
.knip-jaren .k-j5 { grid-column: 6 / 7; }

/* Schijventrap: tarief per schijf, als treden */
.knip-trap { display: flex; align-items: flex-end; gap: 8px; height: 190px; margin-top: 34px; }
.knip-trede { flex: 1; display: flex; flex-direction: column; justify-content: flex-end; height: 100%; }
.knip-trede-blok { border-radius: 10px 10px 4px 4px; background: #2c3e4a; color: #fff; font-family: 'Space Grotesk', sans-serif; font-weight: 700; font-size: 1.15rem; display: flex; align-items: flex-start; justify-content: center; padding-top: 8px; box-shadow: 0 3px 0 rgba(31,45,56,.10); }
.knip-trede.vrij .knip-trede-blok { background: #7d8f7a; font-size: .95rem; }
.knip-trede.top .knip-trede-blok { background: #d9714a; }
.knip-trede-onder { display: flex; gap: 8px; margin-top: 8px; }
.knip-trede-onder span { flex: 1; text-align: center; font-family: 'IBM Plex Mono', monospace; font-size: .72rem; font-weight: 600; color: var(--navy-deep, #1f2d38); line-height: 1.35; }

@media (max-width: 640px) {
    .knip-c-takken { grid-template-columns: 1fr; padding-top: 18px; }
    .knip-c-takken::before { display: none; }
    .knip-c-takken::after { top: -14px; height: 22px; }
    .knip-c-vink { grid-template-columns: 1fr; }
    .knip-c-staaf { grid-template-columns: 1fr; }
    .knip-legende.knip-c-vier { grid-template-columns: 1fr 1fr; }
    .knip-banen { grid-template-columns: 1fr; }
    .knip-jaren { grid-template-columns: repeat(5, 1fr); }
    .knip-jaren .knip-rij-wie { grid-column: 1 / -1; margin-top: 6px; }
    .knip-jaren .knip-hoek { display: none; }
    .knip-jaren .k-j12 { grid-column: 1 / 3; }
    .knip-jaren .k-j14 { grid-column: 1 / 5; }
    .knip-jaren .k-j35 { grid-column: 3 / 6; }
    .knip-jaren .k-j5 { grid-column: 5 / 6; }
    .knip-strook { font-size: .78rem; padding: 8px 6px; }
    .knip-trede-blok { font-size: .95rem; }
    .knip-trede.vrij .knip-trede-blok { font-size: .78rem; }
    .knip-trede-onder span { font-size: .64rem; }
}

/* Groep V1: vraagpagina's (tools/vragen/beelden-v1.mjs).
   Een aftreklijst van marge naar rekening, en wat lucht en maat voor
   bestaande onderdelen wanneer ze onder elkaar of in een kaart staan. */
.knip-v1-aftrek { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; max-width: 34rem; }
.knip-v1-aftrek li { display: flex; align-items: center; gap: 12px; margin: 0; background: #fff; border-radius: 12px; padding: 10px 14px; box-shadow: 0 3px 0 rgba(31,45,56,.10); font-size: .95rem; line-height: 1.4; color: var(--navy-deep, #1f2d38); }
.knip-v1-aftrek li::before { content: "\2212"; flex: none; width: 26px; height: 26px; border-radius: 50%; background: #a8452a; color: #fff; font-family: 'Space Grotesk', sans-serif; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.knip-v1-aftrek li b { font-family: 'Space Grotesk', sans-serif; }
.knip-v1-aftrek li.start { background: #2c3e4a; color: #fff; }
.knip-v1-aftrek li.start::before { content: ""; background: #d9714a; }
.knip-v1-aftrek li.eind { background: #5e6f5b; color: #fff; }
.knip-v1-aftrek li.eind::before { content: "="; background: #fff; color: #5e6f5b; }
.knip-v1-onder { margin-top: 14px; }
.knip-omlaag.knip-v1-midden { text-align: center; padding-left: 0; max-width: none; }
.knip-segment.knip-v1-jaar { height: 34px; margin-top: 12px; }
.knip-segment.knip-v1-jaar > div { flex: 1; font-size: .8rem; }
.knip-segment.knip-v1-jaar > div + div { box-shadow: inset 2px 0 0 #fff; }
@media (max-width: 640px) {
    .knip-segment.knip-v1-kast > div { font-size: .82rem; }
}

/* Groep V2: vraagpagina's (tools/vragen/beelden-v2.mjs). Extra lucht tussen twee onderdelen in één beeld. */
.knip .knip-v2-tussen { margin-top: 22px; }

/* Groep V4: vraagpagina's (tools/vragen/beelden-v4.mjs).
   Het label boven de vraag in een ja/nee-keuze staat mee in het midden. */
.knip-keuze .knip-wie.knip-v4-midden { max-width: none; }

/* Groep V3: vraagpagina's (tools/vragen/beelden-v3.mjs).
   Afvinklijst in twee kolommen en een klein balkje in een kaart. */
.knip-vink.knip-v3-vink-twee { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.knip-segment.knip-v3-balkje { height: 40px; margin-top: 12px; }
.knip-segment.knip-v3-balkje > div { font-size: .85rem; padding: 0 8px; }
@media (max-width: 640px) {
    .knip-vink.knip-v3-vink-twee { grid-template-columns: 1fr; }
}