/* 1.76.541: Zo ziet het er echt uit (parts/real-panel.php) */
.nsl-realp__view { margin-top: 28px; }
.nsl-realp__tabs { display: flex; gap: 0; border-bottom: 1px solid var(--line, #1d1d1f); overflow-x: auto; scrollbar-width: none; }
.nsl-realp__tabs::-webkit-scrollbar { display: none; }
.nsl-realp__tabs button { flex: 0 0 auto; background: none; border: 0; border-bottom: 2px solid transparent; color: var(--muted, #9a9a9a); font: inherit; font-size: 15px; font-weight: 600; padding: 12px 18px; margin-bottom: -1px; cursor: pointer; white-space: nowrap; }
.nsl-realp__tabs button:hover { color: var(--text, #fff); }
.nsl-realp__tabs button[aria-selected="true"] { color: var(--text, #fff); border-bottom-color: #7643c8; }
.nsl-realp__tabs button:focus-visible { outline: 2px solid #7643c8; outline-offset: -2px; }
.nsl-realp__pane { margin: 20px 0 0; }
.nsl-realp__frame { border: 1px solid var(--line2, #2a2a2d); background: #0b0b0c; }
.nsl-realp__bar { display: flex; align-items: center; gap: 6px; padding: 9px 12px; border-bottom: 1px solid var(--line2, #2a2a2d); }
.nsl-realp__bar i { width: 9px; height: 9px; border: 1px solid #3a3a3e; display: block; }
.nsl-realp__bar em { font-style: normal; font-family: var(--mono, "IBM Plex Mono", monospace); font-size: 12px; color: var(--muted, #9a9a9a); margin-left: 8px; }
.nsl-realp__frame img { display: block; width: 100%; height: auto; }
.nsl-realp__pane figcaption { margin-top: 14px; color: var(--muted, #9a9a9a); max-width: 760px; line-height: 1.55; }
.nsl-realp__pane figcaption b { color: var(--text, #fff); margin-right: 4px; }
.nsl-realp__note { margin-top: 10px; font-size: 13px; color: var(--dim, #6f6f73); }
.nsl-realp__steps { list-style: none; margin: 36px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--line, #1d1d1f); }
.nsl-realp__steps li { padding: 20px 20px 4px 0; display: grid; gap: 6px; align-content: start; }
.nsl-realp__steps li + li { padding-left: 20px; border-left: 1px solid var(--line, #1d1d1f); }
.nsl-realp__n { font-family: var(--mono, "IBM Plex Mono", monospace); font-size: 13px; color: #7643c8; }
.nsl-realp__steps b { font-size: 16px; }
.nsl-realp__steps li > span:last-child { color: var(--muted, #9a9a9a); font-size: 14px; line-height: 1.5; }
@media (max-width: 860px) {
	.nsl-realp__steps { grid-template-columns: 1fr 1fr; }
	.nsl-realp__steps li:nth-child(3) { padding-left: 0; border-left: 0; }
	.nsl-realp__steps li:nth-child(n+3) { border-top: 1px solid var(--line, #1d1d1f); }
}
@media (max-width: 520px) {
	.nsl-realp__tabs button { padding: 10px 12px; font-size: 14px; }
	.nsl-realp__steps { grid-template-columns: 1fr; }
	.nsl-realp__steps li, .nsl-realp__steps li + li { padding-left: 0; border-left: 0; }
	.nsl-realp__steps li + li { border-top: 1px solid var(--line, #1d1d1f); }
}
/* Licht thema op de landingspagina's */
[data-theme="light"] .nsl-realp__frame, .nsl-theme-light .nsl-realp__frame { border-color: #d9d9de; }
.nsl-realp__scroll { display: block; cursor: zoom-in; }
.nsl-realp__swipe { display: none; margin: 8px 0 0; font-size: 13px; color: var(--dim, #6f6f73); }
@media (max-width: 700px) {
	.nsl-realp__scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
	.nsl-realp__scroll img { width: 820px; max-width: none; }
	.nsl-realp__swipe { display: block; }
}
/* 1.76.542: uitsneden van de details: ingezoomd op het stukje dat ertoe doet, klik voor het hele stuk */
.nsl-realp__dets { margin-top: 32px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px 20px; }
.nsl-realp__det { margin: 0; display: grid; gap: 12px; align-content: start; }
.nsl-realp__crop { display: block; border: 1px solid var(--line2, #2a2a2d); background: #0b0b0c; cursor: zoom-in; overflow: hidden; }
.nsl-realp__crop img { display: block; width: 100%; height: auto; transition: transform .3s ease; transform-origin: 50% 0; }
.nsl-realp__crop:hover img { transform: scale(1.03); }
.nsl-realp__crop:focus-visible { outline: 2px solid #7643c8; outline-offset: 2px; }
.nsl-realp__det figcaption { display: grid; gap: 2px; }
.nsl-realp__det figcaption b { font-size: 15px; }
.nsl-realp__det figcaption span { color: var(--muted, #9a9a9a); font-size: 14px; line-height: 1.5; }
.nsl-realp__det.is-wide { grid-column: span 2; }
@media (max-width: 960px) { .nsl-realp__dets { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .nsl-realp__dets { grid-template-columns: 1fr; } .nsl-realp__det.is-wide { grid-column: auto; } }
@media (prefers-reduced-motion: reduce) { .nsl-realp__crop img { transition: none; } .nsl-realp__crop:hover img { transform: none; } }