/* Quickmouse editorial motion — original implementation inspired by 21st.dev's
   Editorial Collage Hero, Scroll 01, Floating Header and Disclosure Group.
   Shared brand tokens and existing page structure remain authoritative. */
:root{--qm-motion-ease:cubic-bezier(.22,.75,.25,1);--qm-motion-duration:320ms}
.site-header{transition:box-shadow 240ms,background 240ms}
.site-header.scrolled{box-shadow:0 4px 18px #111b2a08;background:var(--qm-canvas)}
.site-header .nav{transition:min-height 240ms var(--qm-motion-ease)}
@media(min-width:641px){.site-header .nav{min-height:70px}.site-header.scrolled .nav{min-height:62px}}
.nav-links{position:relative}
.qm-nav-indicator{position:absolute;bottom:8px;left:0;height:1px;background:var(--qm-navy);pointer-events:none;opacity:0;transition:transform 260ms var(--qm-motion-ease),width 260ms var(--qm-motion-ease),opacity 160ms}
.nav-links.qm-nav-enhanced .nav-link::after{display:none}
.button>span[aria-hidden=true],.text-link>span[aria-hidden=true],.service-link>span[aria-hidden=true]{display:inline-block;transition:transform 240ms var(--qm-motion-ease)}
.button:hover>span[aria-hidden=true],.button:focus-visible>span[aria-hidden=true],.service-link:hover>span[aria-hidden=true],.service-link:focus-visible>span[aria-hidden=true]{transform:translate(2px,-2px)}
.text-link:hover>span[aria-hidden=true],.text-link:focus-visible>span[aria-hidden=true]{transform:translateX(3px)}
.service-summary{transition:transform 260ms var(--qm-motion-ease),border-color 260ms,box-shadow 260ms}
@media(hover:hover){.service-summary:hover{transform:translateY(-4px);border-color:var(--qm-line-strong);box-shadow:0 12px 25px #111b2a09}}
.service-summary:focus-within{border-color:var(--qm-focus)}
.section-head{position:relative}

/* A collage within the existing right-hand hero column. */
.offer-led-hero>.wrap{align-items:center}
.hero-vignette.qm-collage{position:relative;overflow:visible;background:transparent;border-radius:0;min-width:0;padding:30px 8px 58px 18px;margin:0}
.qm-collage-image{transform:rotate(2deg);border:6px solid var(--qm-paper);border-radius:3px;box-shadow:0 15px 35px #111b2a14;overflow:hidden}
.qm-collage .qm-collage-image img{width:100%;aspect-ratio:1.62;object-fit:cover;object-position:58% center}
.qm-collage-note{position:absolute;left:-14px;bottom:30px;width:61%;max-width:270px;padding:18px 20px;background:var(--qm-paper);border:1px solid var(--qm-line);box-shadow:0 12px 28px #111b2a12;transform:rotate(-4deg);border-radius:2px;text-align:left}
.qm-document-label{display:block;font:10px/1.5 var(--qm-font-mono);letter-spacing:.035em;color:var(--qm-muted);margin-bottom:9px}
.qm-collage-note>strong{display:block;font:500 clamp(1.35rem,2vw,1.8rem)/1.06 EBG,Georgia,serif;color:var(--qm-navy);letter-spacing:-.025em}
.qm-mini-flow{display:flex;align-items:center;gap:8px;border-top:1px solid var(--qm-line);margin-top:14px;padding-top:11px;font-size:10px;color:var(--qm-muted)}
.qm-mini-flow>span{padding:4px 6px;border:1px solid var(--qm-line);border-radius:2px}.qm-mini-flow>span:last-child{color:var(--qm-navy);border-color:var(--qm-line-strong)}
.qm-mini-flow i{font-style:normal}
.qm-collage-slip{position:absolute;right:0;top:10px;display:flex;align-items:center;gap:10px;padding:10px 15px;background:var(--qm-paper);border:1px solid var(--qm-line);box-shadow:0 6px 18px #111b2a0c;transform:rotate(4deg);font-size:11px;line-height:1.5;color:var(--qm-body)}
.qm-slip-check{display:grid;place-items:center;border:1px solid var(--qm-line-strong);border-radius:50%;width:24px;height:24px;color:var(--qm-navy)}
.qm-collage-caption{position:absolute;right:7px;bottom:3px;font:10px/1.5 var(--qm-font-mono);letter-spacing:.025em;color:var(--qm-muted)}

/* An illustrated work document follows the reader through the existing six steps.
   Without JS, at small sizes and in print every illustration stays with its step. */
.qm-story-stage{display:none}
#ai-kickstart-werkwijze .qm-story-steps{gap:0}
#ai-kickstart-werkwijze .qm-story-step{position:relative;grid-template-columns:32px minmax(0,1fr);gap:14px 20px;padding:30px 0;background:transparent;border:0;border-top:1px solid var(--qm-line-strong);border-radius:0;align-content:center}
#ai-kickstart-werkwijze .qm-story-step h3{font-size:clamp(1.65rem,2.4vw,2rem);line-height:1.12;max-width:440px}
#ai-kickstart-werkwijze .qm-story-step>p{grid-column:2;max-width:460px;margin:0}
#ai-kickstart-werkwijze .qm-story-step>.number{background:transparent;color:var(--qm-muted);border:1px solid var(--qm-line-strong);transition:color 240ms,background 240ms,border-color 240ms}
#ai-kickstart-werkwijze .qm-story-step.is-current>.number{background:var(--qm-navy);border-color:var(--qm-navy);color:var(--qm-paper)}
.qm-story-inline{grid-column:2;max-width:450px;padding:20px 0 4px}
.qm-document{position:relative;background:var(--qm-paper);border:1px solid var(--qm-line-strong);box-shadow:0 12px 30px #111b2a08;padding:24px 26px 28px;text-align:left;min-width:0}
.qm-document::before{content:'';position:absolute;inset:6px -6px -6px 6px;border:1px solid var(--qm-line);background:var(--qm-surface-muted);z-index:-1;transform:rotate(1.5deg)}
.qm-document-top{display:flex;justify-content:space-between;gap:15px;padding-bottom:18px;margin-bottom:20px;border-bottom:1px solid var(--qm-line);font:10px/1.5 var(--qm-font-mono);color:var(--qm-muted)}
.qm-document-title{display:block;font:500 clamp(1.65rem,2.5vw,2.2rem)/1.08 EBG,Georgia,serif;color:var(--qm-navy);letter-spacing:-.025em;margin-bottom:26px}
.qm-document-rule{border-top:1px solid var(--qm-line);margin:26px 0 16px}
.qm-document-footer{font-size:11px;line-height:1.7;color:var(--qm-muted)}
.qm-task-notes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:center;padding:12px 0}
.qm-task-notes span{display:block;background:var(--qm-canvas);border:1px solid var(--qm-line);padding:26px 10px;transform:rotate(-5deg);font-size:12px;line-height:1.5;color:var(--qm-body);box-shadow:0 3px 8px #111b2a08}
.qm-task-notes span:nth-child(2){transform:translateY(-8px) rotate(3deg)}
.qm-task-notes span:nth-child(3){transform:rotate(-2deg)}
.qm-case-rows>div{padding:18px 0;border-bottom:1px solid var(--qm-line);display:flex;flex-direction:column;gap:6px}
.qm-case-rows span{font:10px/1.5 var(--qm-font-mono);color:var(--qm-muted)}
.qm-case-rows b{font-size:13px;font-weight:500;color:var(--qm-body)}
.qm-selected-note{display:flex;gap:12px;align-items:center;padding:14px 0 0;font-size:12px;color:var(--qm-navy)}
.qm-selected-note>span{font-size:22px}
.qm-workflow{display:flex;flex-direction:column;align-items:center;margin:0 auto;max-width:250px}
.qm-workflow>span{width:100%;text-align:center;border:1px solid var(--qm-line-strong);padding:8px 12px;font-size:12px;color:var(--qm-body);background:var(--qm-canvas)}
.qm-workflow>.qm-flow-ai{background:var(--qm-navy);color:var(--qm-paper);border-color:var(--qm-navy)}
.qm-workflow>i{font-style:normal;line-height:1.2;padding:3px;color:var(--qm-muted)}
.qm-workflow>.qm-flow-result{border-style:dashed;background:transparent}
.qm-test-list{margin:4px 0 25px}
.qm-test-list>div{display:grid;grid-template-columns:22px 1fr 20px;align-items:center;gap:10px;padding:17px 0;border-bottom:1px solid var(--qm-line)}
.qm-test-list span{font:10px var(--qm-font-mono);color:var(--qm-muted)}
.qm-test-list b{font-size:12px;font-weight:500;color:var(--qm-body)}
.qm-test-list i{font-style:normal;color:var(--qm-navy)}
.qm-prototype-cycle{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:20px 0}
.qm-prototype-cycle>span{font-size:11px;color:var(--qm-body);border-bottom:1px solid var(--qm-line-strong);padding:8px 0}
.qm-prototype-cycle>i{font-style:normal;font-size:12px}
.qm-feedback-note{display:flex;align-items:center;gap:18px;padding:18px;background:var(--qm-canvas);margin-top:14px}
.qm-feedback-mark{font:2rem/1 EBG,serif;color:var(--qm-navy)}
.qm-feedback-note b,.qm-feedback-note div>span{display:block;font-size:12px;font-weight:500;color:var(--qm-body)}
.qm-feedback-note div>span{font-size:10px;margin-top:5px;font-weight:400}
.qm-plan>div{display:grid;grid-template-columns:24px 1fr;gap:4px 10px;padding:16px 0;border-bottom:1px solid var(--qm-line)}
.qm-plan>div>span{grid-row:1/3;font:10px/1.7 var(--qm-font-mono);color:var(--qm-muted)}
.qm-plan b{font-size:12px;font-weight:500;color:var(--qm-body)}
.qm-plan small{font-size:10px;color:var(--qm-muted)}
@media(min-width:861px) and (min-height:620px){
 .qm-story.is-enhanced{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1fr);gap:clamp(45px,6vw,90px);align-items:start}
 .qm-story.is-enhanced .qm-story-stage{display:block;position:sticky;top:calc(62px + (100vh - 62px - 500px)/2);grid-column:1;grid-row:1;min-width:0;padding:8px 8px 18px}
 .qm-story.is-enhanced .qm-story-steps{grid-column:2;grid-row:1}
 .qm-story.is-enhanced .qm-story-inline{display:none}
 #ai-kickstart-werkwijze .is-enhanced .qm-story-step{min-height:440px;min-height:65svh;padding:54px 0;border-top-color:var(--qm-line)}
 #ai-kickstart-werkwijze .is-enhanced .qm-story-step:first-child{border-top:0}
 .qm-story-art{display:grid;isolation:isolate;min-height:420px;align-items:center}
 .qm-story-scene{grid-area:1/1;opacity:0;visibility:hidden;transform:translateY(14px) rotate(1deg);transition:opacity 300ms var(--qm-motion-ease),transform 400ms var(--qm-motion-ease),visibility 400ms;pointer-events:none}
 .qm-story-scene.is-current{opacity:1;visibility:visible;transform:translateY(0) rotate(-1deg)}
 .qm-story-scene .qm-document{min-height:400px}
 .qm-story-caption{display:flex;justify-content:space-between;font:10px/1.5 var(--qm-font-mono);color:var(--qm-muted);padding:22px 0 12px}
 .qm-story-progress{height:1px;background:var(--qm-line);overflow:hidden}
 .qm-story-progress>span{display:block;width:100%;height:100%;background:var(--qm-navy);transform:scaleX(.1667);transform-origin:left;transition:transform 400ms var(--qm-motion-ease)}
}
#ai-kickstart-opbrengst .grid-three{gap:28px 36px}
#ai-kickstart-opbrengst .grid-three article{background:transparent;border:0;border-top:1px solid var(--qm-line-strong);padding:22px 0;box-shadow:none;border-radius:0}
#ai-kickstart-opbrengst .grid-three article>.number{font:12px var(--qm-font-mono);color:var(--qm-muted)}
#ai-kickstart-opbrengst .grid-three h3{margin-top:20px}

/* Native details retain keyboard operation and readable, indexed answers. */
.faq details{background:transparent;transition:background 220ms}
.faq details[open]{background:var(--qm-surface-muted)}
.faq summary{padding-right:44px}
.faq summary::after,.faq details[open] summary::after{content:'+';top:50%;margin-top:-.5em;transform:rotate(0);transform-origin:center;transition:transform 240ms var(--qm-motion-ease);color:var(--qm-navy)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details.qm-faq-closing summary::after{transform:rotate(0)}
.faq details>p:last-child{margin-bottom:0}
.faq details:focus-within{position:relative;z-index:1}

@media(max-width:860px){
 .qm-collage-note{padding:14px;width:66%;left:-7px}
 .qm-mini-flow{gap:5px;font-size:9px}.qm-mini-flow>span{padding:3px 4px}
 .qm-collage-slip{font-size:9px;padding:8px;gap:7px;right:-3px}
 .qm-story-inline .qm-document{max-width:440px}
}
@media(max-width:640px){
 .qm-nav-indicator{display:none}
 .js .nav-links.open{animation:qm-menu-enter 240ms var(--qm-motion-ease)}
 .hero-vignette.qm-collage{padding:22px 9px 65px 14px;max-width:480px;align-self:center;width:100%;margin:4px 0 0}
 .qm-collage .qm-collage-image img{aspect-ratio:1.8;max-height:none}
 .qm-collage-note{left:0;bottom:25px;padding:15px 17px;width:59%;max-width:245px}
 .qm-collage-note>strong{font-size:1.6rem}
 .qm-collage-caption{font-size:9px}
 .qm-collage-slip{right:1px;top:7px;font-size:10px;padding:9px 11px}
 .qm-story-inline{grid-column:1/-1;padding:18px 5px 8px}
 #ai-kickstart-werkwijze .qm-story-step{padding:26px 0 30px;gap:12px}
 #ai-kickstart-werkwijze .qm-story-step>p{grid-column:2}
 .qm-document{padding:20px 20px 24px}
 .qm-document-title{font-size:1.9rem;margin-bottom:22px}
 .qm-task-notes span{font-size:11px;padding:22px 8px}
 .qm-document-top{font-size:9px}
 #ai-kickstart-opbrengst .grid-three{gap:8px}
}
@keyframes qm-menu-enter{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto!important}
 .site-header,.site-header .nav,.qm-nav-indicator,.service-summary,.qm-story-scene,.qm-story-progress>span,.faq details,.faq summary::after,.button>span,.text-link>span,.service-link>span{transition:none!important}
 .js .nav-links.open{animation:none!important}
 .service-summary:hover,.button:hover>span[aria-hidden=true],.service-link:hover>span[aria-hidden=true],.text-link:hover>span[aria-hidden=true]{transform:none}
 .qm-proof-track{animation:none!important}
}
@media print{
 .site-header{position:static;box-shadow:none}
 .qm-story.is-enhanced{display:block}
 .qm-story-stage{display:none!important}
 .qm-story-inline{display:block!important;max-width:320px}
 #ai-kickstart-werkwijze .is-enhanced .qm-story-step{min-height:0;padding:24px 0;break-inside:avoid}
 .qm-document,.qm-collage-image,.qm-collage-note,.qm-collage-slip{box-shadow:none}
 .qm-story-inline .qm-document{transform:none}
 .faq details{height:auto!important;overflow:visible!important}
}