/* Approved reference composition. Loaded only on preview 1784. */
body.netjes-home-concept-page #site_header,
body.netjes-home-concept-page .page_cover,
body.netjes-home-concept-page #site_footer { display: none !important; }
body.netjes-home-concept-page #page_content,
body.netjes-home-concept-page #page_content .row.clr { padding: 0 !important; margin: 0 !important; max-width: none !important; width: 100% !important; }
/* XTRA core.css's ".widget, .content { margin: 0 0 50px }" leaves a 50px
   white gap below the full-bleed .np-footer on this page only. */
body.page-id-1784 .content.clr { margin-bottom: 0 !important; }
.netjes-home-concept-page .np-reference { --padding-top:0px; --padding-bottom:0px; --padding-left:0px; --padding-right:0px; --gap:0px; --widgets-spacing:0px; display:block; width:100%; max-width:none; background:#F5F0E7; color:#081A32; font-family:var(--netjes-font-body); }
.np-reference *, .np-reference *::before, .np-reference *::after { box-sizing:border-box; }
.np-reference .elementor-widget { margin:0; width:100%; }
.np-reference h1,.np-reference h2,.np-reference h3,.np-reference p,.np-reference ul,.np-reference ol { margin:0; padding:0; }
.np-reference h1,.np-reference h2,.np-reference h3 { color:inherit; }
.np-reference h1,.np-reference h2 { font-family:var(--netjes-font-heading); font-weight:500; letter-spacing:-.035em; }
.np-reference a { color:inherit; text-decoration:none; }
.np-reference a:focus-visible,.np-reference button:focus-visible { outline:3px solid #fff; outline-offset:4px; box-shadow:0 0 0 6px #A90912; }
.np-reference svg { width:28px; height:28px; flex:none; }
.np-reference .np-photo { display:block; position:absolute; width:100%; height:100%; max-width:none; object-fit:cover; }
.np-reference .np-hero { height:clamp(440px,30.8vw,530px); position:relative; background:#031326; color:#F5F0E7; isolation:isolate !important; }
.np-reference .np-hero-photo { position:absolute; inset:95px 0 0 34%; overflow:hidden; z-index:-3; }
.np-reference .np-hero-photo img { object-position:50% 0%; }
.np-reference .np-hero-photo::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(3,19,38,.5),rgba(3,19,38,.08) 65%,rgba(3,19,38,.3)); }
.np-reference .np-hero-plane { position:absolute; inset:0; background:#031326; clip-path:polygon(0 0,56% 0,35% 100%,0 100%); z-index:-2; }
.np-reference .np-hero::after { content:""; position:absolute; right:2.5%; bottom:0; width:1px; height:37%; background:#D71920; transform:skew(-36deg); transform-origin:bottom; pointer-events:none; }
.np-reference .netjes-preview-header { position:absolute; top:15px; left:20.4%; right:15.7%; background:rgba(1,13,27,.97); border:1px solid #6b6c6d; border-radius:8px; z-index:10; }
.np-reference .netjes-preview-header__bar { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:9px 22px; }
.np-reference .netjes-preview-header__brand { display:flex; align-items:center; min-height:44px; color:#fff; font:700 36px/1 var(--netjes-font-body); letter-spacing:-1.5px; }
.np-reference .accent { color:#D71920; font-style:italic; }
.np-reference .netjes-preview-header__nav { display:flex; align-items:center; gap:clamp(20px,6vw,100px); }
.np-reference .netjes-preview-header__links { display:flex; gap:clamp(16px,3vw,45px); list-style:none; }
.np-reference .netjes-preview-header__links a { display:flex; align-items:center; min-height:44px; color:#fff; font-size:13px; position:relative; white-space:nowrap; }
.np-reference .netjes-preview-header__links a[aria-current]::after { content:""; position:absolute; bottom:-10px; height:2px; left:0; right:0; background:#D71920; }
.np-reference .netjes-header-cta,.np-reference .np-button { display:inline-flex; min-height:44px; justify-content:center; align-items:center; padding:10px 23px; background:#D71920; color:#fff; font-size:13px; font-weight:600; border-radius:3px; white-space:nowrap; }
.np-reference .netjes-header-cta:hover,.np-reference .np-button:hover { background:#A90912; }
.np-reference .netjes-preview-header__toggle { display:none; width:44px; height:44px; padding:0; background:none; border:1px solid #66717D; color:white; border-radius:3px; font-size:22px; }
.np-reference .netjes-preview-header__mobile-panel { display:none; }
.np-reference .np-copy { position:absolute; left:3.9%; top:22.5%; z-index:1; }
.np-reference .np-eyebrow { color:#ff434a; font-size:clamp(10px,.88vw,14px); font-weight:700; text-transform:uppercase; margin-bottom:10px; }
.np-reference #np-title { font-size:clamp(64px,5.55vw,96px); line-height:.9; font-weight:600; letter-spacing:-.045em; }
.np-reference #np-title span { display:block; }
.np-reference .np-intro { font-size:clamp(16px,1.18vw,20px); line-height:1.5; margin-top:20px; }
.np-reference .np-hero-action { position:absolute; top:36%; left:38.5%; width:17%; z-index:2; text-align:center; }
.np-reference .np-ribbon { display:flex; align-items:center; justify-content:center; gap:14px; height:clamp(108px,8.3vw,140px); padding:15px 30px 25px; position:relative; color:#fff; font-size:clamp(15px,1.18vw,20px); font-weight:600; text-align:left; }
.np-reference .np-ribbon::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(#D71920 0 86%,#A90912 86%); clip-path:polygon(17% 0,100% 0,83% 100%,0 100%); }
.np-reference .np-ribbon svg { width:21px; height:21px; flex:none; }
.np-reference .np-ribbon:hover::before { filter:brightness(.9); }
.np-reference .np-discover { display:inline-flex; align-items:center; min-height:44px; margin-top:5px; border-bottom:2px solid #D71920; font-size:13px; }
.np-reference .np-trust { position:absolute; bottom:0; left:24%; right:24%; display:flex; justify-content:space-around; align-items:center; gap:22px; min-height:56px; list-style:none; background:rgba(3,19,38,.96); border-top:1px solid #817b72; transform:skew(-35deg); padding:8px 24px; }
.np-reference .np-trust li { display:flex; align-items:center; gap:16px; font-size:13px; transform:skew(35deg); white-space:nowrap; }
.np-reference .np-trust li+li::before { content:""; width:5px; height:5px; background:#D71920; border-radius:50%; margin-right:8px; }
.np-reference .np-trust svg { width:31px; height:31px; }
.np-reference .np-sectors { display:grid; grid-template-columns:17% 83%; padding:24px 3.9% 0; }
.np-reference .np-section-label { padding-top:28px; }
.np-reference .np-section-label::before { content:""; display:block; width:34px; height:2px; background:#D71920; margin-bottom:18px; }
.np-reference .np-section-label::after { content:""; display:block; width:48px; height:1px; background:#66717D; margin-top:26px; }
.np-reference .np-section-label h2 { font-size:clamp(24px,2.05vw,34px); line-height:1.1; }
.np-reference .np-cards { display:flex; padding-left:30px; }
.np-reference .np-card { flex:1; position:relative; min-width:0; height:clamp(218px,15.2vw,260px); margin-left:-2px; background:#031326; transform:skew(-16deg); overflow:hidden; border-left:5px solid #F5F0E7; }
.np-reference .np-card .np-photo { transform:skew(16deg) scale(1.3); }
.np-reference .np-card::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(1,10,17,.98),rgba(1,10,17,.60) 42%,rgba(1,10,17,.05)); }
.np-reference .np-card-copy { position:absolute; z-index:1; bottom:25px; left:25px; right:12px; transform:skew(16deg); color:#fff; }
.np-reference .np-card-number { color:#ff434a; font-size:25px; line-height:1.15; }
.np-reference .np-card h3 { font-family:var(--netjes-font-heading); font-size:clamp(23px,1.85vw,31px); font-weight:500; line-height:.98; letter-spacing:-.035em; margin:0 0 8px; }
.np-reference .np-card p { font-size:11px; line-height:1.5; max-width:190px; padding-right:8px; }
.np-reference .np-card:hover .np-photo { filter:brightness(1.12); }
.np-reference .np-process { display:grid; grid-template-columns:19% 57% 24%; align-items:center; padding:25px 3.9%; gap:0; min-height:157px; }
.np-reference .np-process h2 { font-size:clamp(21px,1.55vw,26px); line-height:1.1; }
.np-reference .np-process h2::after,.np-reference .np-final h2::after { content:""; display:block; width:34px; height:2px; background:#D71920; margin-top:15px; }
.np-reference .np-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; list-style:none; padding-right:26px; }
.np-reference .np-step { display:flex; align-items:center; gap:18px; position:relative; }
.np-reference .np-step:not(:last-child)::after { content:""; position:absolute; right:-12px; top:66%; width:26px; height:1px; background:#D71920; }
.np-reference .np-step-symbol { flex:none; text-align:center; }
.np-reference .np-step-symbol>span { color:#C41018; font-size:25px; line-height:1.3; }
.np-reference .np-step-symbol>div { display:grid; place-items:center; width:48px; height:48px; border:1px solid #66717D; border-radius:50%; }
.np-reference .np-step h3,.np-reference .np-local h3 { font:600 13px/1.4 var(--netjes-font-body); margin-bottom:8px; }
.np-reference .np-step p,.np-reference .np-local p { font-size:11px; line-height:1.65; }
.np-reference .np-local { border-left:1px solid #D0C8BE; padding:10px 0 10px 32px; }
.np-reference .np-local a { display:inline-flex; align-items:center; gap:12px; min-height:44px; font-size:12px; color:#A90912; font-weight:600; }
.np-reference .np-local svg { width:18px; }

/* Waarom Netjes — trust points, navy section for rhythm against the ivory
   sections either side of it. Reuses .np-step-symbol's icon-circle markup
   (same numbered-badge language as .np-process) with a scoped color
   override for contrast on navy. */
.np-reference .np-why { background:#031326; color:#F5F0E7; padding:32px 3.9% 40px; }
.np-reference .np-why .np-section-label::after { background:rgba(245,240,231,.25); }
.np-reference .np-why-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:28px; margin-top:28px; }
.np-reference .np-why-item { display:flex; flex-direction:column; align-items:flex-start; gap:14px; }
.np-reference .np-why .np-step-symbol>span { color:#ff434a; }
.np-reference .np-why .np-step-symbol>div { border-color:rgba(245,240,231,.3); }
.np-reference .np-why-item h3 { font-family:var(--netjes-font-heading); font-size:17px; font-weight:600; letter-spacing:-.02em; margin:0; }
.np-reference .np-why-item p { font-size:12.5px; line-height:1.65; color:rgba(245,240,231,.72); margin:0; max-width:230px; }

/* Wat klanten zeggen — the empty state (dashed border, muted quote icon,
   no name/quote/rating) shows only until a genuine review exists, per the
   standing rule against fabricated quotes or names. .np-review-card is the
   filled state once a real, consenting customer's words are in hand. */
.np-reference .np-reviews { display:grid; grid-template-columns:17% 83%; padding:24px 3.9% 40px; }
.np-reference .np-reviews-empty { border:1.5px dashed #D8D0C5; border-radius:6px; padding:48px 40px; display:flex; flex-direction:column; align-items:center; text-align:center; gap:18px; max-width:560px; margin:0 auto; }
.np-reference .np-reviews-empty svg { width:40px; height:40px; color:#D8D0C5; }
.np-reference .np-reviews-empty h3 { font-family:var(--netjes-font-heading); font-size:clamp(19px,1.6vw,24px); font-weight:600; letter-spacing:-.02em; line-height:1.3; max-width:26ch; }
.np-reference .np-reviews-empty p { font-size:13px; line-height:1.6; color:#66717D; max-width:38ch; }
.np-reference .np-reviews-empty .np-button { margin-top:6px; }
.np-reference .np-review-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:24px; }
.np-reference .np-review-card { border:1px solid #D8D0C5; border-radius:8px; background:#fff; padding:32px 30px; display:flex; flex-direction:column; align-items:flex-start; text-align:left; gap:16px; }
.np-reference .np-review-card svg { width:28px; height:28px; color:#D71920; }
.np-reference .np-review-card blockquote { margin:0; }
.np-reference .np-review-card blockquote p { font-family:var(--netjes-font-heading); font-size:clamp(16px,1.25vw,19px); font-weight:500; line-height:1.55; letter-spacing:-.01em; }
.np-reference .np-review-card cite { font-style:normal; font-size:13px; font-weight:600; color:#66717D; }

.np-reference .np-final { display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:35px; align-items:center; padding:24px 3.9%; background:#031326; color:#F5F0E7; }
.np-reference .np-final h2 { font-size:clamp(26px,2.3vw,40px); line-height:1.1; }
.np-reference .np-button { gap:30px; min-height:56px; padding:16px 30px; }
.np-reference .np-final address { font-style:normal; font-size:11px; line-height:1.4; }
.np-reference .np-final address>* { display:flex; align-items:center; gap:12px; min-height:28px; }
.np-reference .np-final address a { min-height:44px; }
.np-reference .np-final address svg { width:18px; height:18px; }

/* Site footer — sits below .np-final (untouched). Same navy as .np-final
   (already the darkest token in the palette) with a translucent divider
   instead of inventing an off-palette darker shade. */
.np-reference .np-footer { background:#031326; color:#F5F0E7; border-top:1px solid rgba(245,240,231,.12); }
.np-reference .np-footer-top { display:grid; grid-template-columns:repeat(4,1fr); gap:40px; padding:64px 3.9% 40px; }
.np-reference .np-footer-logo { display:block; margin-bottom:18px; }
.np-reference .np-footer-tagline { font-family:var(--netjes-font-heading); font-size:17px; font-weight:600; margin:0 0 8px; }
.np-reference .np-footer-brand p:not(.np-footer-tagline) { font-size:13px; line-height:1.6; color:rgba(245,240,231,.65); max-width:30ch; }
.np-reference .np-footer-heading { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:#ff434a; margin:0 0 18px; }
.np-reference .np-footer-links { display:flex; flex-direction:column; gap:12px; font-style:normal; }
.np-reference .np-footer-links a,
.np-reference .np-footer-links span { display:flex; align-items:center; gap:10px; font-size:14px; line-height:1.4; color:rgba(245,240,231,.75); min-height:24px; }
.np-reference .np-footer-links a { transition:color .15s ease; }
.np-reference .np-footer-links a:hover,
.np-reference .np-footer-links a:focus-visible { color:#D71920; }
.np-reference .np-footer-links svg { width:16px; height:16px; flex:none; color:rgba(245,240,231,.5); }
.np-reference .np-footer-col p { font-size:13px; line-height:1.7; color:rgba(245,240,231,.65); margin:0 0 4px; }
.np-reference .np-footer-bottom { border-top:1px solid rgba(245,240,231,.12); padding:20px 3.9%; }
.np-reference .np-footer-bottom p { font-size:12px; color:rgba(245,240,231,.5); margin:0; }
@media(min-width:1600px) { .np-reference .np-hero { height:530px; } }
@media(max-width:1250px) {
 .np-reference .netjes-preview-header { left:12%; right:7%; }
 .np-reference .netjes-preview-header__nav { gap:30px; }
 .np-reference .np-trust { left:24%; right:8%; gap:12px; }
 .np-reference .np-trust li { gap:8px; font-size:11px; }
 .np-reference .np-copy { top:24%; }
 .np-reference #np-title { font-size:5.55vw; }
 .np-reference .np-hero-action { left:32%; width:20%; }
 .np-reference .np-card-copy { left:18px; }
 .np-reference .np-process { grid-template-columns:21% 79%; }
 .np-reference .np-local { grid-column:2; border-left:0; padding:10px 0 0; display:flex; gap:18px; align-items:center; }
 .np-reference .np-local h3 { margin:0; }
 .np-reference .np-final { gap:24px; }
 .np-reference .np-button { padding:14px 20px; gap:15px; }
 .np-reference .np-reviews { grid-template-columns:21% 79%; }
}
@media(max-width:1023px) {
 .np-reference .netjes-preview-header { left:4%; right:4%; }
 .np-reference .netjes-preview-header__links { display:none; }
 .np-reference .netjes-preview-header__toggle { display:block; }
 .np-reference .netjes-preview-header__nav { gap:16px; }
 .np-reference .netjes-preview-header.is-open .netjes-preview-header__mobile-panel { display:grid; padding:8px 22px 16px; border-top:1px solid #66717D; }
 .np-reference .netjes-preview-header__mobile-panel a { min-height:44px; display:flex; align-items:center; color:#fff; }
 .np-reference .np-hero { height:450px; }
 .np-reference #np-title { font-size:6.2vw; }
 .np-reference .np-eyebrow { max-width:270px; line-height:1.5; }
 .np-reference .np-hero-plane { clip-path:polygon(0 0,63% 0,39% 100%,0 100%); }
 .np-reference .np-hero-action { top:43%; left:47%; width:28%; }
 .np-reference .np-trust { left:10%; right:10%; }
 .np-reference .np-sectors { grid-template-columns:1fr; padding-top:25px; }
 .np-reference .np-section-label { padding:0 0 20px; }
 .np-reference .np-section-label h2 br { display:none; }
 .np-reference .np-section-label::before { margin-bottom:12px; }
 .np-reference .np-section-label::after { display:none; }
 .np-reference .np-cards { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; padding:0 28px; }
 .np-reference .np-card { height:220px; border:0; }
 .np-reference .np-card-copy { left:30px; }
 .np-reference .np-card h3 { font-size:29px; }
 .np-reference .np-process { grid-template-columns:1fr; gap:22px; padding-top:30px; }
 .np-reference .np-process h2 br { display:none; }
 .np-reference .np-local { grid-column:auto; border-top:1px solid #D0C8BE; }
 .np-reference .np-final { grid-template-columns:1fr auto; }
 .np-reference .np-final address { grid-column:1/-1; display:flex; flex-wrap:wrap; gap:10px 24px; }
 .np-reference .np-why-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px 20px; }
 .np-reference .np-reviews { grid-template-columns:1fr; padding-top:25px; }
 .np-reference .np-review-grid { grid-template-columns:1fr; }
 .np-reference .np-footer-top { grid-template-columns:repeat(2,minmax(0,1fr)); gap:36px 28px; }
}
@media(max-width:767px) {
 .np-reference .netjes-preview-header { top:12px; }
 .np-reference .netjes-preview-header__bar { padding:7px 12px; gap:10px; }
 .np-reference .netjes-preview-header__brand { font-size:28px; }
 .np-reference .netjes-preview-header__nav { gap:8px; }
 .np-reference .netjes-header-cta { padding:8px 12px; font-size:11px; }
 .np-reference .np-hero { height:660px; }
 .np-reference .np-copy { left:6%; top:100px; }
 .np-reference .np-eyebrow { max-width:none; font-size:10px; margin-bottom:13px; }
 .np-reference #np-title { font-size:clamp(48px,9.4vw,68px); line-height:.96; }
 .np-reference .np-intro { font-size:15px; margin-top:15px; }
 .np-reference .np-hero-photo { inset:320px 0 66px 16%; }
 .np-reference .np-hero-photo img { object-position:50% 38%; }
 .np-reference .np-hero-plane { clip-path:polygon(0 0,100% 0,100% 45%,13% 90%,0 90%); }
 .np-reference .np-hero-action { left:5%; top:390px; width:220px; }
 .np-reference .np-ribbon { height:110px; font-size:16px; }
 .np-reference .np-discover { background:#031326; padding:0 8px; }
 .np-reference .np-trust { left:0; right:0; transform:none; padding:10px 15px; gap:7px; min-height:66px; }
 .np-reference .np-trust li { transform:none; flex:1; flex-direction:column; text-align:center; white-space:normal; font-size:10px; line-height:1.35; gap:5px; }
 .np-reference .np-trust li+li::before { display:none; }
 .np-reference .np-trust svg { width:24px; height:24px; }
 .np-reference .np-sectors { padding:24px 6% 0; }
 .np-reference .np-section-label h2 { font-size:29px; }
 .np-reference .np-process { padding:28px 6%; }
 .np-reference .np-steps { grid-template-columns:1fr; gap:20px; padding:0; }
 .np-reference .np-step { gap:22px; }
 .np-reference .np-step h3 { font-size:14px; }
 .np-reference .np-step p { font-size:13px; }
 .np-reference .np-step:not(:last-child)::after { width:1px; height:18px; top:auto; bottom:-20px; left:24px; right:auto; }
 .np-reference .np-local { display:block; padding-top:20px; }
 .np-reference .np-local p { font-size:13px; margin-top:8px; }
 .np-reference .np-final { grid-template-columns:1fr; gap:22px; padding:26px 6%; }
 .np-reference .np-final h2 { font-size:31px; }
 .np-reference .np-button { justify-self:start; }
 .np-reference .np-final address { display:block; font-size:12px; overflow-wrap:anywhere; }
 .np-reference .np-why { padding:28px 6% 32px; }
 .np-reference .np-reviews { padding:24px 6% 32px; }
 .np-reference .np-reviews-empty { padding:36px 24px; }
 .np-reference .np-review-card { padding:32px 24px; }
 .np-reference .np-footer-top { grid-template-columns:1fr; gap:36px; padding:40px 6% 32px; }
 .np-reference .np-footer-bottom { padding:18px 6%; }
}
@media(max-width:599px) {
 .np-reference .np-cards { grid-template-columns:1fr; padding:0 20px; gap:10px; }
 .np-reference .np-card { height:215px; transform:skew(-10deg); }
 .np-reference .np-card .np-photo { transform:skew(10deg) scale(1.2); }
 .np-reference .np-card-copy { transform:skew(10deg); left:24px; }
 .np-reference .np-card p { max-width:225px; font-size:12px; }
 .np-reference .np-why-grid { grid-template-columns:1fr; gap:26px; }
}
