/* J&B Interim | ZZP Checklist | Frontend */
body.jnbzc-canvas-body{margin:0}
body:has(#jnbzc.jnbzc-page){background:radial-gradient(760px 460px at 0% 0%,rgba(245,163,22,.16),transparent 65%),radial-gradient(700px 480px at 100% 35%,rgba(21,58,79,.07),transparent 70%),#F4F6F8 !important;overflow-x:hidden;margin:0}

#jnbzc{--navy:#153A4F;--navy-d:#0F2C3D;--accent:#F5A316;--cream:#FFF8EE;--cream-line:#F2DFC3;--ink:#173447;--muted:#5E6E79;--line:#E3E9EE;--bad:#C23B2A;--bad-bg:#FDEEEA;--bad-line:#F4C3B9;--ok:#2FA560;
font-family:var(--e-global-typography-text-font-family,system-ui),-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;text-align:left}
#jnbzc.jnbzc-page{min-height:100vh;display:flex;flex-direction:column}
#jnbzc *,#jnbzc *::before,#jnbzc *::after{box-sizing:border-box}
#jnbzc [hidden]{display:none !important}
#jnbzc .jnbzc-bleed{width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}
#jnbzc h1,#jnbzc h2{font-family:var(--e-global-typography-primary-font-family,inherit),-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--navy);font-weight:800;text-transform:none;letter-spacing:-.3px;padding:0}
#jnbzc a{color:inherit}

/* Header */
#jnbzc .jnbzc-top{background:var(--navy);border-bottom:3px solid var(--accent);box-shadow:0 6px 20px rgba(15,44,61,.18)}
#jnbzc .jnbzc-top-in{max-width:1140px;margin:0 auto;padding:14px 20px;display:flex;align-items:center;justify-content:space-between;gap:16px}
#jnbzc .jnbzc-brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:#fff}
#jnbzc .jnbzc-badge{width:46px;height:46px;border-radius:50%;background:#20506A;border:2px solid var(--accent);display:grid;place-items:center;font-weight:800;font-size:13px;color:#fff;box-shadow:0 4px 12px rgba(0,0,0,.25);flex:none}
#jnbzc .jnbzc-logo{height:46px;width:auto;max-width:120px;display:block;object-fit:contain}
#jnbzc .jnbzc-word strong{display:block;font-size:18px;font-weight:800;line-height:1.1;color:#fff;letter-spacing:.2px}
#jnbzc .jnbzc-word small{display:block;font-size:12px;font-weight:600;color:rgba(255,255,255,.75)}
#jnbzc .jnbzc-toplink{color:#fff;text-decoration:none;font-weight:700;font-size:14px;padding:9px 16px;border-radius:999px;background:rgba(245,163,22,.22);border:1px solid rgba(245,163,22,.45);white-space:nowrap;transition:background .15s,color .15s}
#jnbzc .jnbzc-toplink:hover{background:var(--accent);color:var(--navy)}

/* Content */
#jnbzc .jnbzc-main{flex:1;padding:40px 16px 56px}
#jnbzc.jnbzc-blok .jnbzc-main{padding:0}
#jnbzc .jnbzc-main-center{display:flex;align-items:center}
#jnbzc .jnbzc-wrap{max-width:780px;margin:0 auto;width:100%}
#jnbzc .jnbzc-wrap-narrow{max-width:640px}
#jnbzc .jnbzc-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:32px;box-shadow:0 14px 40px rgba(21,58,79,.08);margin:0 0 22px}
#jnbzc .jnbzc-pill{display:inline-flex;align-items:center;gap:8px;background:#EDF1F4;color:var(--navy);font-weight:700;font-size:14px;line-height:1.2;padding:8px 14px;border-radius:999px}
#jnbzc .jnbzc-pill::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px rgba(245,163,22,.2)}
#jnbzc .jnbzc-pill-ok::before{background:var(--ok);box-shadow:0 0 0 3px rgba(47,165,96,.2)}
#jnbzc h1{margin:22px 0 8px;font-size:clamp(26px,4vw,34px);line-height:1.15}
#jnbzc h2{margin:20px 0 6px;font-size:clamp(22px,3vw,26px);line-height:1.2}
#jnbzc .jnbzc-lead{margin:0 0 22px;color:var(--muted);font-size:16px}

