@font-face{font-family:"Inter Tight";src:url(intertight.woff2) format("woff2");font-weight:400 800;font-display:swap}
:root{
  --black:#000;--white:#fff;--fill:#F3F3F3;--fill2:#E8E8E8;--line:#E2E2E2;--muted:#5E5E5E;
  --cyan:#00D8F5;--mag:#C42A9E;--red:#FF3B5C;--err:#D21F3C;
  --grad:linear-gradient(90deg,var(--cyan),var(--mag) 55%,var(--red));
  --r:8px;--f:"Inter Tight",-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{font-family:var(--f);color:var(--black);background:var(--white);font-size:16px;line-height:1.5;padding-bottom:env(safe-area-inset-bottom,0)}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:0}
:focus-visible{outline:3px solid var(--cyan);outline-offset:2px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
[hidden]{display:none!important}

/* nav */
.nav{background:var(--black);color:var(--white);display:flex;align-items:center;justify-content:space-between;padding:calc(14px + env(safe-area-inset-top,0)) clamp(16px,4vw,64px) 14px;position:sticky;top:0;z-index:20}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:21px;letter-spacing:-.02em;text-decoration:none}
.nav nav{display:flex;gap:22px;align-items:center;font-weight:500;font-size:15px}
.nav nav a{text-decoration:none}
.nav-b{background:var(--white);color:var(--black);padding:8px 14px;border-radius:999px}
@media(max-width:640px){.nav nav a:not(.nav-b){display:none}}

/* buttons */
.btn{text-decoration:none;display:inline-flex;align-items:center;justify-content:center;background:var(--black);color:var(--white);font-weight:600;font-size:17px;padding:16px 22px;border-radius:var(--r);width:100%;min-height:56px;transition:background .15s}
.btn:hover{background:#333}
.btn:disabled{background:#BDBDBD;cursor:not-allowed}
.btn.inv{background:var(--white);color:var(--black);width:auto}
.btn.inv:hover{background:var(--fill2)}
.btn.ghost{background:var(--fill);color:var(--black)}
.btn.ghost:hover{background:var(--fill2)}
.btn.sm{min-height:44px;padding:10px 18px;font-size:15px;width:auto}

/* hero */
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,80px);align-items:center;padding:clamp(32px,6vw,88px) clamp(16px,4vw,64px);max-width:1280px;margin:0 auto}
h1{font-size:clamp(42px,6.2vw,76px);line-height:1.02;font-weight:700;letter-spacing:-.035em;max-width:11ch}
.sub{font-size:clamp(17px,1.6vw,20px);color:var(--muted);margin:20px 0 28px;max-width:44ch}
.route{position:relative;display:grid;gap:10px;max-width:460px;padding-left:28px}
.route-line{position:absolute;left:4px;top:23px;bottom:94px;display:flex;flex-direction:column;align-items:center;width:10px}
.route-line .dot{width:9px;height:9px;border-radius:50%;background:var(--black)}
.route-line .bar{flex:1;width:2px;background:var(--black);margin:3px 0}
.route-line .sq{width:9px;height:9px;background:var(--black)}
.field input,.in{width:100%;background:var(--fill);border:2px solid transparent;border-radius:var(--r);font:inherit;font-size:17px;padding:15px 16px;min-height:56px;color:var(--black)}
.field input:focus,.in:focus{outline:none;border-color:var(--black);background:var(--white)}
.route .btn{margin-top:6px}
.fine{font-size:14px;color:var(--muted);margin-top:14px;padding-left:28px}

