/* Start met STOP — the public marketing family of Elk Solutions design A.
   The suite/editor's tool tokens and runtime stay separate. */
@font-face{font-family:Outfit;src:url('/fonts/outfit-latin-wght-normal.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:'Public Sans';src:url('/fonts/public-sans-latin-wght-normal.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
body.marketing{
 --paper:#fcfcf7;--ink:#172d31;--muted:#536461;--teal:#086c70;
 --mint:#d8eccc;--purple:#e7e2f5;--peach:#ffe2ce;--coral:#f6b7a2;
 --orange:#ff6600;--action:#c64a00;--line:#c8d2c8;--white:#fff;
 --grond:var(--paper);--vel:var(--paper);--paneel:var(--paper);--inkt:var(--ink);
 --potlood:var(--muted);--potlood-licht:var(--muted);--lijn:var(--line);--lijn-zacht:var(--line);
 --klok:var(--teal);--klok-vlak:var(--peach);--klok-licht:var(--peach);
 --goed:var(--teal);--goed-vlak:var(--mint);--let-op:#a6371a;--let-op-vlak:var(--peach);
 --ik:var(--teal);--ik-vlak:var(--purple);--accent:var(--orange);
 --lees:Outfit,Arial,sans-serif;--ui:'Public Sans',Arial,sans-serif;
 --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:20px;--s6:24px;--s8:32px;--s10:40px;--s12:48px;
 color-scheme:light;display:block;margin:0;padding:0;min-height:100vh;background:var(--paper);color:var(--ink);font:400 16px/1.65 var(--ui)
}
.marketing *{box-sizing:border-box}
.marketing [hidden]{display:none!important}
.marketing .blad{max-width:1280px;margin:auto;padding:0 var(--s10)}
.marketing :is(h1,h2,h3){font-family:var(--lees);color:var(--ink);text-wrap:pretty;overflow-wrap:break-word}
.marketing h1{font-size:clamp(38px,4.8vw,64px);font-weight:550;line-height:1.08;letter-spacing:-.035em}
.marketing h2{font-size:clamp(26px,3vw,36px);font-weight:500;line-height:1.16;letter-spacing:-.02em}
.marketing h3{font-size:23px;font-weight:500;line-height:1.25;margin:0 0 var(--s3)}
.marketing p{max-width:76ch}
.marketing a{color:var(--teal);text-underline-offset:4px}
.marketing :focus-visible{outline:3px solid var(--teal);outline-offset:4px;border-radius:4px}
.marketing :is(section,[id]){scroll-margin-top:var(--s6)}
.marketing img{max-width:100%;height:auto}
.marketing .skip-link{position:absolute;top:-100px;left:var(--s6);padding:var(--s3) var(--s4);z-index:50;background:var(--paper)}
.marketing .skip-link:focus{top:var(--s3)}
.marketing-mast{display:flex;align-items:center;gap:var(--s6);min-height:100px;padding:var(--s5) 0;border-bottom:1px solid var(--line)}
.marketing .product-merk{display:grid;grid-template-columns:auto auto;column-gap:var(--s3);row-gap:var(--s1);align-items:center;font-family:var(--lees);font-size:26px;line-height:1.1;letter-spacing:-.6px;text-decoration:none;color:var(--ink)}
.product-merk .teken{width:48px;height:auto;grid-column:1;grid-row:1}
.product-merk .product-naam{grid-column:2;grid-row:1;white-space:nowrap}
.product-merk b{font-weight:650}
.product-merk small{display:block;grid-column:2;grid-row:2;font:400 10px/1.5 var(--ui);letter-spacing:0;margin-top:0;color:var(--muted)}
#marketing-nav{display:flex;margin-left:auto;gap:var(--s6);align-items:center;font-size:13px;font-weight:550}
#marketing-nav ul{display:flex;align-items:center;gap:inherit;list-style:none;margin:0;padding:0}
#marketing-nav li{margin:0;padding:0}
#marketing-nav a{color:var(--ink);text-decoration:none;padding-block:var(--s3)}
#marketing-nav .nav-contact{border-bottom:1px solid var(--ink)}
#marketing-nav a:hover{text-decoration:underline}
.menu-button{display:none;font:inherit;padding:10px 14px;background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:6px;min-height:44px}
.menu-button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;flex-shrink:0}
.menu-icon-close,.menu-button[aria-expanded="true"] .menu-icon-open{display:none}
.menu-button[hidden]{display:none}
.menu-button[aria-expanded="true"] .menu-icon-close{display:block}
.menu-button[aria-expanded="true"]{background:var(--mint);border-color:var(--teal)}
.marketing .eyebrow{font-size:11px;font-weight:650;letter-spacing:.04em;margin:0 0 var(--s4)}
.brand-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--orange);vertical-align:middle;margin-right:var(--s2)}
.marketing .marketing-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s12);padding:var(--s12) 0;align-items:start}
.hero-copy{padding-top:var(--s4);min-width:0}
.marketing .hero-copy h1{margin:0 0 var(--s6)}
.marketing .accent-word{color:var(--teal);position:relative;display:inline-block;max-width:100%}
.marketing .accent-word svg{position:absolute;bottom:-16px;left:0;width:100%;height:18px;fill:none;stroke:var(--orange);stroke-width:4;stroke-linecap:round;pointer-events:none}
.marketing .hero-lead{font-size:18px;color:var(--muted);line-height:1.65;margin:var(--s8) 0}
.marketing .actions{display:flex;align-items:center;flex-wrap:wrap;gap:var(--s4)}
.marketing a.knop,.marketing button.knop,.marketing .deuren a:not(.rustig){display:inline-flex;align-items:center;justify-content:space-between;gap:var(--s5);background:var(--action);color:var(--white);border-radius:6px;border:1px solid var(--action);padding:13px 20px;min-height:48px;font:550 14px/1.5 var(--ui);text-decoration:none}
.marketing .text-link{font-size:13px;font-weight:550}
.marketing .hero-signature{font-size:12px;color:var(--muted);border-left:2px solid var(--orange);padding-left:var(--s3);margin:var(--s8) 0 0}
.marketing .hero-demo{background:var(--mint);border-radius:8px;padding:var(--s6);min-width:0}
.hero-demo>p:not(.eyebrow){font-size:13px;margin-bottom:var(--s5)}
.marketing .hero-demo h2{font-size:32px;margin-bottom:var(--s3)}
.marketing .proef{background:transparent;padding:0;border:0;margin:0}
.marketing .proef .veld{font:400 16px/1.6 var(--ui);min-height:124px;margin-top:var(--s3);background:var(--paper);padding:var(--s4);border:1px solid var(--muted);border-radius:4px}
.marketing .aanbod{gap:var(--s2);margin-top:var(--s3)}
.marketing .aanbod button{font:500 12px/1.45 var(--ui);border:1px solid var(--muted);border-radius:4px;padding:10px 12px;min-height:40px;color:var(--ink);background:var(--paper)}
.marketing .aanbod button:disabled{color:var(--muted);border-style:dashed}
.marketing .regel{font:400 12px/1.5 var(--ui);min-height:54px;margin-top:var(--s3)}
.marketing .proef .fijn{font-size:11px;line-height:1.6;margin-top:var(--s3)}
.marketing section{padding:var(--s10) 0;border-bottom:1px solid var(--line)}
.marketing .section-heading{margin-bottom:var(--s6)}
.marketing .section-heading h2{margin:0}
.marketing .section-heading .eyebrow{margin-bottom:var(--s3)}
.entry-grid{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s4)}
.entry-grid li{display:flex;min-width:0}
.marketing .entry-grid a{display:flex;flex-direction:column;width:100%;padding:var(--s6);border:1px solid transparent;border-radius:6px;background:var(--mint);color:var(--ink);text-decoration:none}
.marketing .entry-grid li:nth-child(2) a{background:var(--purple)}
.marketing .entry-grid li:nth-child(3) a{background:var(--peach)}
.step-no{font-size:12px;font-weight:650;margin-bottom:var(--s5);border-bottom:2px solid var(--orange);align-self:start;padding-bottom:var(--s1)}
.entry-grid p{font-size:14px;margin:0 0 var(--s5)}
.card-link{margin-top:auto;display:flex;justify-content:space-between;gap:var(--s4);font-size:13px;font-weight:550;text-decoration:underline}
.marketing .beeld{background:var(--purple);padding:var(--s6);border:0;border-radius:6px;margin:var(--s10) 0}
.marketing .beeld img{display:block;max-width:920px;width:100%;margin:auto;border:1px solid var(--line);border-radius:4px}
.marketing .beeld figcaption{max-width:920px;font:400 12px/1.65 var(--ui);color:var(--muted);margin:var(--s4) auto 0}
.marketing .reading-section>p{font-size:16px}
.marketing .reading-section h2{max-width:32ch}
.marketing .reading-section:has(>h2){display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:var(--s4) var(--s12)}
.marketing .reading-section>h2{grid-column:1;grid-row:1/span 2}
.marketing .reading-section:has(>h2)>:not(h2){grid-column:2;margin-top:0}
.marketing table{font-size:14px;line-height:1.55;margin-top:var(--s4)}
.marketing th{font:550 11px/1.5 var(--ui);color:var(--muted)}
.marketing :is(th,td){padding:var(--s3) var(--s2);overflow-wrap:anywhere}
.marketing #keten :is(th,td){overflow-wrap:normal;word-break:normal;hyphens:none}
.marketing #keten :is(th,td):first-child{width:1%;padding-right:var(--s5)}
.marketing .schuif{overflow-x:auto}
.marketing .rapport{background:var(--purple);border-color:var(--line)}
.marketing .rapport .uit{font:400 13px/1.7 var(--ui)}
.marketing .rapport .schuif table{min-width:500px}
.marketing .anders{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s4);margin-top:var(--s6)}
.marketing #onderscheid{display:block}
.marketing .anders>div{display:block;background:var(--paper);border:1px solid var(--line);border-top:3px solid var(--orange);border-radius:4px;padding:var(--s5)}
.marketing .anders .markt{font:400 13px/1.6 var(--ui);color:var(--muted)}
.marketing .anders .wij{font:400 15px/1.65 var(--ui);border-top:1px solid var(--line);padding-top:var(--s3);margin-top:var(--s3)}
.marketing .fundament{background:var(--mint);color:var(--ink);border:0;border-radius:6px;padding:var(--s8);margin:0}
.marketing .fundament :is(h2,p,li,b){color:var(--ink)}
.marketing .fundament .draagt{font:400 19px/1.55 var(--ui);max-width:66ch}
.marketing .fundament ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s6);padding:0;list-style:none}
.marketing .fundament li{padding:var(--s4) 0;border-top:1px solid var(--muted);font-size:14px}
.marketing .fundament .naamplaat{opacity:1;color:var(--teal);font:500 12px/1.55 var(--ui);overflow-wrap:anywhere}
.marketing .fundament .slot{font-size:14px;border-top:1px solid var(--muted);padding-top:var(--s4)}
.marketing details>summary{font:500 22px/1.3 var(--lees);cursor:pointer;padding:var(--s3) 0;color:var(--ink)}
.marketing details[open]>summary{margin-bottom:var(--s6)}
.marketing .stap{background:var(--peach);border:0;border-radius:6px;padding:var(--s8);margin:var(--s10) 0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s4) var(--s10)}
.marketing .stap>:not(.prijs){grid-column:1}
.marketing .stap h2{color:var(--ink)}
.marketing .stap .prijs{grid-column:2;grid-row:1/span 5;background:var(--paper);padding:var(--s6);margin:0;border:0;align-self:start;border-radius:6px}
.marketing .prijs .helft{font:500 32px/1.2 var(--lees);color:var(--ink)}
.marketing .stap .afbreek{font-size:13px;border-color:var(--line);margin:0}
.marketing .offer-action{margin-top:var(--s2)}
.marketing .pace{padding:var(--s8);background:var(--purple);border:0;border-radius:6px;margin:var(--s8) 0}
.marketing .pace .tempo{font:500 40px/1.1 var(--lees);color:var(--teal);max-width:none;margin:var(--s6) 0}
.marketing .pace .tempo small{font:400 14px/1.6 var(--ui);max-width:70ch;color:var(--ink)}
.marketing .rekensom{gap:var(--s8)}
.marketing .rekensom .w{font-family:var(--lees)}
.marketing .contact-section{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:var(--s12);padding:var(--s8);margin-top:var(--s8);background:var(--peach);border:0;border-radius:6px}
.marketing .contact-section h2{max-width:20ch}
.marketing .contact-actions{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:var(--s4);font-size:14px;min-width:0}
.marketing footer{padding:var(--s8) 0;margin-top:var(--s10);border-top:1px solid var(--line);grid-template-columns:minmax(0,1fr) auto;gap:var(--s8);font-family:var(--ui)}
.marketing footer .gegevens{font:400 12px/1.8 var(--ui)}
.marketing footer .merk{font-family:var(--lees);font-size:22px}
.marketing footer .deur a{color:var(--ink);font-size:14px;overflow-wrap:anywhere}
.marketing footer .afzender p{font-size:13px}
.marketing-reading .opening{padding:var(--s12) 0 var(--s8)}
.marketing-reading .opening h1{max-width:24ch}
.marketing-reading .opening .leid{max-width:70ch}
.marketing-reading main:not(.access-page)>section{max-width:960px;margin:auto}
.marketing-reading .stelsel div,.marketing-reading .cijfers div{background:var(--mint);border:0;border-radius:6px;padding:var(--s5)}
.marketing-reading .stelsel div:nth-child(2){background:var(--purple)}
.marketing-reading .stelsel div:nth-child(3){background:var(--peach)}
.marketing-reading nav.inhoud a{border-radius:4px;padding:10px 14px}
.marketing-reading .cyclus{max-width:none}
.marketing-reading .access-page{max-width:850px;margin:var(--s12) auto;padding-block:var(--s8)}
.marketing-reading .kaart{background:var(--mint);border:0;padding:var(--s8);border-radius:6px;margin-top:var(--s8)}
@media(hover:hover) and (pointer:fine){.marketing a.knop:hover{filter:brightness(.94)}.marketing .entry-grid a:hover{border-color:var(--teal)}.marketing .aanbod button:hover:not(:disabled){background:var(--purple);border-color:var(--teal)}}
@media(max-width:1000px){.marketing .blad{padding-inline:var(--s6)}#marketing-nav{gap:var(--s4);font-size:12px}.marketing .marketing-hero{gap:var(--s6)}.marketing .hero-demo{padding:var(--s5)}.marketing .hero-demo h2{font-size:28px}.marketing .entry-grid a{padding:var(--s5)}}
@media(max-width:760px){.marketing .blad{padding-inline:var(--s5)}.marketing-mast{min-height:82px;flex-wrap:wrap;gap:var(--s4)}.marketing .product-merk{font-size:23px}#marketing-nav{width:100%;margin:0;flex-wrap:wrap;gap:var(--s2) var(--s5)}.menu-button{margin-left:auto;display:block}.js-marketing #marketing-nav{display:none}.js-marketing .menu-open #marketing-nav{display:flex}.marketing .marketing-hero{grid-template-columns:minmax(0,1fr);padding:var(--s8) 0;gap:var(--s8)}.hero-copy{padding-top:0}.marketing .hero-copy h1{font-size:clamp(38px,8vw,56px)}.marketing .hero-lead{font-size:16px;margin:var(--s6) 0}.marketing .hero-signature{margin-top:var(--s6)}.entry-grid{grid-template-columns:1fr;gap:var(--s3)}.entry-grid .step-no{margin-bottom:var(--s3)}.marketing .anders,.marketing .fundament ul{grid-template-columns:1fr}.marketing section{padding:var(--s8) 0}.marketing .reading-section:has(>h2){display:block}.marketing .reading-section>h2{margin-bottom:var(--s5)}.marketing .stap,.marketing .contact-section{display:block;padding:var(--s5)}.marketing .stap .prijs{margin-top:var(--s6)}.marketing .contact-actions{margin-top:var(--s6)}.marketing .fundament,.marketing .pace{padding:var(--s5)}.marketing .beeld{padding:var(--s4);margin:var(--s8) 0}.marketing .rekensom{gap:var(--s5)}.marketing .rekensom div{min-width:0;flex:1 1 110px}.marketing footer{display:block}.marketing footer .gegevens{text-align:left;margin-top:var(--s6)}.marketing-reading .access-page{margin:var(--s8) 0}.marketing .kaart{padding:var(--s5)}.marketing p,.marketing a{overflow-wrap:break-word}.marketing-reading .opening{padding-top:var(--s8)}}
@media(prefers-reduced-motion:reduce){.marketing *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.marketing .klok{color:var(--teal)}

@media(max-width:760px){
  .marketing-mast{position:relative;z-index:20}
  .js-marketing .menu-button{display:inline-flex;align-items:center;justify-content:space-between;gap:8px;min-width:100px;min-height:44px;padding:8px 12px;font-size:13px}
  .js-marketing .menu-button[aria-expanded="true"]{background:var(--paper);border-color:var(--line);color:var(--teal)}
  .menu-button svg{width:16px;height:16px;stroke-width:1.6}
  #marketing-nav ul{width:100%;flex-direction:column;align-items:stretch;gap:0}
  #marketing-nav li{width:100%}
  #marketing-nav a{display:flex;align-items:center;min-height:48px;padding:10px 8px;font-size:14px;font-weight:450;border-bottom:1px solid color-mix(in srgb,var(--line) 65%,transparent)}
  #marketing-nav .nav-contact{justify-content:space-between;gap:12px;border:0;background:transparent;color:var(--teal);font-weight:550;border-radius:0;margin-top:0}
  #marketing-nav .nav-contact svg{color:var(--orange)}
  .js-marketing #marketing-nav{position:absolute;top:calc(100% + 6px);left:0;right:0;width:auto;padding:4px 12px;background:var(--paper);border:1px solid var(--line);border-radius:4px;box-shadow:0 6px 18px rgb(23 45 49 / .08);max-height:calc(100dvh - 140px);overflow-y:auto;overscroll-behavior:contain}
}
@media(max-width:380px){
  .marketing-mast{gap:8px}
  .marketing .product-merk{font-size:18px;gap:8px}
  .product-merk .teken{width:36px}
  .js-marketing .menu-button{min-width:100px;padding-inline:10px}
}