/* Stellingen */
#jnbzc .jnbzc-qs{display:grid;gap:8px}
#jnbzc .jnbzc-q{display:grid;grid-template-columns:1fr auto;align-items:center;gap:18px;padding:14px 16px;background:var(--cream);border:1px solid var(--cream-line);border-radius:14px;transition:background .15s,border-color .15s,box-shadow .15s}
#jnbzc .jnbzc-q-text{margin:0;font-size:15px;line-height:1.5;color:var(--ink)}
#jnbzc .jnbzc-q.is-nee{background:var(--bad-bg);border-color:var(--bad-line)}
#jnbzc .jnbzc-q.has-error{border-color:var(--bad);box-shadow:0 0 0 3px rgba(194,59,42,.12)}
#jnbzc .jnbzc-seg{display:inline-flex;background:#fff;border:1px solid #E6D4BA;border-radius:999px;padding:3px;gap:2px}
#jnbzc .jnbzc-seg input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
#jnbzc .jnbzc-seg label{display:block;margin:0;padding:7px 18px;border-radius:999px;font-weight:700;font-size:14px;line-height:1.2;color:var(--muted);cursor:pointer;user-select:none;transition:background .15s,color .15s}
#jnbzc .jnbzc-seg label:hover{color:var(--navy)}
#jnbzc .jnbzc-seg input[value="ja"]:checked+label{background:var(--navy);color:#fff}
#jnbzc .jnbzc-seg input[value="nee"]:checked+label{background:var(--bad);color:#fff}
#jnbzc .jnbzc-seg input:focus-visible+label{outline:2px solid var(--accent);outline-offset:2px}

/* Velden */
#jnbzc .jnbzc-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:18px}
#jnbzc .jnbzc-field{margin-top:18px}
#jnbzc .jnbzc-grid .jnbzc-field{margin-top:0}
#jnbzc .jnbzc-label{display:block;font-weight:700;font-size:14px;color:var(--navy);margin:0 0 6px}
#jnbzc input[type="text"],#jnbzc input[type="email"],#jnbzc input[type="date"]{display:block;width:100%;height:50px;min-height:50px;padding:0 14px;margin:0;border:1.5px solid #D6DEE4;border-radius:12px;background:#fff;color:var(--ink);font:inherit;font-size:16px;line-height:normal;box-shadow:none;outline:none;-webkit-appearance:none;appearance:none;transition:border-color .15s,box-shadow .15s}
#jnbzc input[type="date"]::-webkit-date-and-time-value{text-align:left}
#jnbzc input[type="text"]:focus,#jnbzc input[type="email"]:focus,#jnbzc input[type="date"]:focus{border-color:var(--navy);box-shadow:0 0 0 4px rgba(245,163,22,.25)}
#jnbzc .has-error input[type="text"],#jnbzc .has-error input[type="email"],#jnbzc .has-error input[type="date"]{border-color:var(--bad)}
#jnbzc .jnbzc-err{display:none;color:var(--bad);font-size:13px;font-weight:600;margin-top:6px}
#jnbzc .has-error>.jnbzc-err{display:block}

/* Handtekening */
#jnbzc .jnbzc-sig{position:relative;height:210px;border:2px dashed #E7CFA8;border-radius:14px;background:#fff;overflow:hidden}
#jnbzc .jnbzc-sig canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:crosshair}
#jnbzc .jnbzc-sig::after{content:"";position:absolute;left:24px;right:24px;bottom:46px;border-bottom:1px solid #E9EDF0;pointer-events:none}
#jnbzc .jnbzc-sig-hint{position:absolute;inset:0;display:grid;place-items:center;padding:0 16px;color:#9AA8B2;font-weight:600;text-align:center;pointer-events:none}
#jnbzc .jnbzc-sig.is-signed .jnbzc-sig-hint{display:none}
#jnbzc .has-error .jnbzc-sig{border-color:var(--bad)}
#jnbzc .jnbzc-sig-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:8px;font-size:13px;color:var(--muted)}
#jnbzc .jnbzc-ghost{-webkit-appearance:none;appearance:none;margin:0;background:#fff;color:var(--navy);border:1px solid #D6DEE4;border-radius:999px;padding:7px 16px;font:inherit;font-size:14px;font-weight:700;line-height:1.2;text-transform:none;letter-spacing:normal;cursor:pointer;box-shadow:none;transition:border-color .15s}
#jnbzc .jnbzc-ghost:hover,#jnbzc .jnbzc-ghost:focus{border-color:var(--navy);background:#fff;color:var(--navy)}