/* phone illustration */
.hero-r{display:flex;justify-content:center}
.phone{width:min(330px,80vw);aspect-ratio:9/18.5;border:10px solid var(--black);border-radius:44px;overflow:hidden;position:relative;background:#E9ECEF}
.ph-map{position:absolute;inset:0;background-color:#E9ECEF;background-image:linear-gradient(#DADDE1 2px,transparent 2px),linear-gradient(90deg,#DADDE1 2px,transparent 2px),linear-gradient(35deg,transparent 48%,#fff 48%,#fff 52%,transparent 52%);background-size:46px 46px,46px 46px,100% 100%}
.ph-map i{position:absolute;width:14px;height:14px;background:var(--black);border:3px solid var(--white);border-radius:50%}
.ph-map i.me{width:18px;height:18px;background:var(--red);box-shadow:0 0 0 8px rgba(255,59,92,.18)}
.ph-sheet{position:absolute;left:0;right:0;bottom:0;background:var(--white);border-radius:20px 20px 0 0;padding:10px 16px 18px;box-shadow:0 -6px 20px rgba(0,0,0,.12);animation:rise .7s .3s cubic-bezier(.2,.8,.2,1) both}
@keyframes rise{from{transform:translateY(100%)}}
@media(prefers-reduced-motion:reduce){.ph-sheet{animation:none}}
.grab{width:38px;height:4px;background:#D5D5D5;border-radius:4px;margin:0 auto 10px}
.ph-k{font-weight:700;font-size:15px}
.ph-vid{height:110px;border-radius:10px;background:#1B1B1B;margin:8px 0 10px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:22px;position:relative;overflow:hidden}
.ph-vid:before{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--grad)}
.ph-t{font-weight:700;font-size:15px;margin-bottom:4px}
.ph-r{display:flex;justify-content:space-between;font-size:13px;padding:6px 0;border-bottom:1px solid var(--line)}
.ph-btns{display:flex;gap:8px;margin-top:12px;font-weight:600;font-size:14px}
.ph-btns span{padding:11px;border-radius:8px;text-align:center}
.ph-btns .g{flex:1;background:var(--fill)}.ph-btns .k{flex:2;background:var(--black);color:var(--white)}

/* sections */
.how,.faq{max-width:1280px;margin:0 auto;padding:clamp(40px,6vw,80px) clamp(16px,4vw,64px)}
h2{font-size:clamp(28px,3.4vw,40px);line-height:1.1;font-weight:700;letter-spacing:-.025em;margin-bottom:24px}
.steps{list-style:none;counter-reset:s;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,3vw,40px)}
.steps li{counter-increment:s;border-top:2px solid var(--black);padding-top:16px}
.steps li:before{content:counter(s);display:block;font-size:44px;font-weight:700;letter-spacing:-.03em;line-height:1;margin-bottom:12px}
.steps b{font-size:19px}.steps p{color:var(--muted);margin-top:6px}
.nocv{background:var(--black);color:var(--white);display:flex;justify-content:space-between;align-items:center;gap:24px;padding:clamp(40px,6vw,72px) clamp(16px,4vw,64px)}
.nocv p{color:#BDBDBD;max-width:52ch}
.nocv h2{margin-bottom:10px}
.faq{max-width:860px;margin-left:clamp(16px,4vw,64px)}
details{border-bottom:1px solid var(--line);padding:18px 0}
summary{font-weight:600;font-size:18px;cursor:pointer;list-style:none;display:flex;justify-content:space-between}
summary::after{content:"+";font-size:22px;line-height:1}
details[open] summary::after{content:"−"}
details p{color:var(--muted);margin-top:8px}
.foot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:28px clamp(16px,4vw,64px);border-top:1px solid var(--line);font-size:14px;color:var(--muted)}
.foot img{vertical-align:middle;margin-right:6px}
.foot a{margin-left:16px}
@media(max-width:860px){
  .hero{grid-template-columns:1fr}
  .hero-r{order:2}
  .phone{width:min(280px,72vw)}
  .steps{grid-template-columns:1fr}
  .nocv{flex-direction:column;align-items:flex-start}
  .nocv .btn{width:100%}
}

/* flow */
.flow{position:fixed;inset:0;background:var(--white);z-index:50;display:flex;flex-direction:column}
.flow-top{display:flex;align-items:center;gap:12px;padding:calc(10px + env(safe-area-inset-top,0)) 16px 10px;max-width:640px;width:100%;margin:0 auto}
.back,.close{width:44px;height:44px;border-radius:50%;font-size:20px;display:flex;align-items:center;justify-content:center}
.back:hover,.close:hover{background:var(--fill)}
.prog{flex:1;height:4px;background:var(--fill2);border-radius:4px;overflow:hidden}
.prog span{display:block;height:100%;width:0;background:var(--grad);transition:width .35s ease}
.flow-body{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch}
.step{max-width:640px;margin:0 auto;padding:12px 20px 32px}
.step h2{font-size:clamp(28px,6vw,36px);margin:8px 0 8px}
.hint{color:var(--muted);margin-bottom:8px}
.lbl{display:block;font-weight:600;font-size:15px;margin:22px 0 8px}
.lbl small{font-weight:400;color:var(--muted)}
.mt{margin-top:10px}
textarea.in{resize:vertical;min-height:96px;line-height:1.4}
select.in{appearance:none;background-image:linear-gradient(45deg,transparent 50%,#000 50%),linear-gradient(135deg,#000 50%,transparent 50%);background-position:calc(100% - 22px) 50%,calc(100% - 16px) 50%;background-size:6px 6px;background-repeat:no-repeat}
.loon{display:flex;align-items:center;gap:10px}
.loon>span:first-child{font-weight:700;font-size:20px}
.loon .in{max-width:160px}
.loon>span:last-child{color:var(--muted);font-size:15px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.two .lbl{margin-top:22px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips button{background:var(--fill);border-radius:999px;padding:10px 16px;font-weight:500;font-size:15px;min-height:44px;transition:background .12s}
@media(hover:hover){.chips button:hover{background:var(--fill2)}}
.chips button.on,.chips button.on:hover{background:var(--black);color:var(--white)}
.chips[data-fill]{margin-top:10px}
.flow-cta{padding:12px 20px calc(12px + env(safe-area-inset-bottom,0));border-top:1px solid var(--line);background:var(--white)}
.flow-cta .btn{max-width:600px;margin:0 auto;display:flex}
.err{color:var(--err);font-weight:500;margin-top:14px;min-height:1px}
.in.bad{border-color:var(--err);background:#FFF5F6}

.pick{display:flex;align-items:center;gap:16px;width:100%;text-align:left;background:var(--fill);border:2px solid transparent;border-radius:12px;padding:18px;margin-top:14px;cursor:pointer;position:relative}
.pick:hover{background:var(--fill2)}
.pick.on{border-color:var(--black);background:var(--white)}
.pick input{position:absolute;inset:0;opacity:0;cursor:pointer}
.pick-i{width:48px;height:48px;border-radius:50%;background:var(--black);color:var(--white);display:flex;align-items:center;justify-content:center;font-size:20px;flex:none}
.pick b{display:block;font-size:17px}.pick small{color:var(--muted);font-size:14px}
.link{display:block;margin:20px auto 0;text-decoration:underline;text-underline-offset:3px;font-weight:500;color:var(--black);padding:8px}

.job{background:var(--fill);border-radius:12px;padding:14px;margin-bottom:10px;position:relative}
.job .in{background:var(--white);min-height:48px;padding:11px 12px;font-size:16px;margin-top:8px}
.job .in:first-of-type{margin-top:0}
.job .row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.job .rm{position:absolute;right:6px;top:6px;width:32px;height:32px;border-radius:50%;font-size:14px;color:var(--muted)}
.job-h{font-size:13px;font-weight:600;color:var(--muted);margin-bottom:8px}
.add{width:100%;border:2px dashed #BDBDBD;border-radius:12px;padding:14px;font-weight:600}
.add:hover{border-color:var(--black)}

.sum{background:var(--fill);border-radius:12px;padding:6px 16px}
.sum div{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);font-size:15px}
.sum div:last-child{border-bottom:0}
.sum span{color:var(--muted)}.sum b{text-align:right;font-weight:600}
.consent{display:flex;gap:12px;align-items:flex-start;margin-top:22px;font-size:15px;cursor:pointer}
.consent input{width:24px;height:24px;flex:none;accent-color:#000;margin-top:1px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}

.done{text-align:center;padding-top:48px}
.done img{margin-bottom:16px}
.done h2{font-size:clamp(36px,8vw,52px)}
.done p{font-size:18px;margin-bottom:8px}
.code{font-size:22px;letter-spacing:.04em;padding:2px 10px;border-radius:6px;background:var(--black);color:var(--white)}
.done .btn{margin-top:14px;max-width:360px}

/* cookie */
.cookie{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0));max-width:520px;margin:0 auto;background:var(--white);border-radius:14px;box-shadow:0 8px 30px rgba(0,0,0,.18);padding:16px;z-index:60;display:flex;flex-direction:column;gap:12px;font-size:15px}
.cookie div{display:flex;gap:8px;justify-content:flex-end}

/* privacy page */
.doc{max-width:760px;margin:0 auto;padding:48px 20px 80px}
.doc h1{font-size:44px;max-width:none;margin-bottom:20px}
.doc h2{font-size:22px;margin:28px 0 8px}
.doc p,.doc li{color:#333;margin-bottom:8px}
.doc ul{padding-left:20px}

/* ===== bedrijven ===== */
.b-hero{max-width:1280px;margin:0 auto;padding:clamp(40px,6vw,88px) clamp(16px,4vw,64px) 24px}
.b-hero h1{max-width:13ch}
.b-cta{display:flex;gap:10px;flex-wrap:wrap;max-width:460px}
.b-cta .btn{flex:1;min-width:180px}
.b-price{background:var(--black);color:var(--white);margin:clamp(24px,4vw,48px) 0 0;padding:clamp(36px,5vw,64px) clamp(16px,4vw,64px);display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(20px,4vw,64px);align-items:center}
.b-price .big{font-size:clamp(40px,6vw,72px);font-weight:700;letter-spacing:-.035em;line-height:1}
.b-price .big span{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.b-price p{color:#BDBDBD;font-size:17px;margin-top:14px;max-width:46ch}
.b-price ul{list-style:none;display:grid;gap:12px}
.b-price li{border-top:1px solid #333;padding-top:12px;display:flex;justify-content:space-between;gap:16px}
.b-price li b{color:#fff}.b-price li span{color:#BDBDBD;text-align:right}
.b-sec{max-width:1280px;margin:0 auto;padding:clamp(40px,6vw,80px) clamp(16px,4vw,64px)}
.b-sec>p.sub{margin-top:-8px}
@media(max-width:860px){.b-price{grid-template-columns:1fr}}

/* dashboard voorbeeld */
.dash{border:10px solid var(--black);border-radius:22px;overflow:hidden;background:#fff;font-size:14px;margin-top:24px}
.d-top{background:var(--black);color:#fff;display:flex;align-items:center;gap:26px;padding:14px 20px;flex-wrap:wrap}
.d-top .brand{font-size:19px}
.d-top .tab{color:#8A8A8A;font-weight:500}.d-top .tab.on{color:#fff}
.d-top .sp{flex:1}
.d-top .bill{color:var(--cyan);font-weight:600;font-size:14px}
.d-body{display:grid;grid-template-columns:1.45fr 1fr}
.d-l{padding:18px;border-right:1px solid var(--line)}
.d-r{padding:18px;background:#FAFAFA}
.d-vac{display:flex;gap:8px;margin-bottom:12px}
.d-sel{flex:1;background:var(--fill);border-radius:var(--r);padding:12px 16px;display:flex;justify-content:space-between;align-items:center}
.d-sel small{display:block;color:var(--muted);font-size:12px;font-weight:500}
.d-sel b{font-size:16px}
.d-plus{width:56px;flex:none;background:var(--black);color:#fff;border-radius:var(--r);font-size:26px;font-weight:400;display:flex;align-items:center;justify-content:center}
.d-link{border:1.5px dashed var(--mag);border-radius:10px;padding:10px 12px;display:flex;justify-content:space-between;align-items:center;gap:10px;font-weight:600;margin-bottom:16px}
.d-mini{background:#000;color:#fff;border-radius:8px;padding:8px 12px;font-weight:600;font-size:13px;white-space:nowrap}
.d-mini.g{background:var(--fill);color:#000}
.d-h{font-weight:700;font-size:16px}
.d-sub{color:var(--muted);font-size:13px;margin-bottom:10px}
.d-c{display:grid;grid-template-columns:48px 1fr 86px 110px;gap:12px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:12px;margin-bottom:10px}
.d-av{width:48px;height:48px;border-radius:50%;background:#000;color:#fff;font-weight:700;font-size:13px;display:flex;align-items:center;justify-content:center}
.d-meta{color:var(--muted);font-size:12.5px;display:flex;flex-wrap:wrap;gap:4px 10px;margin-top:3px}
.d-act{text-align:center}
.d-act small{display:block;color:var(--muted);font-size:11.5px;margin-top:4px}
.spider-s svg{width:86px;height:80px;display:block}
.d-box{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px;margin-bottom:12px}
.d-leg{display:flex;gap:14px;font-size:12px;color:var(--muted)}
.d-leg i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:5px;vertical-align:-1px}
.d-kpi{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:14px}
.d-kpi div{background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px}
.d-kpi b{display:block;font-size:22px;letter-spacing:-.02em}
.d-kpi span{font-size:12.5px;color:var(--muted)}
.d-p{display:flex;justify-content:space-between;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:9px 11px;margin-bottom:7px}
.d-s{font-size:11.5px;font-weight:700;border-radius:999px;padding:3px 9px;white-space:nowrap}
.s-k{background:#000;color:#fff}.s-c{background:#E8FBFE;color:#007f93}.s-y{background:#FFF3CD}.s-n{background:var(--fill);color:var(--muted)}
.d-note{font-size:13px;color:var(--muted);margin-top:4px}
@media(max-width:900px){.d-body{grid-template-columns:1fr}.d-l{border-right:0;border-bottom:1px solid var(--line)}.d-top .tab{display:none}.d-c{grid-template-columns:44px 1fr 86px}.d-c .d-act{grid-column:2/4;text-align:left;display:flex;align-items:center;gap:10px}.d-c .d-act small{margin:0}}

/* bedrijf formulier */
.b-form{display:grid;grid-template-columns:1fr 1fr;gap:0 12px;max-width:720px}
.b-form .full{grid-column:1/-1}
@media(max-width:640px){.b-form{grid-template-columns:1fr}}
.b-done{background:var(--fill);border-radius:14px;padding:28px;max-width:720px}

@media(max-width:640px){.b-hero h1{font-size:38px}.b-hero h1 br.dk{display:none}}

/* prijsmodule */
.plans{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:980px}
.plan{background:var(--fill);border-radius:16px;padding:28px;display:flex;flex-direction:column}
.plan.dark{background:var(--black);color:var(--white)}
.ptag{align-self:flex-start;font-size:13px;font-weight:700;border-radius:999px;padding:5px 12px;background:var(--black);color:var(--white);margin-bottom:18px}
.plan.dark .ptag{background:var(--grad)}
.pbig{font-size:clamp(36px,4.5vw,52px);font-weight:700;letter-spacing:-.03em;line-height:1}
.punit{color:var(--muted);margin-top:6px}.plan.dark .punit{color:#BDBDBD}
.pline{font-weight:600;margin:14px 0 6px}
.plan ul{list-style:none;margin:8px 0 24px;flex:1}
.plan li{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid var(--line);font-size:15px}
.plan.dark li{border-color:#333}
.plan li span{color:var(--muted)}.plan.dark li span{color:#BDBDBD}
.plan li b{text-align:right}.plan li small{font-weight:500;color:var(--cyan);margin-left:4px}
.plan .btn{width:100%}
@media(max-width:760px){.plans{grid-template-columns:1fr}}
.btw-st{font-size:14px;margin-top:8px;min-height:20px;color:var(--muted)}
.btw-st.ok{color:#00813f;font-weight:600}
.btw-st.bad{color:var(--err);font-weight:500}
.btw-st.busy{color:var(--muted)}

.done .done-txt{font-size:17px;max-width:440px;margin:0 auto 10px;color:#333}
.done-share{background:var(--fill);border-radius:14px;padding:18px;max-width:400px;margin:24px auto 0}
.done-share p{font-size:15px;margin-bottom:10px;font-weight:600}
.done-share .btn{margin-top:0}
.done .done-ref{font-size:13px;color:var(--muted);margin-top:20px}
.done .done-share p{font-size:15px}
.done .done-mail{font-size:14px;color:var(--muted);max-width:400px;margin:4px auto 0}

/* dashboard-voorbeeld (zoals de echte business-kant) */
.p2{border:10px solid var(--black);border-radius:22px;overflow:hidden;background:#F4F4F4;color:#000;margin-top:24px;font-size:14px}
.p2-top{background:var(--black);color:#fff;display:flex;align-items:center;gap:18px;padding:12px 20px}
.p2-top .brand{font-size:19px}
.p2-tab{color:#bdbdbd;font-weight:600;padding:8px 14px;border-radius:999px}
.p2-tab.on{background:#fff;color:#000}
.p2-sp1{flex:1}
.p2-pill{border:1px solid #444;border-radius:999px;padding:7px 14px;font-weight:600;font-size:13px}
.p2-ic{width:34px;height:34px;border:1px solid #444;border-radius:50%;display:flex;align-items:center;justify-content:center}
.p2-avatar{width:36px;height:36px;border-radius:50%;background:#fff;color:#000;font-weight:800;font-size:13px;display:flex;align-items:center;justify-content:center}
.p2-body{max-width:880px;margin:0 auto;padding:22px 18px 26px}
.p2-vacs{display:flex;gap:10px;margin-bottom:14px}
.p2-vac{background:#000;color:#fff;border-radius:14px;padding:14px 16px;display:flex;flex-direction:column;gap:4px;min-width:200px}
.p2-vac b{font-size:17px}.p2-vac span{color:#cfcfcf;font-size:13px}
.p2-tag{font-style:normal;background:#dcfce7;color:#166534;font-weight:700;border-radius:999px;padding:2px 8px;font-size:12px}
.p2-vac small{color:#9a9a9a}
.p2-new{border:1.5px dashed #d4d4d4;background:#fff;border-radius:14px;padding:0 18px;display:flex;align-items:center;font-weight:700}
.p2-link{border:1.5px dashed var(--mag);border-radius:14px;background:#fff;padding:12px 14px;margin-bottom:14px}
.p2-link p{margin:0 0 10px;line-height:1.45}
.p2-free{font-style:normal;background:#16a34a;color:#fff;font-weight:700;border-radius:6px;padding:1px 7px;font-size:12px}
.p2-lrow{display:flex;gap:8px;flex-wrap:wrap}
.p2-url{flex:1;min-width:200px;background:#F4F4F4;border-radius:8px;padding:9px 12px;font-weight:500}
.p2-b{background:#EDEDED;border-radius:8px;padding:9px 14px;font-weight:700}
.p2-b.k{background:#000;color:#fff}
.p2-kpi{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:10px}
.p2-kpi div{background:#fff;border:1px solid #e5e5e5;border-radius:12px;padding:12px 14px}
.p2-kpi div.on{background:#000;color:#fff;border-color:#000}
.p2-kpi b{display:block;font-size:24px;line-height:1.1}
.p2-kpi span{font-size:13px;color:#6b6b6b}.p2-kpi .on span{color:#cfcfcf}
.p2-note{font-size:13px;color:#6b6b6b;margin:0 0 10px}
.p2-search{display:flex;gap:8px;margin-bottom:10px}
.p2-q{flex:1;background:#fff;border:1px solid #e5e5e5;border-radius:10px;padding:10px 12px;color:#8a8a8a}
.p2-sort{background:#fff;border:1px solid #e5e5e5;border-radius:10px;padding:10px 14px;font-weight:700}
.p2-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.p2-chips span{background:#fff;border:1px solid #e5e5e5;border-radius:999px;padding:6px 12px;font-weight:600;font-size:13px;display:inline-flex;align-items:center;gap:6px}
.p2-chips i{width:8px;height:8px;border-radius:50%;display:inline-block}
.p2-chips em{font-style:normal;color:#8a8a8a}
.p2-row{display:grid;grid-template-columns:52px 1fr 84px 130px;gap:14px;align-items:center;background:#fff;border:1px solid #e5e5e5;border-radius:14px;padding:14px 16px;margin-bottom:10px}
.p2-av{width:52px;height:52px;border-radius:50%;background:#000;color:#fff;font-weight:800;font-size:14px;display:flex;align-items:center;justify-content:center}
.p2-t{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.p2-t b{font-size:16px}
.p2-sc{font-weight:700;font-size:12px;border-radius:6px;padding:2px 7px}
.p2-g{background:#dcfce7;color:#166534}.p2-o{background:#fef3c7;color:#92400e}
.p2-meta{display:flex;flex-wrap:wrap;gap:4px 14px;color:#5e5e5e;font-size:13px;margin-top:4px}
.p2-pop{color:#e11d48;font-weight:700}
.p2-sp svg{width:84px;height:84px;display:block}
.p2-act{text-align:center}
.p2-btn{display:block;background:#000;color:#fff;border-radius:10px;padding:10px 0;font-weight:700}
.p2-act small{display:block;color:#6b6b6b;font-size:12px;margin-top:5px}
@media(max-width:760px){.p2-top .p2-tab:not(.on),.p2-pill{display:none}.p2-row{grid-template-columns:44px 1fr 70px}.p2-act{grid-column:2/4;display:flex;align-items:center;gap:12px;text-align:left}.p2-btn{padding:9px 16px}.p2-act small{margin:0}.p2-kpi b{font-size:20px}}

/* one-liner */
.b-what{max-width:1280px;margin:0 auto;padding:8px clamp(16px,4vw,64px) 8px}
.b-what-k{font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--mag);margin-bottom:8px}
.b-what-t{font-size:clamp(22px,2.4vw,30px);line-height:1.3;font-weight:600;max-width:46ch;border-left:4px solid;border-image:var(--grad) 1;padding-left:18px}

/* demo: klikbaar + profiel */
.p2-row[data-k]{cursor:pointer;transition:border-color .15s, box-shadow .15s}
.p2-row[data-k]:hover{border-color:#bdbdbd;box-shadow:0 6px 18px rgba(0,0,0,.06)}
.p2-btn{cursor:pointer}.p2-btn.on{background:var(--accent)}
.p3-back{font-weight:700;font-size:14px;margin-bottom:12px;padding:4px 0}
.p3-card{background:#fff;border:1px solid #e5e5e5;border-radius:14px;padding:16px}
.p3-head{display:grid;grid-template-columns:52px 1fr 260px;gap:16px;align-items:center;margin-bottom:12px}
.p3-hmid b{display:block;font-size:22px;letter-spacing:-.02em}
.p3-hmid span{display:block;font-size:13px;color:#6b6b6b}.p3-hmid small{font-size:12px;color:#8a8a8a}
.p3-hact{border-left:1px solid #e5e5e5;padding-left:16px}
.p3-hact .p2-btn{display:inline-block;padding:9px 18px;margin-bottom:6px}
.p3-hact small{display:block;font-size:12px;color:#6b6b6b;line-height:1.4}
.p3-grid{display:grid;grid-template-columns:1.1fr 1.1fr .8fr;gap:12px;margin-bottom:12px}
.p3-grid2{display:grid;grid-template-columns:2fr 1fr;gap:12px;align-items:start}
.p3-ct{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px}
.p3-ct b{font-size:15px;white-space:nowrap}.p3-ct small{font-size:11px;color:#8a8a8a;text-align:right}
.p3-card p{font-size:14px;line-height:1.5;margin:0}
.p3-sp svg{width:100%;height:auto;display:block}
.p3-data{display:flex;flex-direction:column}
.p3-h{font-size:15px;margin-bottom:8px}
.p3-data span{font-size:12px;color:#6b6b6b;margin-top:8px}
.p3-data b{font-size:15px}.p3-data small{font-weight:500;color:#6b6b6b}
.p3-lock i{font-style:normal;filter:blur(4px);user-select:none}
.p3-qa{border-top:1px solid #eee;padding:9px 0}
.p3-qa span{display:block;font-size:12px;color:#6b6b6b}.p3-qa b{font-size:15px}
.p3-open{border-top:2px solid #000;margin-top:6px;padding-top:12px}
.p3-open p{font-size:13px;color:#5e5e5e;margin-top:4px}
.p3-tl{list-style:none;margin:6px 0 0;padding:0 0 0 6px;border-left:2px solid #e5e5e5}
.p3-tl li{position:relative;padding:0 0 14px 16px}
.p3-tl li:before{content:"";position:absolute;left:-8px;top:3px;width:10px;height:10px;border-radius:50%;border:2px solid #000;background:#fff}
.p3-tl b{display:block;font-size:14px}.p3-tl span{font-size:12px;color:#8a8a8a}
@media(max-width:860px){.p3-head{grid-template-columns:44px 1fr}.p3-hact{grid-column:1/-1;border:0;padding:0}.p3-grid,.p3-grid2{grid-template-columns:1fr}}

/* visuele flow: AI-agent pre-gesprek */
.fl4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:28px;position:relative}
.fl4:before{content:"";position:absolute;left:6%;right:6%;top:22px;height:3px;background:var(--grad);border-radius:3px;z-index:0}
.fl4-step{position:relative;z-index:1;display:flex;flex-direction:column;gap:10px}
.fl4-n{width:46px;height:46px;border-radius:50%;background:var(--black);color:#fff;font-weight:800;font-size:20px;display:flex;align-items:center;justify-content:center;border:4px solid #fff}
.fl4-pay .fl4-n{background:var(--grad)}
.fl4-vis{background:var(--fill);border-radius:16px;padding:16px;height:214px;box-sizing:border-box;overflow:hidden;display:flex;flex-direction:column;justify-content:center;gap:8px}
.fl4-step>b{font-size:19px;margin-top:4px}.fl4-step>p{color:var(--muted);font-size:15px;margin:0}
.fl4-vac{display:flex;align-items:center;gap:12px;background:#fff;border-radius:12px;padding:14px;border:1px solid var(--line)}
.fl4-vac span{display:flex;flex-direction:column}.fl4-vac small{color:var(--muted)}
.fl4-chat{justify-content:flex-start}
.fl4-ai{align-self:flex-start;font-size:12px;font-weight:800;background:#000;color:#fff;border-radius:999px;padding:3px 10px}
.fl4-q,.fl4-a{margin:0;font-size:14px;line-height:1.35;padding:9px 12px;border-radius:14px;max-width:88%}
.fl4-q{background:#fff;border:1px solid var(--line);align-self:flex-start;border-bottom-left-radius:4px}
.fl4-a{background:var(--black);color:#fff;align-self:flex-end;border-bottom-right-radius:4px}
.fl4-list div{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px 10px}
.fl4-list i{font-style:normal;width:34px;height:34px;border-radius:50%;background:#000;color:#fff;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center}
.fl4-list span{flex:1;font-size:13px;color:var(--muted)}
.fl4-list em{font-style:normal;font-weight:800;font-size:13px;border-radius:6px;padding:2px 7px}
.fl4-list em.g{background:#dcfce7;color:#166534}.fl4-list em.o{background:#fef3c7;color:#92400e}
.fl4-pay .fl4-vis{align-items:center}
.fl4-btn{background:#000;color:#fff;font-weight:700;border-radius:10px;padding:12px 26px}
.fl4-price{font-weight:700;font-size:14px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:6px 14px}
@media(max-width:900px){.fl4{grid-template-columns:1fr 1fr}.fl4:before{display:none}}
@media(max-width:560px){.fl4{grid-template-columns:1fr}}

/* 7-stappen flow */
.fl7{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px 18px;margin-top:28px}
.fl7-step{display:flex;flex-direction:column;gap:10px}
.fl7-n{width:40px;height:40px;border-radius:50%;background:var(--black);color:#fff;font-weight:800;font-size:18px;display:flex;align-items:center;justify-content:center}
.fl7-cand .fl7-n{background:#FFB574;color:#000}.fl7-pay .fl7-n{background:var(--grad)}
.fl7-vis{background:var(--fill);border-radius:16px;padding:14px;height:200px;box-sizing:border-box;overflow:hidden;display:flex;flex-direction:column;justify-content:center;gap:8px}
.fl7-cand .fl7-vis{background:#FFF4EA}
.fl7-step>b{font-size:17px;line-height:1.25}.fl7-step>p{color:var(--muted);font-size:14px;margin:0}
.fl7-tag,.fl7-ai{align-self:flex-start;font-size:12px;font-weight:800;background:#000;color:#fff;border-radius:999px;padding:3px 10px}
.fl7-tag{background:#FFB574;color:#000}
.fl7-file{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px;font-size:14px}
.fl7-file em{margin-left:auto;font-style:normal;color:#16a34a;font-weight:800}.fl7-file small{color:var(--muted)}
.fl7-tog{display:flex;align-items:center;justify-content:space-between;background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 12px;font-size:13px;font-weight:600}
.fl7-tog i{width:36px;height:20px;border-radius:12px;background:#16a34a;position:relative}.fl7-tog i:after{content:"";position:absolute;right:3px;top:3px;width:14px;height:14px;border-radius:50%;background:#fff}
.fl7-vis>*{flex:none}
.fl7-list div{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:7px 9px;font-size:13px}
.fl7-list div.on{border-color:#000}
.fl7-list i{font-style:normal;width:30px;height:30px;border-radius:50%;background:#000;color:#fff;font-size:10px;font-weight:800;display:flex;align-items:center;justify-content:center;flex:none}
.fl7-list span{flex:1;color:#333;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fl7-list em{font-style:normal;font-weight:800;font-size:12px;border-radius:6px;padding:2px 6px}
.fl7-list em.g,.fl7-rh em.g{background:#dcfce7;color:#166534}.fl7-list em.o{background:#fef3c7;color:#92400e}
.fl7-ck{width:20px;height:20px;border-radius:6px;border:2px solid #000;display:flex;align-items:center;justify-content:center;font-size:12px;flex:none}
.fl7-list div.on .fl7-ck{background:#000;color:#fff}
.fl7-chat{justify-content:flex-start}
.fl7-q,.fl7-a{margin:0;font-size:13px;line-height:1.35;padding:8px 11px;border-radius:13px;max-width:90%}
.fl7-q{background:#fff;border:1px solid var(--line);align-self:flex-start;border-bottom-left-radius:4px}
.fl7-a{background:var(--black);color:#fff;align-self:flex-end;border-bottom-right-radius:4px}
.fl7-rep{background:#fff;border:1px solid var(--line)}
.fl7-rh{display:flex;justify-content:space-between;align-items:center}.fl7-rh em{font-style:normal;font-weight:800;font-size:12px;border-radius:6px;padding:2px 7px}
.fl7-rep p{font-size:13px;color:#444;margin:0;line-height:1.4}
.fl7-rb{display:flex;gap:8px}.fl7-rb span{flex:1;text-align:center;border-radius:8px;padding:8px 0;font-weight:700;font-size:13px;background:var(--fill)}.fl7-rb .k{background:#000;color:#fff}
.fl7-pay .fl7-vis{align-items:stretch}
.fl7-rev{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 12px}.fl7-rev b{display:block}.fl7-rev span{font-size:12px;color:var(--muted)}
.fl7-price{align-self:center;font-weight:700;font-size:13px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:5px 12px}
.fl7-btn{text-align:center;background:#000;color:#fff;font-weight:700;border-radius:10px;padding:10px 0;font-size:14px}
@media(max-width:960px){.fl7{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.fl7{grid-template-columns:1fr}}
/* detail: weigeren/aanvaarden */
.p3-btns{display:flex;gap:8px;margin-bottom:6px}
.p3-btns .p2-btn{display:inline-block;padding:9px 16px}
.p3-no{background:#EDEDED !important;color:#000 !important}
.p3-inv.done{background:var(--accent)}
.p3-lock.open i{filter:none}.p3-lock.open u{display:none}
.p3-lock u{text-decoration:none}
.fl7-cta{justify-content:center;background:#000;color:#fff;border-radius:16px;padding:22px;display:flex;flex-direction:column;gap:12px;height:100%;min-height:200px;box-sizing:border-box}
.fl7-cta b{font-size:22px;line-height:1.2}.fl7-cta p{color:#cfcfcf;font-size:14px;margin:0}.fl7-cta .btn{width:100%}
.fl7-list .fl7-ai{flex:none;overflow:visible;color:#fff}
.p2-scr{background:#fff !important;color:#000 !important;border:2px solid #000;box-sizing:border-box}
.p2-btn.busy{background:#EDEDED !important;color:#555 !important;border-color:#EDEDED}
.p2-row.p2-new{animation:p2flash 1.2s ease-out}
@keyframes p2flash{from{box-shadow:0 0 0 3px #16a34a}to{box-shadow:0 0 0 0 rgba(22,163,74,0)}}
/* twee vacatures + 12 kandidaten, scrollbaar */
.p2-vac{cursor:pointer}
.p2-vac.off{background:#fff;color:#000;border:1px solid #e5e5e5}
.p2-vac.off span{color:#6b6b6b}
.p2-scroll{max-height:620px;overflow-y:auto;padding-right:6px;scrollbar-width:thin}
.p2-row{grid-template-columns:52px 1fr 84px 200px}
.p2-fn{font-size:15px;color:#333}
.p2-own{color:#166534;font-weight:700}
.p2-r{background:#fee2e2;color:#991b1b}
.p2-btn.p2-scr{font-size:13px;padding:10px 8px}
@media(max-width:760px){.p2-row{grid-template-columns:44px 1fr 70px}.p2-scroll{max-height:560px}}
/* pop-up uitnodigen voor een gesprek */
.im-wrap{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:80;display:flex;align-items:center;justify-content:center;padding:16px}
.im{background:#fff;color:#000;border-radius:18px;width:100%;max-width:580px;max-height:calc(100vh - 32px);overflow:auto;box-shadow:0 24px 60px rgba(0,0,0,.25)}
.im-h{display:flex;justify-content:space-between;align-items:center;padding:20px 22px 12px}.im-h b{font-size:20px;letter-spacing:-.01em}
.im-x{width:36px;height:36px;border-radius:50%;font-size:16px}.im-x:hover{background:var(--fill)}
.im-c{margin:0 22px;display:flex;align-items:center;gap:12px;background:#FFF4EA;border-radius:12px;padding:12px 14px}
.im-av{width:44px;height:44px;border-radius:50%;background:#fff;color:#C42A9E;font-weight:800;display:flex;align-items:center;justify-content:center}
.im-c b{display:block;font-size:16px}.im-c small{color:var(--muted)}
.im-body{padding:6px 22px 4px}
.im-q{display:flex;align-items:center;gap:8px;font-weight:700;margin:18px 0 10px}
.im-q i{font-style:normal;width:24px;height:24px;border-radius:50%;background:#000;color:#fff;font-size:12px;display:flex;align-items:center;justify-content:center}
.im-q small{font-weight:500;color:var(--muted)}
.im-how{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.im-how button,.im-slot{border:1.5px solid var(--line);border-radius:12px;padding:12px 8px;background:#fff;font-weight:600;font-size:14px;display:flex;flex-direction:column;align-items:center;gap:6px;transition:border-color .12s,background .12s}
.im-how svg{width:20px;height:20px}
.im-how button:hover,.im-slot:hover{border-color:#bdbdbd}
.im-how button.on,.im-slot.on{border-color:#000;background:#F4F4F4;box-shadow:inset 0 0 0 1px #000}
.im-slots{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.im-slot small{color:var(--muted);font-weight:500;font-size:13px}.im-slot b{font-size:18px}
.im-other{border-style:dashed}
.im-tel{display:inline-block;font-size:26px;font-weight:800;color:#000;text-decoration:none;border-bottom:3px solid #FFB574}
.im-hint{color:var(--muted);font-size:14px;margin-top:8px}
.im-err{color:var(--err);font-weight:600;min-height:20px;margin-top:10px;font-size:14px}
.im-f{display:flex;align-items:center;gap:10px;padding:14px 22px 20px;border-top:1px solid var(--line);margin-top:6px}
.im-f small{flex:1;color:var(--muted);font-size:13px;line-height:1.35}
.im-cancel{font-weight:700;padding:12px 14px;border-radius:10px}.im-cancel:hover{background:var(--fill)}
.im-send{background:#000;color:#fff;font-weight:700;padding:12px 18px;border-radius:10px;margin-left:auto}
.im-ok{text-align:center;padding:26px 0 10px}.im-ok span{display:inline-flex;width:56px;height:56px;border-radius:50%;background:#16a34a;color:#fff;font-size:28px;align-items:center;justify-content:center}
.im-ok b{display:block;font-size:22px;margin:12px 0 4px}.im-ok p{color:var(--muted)}
@media(max-width:560px){.im-how{grid-template-columns:1fr 1fr}.im-slots{grid-template-columns:1fr 1fr}.im-f{flex-wrap:wrap}.im-f small{flex-basis:100%}}
.fl4b .fl7-vis{height:210px}
.fl7-alt{background:#fff !important;color:#000 !important;border:1.5px solid #000}
@media(min-width:961px){.fl4b{grid-template-columns:repeat(4,minmax(0,1fr))}}
/* simpele 4 stappen */
.k4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:28px;position:relative}
.k4-s{position:relative;text-align:center;display:flex;flex-direction:column;align-items:center;gap:6px}
.k4-pic{width:100%;aspect-ratio:1/0.8;background:var(--fill);border-radius:22px;display:flex;align-items:center;justify-content:center}
.k4-last .k4-pic{background:#FFF4EA}
.k4-pic svg{width:58%;height:auto}
.k4-n{margin-top:-24px;width:44px;height:44px;border-radius:50%;background:#000;color:#fff;font-weight:800;font-size:20px;display:flex;align-items:center;justify-content:center;border:4px solid #fff}
.k4-last .k4-n{background:var(--grad)}
.k4-s b{font-size:22px;letter-spacing:-.02em;margin-top:6px}
.k4-s p{color:var(--muted);font-size:16px;margin:0}
.k4-s:not(:last-child):after{content:"→";position:absolute;right:-16px;top:36%;font-size:24px;font-weight:800;color:#C42A9E}
@media(max-width:900px){.k4{grid-template-columns:1fr 1fr}.k4-s:after{display:none}}
/* bedrijfsacties met verbindingen (AI / kandidaat) */
.k5{display:grid;grid-template-columns:1fr minmax(104px,.55fr) 1fr minmax(104px,.55fr) 1fr minmax(104px,.55fr) 1fr;align-items:start;gap:0;margin-top:28px}
.k5 .k4-s:after{display:none}
.k5 .k4-pic{aspect-ratio:1/0.85}
.k5 .k4-s b{font-size:19px;line-height:1.2}
.kc{display:flex;flex-direction:column;align-items:center;gap:8px;padding:70px 8px 0;text-align:center}
.kc-line{display:block;width:100%;height:3px;position:relative;background:repeating-linear-gradient(90deg,#C42A9E 0 8px,transparent 8px 14px)}
.kc-line:after{content:"";position:absolute;right:-2px;top:-6px;border-left:11px solid #C42A9E;border-top:7px solid transparent;border-bottom:7px solid transparent}
.kc-chip{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:800;border-radius:999px;padding:5px 10px;white-space:nowrap}
.kc-chip svg{width:14px;height:14px}
.kc-chip.ai{background:#000;color:#fff}
.kc-chip.ka{background:#FFB574;color:#000}
.kc-t{font-size:13px;font-weight:600;color:#333;line-height:1.3;padding:0 4px}
.k5-end{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-top:16px;font-weight:600;font-size:15px}
.k5-leg{display:flex;gap:20px;flex-wrap:wrap;margin-top:18px;font-size:13px;color:var(--muted)}
.k5-leg span{display:inline-flex;align-items:center;gap:7px}
.k5-leg i{display:inline-block;width:14px;height:14px;border-radius:4px}
.k5-sq{background:var(--fill);border:1px solid #ccc}.k5-ai{background:#000;border-radius:50% !important}.k5-ka{background:#FFB574;border-radius:50% !important}
@media(max-width:960px){
  .k5{grid-template-columns:1fr}
  .kc{padding:14px 0;flex-direction:row;justify-content:center}
  .kc-line{width:3px;height:34px;background:repeating-linear-gradient(180deg,#C42A9E 0 8px,transparent 8px 14px)}
  .kc-line:after{right:-6px;top:auto;bottom:-4px;border-left:7px solid transparent;border-right:7px solid transparent;border-top:11px solid #C42A9E;border-bottom:0}
  .k5 .k4-pic{max-width:320px;margin:0 auto}
  .k5-end{justify-content:center}
}
.dots{display:inline-flex;margin-left:2px}
.dots i{font-style:normal;animation:dotblink 1.2s infinite both}
.dots i:nth-child(2){animation-delay:.2s}.dots i:nth-child(3){animation-delay:.4s}
@keyframes dotblink{0%,80%,100%{opacity:.15}40%{opacity:1}}
@media(prefers-reduced-motion:reduce){.dots i{animation:none;opacity:1}}
/* proef-teaser i.p.v. prijzen */
.b-trial{padding:clamp(40px,6vw,80px) clamp(16px,4vw,64px)}
.b-trial-in{max-width:980px;margin:0 auto;background:#000;color:#fff;border-radius:24px;padding:clamp(28px,4vw,56px);display:flex;flex-direction:column;gap:16px}
.b-trial-k{align-self:flex-start;font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;background:var(--grad);border-radius:999px;padding:6px 14px}
.b-trial h2{margin:0;font-size:clamp(32px,4.4vw,56px);line-height:1.04}
.b-trial h2 span{color:#FFB574;white-space:nowrap}
.b-trial p{color:#cfcfcf;font-size:18px;max-width:56ch;margin:0}
.b-trial ul{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:10px 24px;margin:6px 0}
.b-trial li{position:relative;padding-left:28px;font-weight:600}
.b-trial li:before{content:"✓";position:absolute;left:0;top:0;width:20px;height:20px;border-radius:50%;background:#16a34a;color:#fff;font-size:12px;display:flex;align-items:center;justify-content:center}
.b-trial .btn{align-self:flex-start;width:auto}
.b-trial small{color:#9a9a9a;font-size:14px}
@media(max-width:640px){.b-trial ul{grid-template-columns:1fr}.b-trial .btn{width:100%}}
/* vergelijking */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.cmp-wrap{overflow-x:auto;margin-top:26px;border-radius:18px;border:1px solid var(--line)}
.cmp{width:100%;min-width:860px;border-collapse:separate;border-spacing:0;font-size:14px}
.cmp th,.cmp td{padding:14px 14px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.cmp tbody tr:last-child th,.cmp tbody tr:last-child td{border-bottom:0}
.cmp thead th{font-size:15px;font-weight:800;background:var(--fill)}
.cmp tbody th{font-weight:700;width:18%;background:#fff}
.cmp td span{display:block;color:#444;line-height:1.35;margin-top:4px}
.cmp .cmp-gtw{background:#000;color:#fff}
.cmp thead .cmp-gtw{background:var(--grad);color:#fff}
.cmp td.cmp-gtw span{color:#e5e5e5;font-weight:600}
.cv{font-style:normal;display:inline-flex;width:22px;height:22px;border-radius:50%;align-items:center;justify-content:center;font-size:12px;font-weight:800}
.cv.y{background:#16a34a;color:#fff}.cv.m{background:#f59e0b;color:#fff}.cv.n{background:#e5e5e5;color:#666}
.cmp-leg{display:flex;gap:18px;margin-top:12px;font-size:13px;color:var(--muted)}
.cmp-leg span{display:inline-flex;align-items:center;gap:6px}
/* gsm-demo GTW-screening */
.ph-wrap{position:fixed;inset:0;z-index:90;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;padding:16px;animation:phin .3s ease-out}
.ph-wrap.out{opacity:0;transition:opacity .35s}
@keyframes phin{from{opacity:0}to{opacity:1}}
.ph-stage{display:flex;flex-direction:column;align-items:center;gap:12px}
.ph-cap{color:#fff;font-weight:700;font-size:15px;margin:0}
.ph{width:290px;height:590px;max-height:calc(100vh - 110px);background:#111;border-radius:44px;padding:12px;box-shadow:0 30px 80px rgba(0,0,0,.45);position:relative;animation:phup .45s cubic-bezier(.2,1.2,.4,1)}
@keyframes phup{from{transform:translateY(40px) scale(.94)}to{transform:none}}
.ph-notch{position:absolute;left:50%;top:18px;transform:translateX(-50%);width:84px;height:22px;background:#111;border-radius:12px;z-index:2}
.ph-scr{background:#fff;border-radius:34px;height:100%;overflow:hidden;position:relative;display:flex;flex-direction:column}
.ph-top{display:flex;justify-content:space-between;padding:12px 22px 6px;font-size:11px;font-weight:700;color:#333}
.ph-view{flex:1;display:flex;flex-direction:column;gap:9px;padding:6px 14px 14px;position:relative;min-height:0}
.ph-co{display:flex;align-items:center;gap:9px;margin-top:6px}
.ph-co i{font-style:normal;width:36px;height:36px;border-radius:10px;background:#000;color:#fff;font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center}
.ph-co b{display:block;font-size:13px}.ph-co small{font-size:11px;color:#777}
.ph-film{position:relative;height:170px;border-radius:14px;overflow:hidden;background:#222;color:#fff}
.ph-film-bg{position:absolute;inset:0;background:linear-gradient(120deg,#1c1c1c,#3a2a40 45%,#5a2f2f);background-size:200% 200%}
.ph-film.play .ph-film-bg{animation:phbg 4s linear infinite}
@keyframes phbg{0%{background-position:0% 50%}100%{background-position:100% 50%}}
.ph-play{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.9);color:#000;display:flex;align-items:center;justify-content:center;font-size:16px;transition:opacity .3s}
.ph-film.play .ph-play{opacity:0}
.ph-sub{position:absolute;left:10px;right:10px;bottom:16px;margin:0;font-size:13px;font-weight:700;text-align:center;text-shadow:0 1px 4px rgba(0,0,0,.6)}
.ph-sub.in{animation:phsub .5s ease-out}
@keyframes phsub{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.ph-bar{position:absolute;left:0;right:0;bottom:0;height:4px;background:rgba(255,255,255,.25)}
.ph-bar i{display:block;height:100%;width:0;background:#FFB574}
.ph-film.play .ph-bar i{animation:phbar 3.2s linear forwards}
@keyframes phbar{to{width:100%}}
.ph-job{font-size:20px;letter-spacing:-.02em}
.ph-tags{display:flex;flex-wrap:wrap;gap:5px}
.ph-tags span{font-size:11px;font-weight:600;background:#F2F2F2;border-radius:999px;padding:4px 9px}
.ph-btns{display:flex;gap:7px;margin-top:auto}
.ph-btns span{flex:1;text-align:center;border-radius:12px;padding:11px 0;font-weight:700;font-size:13px}
.ph-no{background:#F2F2F2}.ph-yes{background:#000;color:#fff;transition:background .2s,transform .15s}
.ph-yes.on{background:#16a34a;transform:scale(.96)}
.ph-tap{position:absolute;right:48px;bottom:-40px;width:34px;height:34px;border-radius:50%;background:rgba(0,0,0,.35);border:3px solid #fff;opacity:0}
.ph-tap.go{animation:phtap .7s ease-out forwards}
@keyframes phtap{0%{opacity:0;transform:translate(30px,30px)}60%{opacity:1;transform:translate(0,-58px)}100%{opacity:1;transform:translate(0,-58px) scale(.8)}}
.ph-gtw{align-self:flex-start;font-size:11px;font-weight:800;background:#000;color:#fff;border-radius:999px;padding:4px 10px;margin-top:6px}
.ph-chat{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:7px;padding-top:4px}
.ph-b{margin:0;max-width:85%;font-size:13px;line-height:1.35;padding:8px 11px;border-radius:14px;animation:phsub .35s ease-out}
.ph-b.q{background:#F2F2F2;align-self:flex-start;border-bottom-left-radius:4px}
.ph-b.a{background:#000;color:#fff;align-self:flex-end;border-bottom-right-radius:4px}
.ph-b.ok{background:#dcfce7;color:#166534;font-weight:600}
.ph-skip{color:#fff;font-weight:700;font-size:14px;padding:8px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.5)}
.ph-skip:hover{background:rgba(255,255,255,.12)}
@media(prefers-reduced-motion:reduce){.ph,.ph-wrap,.ph-b,.ph-sub.in{animation:none}.ph-film.play .ph-bar i{animation-duration:1.6s}}
.ph-film .ph-sub{background:none !important;padding:0 !important;border:0 !important;box-shadow:none !important;color:#fff !important;max-width:none !important}
.ph-ico{position:absolute;left:50%;top:38%;transform:translate(-50%,-50%);width:120px;opacity:.9}
.ph-film.play .ph-ico{animation:phico 3.2s ease-in-out}
@keyframes phico{0%{transform:translate(-50%,-50%) scale(1)}100%{transform:translate(-50%,-50%) scale(1.15)}}
.ph-film .ph-sub{position:absolute !important;top:auto !important;bottom:14px !important;left:10px;right:10px;margin:0 !important;font-size:12.5px !important;line-height:1.3 !important;opacity:1 !important}.ph-ico{top:36%}
.p2-av-ok{background:var(--grad);font-size:16px}
.p2-row.p2-ok{border-color:#16a34a}
.p2-row.p2-ok .p2-st{color:#166534;font-weight:700}
.p2-tel{font-weight:600;color:#000}
