/* Netslim: telefoon en kleine tablets. Apart bestand, geladen na main.css. */
@media (max-width: 640px) {
	html, body { overflow-x: clip; }
	.nsl-wrap { padding-left: 16px; padding-right: 16px; }

	/* Knoppen: onder elkaar, even breed, recht uitgelijnd */
	.nsl-actions, .nsl-ai__btns, .nsl-gsc-help__btns, .nsl-hero__actions, .nsl-cta__actions {
		display: flex; flex-direction: column; align-items: stretch; gap: 10px; flex-wrap: nowrap;
	}
	.nsl-actions > .nsl-btn, .nsl-actions > a, .nsl-actions > form, .nsl-actions > form .nsl-btn,
	.nsl-ai__btns > .nsl-btn, .nsl-ai__btns > form, .nsl-ai__btns > form .nsl-btn {
		width: 100%; margin: 0 !important; justify-content: center; text-align: center;
	}
	.nsl-btn + .nsl-btn { margin-left: 0; }
	.nsl-btn--lg { padding-top: 15px; padding-bottom: 15px; }
	p:has(> .nsl-btn:only-child) > .nsl-btn { width: 100%; justify-content: center; }

	/* Hero's gecentreerd */
	.nsl-hero, .nsl-pagehero { min-height: auto; padding-top: calc(var(--header-h) + 28px); padding-bottom: 48px; text-align: center; }
	.nsl-hero .nsl-eyebrow, .nsl-pagehero .nsl-eyebrow { justify-content: center; line-height: 1.7; }
	.nsl-hero h1, .nsl-pagehero h1 { line-height: 1.08; }
	.nsl-hero h1, .nsl-pagehero h1, .nsl-hero p, .nsl-pagehero p { margin-left: auto; margin-right: auto; }
	.nsl-pagehero__content, .nsl-hero__content, .nsl-pagehero--side .nsl-pagehero__content > * { max-width: none; margin-left: auto; margin-right: auto; }
	.nsl-hero .nsl-actions, .nsl-pagehero .nsl-actions { align-items: stretch; }
	.nsl-hero__trust { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 14px; text-align: left; justify-items: start; max-width: 360px; margin-left: auto; margin-right: auto; }
	.nsl-scrollcue { display: none; }
	.nsl-herolink { justify-content: center; text-align: left; margin-left: auto; margin-right: auto; }
	.nsl-hero form, .nsl-pagehero form { margin-left: auto; margin-right: auto; }
	.nsl-pagehero__screen { display: none; }

	/* Koppen en secties */
	.nsl-sechead { text-align: center; }
	.nsl-sechead p { margin-left: auto; margin-right: auto; }
	.nsl-h1 { font-size: clamp(2rem, 9vw, 2.6rem); line-height: 1.08; }
	.nsl-h2 { font-size: clamp(1.6rem, 7.4vw, 2.1rem); line-height: 1.12; }
	.nsl-section { padding-top: 56px; padding-bottom: 56px; }

	/* Kaarten en rasters: één kolom, gelijke binnenruimte */
	.nsl-eprod, .nsl-why4, .nsl-edgenote, .nsl-moves, .nsl-bento, .nsl-plans, .nsl-gsc-grid, .nsl-gsc-grid--geo { grid-template-columns: 1fr !important; }
	.nsl-eprod__item, .nsl-edgenote > div, .nsl-panel { padding: 20px; }
	.nsl-eprod__foot { flex-direction: column; align-items: stretch; gap: 12px; }
	.nsl-eprod__foot .nsl-btn { width: 100%; justify-content: center; }

	/* Tabellen nooit breder dan het scherm */
	.nsl-main table { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }

	/* Formulieren: 16px voorkomt inzoomen op iOS */
	input, select, textarea { font-size: 16px; }

	/* Portal */
	.nsl-gsc-hero__meta { justify-content: flex-start; }
	.nsl-gsc-hero__meta .nsl-gsc-pdf { width: 100%; justify-content: center; }
	.nsl-geo__bot { grid-template-columns: 34px minmax(0, 1fr) auto; gap: 10px; padding: 10px !important; }
	.nsl-botico { width: 34px; height: 34px; }
	.nsl-geo__reads > div { grid-template-columns: minmax(0, 1fr) auto; }
	.nsl-geo__reads .nsl-geo__bar { display: none; }
	.nsl-toasts { top: auto !important; bottom: 16px !important; }
}

@media (max-width: 380px) {
	.nsl-kpit__grid { grid-template-columns: 1fr 1fr; }
	.nsl-kpit__tile { padding: 14px 12px; }
}

/* =========================================================
   Klantportaal op tablet en telefoon
   ========================================================= */