/* Checkboxen */
#jnbzc .jnbzc-check{display:flex;gap:12px;align-items:flex-start;margin:0;padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:#FAFBFC;cursor:pointer;font-size:15px;line-height:1.5;color:var(--ink);font-weight:500}
#jnbzc .jnbzc-check input{width:20px;height:20px;margin:1px 0 0;flex:none;accent-color:var(--navy);cursor:pointer}
#jnbzc .has-error>.jnbzc-check{border-color:var(--bad);background:var(--bad-bg)}
#jnbzc .jnbzc-email{margin-top:10px}

/* Melding en knop */
#jnbzc .jnbzc-alert{display:none;margin:20px 0 0;padding:12px 14px;border-radius:12px;background:var(--bad-bg);border:1px solid var(--bad-line);color:#8E2A1D;font-weight:600;font-size:14px}
#jnbzc .jnbzc-alert.is-visible{display:block}
#jnbzc .jnbzc-submit{-webkit-appearance:none;appearance:none;display:block;width:100%;height:56px;margin:20px 0 0;padding:0 20px;border:0;border-radius:14px;background:var(--navy);color:#fff;font:inherit;font-weight:800;font-size:17px;line-height:1;text-transform:none;letter-spacing:normal;cursor:pointer;box-shadow:0 10px 24px rgba(21,58,79,.25);transition:background .15s}
#jnbzc .jnbzc-submit:hover,#jnbzc .jnbzc-submit:focus{background:var(--navy-d);color:#fff}
#jnbzc .jnbzc-submit:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
#jnbzc .jnbzc-submit:disabled{opacity:.7;cursor:wait}
#jnbzc .jnbzc-note{margin:12px 0 0;font-size:13px;color:var(--muted);text-align:center}
#jnbzc .jnbzc-hp{position:absolute !important;left:-9999px !important;width:1px;height:1px;overflow:hidden}

/* Bedankt */
#jnbzc .jnbzc-thanks-card{padding:40px 36px}
#jnbzc .jnbzc-copy-note{margin:0 0 14px;background:var(--cream);border:1px solid var(--cream-line);border-radius:12px;padding:12px 14px;color:var(--ink);font-size:15px}
#jnbzc .jnbzc-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
#jnbzc .jnbzc-btn{display:inline-flex;align-items:center;justify-content:center;height:50px;padding:0 24px;border-radius:14px;font-weight:800;font-size:16px;text-decoration:none;transition:background .15s,border-color .15s}
#jnbzc .jnbzc-btn-main{background:var(--navy);color:#fff;box-shadow:0 10px 24px rgba(21,58,79,.25)}
#jnbzc .jnbzc-btn-main:hover{background:var(--navy-d);color:#fff}
#jnbzc .jnbzc-btn-alt{background:#fff;color:var(--navy);border:1px solid #D6DEE4}
#jnbzc .jnbzc-btn-alt:hover{border-color:var(--navy);color:var(--navy)}

/* Footer */
#jnbzc .jnbzc-foot{background:var(--navy);border-top:3px solid var(--accent);color:rgba(255,255,255,.85);font-size:14px}
#jnbzc .jnbzc-foot-in{max-width:1140px;margin:0 auto;padding:26px 20px;display:flex;justify-content:space-between;align-items:flex-start;gap:20px;flex-wrap:wrap}
#jnbzc .jnbzc-foot strong{color:#fff}
#jnbzc .jnbzc-foot a{color:#fff;text-decoration:none;font-weight:600}
#jnbzc .jnbzc-foot a:hover{color:var(--accent)}
#jnbzc .jnbzc-copy{max-width:1140px;margin:0 auto;padding:14px 20px;border-top:1px solid rgba(255,255,255,.1);font-size:13px;color:rgba(255,255,255,.6)}

@media (max-width:600px){
#jnbzc .jnbzc-main{padding:24px 12px 40px}
#jnbzc .jnbzc-card,#jnbzc .jnbzc-thanks-card{padding:22px 18px;border-radius:16px}
#jnbzc .jnbzc-q{grid-template-columns:1fr;gap:10px}
#jnbzc .jnbzc-seg{justify-self:start}
#jnbzc .jnbzc-grid{grid-template-columns:1fr}
#jnbzc .jnbzc-sig{height:190px}
#jnbzc .jnbzc-word small{display:none}
#jnbzc .jnbzc-toplink{padding:8px 12px;font-size:13px}
#jnbzc .jnbzc-btn{width:100%}
}
@media (prefers-reduced-motion:reduce){#jnbzc *{transition:none !important;scroll-behavior:auto !important}}
