/* boerderijwinkel-kennis: van zaaien tot oogst met React Bits Pro frame-scrub (origineel gecompileerd) en de kennisbank. */
.msm-boerderijwinkel-kennis{--kn-p:var(--m-primary,#7d2b38);--kn-bg:var(--m-bg,#f5efe1);--kn-ink:var(--m-ink,#2b2219);--kn-s:var(--m-surface,#fffbf3);--kn-mu:var(--m-muted,#6b5f4f);--kn-a:var(--m-accent2,#e3ad3b);--kn-l:var(--m-line,#e1d6c1);--kn-display:var(--m-font-display,"Young Serif",Georgia,"Times New Roman",serif);--kn-body:var(--m-font-body,"Schibsted Grotesk","Segoe UI",system-ui,sans-serif);position:relative;box-sizing:border-box;width:100%;scroll-margin-top:112px;padding:64px 0;background:var(--kn-s);color:var(--kn-ink);font-family:var(--kn-body);font-size:16px;line-height:1.55}
.msm-boerderijwinkel-kennis *{box-sizing:border-box}
.msm-boerderijwinkel-kennis .kn-wrap{width:min(1280px,100% - 32px);margin:0 auto}
.msm-boerderijwinkel-kennis .kn-head{max-width:720px}
.msm-boerderijwinkel-kennis .kn-kicker,.msm-boerderijwinkel-kennis .kn-bank-kicker{margin:0 0 10px;color:var(--kn-p);font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.msm-boerderijwinkel-kennis .kn-title{margin:0;font-family:var(--kn-display);font-weight:400;font-size:clamp(30px,4.6vw,52px);line-height:1.08;letter-spacing:-.02em;text-wrap:balance}
.msm-boerderijwinkel-kennis .kn-lead{margin:14px 0 0;color:var(--kn-mu);font-size:17px;line-height:1.6}
/* Stille reeks: zonder JavaScript en bij reduced motion vier bij twee. */
.msm-boerderijwinkel-kennis .kn-frames{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 12px;margin:32px 0 0;padding:0;list-style:none}
.msm-boerderijwinkel-kennis .kn-frame figure{margin:0}
.msm-boerderijwinkel-kennis .kn-frame img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:12px;background:var(--kn-ink)}
.msm-boerderijwinkel-kennis .kn-frame figcaption{display:flex;gap:8px;margin-top:8px;font-size:14px;line-height:1.4}
.msm-boerderijwinkel-kennis .kn-fnum{flex:none;color:var(--kn-p);font-weight:600;font-variant-numeric:tabular-nums}
/* Scrub actief: de reeks blijft voor schermlezers, het podium neemt het beeld over. */
.msm-boerderijwinkel-kennis .kn-scrub[hidden]{display:none}
.msm-boerderijwinkel-kennis .kn-scrub{position:relative;display:grid;grid-template-columns:minmax(0,1fr);margin-top:24px}
.msm-boerderijwinkel-kennis .kn-host,.msm-boerderijwinkel-kennis .kn-side{grid-area:1/1}
.msm-boerderijwinkel-kennis .kn-host{position:relative;min-width:0}
.msm-boerderijwinkel-kennis .kn-side{position:relative;z-index:2;pointer-events:none}
.msm-boerderijwinkel-kennis .kn-side-pin{position:sticky;top:0;height:100vh}
.msm-boerderijwinkel-kennis .kn-caption{position:absolute;left:28px;right:28px;bottom:calc(17vh + 14px);margin:0;padding:10px 14px;border-radius:12px;background:color-mix(in srgb,var(--kn-ink) 80%,transparent);color:var(--kn-s);font-size:15px;line-height:1.4}
.msm-boerderijwinkel-kennis .kn-caption:empty{display:none}
.msm-boerderijwinkel-kennis[data-kn-mode="scrub"] .kn-frames{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* Wachtstand voor het podium tot de bundel er is (zelfde maat als de bron). */
.msm-boerderijwinkel-kennis .kn-poster{position:relative;width:100%}
.msm-boerderijwinkel-kennis .kn-poster-pin{position:sticky;top:0;display:flex;align-items:center;justify-content:center;height:100vh;padding:0 1rem}
.msm-boerderijwinkel-kennis .kn-poster-stage{position:relative;width:100%;height:66vh;overflow:hidden;background:var(--kn-ink)}
.msm-boerderijwinkel-kennis .kn-poster-stage img{display:block;width:100%;height:100%;object-fit:cover}
/* Originele component-CSS (frame-scrub.css), gescoped; monospace vervangen door de merkletter. */
.msm-boerderijwinkel-kennis .frame-scrub{position:relative;width:100%}
.msm-boerderijwinkel-kennis .frame-scrub__pin{position:sticky;top:0;display:flex;height:100vh;width:100%;flex-direction:column;align-items:center;justify-content:center;gap:1rem;overflow:hidden;padding-left:1rem;padding-right:1rem}
.msm-boerderijwinkel-kennis .frame-scrub__stage{position:relative;width:100%;overflow:hidden}
.msm-boerderijwinkel-kennis .frame-scrub__canvas{display:block;height:100%;width:100%}
.msm-boerderijwinkel-kennis .frame-scrub__counter{pointer-events:none;position:absolute;right:1rem;top:1rem;font-family:var(--kn-body);font-size:11px;letter-spacing:.18em;font-variant-numeric:tabular-nums}
.msm-boerderijwinkel-kennis .frame-scrub__loader{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.msm-boerderijwinkel-kennis .frame-scrub__fault{max-width:70%;text-align:center;font-family:var(--kn-body);font-size:11px;line-height:1.625;letter-spacing:.14em}
.msm-boerderijwinkel-kennis .frame-scrub__loader-inner{display:flex;width:10rem;flex-direction:column;align-items:center;gap:.5rem}
.msm-boerderijwinkel-kennis .frame-scrub__loader-track{display:block;height:1px;width:100%;overflow:hidden}
.msm-boerderijwinkel-kennis .frame-scrub__loader-fill{display:block;height:100%;width:100%;transform-origin:left}
.msm-boerderijwinkel-kennis .frame-scrub__loader-pct{font-family:var(--kn-body);font-size:10px;letter-spacing:.18em;font-variant-numeric:tabular-nums}
/* Kennisbank */
.msm-boerderijwinkel-kennis .kn-bank{margin-top:56px}
.msm-boerderijwinkel-kennis .kn-bank-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 24px;margin-bottom:20px}
.msm-boerderijwinkel-kennis .kn-bank-kicker{margin:0}
.msm-boerderijwinkel-kennis .kn-all{display:inline-flex;align-items:center;gap:6px;min-height:44px;color:var(--kn-p);font-size:15px;font-weight:600;text-decoration:none}
.msm-boerderijwinkel-kennis .kn-all svg{transition:transform .2s}
.msm-boerderijwinkel-kennis .kn-all:hover svg{transform:translate(2px,-2px)}
.msm-boerderijwinkel-kennis .kn-all:focus-visible{outline:2px solid var(--kn-p);outline-offset:3px;border-radius:6px}
.msm-boerderijwinkel-kennis .kn-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;margin:0;padding:0;list-style:none}
.msm-boerderijwinkel-kennis .kn-cell{display:flex}
.msm-boerderijwinkel-kennis .kn-card{display:flex;flex-direction:column;width:100%;overflow:hidden;border:1px solid var(--kn-l);border-radius:22px;background:var(--kn-bg);color:var(--kn-ink);text-decoration:none;transition:border-color .2s,transform .2s}
.msm-boerderijwinkel-kennis .kn-card:hover{border-color:color-mix(in srgb,var(--kn-p) 45%,var(--kn-l))}
.msm-boerderijwinkel-kennis .kn-card:focus-visible{outline:3px solid var(--kn-p);outline-offset:3px}
.msm-boerderijwinkel-kennis .kn-media{display:block;aspect-ratio:3/2;overflow:hidden;background:var(--kn-l)}
.msm-boerderijwinkel-kennis .kn-media img{display:block;width:100%;height:100%;object-fit:cover}
.msm-boerderijwinkel-kennis .kn-body{display:flex;flex-direction:column;gap:10px;padding:18px 20px 22px}
.msm-boerderijwinkel-kennis .kn-meta{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:13px;line-height:1.3}
.msm-boerderijwinkel-kennis .kn-cat{color:var(--kn-p);font-weight:600}
.msm-boerderijwinkel-kennis .kn-time{color:var(--kn-mu)}
.msm-boerderijwinkel-kennis .kn-card-title{margin:0;font-family:var(--kn-display);font-weight:400;font-size:20px;line-height:1.3;text-wrap:balance}
.msm-boerderijwinkel-kennis .kn-note{margin:20px 0 0;color:var(--kn-mu);font-size:14px}
@media (min-width:640px){
.msm-boerderijwinkel-kennis{padding:80px 0}
.msm-boerderijwinkel-kennis .kn-wrap{width:min(1280px,100% - 48px)}
.msm-boerderijwinkel-kennis .frame-scrub__pin{padding-left:2rem;padding-right:2rem}
.msm-boerderijwinkel-kennis .kn-poster-pin{padding:0 2rem}
.msm-boerderijwinkel-kennis .frame-scrub__counter{right:1.25rem;top:1.25rem}
.msm-boerderijwinkel-kennis .kn-caption{left:48px;right:auto;max-width:420px}
.msm-boerderijwinkel-kennis .kn-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:1024px){
.msm-boerderijwinkel-kennis{padding:104px 0}
.msm-boerderijwinkel-kennis .kn-wrap{width:min(1280px,100% - 64px)}
.msm-boerderijwinkel-kennis .kn-frames{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px 16px}
.msm-boerderijwinkel-kennis .kn-scrub{grid-template-columns:minmax(0,1fr) 280px;column-gap:8px;width:min(1400px,100% - 32px);margin-left:auto;margin-right:auto}
.msm-boerderijwinkel-kennis .kn-side{grid-area:1/2}
.msm-boerderijwinkel-kennis .kn-caption{position:absolute;left:0;right:0;top:50%;bottom:auto;max-width:none;padding:0 0 0 18px;border-left:3px solid var(--kn-p);border-radius:0;background:none;color:var(--kn-ink);font-family:var(--kn-display);font-size:24px;line-height:1.3;transform:translateY(-50%)}
.msm-boerderijwinkel-kennis .kn-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
}
@media (prefers-reduced-motion:reduce){
.msm-boerderijwinkel-kennis .kn-card,.msm-boerderijwinkel-kennis .kn-all svg{transition:none}
.msm-boerderijwinkel-kennis .kn-all:hover svg{transform:none}
}