@media (max-width: 1000px) {
	.nsl-portal .nsl-portal__grid { grid-template-columns: minmax(0, 1fr) !important; gap: 14px; padding-left: 16px; padding-right: 16px; }
	.nsl-portal__main { min-width: 0; width: 100%; }
	.nsl-portal__side { position: sticky !important; top: var(--header-h); z-index: 60; margin: 0 -16px; padding: 8px 0; background: rgba(12, 10, 22, .94); backdrop-filter: blur(14px); border-bottom: 1px solid var(--line); }
	.nsl-portal__me { display: none !important; }
	.nsl-portal .nsl-portal__nav { position: static !important; display: flex !important; flex-wrap: nowrap; gap: 6px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x proximity; padding: 2px 16px; margin: 0; border: 0; border-radius: 0; background: none; box-shadow: none; backdrop-filter: none; scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 14px, #000 calc(100% - 28px), transparent); mask-image: linear-gradient(90deg, transparent 0, #000 14px, #000 calc(100% - 28px), transparent); }
	.nsl-portal .nsl-portal__nav::-webkit-scrollbar { display: none; }
	.nsl-portal .nsl-portal__nav a { flex: none !important; flex-direction: row !important; gap: 7px !important; padding: 8px 12px !important; border-radius: 999px !important; font: 500 .84rem var(--f-display) !important; white-space: nowrap; scroll-snap-align: start; border: 1px solid var(--line) !important; background: rgba(255, 255, 255, .02); }
	.nsl-portal .nsl-portal__nav a .nsl-emo { width: 18px !important; height: 18px !important; }
	.nsl-portal .nsl-portal__nav a.is-active { color: #fff; border-color: rgba(138, 92, 230, .6) !important; background: rgba(138, 92, 230, .18) !important; }
	.nsl-portal .nsl-portal__nav a em { position: static !important; margin: 0 0 0 2px !important; font-size: .66rem; line-height: 18px; min-width: 18px; }
	.nsl-portal .nsl-portal__logout { display: inline-flex !important; }
	.nsl-portal { padding-bottom: 40px !important; padding-top: calc(var(--header-h) + 4px) !important; }
	/* Alles binnen het portaal: nooit breder dan het scherm */
	.nsl-portal__main > *, .nsl-portal__main .nsl-panel, .nsl-portal__main section { max-width: 100%; min-width: 0; }
	.nsl-portal__main img, .nsl-portal__main svg, .nsl-portal__main video, .nsl-portal__main canvas { max-width: 100%; height: auto; }
	.nsl-portal__main table { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
	.nsl-portal__main pre, .nsl-portal__main code { white-space: pre-wrap; word-break: break-word; }
	.nsl-portal__head { flex-wrap: wrap; gap: 10px; }
	.nsl-portal__main .nsl-h1 { font-size: clamp(1.7rem, 7.5vw, 2.2rem); }
}
@media (max-width: 640px) {
	.nsl-portal__main .nsl-panel { padding: 16px !important; border-radius: 16px; }
	.nsl-portal__main [class*="grid"], .nsl-portal__main [class*="__grid"], .nsl-portal__main .nsl-kpit__grid { grid-template-columns: minmax(0, 1fr) !important; }
	.nsl-portal__main .nsl-kpit__grid { grid-template-columns: 1fr 1fr !important; }
	.nsl-portal__main .nsl-gsc-hero__kpis, .nsl-portal__main .nsl-gsc-kpis { grid-template-columns: 1fr 1fr !important; }
	.nsl-portal__main .nsl-btn { max-width: 100%; white-space: normal; }
	.nsl-portal__main form .nsl-row, .nsl-portal__main .nsl-corr-row, .nsl-portal__main .nsl-form__row { grid-template-columns: 1fr !important; display: grid; }
	.nsl-portal__main dl, .nsl-portal__main .nsl-dl { grid-template-columns: 1fr !important; }
	.nsl-chat-fab, .nsl-chatbot__fab, [data-chat-fab] { bottom: 84px !important; }
}

/* Adminbalk van WordPress: header eronder, niet erachter */
.admin-bar .nsl-header{top:32px}
@media (max-width:782px){.admin-bar .nsl-header{top:46px}.admin-bar .nsl-portal__side{top:calc(var(--header-h) + 46px)!important}#wpadminbar{position:fixed!important}}
@media (max-width:1000px){
	/* Portaal als app: compacte tegels, rustige banners */
	.nsl-portal .nsl-kpis{grid-template-columns:1fr 1fr!important;gap:10px}
	.nsl-portal .nsl-kpi{display:grid!important;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:12px;align-items:center;padding:14px!important}
	.nsl-portal .nsl-kpi>:first-child{grid-row:1/span 2;margin:0!important}
	.nsl-portal .nsl-kpi b{font-size:1.25rem!important}
	.nsl-portal .nsl-kpi span{font-size:.78rem}
	.nsl-portal .nsl-banner{flex-wrap:wrap;align-items:flex-start;font-size:.86rem;padding:12px 14px}
	.nsl-portal .nsl-banner a{margin-left:auto}
	.nsl-portal .nsl-quick{grid-template-columns:1fr 1fr!important;gap:10px}
	.nsl-portal__main .nsl-btn{min-height:44px}
	.nsl-portal__main input,.nsl-portal__main select,.nsl-portal__main textarea{min-height:44px}
}
@media (max-width:380px){.nsl-portal .nsl-kpis{grid-template-columns:1fr!important}}
@media (max-width:640px){.nsl-portal-page .nsl-wa,body:has(.nsl-portal) .nsl-wa{transform:scale(.8);transform-origin:bottom right;right:10px}
.nsl-portal .nsl-kpis>:last-child:nth-child(odd){grid-column:1/-1}}