.cxp{--navy:#021B4E;--lime:#8DD30E;color:var(--navy);font:17px/1.7 Inter,Arial,sans-serif;max-width:1200px;margin:32px auto;overflow-wrap:anywhere;container:cxp/inline-size}.cxp *{box-sizing:border-box;min-width:0}.cxp [hidden]{display:none!important}.cxp nav{margin-bottom:20px;font-size:14px}.cxp :is(h1,h2,h3){color:var(--navy);line-height:1.15;letter-spacing:-.035em}.cxp p{margin:0 0 20px}.cxp h2{font-size:32px}.cxp-hero{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px;align-items:center;padding:44px;border-radius:28px;background:#F1F5F9;margin-bottom:28px}.cxp-intro{container-type:inline-size}.cxp .cxp-hero h1{font-size:clamp(22px,7cqi,44px)!important;line-height:1.15;margin:22px 0;word-break:normal;overflow-wrap:normal;hyphens:auto;text-wrap:balance}.cxp-pill{display:inline-block;padding:7px 14px;border-radius:40px;background:#E2F1CE;font-size:12px;font-weight:700}.cxp figure{margin:0}.cxp figure img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:22px}.cxp figcaption{font-size:11px;line-height:1.5;margin-top:9px;color:#52647f}.cxp .cxp-button{display:inline-flex;align-items:center;justify-content:center;max-width:100%;padding:15px 22px;border:0;border-radius:12px;background:#8DD30E!important;color:#021B4E!important;font:700 15px/1.5 Inter,Arial,sans-serif;text-decoration:none!important;white-space:normal;cursor:pointer}.cxp .cxp-button:hover:not(:disabled){background:#CFE3FF!important;color:#021B4E!important}.cxp .cxp-button:disabled{opacity:.6;cursor:wait}.cxp :is(a,button,input,select,textarea):focus-visible{outline:3px solid #021B4E;outline-offset:3px}.cxp-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;padding:24px 28px;border:1px solid #E1E7EF;border-radius:18px;margin:0 0 48px}.cxp dt{font-size:12px;color:#64748b}.cxp dd{font-size:16px;font-weight:650;margin:0}.cxp-details{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:48px;margin:0 10px 48px}.cxp-description :is(h2,h3){margin-top:32px}.cxp-description img{max-width:100%;height:auto}.cxp-description table{display:block;overflow:auto;max-width:100%}.cxp-details aside{align-self:start;padding:28px;border-radius:20px;background:#021B4E;color:#fff}.cxp-details aside h2{color:#fff;font-size:26px}.cxp-details aside a:not(.cxp-button){color:#fff}.cxp-details aside>span{color:#8DD30E;font-size:12px;letter-spacing:.1em}.cxp-details aside .cxp-button{width:100%;margin-bottom:22px}.cxp-apply{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:40px;align-items:start;padding:40px;background:#EEF3F9;border-radius:28px;scroll-margin-top:130px}.cxp-apply>div>span{font-size:12px;letter-spacing:.1em;font-weight:700}.cxp-apply ol{padding-left:24px}.cxp-apply li{padding:5px}.cxp-form-card{background:#fff;padding:30px;border-radius:20px}.cxp-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;overflow:visible}.cxp label{display:flex;flex-direction:column;gap:8px;font-size:14px;font-weight:600;margin:0}.cxp :is(input,textarea,select){width:100%;max-width:100%;min-height:52px;padding:12px 14px;color:#021B4E;background:#F8FAFC;border:1px solid #D8DFE8;border-radius:12px;font:16px/1.5 Inter,Arial,sans-serif;box-shadow:none}.cxp textarea{resize:vertical}.cxp small{font-weight:400}.cxp-wide{grid-column:1/-1}.cxp-upload{padding:20px;border:1.5px dashed #A9BBCF;border-radius:16px;background:#F4F8FC}.cxp-upload input{background:transparent;padding:6px;border:0}.cxp .cxp-consent{display:flex;flex-direction:row;align-items:flex-start;font-size:12px;font-weight:400}.cxp-consent input{width:20px;min-width:20px;height:20px;min-height:20px;padding:0;margin:3px 5px 0 0}.cxp-trap{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}.cxp-status{font-size:14px;margin:0}.cxp-filters{display:grid;grid-template-columns:2fr repeat(3,minmax(0,1fr));gap:18px;align-items:end;padding:26px;background:#EEF3F9;border-radius:20px;margin-bottom:26px}.cxp-reset{justify-self:start;background:none;border:0;color:#021B4E;text-decoration:underline;cursor:pointer}.cxp-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.cxp-card{display:flex;flex-direction:column;border:1px solid #E6E9F0;border-radius:18px;color:#021B4E!important;text-decoration:none!important;background:#fff;overflow:visible}.cxp-card:hover{background:#CFE3FF}.cxp-card>img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:18px 18px 0 0}.cxp-card>div{padding:22px;display:flex;flex-direction:column;flex:1}.cxp-card h3{font-size:21px;line-height:1.3;margin:0 0 14px;overflow-wrap:anywhere;hyphens:auto}.cxp-card p{font-size:14px}.cxp-card span{margin-top:auto;font-size:14px}.single-cx_vacancy:has(.cxp) :is(#sidebar,.page-header,#post-header){display:none!important}.single-cx_vacancy:has(.cxp) :is(#primary,#content){width:100%!important;float:none!important;max-width:none!important}.single-cx_vacancy:has(.cxp) #content-wrap{width:calc(100% - 32px);max-width:1200px;margin-inline:auto}
@container cxp (max-width:1000px){.cxp-apply{grid-template-columns:minmax(0,1fr)}.cxp-details{gap:28px;grid-template-columns:minmax(0,1fr) 250px}.cxp-hero{padding:32px;gap:28px}.cxp-filters{grid-template-columns:repeat(2,minmax(0,1fr))}.cxp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container cxp (max-width:800px){.cxp-hero,.cxp-details{grid-template-columns:minmax(0,1fr)}.cxp-hero img{aspect-ratio:16/9;max-height:380px}.cxp-facts{margin-bottom:32px}.cxp-details{margin-inline:0}}
@container cxp (max-width:520px){.cxp{font-size:16px}.cxp-hero{padding:24px 20px;border-radius:20px}.cxp .cxp-button{width:100%}.cxp-facts,.cxp-filters,.cxp-grid{grid-template-columns:minmax(0,1fr)}.cxp-apply{padding:24px 14px;gap:20px}.cxp-apply h2{font-size:28px}.cxp-form-card{padding:24px 16px}.cxp-form{grid-template-columns:minmax(0,1fr)}.cxp h2{font-size:28px}.cxp-card h3{font-size:21px}.cxp-hero img{aspect-ratio:4/3}.cxp-facts{gap:14px}.cxp-apply{border-radius:20px}}

/* CX design review: consistent controls and stronger card separation. */
.cxp{font-size:18px;line-height:1.6}
.cxp .cxp-filters label,.cxp .cxp-form label{font-size:18px;line-height:1.5}
.cxp .cxp-filters input,.cxp .cxp-filters select,.cxp .cxp-form input,.cxp .cxp-form textarea,.cxp .cxp-form select,.cxp .cxp-reset{font-family:inherit;font-size:18px;line-height:1.5;color:#021B4E}
.cxp .cxp-filters{background:#CFE3FF;border:1px solid #b5cbed}
.cxp .cxp-card{background:#E6E9F0;border:1px solid #b7c5dc;box-shadow:0 5px 16px rgba(2,27,78,.08);transition:background .2s,border-color .2s,box-shadow .2s}
.cxp .cxp-card:hover,.cxp .cxp-card:focus-visible{background:#CFE3FF;color:#021B4E;border-color:#021B4E;box-shadow:0 8px 24px rgba(2,27,78,.14)}
.cxp .cxp-card p,.cxp .cxp-card span{font-size:16px;line-height:1.5}
.cxp .cxp-card h3,.cxp h1{hyphens:none;word-break:normal;overflow-wrap:anywhere}
.cxp .cxp-facts{background:#E6E9F0;border-color:#b7c5dc}
.cxp .cxp-form-card{background:#fff;border:1px solid #b7c5dc;box-shadow:0 5px 20px rgba(2,27,78,.08)}
.cxp .cxp-apply{background:#E6E9F0}
.cxp .cxp-form input:focus-visible,.cxp .cxp-form textarea:focus-visible,.cxp .cxp-filters input:focus-visible,.cxp .cxp-filters select:focus-visible{outline:2px solid #021B4E;outline-offset:2px}
/* Noodmelding zolang het e-mailformulier uit staat (2026-10). */
.cxp .cxp-notice{background:#E6E9F0;border:1px solid #b7c5dc;border-left:6px solid #8DD30E;border-radius:14px;padding:20px 22px;font-size:16px;line-height:1.6}
.cxp .cxp-notice strong{display:block;font-size:19px;margin-bottom:6px}
.cxp .cxp-notice p{margin:0}
.cxp .cxp-notice a{color:#021B4E;font-weight:700}
.cxp .cxp-notice a[href^="tel:"]{white-space:nowrap}
/* Filterbalk 2026-10: ruimere keuzelijsten en compacte balk die meeloopt binnen het overzicht. */
.cxp .cxp-filtertoggle,.cxp .cxp-stuckcount{display:none}
@container cxp (min-width:1001px){.cxp .cxp-filters{grid-template-columns:minmax(0,1.3fr) repeat(3,minmax(0,1fr))}}
.cxp .cxp-filters select{padding-right:34px;text-overflow:ellipsis}
.cxp .cxp-filterbar{z-index:40}
.cxp.cxp-stuck .cxp-filterbar{position:fixed;top:0;margin:0;transition:transform .2s ease}
.cxp.cxp-stuck .cxp-filterbar.is-past{transform:translateY(-120%)}
.cxp.cxp-stuck .cxp-filters{grid-template-columns:minmax(0,1.3fr) repeat(3,minmax(0,1fr)) auto;align-items:center;gap:10px;padding:10px 14px;margin:0;border-radius:0 0 16px 16px;box-shadow:0 8px 22px rgba(2,27,78,.16)}
.cxp.cxp-stuck .cxp-lbl{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.cxp.cxp-stuck .cxp-filters label{gap:0}
.cxp.cxp-stuck .cxp-filters :is(input,select){min-height:44px;padding-top:8px;padding-bottom:8px;font-size:16px}
.cxp.cxp-stuck .cxp-stuckcount{display:block;grid-column:1/-2;font-size:14px;line-height:1.3;margin:-2px 0 0 4px}
.cxp.cxp-stuck .cxp-reset{grid-row:1;grid-column:-2/-1;font-size:15px;white-space:nowrap}
@media (prefers-reduced-motion:reduce){.cxp.cxp-stuck .cxp-filterbar{transition:none}}
@container cxp (max-width:800px){
  .cxp.cxp-stuck .cxp-filters{grid-template-columns:minmax(0,1fr) auto;padding:10px 12px}
  .cxp.cxp-stuck .cxp-filtertoggle{display:inline-flex;align-items:center;min-height:44px;padding:8px 14px;border:1px solid #021B4E;border-radius:12px;background:#fff;color:#021B4E;font:600 16px/1.2 Inter,Arial,sans-serif;cursor:pointer;white-space:nowrap}
  .cxp.cxp-stuck .cxp-select,.cxp.cxp-stuck .cxp-reset{display:none}
  .cxp.cxp-stuck.cxp-open .cxp-select{display:flex;grid-column:1/-1}
  .cxp.cxp-stuck.cxp-open .cxp-reset{display:block;grid-column:1/-1;grid-row:auto;justify-self:start}
  .cxp.cxp-stuck .cxp-stuckcount{grid-column:1/-1}
}
.cxp .cxp-filterbar{margin-bottom:26px}
.cxp .cxp-filterbar .cxp-filters{margin-bottom:0}
/* v0.2.6 — vaste opbouw vacaturetekst: inleiding, tussenkoppen, korte alinea's en vinklijsten */
.cxp .cxp-description{max-width:70ch;font-size:17px;line-height:1.7}
.cxp .cxp-description>:first-child{margin-top:0}
.cxp .cxp-description p{margin:0 0 14px}
.cxp .cxp-description .cxp-lead{font-size:20px;line-height:1.6;font-weight:500;margin-bottom:26px}
.cxp .cxp-description h2{font-size:23px;line-height:1.3;font-weight:700;letter-spacing:-.01em;margin:38px 0 12px;color:var(--navy)}
article.cxp .cxp-description ul{margin:4px 0 22px}
.cxp .cxp-description a{color:inherit;text-decoration:underline;text-underline-offset:2px}
@container cxp (max-width:800px){.cxp .cxp-description{font-size:16px}.cxp .cxp-description .cxp-lead{font-size:18px}.cxp .cxp-description h2{font-size:20px;margin-top:30px}}
