.next-work-menu{position:relative}.next-work-menu summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:7px;color:inherit;font:inherit;font-weight:600;min-height:44px}.next-work-menu summary::-webkit-details-marker{display:none}.next-work-menu summary:focus-visible{outline:2px solid #e9b534;outline-offset:5px;border-radius:3px}.next-work-links{position:absolute;top:100%;left:-18px;min-width:225px;padding:10px;background:#103237;border:1px solid #456367;border-radius:12px;box-shadow:0 15px 35px #001a2340;display:grid;gap:3px;z-index:100}.next-site .next-work-links a{display:block;padding:12px;border-radius:7px;color:#eff6f4;white-space:nowrap}.next-site .next-work-links a:hover{background:#284b50;color:#ffd371}.next-work-menu[open] summary{color:#ffd371}.ploeg-case-image img{display:block;width:100%;height:auto;border-radius:22px;box-shadow:0 20px 45px #001d2933}.next-site .ploeg-preview{padding:0}.next-site .ploeg-preview img{width:100%;height:100%;object-fit:cover}.portfolio-demo-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}.portfolio-demo-copy h3{font-size:clamp(26px,3vw,40px);line-height:1.2;letter-spacing:-1px;margin:0 0 24px}.portfolio-demo-copy em{font-style:normal;color:#29777b}.portfolio-demo-copy>p{line-height:1.8;color:#536d72;margin-bottom:28px}.portfolio-demo-copy .portfolio-demo-note{font-size:12px;margin-top:24px}.ploeg-case-callout{background:#e1ece8}.next-site #websites,.next-site #software{scroll-margin-top:110px}
@media(max-width:820px){.next-work-menu{width:100%}.next-work-menu summary{padding:10px 0;min-height:44px;justify-content:space-between}.next-work-links{position:static;box-shadow:none;background:#15383d;border:0;min-width:0;width:100%;margin-bottom:6px}.next-site .next-work-links a{padding:12px}.portfolio-demo-grid{grid-template-columns:1fr;gap:30px}.ploeg-case-image{margin-top:25px}}

.next-site .next-page-hero .next-text-link{color:#dce9e6}.next-site .next-page-hero .next-text-link:hover{color:#ffd371}.next-work-menu summary{font-size:13px}@media(max-width:820px){.next-work-menu summary{font-size:15px}}

/* The software case uses the same labelled image cards as the concept gallery. */
.next-site .portfolio-concept-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;align-items:stretch}
.next-site .portfolio-concept-grid .next-project{width:auto;min-width:0;display:flex;flex-direction:column}
.next-site .portfolio-concept-grid .next-project-body{flex:1;display:flex;flex-direction:column}
.next-site .portfolio-concept-grid .next-project-body>.next-text-link{margin-top:auto;align-self:flex-start}
.next-site .portfolio-concept-grid .ploeg-preview img{object-fit:contain}
.next-site .portfolio-concept-grid .next-project .next-project-visual{height:340px;padding:28px;flex:none;background:radial-gradient(ellipse at 70% 0,#71988c77,transparent 75%),linear-gradient(145deg,#1f4447,#143136)}
.next-site .portfolio-concept-grid .next-project .next-project-visual img{width:100%;height:100%;object-fit:contain}
@media(max-width:1000px){.next-site .portfolio-concept-grid .next-project .next-project-visual{height:260px;padding:16px}}
@media(max-width:580px){.next-site .portfolio-concept-grid .next-project .next-project-visual{height:auto;aspect-ratio:1.4;padding:16px}}
.next-site #webshops{scroll-margin-top:110px}
.next-site #mobiele-apps{scroll-margin-top:110px}
.next-site .expansion-preview{padding:25px;border-radius:24px;background:radial-gradient(ellipse at 70% 0,#71988c77,transparent 75%),linear-gradient(145deg,#1f4447,#143136)}
.next-site .expansion-preview img{display:block;width:100%;height:auto}
.next-site .next-concept-invite{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:36px;padding:clamp(26px,4vw,48px);border:1px solid #cbdcd6;border-radius:28px;background:#f8fbf9;box-shadow:0 12px 32px #1032370d}
.next-site .next-concept-invite h2{font-size:clamp(28px,3vw,38px);line-height:1.15;margin:12px 0 16px}
.next-site .next-concept-invite p{max-width:650px;margin:0;color:#536d72;line-height:1.7}
.next-site .next-concept-invite .next-actions{display:flex;flex-direction:column;align-items:flex-start;margin:0;gap:18px}
.next-site .next-concept-invite .next-button{white-space:normal;text-align:left}
@media(max-width:1000px){.next-site .next-concept-invite{grid-template-columns:1fr;gap:24px}}
/* Petrol header bands: services remain lightweight and keep native mobile stacking. */
.next-site.next-petrol-services article.next-feature.next-petrol-card{padding:0;overflow:hidden;background:#fafbf8;border:1px solid #c2d2c9;border-radius:24px;backdrop-filter:none;box-shadow:0 8px 18px #133c3010}
.next-site.next-petrol-services .next-petrol-card .next-card-heading{display:flex;align-items:center;gap:16px;min-height:112px;padding:24px 28px;background:#21474a;border-bottom:2px solid #cca952}
.next-site.next-petrol-services .next-card-heading>span{display:grid;place-items:center;flex:none;width:40px;height:40px;margin:0;border:1px solid #658180;border-radius:12px;background:#365c5c;color:#f3ce77;font:12px var(--mono)}
.next-site.next-petrol-services .next-petrol-card .next-card-heading h3{padding:0;margin:0;color:#f2f5f0;font-size:22px;line-height:1.3}
.next-site.next-petrol-services .next-petrol-card>p{margin:0;padding:24px 28px 28px;color:#486567}
.next-site.next-petrol-services :is(.next-use-grid,.next-scope-grid)>article{background:#edf2ee;border:1px solid #c0d1c6;border-top:4px solid #2b5350;backdrop-filter:none;box-shadow:0 8px 18px #133c3010}
@media(max-width:580px){.next-site.next-petrol-services .next-petrol-card .next-card-heading{padding:20px;gap:14px;min-height:100px}.next-site.next-petrol-services .next-petrol-card .next-card-heading h3{font-size:21px}.next-site.next-petrol-services .next-petrol-card>p{padding:20px}}
@media(max-width:820px){.next-site .portfolio-concept-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}}
@media(max-width:580px){.next-site .portfolio-concept-grid{grid-template-columns:1fr}}
.next-site .ploeg-hero>.next-wrap{grid-template-columns:1fr 1.1fr;gap:40px}
/* Identical light and sage section backgrounds on both service pages. */
.next-site.next-petrol-services :is(.next-section,#eigen-huisstijl){background:#f0f4f1}
.next-site.next-petrol-services :is(.next-section.next-tint,#softwareprojecten){background:#e1ece7;border-block:1px solid #cadbd3}
.next-site.next-software-bands #eigen-huisstijl{border:0}
.next-site .ploeg-step-image{aspect-ratio:4/3;background:#14373c;overflow:hidden}
.ploeg-step-image img{display:block;width:100%;height:100%;object-fit:contain}
.next-site .ploeg-steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:26px}
.next-site .ploeg-step-label{padding:20px 24px}
.next-site .ploeg-steps .next-project-body{padding:28px}
.next-site .ploeg-steps .next-project-body h3{font-size:24px;line-height:1.2}
.next-site .ploeg-steps .next-project-body p{margin-bottom:0}
@media(max-width:820px){.next-site .ploeg-hero>.next-wrap{grid-template-columns:1fr}.next-site .ploeg-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.next-site .ploeg-steps .next-project-body{padding:22px}}
@media(max-width:580px){.next-site .ploeg-steps{grid-template-columns:1fr}.next-site .ploeg-step-label{padding:16px 20px}.next-site .ploeg-steps .next-project-body h3{font-size:23px}.next-site .ploeg-hero>.next-wrap{gap:12px}}
/* The overview shows one example per category on phones; catalogs stay complete. */
@media(max-width:700px){
 .next-site.next-concept-hub .portfolio-concept-grid>article:nth-child(n+2){display:none}
}