/* Eén leeslijn voor specialist-, bedrijfs- en softwarepagina's. */
.detail-page { --u-section: var(--sp-10); --u-gap: var(--sp-8); }
.work-page { --u-width: 800px; --u-section: clamp(40px, 5vw, 64px); background: var(--panel); }
.work-page main { font-size: var(--fs-19); }
.work-page .detail-hero { padding-block: var(--u-section); }
.work-page .detail-hero > h1 { font-size: var(--u-h1); max-width: none; margin: 0 0 var(--sp-6); overflow-wrap: normal; hyphens: manual; }
.work-page .detail-summary { margin: 0; max-width: 56ch; }
.work-page .u-actions { margin-top: var(--sp-6); }
.uitleg.work-page .u-section { border: 0; }
.work-page .u-section h2 { font-size: var(--fs-32); max-width: none; }
.work-page :is(#werkzaamheden, #impact, #praktijkvoorbeeld, #vragen, #aanvragen) { scroll-margin-top: 110px; }
.work-page .detail-work-list { list-style: none; padding: 0; margin: var(--sp-8) 0 0; }
.work-page .detail-work-item + .detail-work-item { margin-top: var(--sp-8); }
.work-page .detail-work-item h3 { font-size: var(--fs-24); margin-bottom: var(--sp-3); }
.work-page .detail-work-item dl, .work-page .detail-work-item dd { margin: 0; }
.work-page .detail-contribution { max-width: 65ch; margin-top: var(--sp-3); color: var(--muted); font-size: var(--fs-16); }
.work-page .detail-contribution dt, .work-page .detail-contribution dd { display: inline; }
.work-page .detail-contribution dt { font-weight: 600; }
.work-page .detail-contribution dt::after { content: ': '; }
.work-page .detail-impact { margin-top: var(--sp-10); }
.work-page .detail-impact h3 { font-size: var(--fs-24); }
.detail-page .detail-scope { border-bottom: 1px solid var(--line); }
.detail-page .detail-scope summary { min-height: 56px; padding-block: var(--sp-4); font-size: var(--fs-16); }
.detail-page .detail-scope p { padding-block: var(--sp-2) var(--sp-5); margin: 0; }
.work-page .detail-example p { margin: 0; }
.work-page .work-preview { margin: var(--sp-8) 0 0; padding: 0; }
.work-page .work-preview h3 { font-size: var(--fs-19); margin: 0 0 var(--sp-2); }
.work-page .work-preview .work-preview-kind { font-size: var(--fs-16); color: var(--muted); margin-bottom: var(--sp-5); }
.work-page .work-preview figcaption { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sp-3) var(--sp-6); margin-top: var(--sp-5); font-size: var(--fs-14); color: var(--muted); }
.work-page .detail-maker { display: inline-flex; align-items: center; gap: var(--sp-2); }
.work-page .detail-maker img { width: 32px; height: 32px; }
.work-page .work-preview-table { table-layout: fixed; font-size: var(--fs-16); line-height: var(--lh-body); }
.work-page .work-preview-table th, .work-page .work-preview-table td { padding: var(--sp-3) var(--sp-4) var(--sp-3) 0; overflow-wrap: anywhere; }
.work-page .work-preview-table th:first-child { width: 42%; }
.work-page .work-preview-table thead { color: var(--muted); font-size: var(--fs-14); }
.work-page .work-preview-table td { color: var(--muted); }
.work-page .work-preview-column { display: none; }
.work-page .work-preview-flow { padding-left: var(--sp-6); margin: 0; font-size: var(--fs-16); }
.work-page .work-preview-flow li { padding-left: var(--sp-2); }
.work-page .work-preview-flow li + li { margin-top: var(--sp-4); }
.work-page .work-preview-flow strong, .work-page .work-preview-flow span, .work-page .work-preview-decision strong, .work-page .work-preview-decision span { display: block; }
.work-page .work-preview-flow span, .work-page .work-preview-decision span { color: var(--muted); }
.work-page .work-preview-decision { font-size: var(--fs-16); }
.work-page .work-preview-decision > p { margin-bottom: var(--sp-3); }
.work-page .work-preview-decision ul { padding-left: var(--sp-6); margin: var(--sp-4) 0 0; }
.work-page .work-preview-decision li + li { margin-top: var(--sp-3); }
.uitleg.work-page .u-research { padding-block: var(--u-section); }
.uitleg.work-page .u-research .u-bar-track { background: var(--panel-2); }
.work-page .detail-related h2 { font-size: var(--fs-24); }
.detail-page .detail-directory { list-style: none; margin: 0; padding: 0; }
.detail-page .detail-directory li { min-width: 0; }
.detail-page .detail-directory li + li { margin-top: var(--sp-4); }
.detail-page .detail-directory a { display: grid; grid-template-columns: minmax(0, 1fr) 24px; align-items: start; gap: var(--sp-4); min-height: 48px; padding-block: var(--sp-2); color: var(--ink); text-decoration: none; }
.detail-page .detail-directory h3 { font-size: var(--fs-19); color: var(--brand); margin: 0 0 var(--sp-1); }
.detail-page .detail-directory p { color: var(--muted); font-size: var(--fs-16); margin: 0; }
.detail-page .detail-directory a:hover h3 { text-decoration: underline; text-underline-offset: 4px; }
.detail-page .detail-arrow { display: block; width: 24px; height: 24px; color: var(--brand); position: relative; }
.detail-page .detail-arrow::before { content: ''; position: absolute; width: 12px; height: 2px; background: currentColor; left: 2px; top: 11px; }
.detail-page .detail-arrow::after { content: ''; position: absolute; width: 7px; height: 7px; border-top: 2px solid currentColor; border-right: 2px solid currentColor; transform: rotate(45deg); left: 8px; top: 8px; }
.detail-page .detail-accessible { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.detail-page summary::-webkit-details-marker { display: none; }
.uitleg.detail-page .detail-questions { background: var(--panel); }
.detail-page .detail-faq { display: block; overflow-wrap: anywhere; }
.uitleg.detail-page .detail-faq details { background: transparent; border-bottom: 1px solid var(--line); }
.detail-page .detail-faq summary, .detail-page .detail-scope summary { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-5); list-style: none; }
.detail-page .detail-faq summary { min-height: 80px; padding-block: var(--sp-5); font-size: var(--fs-19); line-height: var(--lh-body); }
.detail-page .detail-faq summary > span, .detail-page .detail-scope summary > span { display: block; flex: 0 0 24px; width: 24px; height: 24px; position: relative; }
.detail-page .detail-faq summary > span::before, .detail-page .detail-faq summary > span::after, .detail-page .detail-scope summary > span::before, .detail-page .detail-scope summary > span::after { content: ''; position: absolute; background: var(--brand); left: 3px; top: 11px; width: 18px; height: 2px; }
.detail-page .detail-faq summary > span::after, .detail-page .detail-scope summary > span::after { transform: rotate(90deg); transition: transform var(--dur-hover) var(--ease-uit); }
.detail-page .detail-faq details[open] summary > span::after, .detail-page .detail-scope[open] summary > span::after { transform: rotate(0); }
.detail-page .detail-faq summary:hover, .detail-page .detail-scope summary:hover { color: var(--brand); }
.detail-page .detail-faq details > div { padding: 0 0 var(--sp-6); }
.detail-page .detail-faq p { margin: 0; max-width: 65ch; font-size: var(--fs-19); line-height: var(--lh-loose); }
.work-page .u-request-grid { display: block; }
.work-page .form-area { padding: 0; border: 0; background: transparent; margin-top: var(--sp-8); }
.work-page .form-area > div > h2 { font-size: var(--fs-24); }
@media (max-width: 599px) {
  .work-page .detail-hero > h1 { font-size: var(--fs-32); }
  .work-page .u-section h2 { font-size: var(--fs-24); }
  .work-page .detail-work-item h3, .work-page .detail-impact h3 { font-size: var(--fs-19); }
  .work-page main, .work-page .detail-summary { font-size: var(--fs-16); }
  .work-page .work-preview-table, .work-page .work-preview-table tbody, .work-page .work-preview-table tr { display: block; width: 100%; }
  .work-page .work-preview-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .work-page .work-preview-table thead th { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .work-page .work-preview-table tbody tr { padding-block: var(--sp-3); border-top: 1px solid var(--line); }
  .work-page .work-preview-table tbody tr:last-child { padding-bottom: 0; }
  .work-page .work-preview-table th, .work-page .work-preview-table td, .work-page .work-preview-table th:first-child { display: block; width: 100%; padding: 0; border: 0; overflow-wrap: normal; }
  .work-page .work-preview-table td { padding-top: var(--sp-3); }
  .work-page .work-preview-column { display: block; margin-bottom: var(--sp-1); font-size: var(--fs-14); font-weight: 400; color: var(--muted); }
  .detail-page .detail-faq summary { gap: var(--sp-3); }
}
@media (prefers-reduced-motion: reduce) {
  .detail-page *, .detail-page *::before, .detail-page *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}