:root{--bg:#07090c;--bg2:#0c1015;--card:#11161c;--card2:#151b22;--text:#f5f7fa;--muted:#aeb8c4;--blue:#168dff;--blue2:#4ba8ff;--line:#252c35;--max:1240px;--radius:14px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.6}img{display:block;max-width:100%}a{color:inherit;text-decoration:none}.container{width:min(var(--max),calc(100% - 40px));margin:auto}.site-header{position:sticky;top:0;z-index:50;background:rgba(5,7,10,.92);backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.06)}.header-inner{height:84px;display:flex;align-items:center;gap:30px}.logo{position:relative;display:inline-flex;align-items:baseline;font-weight:900;letter-spacing:-1px;font-size:28px;line-height:1}.logo strong{color:var(--blue);font-size:30px}.logo small{position:absolute;left:0;top:34px;font-size:7px;color:#d5d9df;letter-spacing:.8px;white-space:nowrap}.main-nav{display:flex;gap:24px;margin-left:auto}.main-nav a{font-size:13px;text-transform:uppercase;font-weight:700;color:#d9dee6;transition:.2s}.main-nav a:hover{color:var(--blue)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:13px;min-height:48px;padding:0 23px;border:1px solid var(--line);border-radius:3px;text-transform:uppercase;font-size:12px;font-weight:800;letter-spacing:.4px;transition:.2s}.btn:hover{transform:translateY(-2px)}.btn-primary{background:linear-gradient(135deg,var(--blue),#2d6cff);border-color:#4aa3ff;color:white;box-shadow:0 12px 34px rgba(22,141,255,.18)}.btn-outline{border-color:#268fea;background:rgba(13,22,33,.48)}.header-cta{margin-left:4px}.menu-toggle{display:none;background:none;border:0;padding:6px;margin-left:auto}.menu-toggle span{display:block;width:25px;height:2px;background:white;margin:5px 0}.hero{position:relative;overflow:hidden;min-height:650px;border-bottom:1px solid var(--line);background:radial-gradient(circle at 80% 35%,rgba(0,116,255,.16),transparent 30%),linear-gradient(115deg,#090d12,#0a0c0f 55%,#080b0f)}.hero:after{content:"";position:absolute;inset:auto 0 0;height:160px;background:linear-gradient(transparent,rgba(0,0,0,.6))}.hero-glow{position:absolute;width:650px;height:650px;right:-160px;top:-190px;border-radius:50%;background:rgba(0,124,255,.13);filter:blur(60px)}.hero-grid{position:relative;z-index:2;min-height:650px;display:grid;grid-template-columns:1.05fr .95fr;align-items:center}.hero-copy{padding:70px 0 60px}.eyebrow{color:var(--blue2);text-transform:uppercase;font-weight:800;letter-spacing:1.6px;font-size:12px;margin:0 0 10px}.hero h1,.section-head h2,.cta h2{margin:0;text-transform:uppercase;letter-spacing:-1.5px;line-height:1.03}.hero h1{font-size:clamp(54px,6.2vw,90px);max-width:760px}.hero h1 span{display:block;color:var(--blue)}.lead{max-width:650px;font-size:19px;color:#d5dbe4;margin:22px 0 30px}.hero-actions{display:flex;gap:16px;flex-wrap:wrap}.hero-services{display:flex;gap:0;margin-top:46px;flex-wrap:wrap}.hero-services span{font-size:13px;text-transform:uppercase;font-weight:800;padding:0 28px;border-right:1px solid #4a515a}.hero-services span:first-child{padding-left:0}.hero-services span:last-child{border-right:0}.hero-visual{align-self:end;filter:drop-shadow(0 50px 40px rgba(0,0,0,.7))}.hero-visual img{width:105%;max-width:none;transform:translateX(-4%)}.section{padding:88px 0}.section-dark{background:#080b0f;border-block:1px solid var(--line)}.section-head{max-width:720px;margin-bottom:42px}.section-head.centered{text-align:center;margin:0 auto 46px}.section-head h2{font-size:clamp(32px,4vw,50px)}.section-head>p:last-child{color:var(--muted);font-size:16px}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.service-card{position:relative;min-height:485px;overflow:hidden;border:1px solid #242c35;background:linear-gradient(180deg,#171c22,#101419);border-radius:var(--radius);box-shadow:0 26px 60px rgba(0,0,0,.22)}.service-card>img{position:absolute;right:-25px;top:20px;width:64%;height:58%;object-fit:contain;opacity:.96}.service-icon{position:absolute;left:28px;top:28px;color:var(--blue);border:1px solid rgba(22,141,255,.55);font-size:28px;width:52px;height:52px;display:grid;place-items:center}.service-body{position:absolute;left:28px;right:28px;bottom:25px}.service-body h3{font-size:27px;margin:0 0 2px;text-transform:uppercase}.service-body strong{display:block;color:var(--blue2);font-size:13px;text-transform:uppercase;margin-bottom:8px}.service-body p{color:#bfc7d1;font-size:14px}.service-body a{color:var(--blue2);font-size:12px;font-weight:800;text-transform:uppercase}.process-showcase{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;align-items:center;gap:14px}.process-card p{text-transform:uppercase;font-weight:800;font-size:13px}.process-card p b{color:var(--blue);font-size:20px;margin-right:8px}.process-image{aspect-ratio:1.25;border:1px solid var(--line);background:linear-gradient(145deg,#141a21,#0a0e12);border-radius:8px;overflow:hidden;display:grid;place-items:center}.process-image img{width:100%;height:100%;object-fit:contain}.original-part img{width:55%;height:55%}.arrow{font-size:40px;color:white}.benefit-grid{display:grid;grid-template-columns:repeat(5,1fr);border-block:1px solid var(--line)}.benefit-grid>div{text-align:center;padding:32px 18px;border-right:1px solid var(--line)}.benefit-grid>div:last-child{border-right:0}.benefit-grid span{font-size:40px;color:var(--blue)}.benefit-grid h3{font-size:14px;text-transform:uppercase}.benefit-grid p{font-size:13px;color:var(--muted)}.workflow{background:#090c10}.workflow-grid{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:36px}.workflow-grid:before{content:"";position:absolute;height:1px;background:#53606e;left:12.5%;right:12.5%;top:57px}.workflow-step{text-align:center;position:relative}.workflow-step>span{color:var(--blue);font-weight:900}.circle{position:relative;z-index:2;margin:12px auto 18px;width:86px;height:86px;border:2px solid var(--blue);border-radius:50%;display:grid;place-items:center;background:#0b1016;font-size:30px}.workflow-step h3{text-transform:uppercase;margin:0}.workflow-step p{color:var(--muted);font-size:14px;max-width:220px;margin:10px auto}.materials{border-top:1px solid var(--line)}.material-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:12px}.material-grid span{border:1px solid #313944;background:#0d1116;min-height:76px;border-radius:6px;display:grid;place-items:center;text-align:center;padding:10px;font-weight:800}.checks{display:flex;justify-content:center;gap:30px;flex-wrap:wrap;margin-top:24px;color:#bec7d2;font-size:13px}.checks span::first-letter{color:var(--blue)}.cta{position:relative;padding:70px 0;background:radial-gradient(circle at 85% 30%,rgba(22,141,255,.22),transparent 25%),linear-gradient(120deg,#0a1928,#08101a);border-block:1px solid #123b61}.cta-grid{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:50px}.cta h2{font-size:clamp(34px,4.2vw,58px)}.cta p{color:#c4cfda}.cta-action{display:flex;flex-direction:column;align-items:flex-start;gap:20px}.btn-large{min-height:58px;padding:0 30px}.cta-action>div{display:flex;gap:20px;color:#c7d3df;font-size:13px;flex-wrap:wrap}.site-footer{padding:62px 0 18px;background:#05070a}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:56px}.footer-grid p,.footer-grid a{color:#aeb7c2;font-size:14px}.footer-grid>div:not(:first-child){display:flex;flex-direction:column;gap:8px}.footer-grid h4{text-transform:uppercase;margin:0 0 10px}.footer-logo{margin-bottom:34px}.footer-bottom{margin-top:44px;padding-top:18px;border-top:1px solid var(--line);display:flex;justify-content:space-between;color:#727d89;font-size:12px}
@media(max-width:1050px){.main-nav{display:none;position:absolute;left:20px;right:20px;top:78px;background:#0c1117;border:1px solid var(--line);padding:18px;flex-direction:column;gap:0}.main-nav.open{display:flex}.main-nav a{padding:12px 6px;border-bottom:1px solid var(--line)}.menu-toggle{display:block}.header-cta{display:none}.hero-grid{grid-template-columns:1fr .8fr}.hero h1{font-size:64px}.service-grid{grid-template-columns:1fr 1fr}.service-card:last-child{grid-column:1/-1}.benefit-grid{grid-template-columns:repeat(3,1fr)}.benefit-grid>div:nth-child(3){border-right:0}.benefit-grid>div:nth-child(-n+3){border-bottom:1px solid var(--line)}.material-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:760px){.container{width:min(100% - 28px,var(--max))}.header-inner{height:72px}.logo{font-size:23px}.logo strong{font-size:25px}.logo small{top:29px;font-size:6px}.hero{min-height:auto}.hero-grid{grid-template-columns:1fr}.hero-copy{padding:72px 0 28px}.hero h1{font-size:clamp(44px,14vw,68px)}.lead{font-size:16px}.hero-visual{max-height:370px;overflow:hidden}.hero-visual img{width:95%;margin:auto;transform:none}.hero-services{margin-top:32px;gap:10px}.hero-services span{border:0;padding:0 12px 0 0;font-size:11px}.section{padding:64px 0}.service-grid{grid-template-columns:1fr}.service-card:last-child{grid-column:auto}.service-card{min-height:440px}.service-card>img{width:70%}.process-showcase{grid-template-columns:1fr 1fr;gap:18px}.process-showcase .arrow{display:none}.benefit-grid{grid-template-columns:1fr 1fr}.benefit-grid>div{border-bottom:1px solid var(--line)!important}.benefit-grid>div:nth-child(even){border-right:0}.workflow-grid{grid-template-columns:1fr 1fr}.workflow-grid:before{display:none}.material-grid{grid-template-columns:repeat(2,1fr)}.cta-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:first-child{grid-column:1/-1}.footer-bottom{flex-direction:column;gap:7px}}
@media(max-width:480px){.hero-actions .btn{width:100%}.hero-visual{max-height:300px}.service-card{min-height:415px}.service-card>img{width:78%;right:-50px}.process-showcase{grid-template-columns:1fr}.benefit-grid,.workflow-grid{grid-template-columns:1fr}.benefit-grid>div{border-right:0}.material-grid{grid-template-columns:1fr 1fr}.cta-action .btn{width:100%;text-align:center}.footer-grid{grid-template-columns:1fr}.footer-grid>div:first-child{grid-column:auto}}

/* Mobile hero / header overflow fix */
html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

.hero-grid,
.hero-copy,
.hero-visual,
.header-inner {
  min-width: 0;
}

@media (max-width: 760px) {
  .site-header,
  .hero,
  .hero-grid,
  .hero-copy {
    width: 100%;
    max-width: 100%;
  }

  .hero-copy {
    padding-top: 52px;
  }

  .hero h1 {
    font-size: clamp(36px, 10.5vw, 48px);
    line-height: 1.02;
    letter-spacing: -1px;
    width: 100%;
    max-width: 100%;
  }

  .hero h1 span {
    max-width: 100%;
    overflow-wrap: break-word;
  }

  .lead {
    width: 100%;
    max-width: 100%;
  }

  .hero-actions {
    width: 100%;
  }

  .hero-services {
    width: 100%;
  }

  .hero-visual {
    width: 100%;
    max-width: 100%;
  }

  .hero-visual img {
    width: min(100%, 520px);
    max-width: 100%;
  }
}

@media (max-width: 380px) {
  .container {
    width: calc(100% - 24px);
  }

  .hero h1 {
    font-size: clamp(34px, 10vw, 39px);
  }

  .hero-services {
    display: grid;
    grid-template-columns: 1fr;
    gap: 7px;
  }

  .hero-services span {
    padding: 0;
  }
}

/* Van scan tot print - echte projectfoto's */
.process-showcase{align-items:stretch}
.process-card{position:relative;min-width:0;border:1px solid #24303c;background:linear-gradient(180deg,#111820,#0b0f14);border-radius:10px;overflow:hidden;box-shadow:0 20px 50px rgba(0,0,0,.28)}
.process-number{position:absolute;z-index:3;left:0;top:0;min-width:58px;height:54px;padding:0 12px;display:grid;place-items:center;background:linear-gradient(135deg,#073a70,#07192a);border-right:1px solid var(--blue);border-bottom:1px solid var(--blue);font-size:21px;font-weight:900;color:#fff}
.process-image{aspect-ratio:4/3;border:0;border-radius:0;background:#0c1117;overflow:hidden;display:block}
.process-image picture{display:block;width:100%;height:100%}
.process-image img{width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .4s ease,filter .4s ease;filter:saturate(.95) contrast(1.03)}
.process-card:hover .process-image img{transform:scale(1.035);filter:saturate(1.02) contrast(1.06)}
.process-caption{padding:18px 18px 20px;border-top:1px solid #22303d;min-height:104px}
.process-caption h3{margin:0 0 3px;text-transform:uppercase;font-size:15px;letter-spacing:.2px}
.process-caption p{margin:0!important;color:var(--muted);font-size:12px!important;text-transform:none!important;font-weight:500!important}
.process-showcase>.arrow{align-self:center;font-size:30px;color:var(--blue2);opacity:.9}

@media(max-width:1050px){
  .process-showcase{grid-template-columns:1fr 1fr;gap:18px}
  .process-showcase>.arrow{display:none}
}
@media(max-width:760px){
  .process-showcase{grid-template-columns:1fr 1fr;gap:14px}
  .process-number{min-width:50px;height:46px;font-size:18px}
  .process-caption{min-height:96px;padding:15px 14px 17px}
  .process-caption h3{font-size:14px}
}
@media(max-width:520px){
  .process-showcase{grid-template-columns:1fr}
  .process-image{aspect-ratio:4/3}
  .process-caption{min-height:auto}
}

/* Siepel3D beeldmerk in header en footer */
.logo-with-mark{display:inline-flex;align-items:center;gap:10px;min-width:max-content}
.logo-with-mark .brand-mark{width:58px;height:58px;object-fit:contain;flex:0 0 auto}
.logo-with-mark .brand-text{position:relative;display:inline-flex;align-items:baseline;font-weight:900;letter-spacing:-1px;font-size:28px;line-height:1;padding-bottom:14px}
.logo-with-mark .brand-text strong{color:#168dff;font-size:30px}
.logo-with-mark .brand-text small{position:absolute;left:0;bottom:0;font-size:7px;color:#d5d9df;letter-spacing:.8px;white-space:nowrap}
.footer-logo.logo-with-mark{margin-bottom:28px}
.footer-logo.logo-with-mark .brand-mark{width:68px;height:68px}
@media(max-width:760px){
  .logo-with-mark{gap:7px}
  .logo-with-mark .brand-mark{width:46px;height:46px}
  .logo-with-mark .brand-text{font-size:21px;padding-bottom:12px}
  .logo-with-mark .brand-text strong{font-size:23px}
  .logo-with-mark .brand-text small{font-size:5.5px;letter-spacing:.55px}
}
@media(max-width:380px){
  .logo-with-mark .brand-mark{width:42px;height:42px}
  .logo-with-mark .brand-text{font-size:19px}
  .logo-with-mark .brand-text strong{font-size:21px}
}

/* Hero productfoto - naadloze integratie */
.hero{background:radial-gradient(circle at 76% 40%,rgba(22,141,255,.18),transparent 32%),linear-gradient(115deg,#090d12,#0a0c0f 54%,#070b10)}
.hero-visual{position:relative;align-self:stretch;display:flex;align-items:flex-end;justify-content:center;filter:none;min-width:0}
.hero-visual:before{content:"";position:absolute;z-index:0;width:86%;aspect-ratio:1;border-radius:50%;right:-8%;bottom:-14%;background:rgba(22,141,255,.16);filter:blur(70px);pointer-events:none}
.hero-visual picture{position:relative;z-index:1;width:118%;height:100%;display:block;margin-right:-18%;overflow:hidden}
.hero-visual img{width:100%;height:100%;max-width:none;object-fit:cover;object-position:58% 52%;transform:none;mix-blend-mode:screen;opacity:.96;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 12%,#000 92%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0%,#000 12%,#000 92%,transparent 100%)}

@media(max-width:1050px){
  .hero-grid{grid-template-columns:1fr .9fr}
  .hero-visual picture{width:125%;margin-right:-24%}
  .hero-visual img{object-position:60% 52%}
}

@media(max-width:760px){
  .hero-visual{height:330px;max-height:none;margin:0 -14px;overflow:hidden;align-items:center}
  .hero-visual picture{width:100%;height:100%;margin:0}
  .hero-visual img{width:100%;height:100%;object-fit:cover;object-position:58% 50%;opacity:.94;-webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 12%,#000 88%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0%,#000 12%,#000 88%,transparent 100%)}
}

@media(max-width:480px){
  .hero-visual{height:280px}
  .hero-visual img{object-position:60% 50%}
}


/* Mobiele hero terug naar layout van revisie 4 */
@media (max-width: 760px) {
  .hero-grid {
    grid-template-columns: 1fr;
  }

  .hero-visual {
    position: relative;
    height: auto;
    max-height: 370px;
    margin: 0;
    overflow: hidden;
    display: block;
    align-self: auto;
  }

  .hero-visual:before {
    display: none;
  }

  .hero-visual picture {
    position: relative;
    width: 100%;
    height: auto;
    margin: 0;
    display: block;
    overflow: visible;
  }

  .hero-visual img {
    width: min(100%, 520px);
    height: auto;
    max-width: 100%;
    margin: 0 auto;
    object-fit: contain;
    object-position: center;
    transform: none;
    mix-blend-mode: normal;
    opacity: 1;
    -webkit-mask-image: none;
    mask-image: none;
  }
}

@media (max-width: 480px) {
  .hero-visual {
    height: auto;
    max-height: 300px;
  }

  .hero-visual img {
    object-position: center;
  }
}


/* Diensten - alle beelden dezelfde opmaak als 3D Printen */
.service-card>img{
  right:0;
  top:0;
  width:100%;
  height:60%;
  object-fit:cover;
  object-position:center 55%;
  opacity:.9;
  filter:none;
  -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 72%,transparent 100%);
  mask-image:linear-gradient(180deg,#000 0%,#000 72%,transparent 100%);
}
@media(max-width:760px){
  .service-card>img{
    right:0;
    top:0;
    width:100%;
    height:58%;
    object-fit:cover;
    object-position:center 55%;
  }
}
@media(max-width:480px){
  .service-card>img{
    right:0;
    top:0;
    width:100%;
  }
}


/* Legal pagina */
.legal-hero{padding:82px 0 48px;background:radial-gradient(circle at 82% 18%,rgba(22,141,255,.14),transparent 28%),linear-gradient(115deg,#090d12,#080b0f);border-bottom:1px solid var(--line)}
.legal-hero h1{margin:0;text-transform:uppercase;letter-spacing:-1.5px;line-height:1.03;font-size:clamp(42px,5vw,68px)}
.legal-hero p:last-child{max-width:720px;color:var(--muted);font-size:17px}
.legal-content{padding:64px 0 88px}
.legal-document{max-width:920px;margin:0 auto}
.legal-document h2{margin:42px 0 16px;padding-top:10px;color:var(--text);font-size:24px;line-height:1.25;text-transform:none;border-top:1px solid var(--line)}
.legal-document h2:first-child{margin-top:0;border-top:0;padding-top:0}
.legal-document p{margin:0 0 13px;color:#c6ced8;font-size:15px}
.legal-document strong{color:var(--text)}
@media(max-width:760px){.legal-hero{padding:58px 0 34px}.legal-content{padding:44px 0 64px}.legal-document h2{font-size:21px;margin-top:34px}.legal-document p{font-size:14px}}

/* Footer: Diensten, Legal en Contact naast elkaar op tablet */
@media (min-width:481px) and (max-width:760px){
  .footer-grid{grid-template-columns:repeat(3,1fr);gap:28px}
  .footer-grid>div:first-child{grid-column:1/-1}
}


/* 2026-08-23 - ruimere responsive desktop layout + hero in betere verhouding */
:root{--max:1480px}

@media (min-width:1200px){
  .container{width:min(var(--max),calc(100% - 72px))}
  .header-inner{height:90px}
  .hero{min-height:clamp(650px,72vh,790px)}
  .hero-grid{min-height:clamp(650px,72vh,790px);grid-template-columns:minmax(0,.88fr) minmax(520px,1.12fr);gap:clamp(30px,4vw,72px)}
  .hero-copy{padding:72px 0 62px;max-width:690px}
  .hero h1{font-size:clamp(58px,4.45vw,78px);max-width:690px;line-height:.98}
  .lead{font-size:17px;max-width:640px;margin:20px 0 26px}
  .hero-services{margin-top:36px}
  .hero-visual{align-self:stretch;min-height:0}
  .hero-visual picture{width:112%;height:100%;margin-right:-10%}
  .hero-visual img{object-position:56% 50%}
  .section{padding:clamp(88px,6vw,112px) 0}
}

.hero-slogan{display:flex;align-items:center;gap:14px;margin:18px 0 0;color:#d7e1ec;text-transform:uppercase;font-size:12px;font-weight:800;letter-spacing:3.2px}
.hero-slogan>span{display:block;width:36px;height:2px;background:var(--blue);flex:0 0 auto}

@media (min-width:1600px){
  .container{width:min(var(--max),calc(100% - 96px))}
  .hero-grid{grid-template-columns:minmax(0,.82fr) minmax(620px,1.18fr)}
  .hero h1{font-size:76px}
}

@media (max-width:1199px) and (min-width:761px){
  .hero-grid{grid-template-columns:1fr .9fr;gap:24px}
  .hero h1{font-size:clamp(50px,6vw,64px)}
  .hero-visual picture{width:118%;margin-right:-18%}
}

@media (max-width:760px){
  .hero-slogan{font-size:10px;letter-spacing:2.1px;gap:10px;margin-top:14px}
  .hero-slogan>span{width:26px}
  .hero-copy{padding-left:0;padding-right:0}
  .hero-visual{width:100%;max-width:100%;margin:0}
}

/* =========================================================
   4K / ULTRAWIDE RESPONSIVE SCALING
   Laat de bestaande tablet- en mobiele styling ongemoeid,
   maar laat desktopvloeiender meegroeien op grote schermen.
   ========================================================= */

@media (min-width: 1200px) {
  :root { --max: 1580px; }

  .container { width: min(var(--max), calc(100% - 72px)); }
  .header-inner { height: clamp(88px, 5vw, 104px); }

  .hero {
    min-height: clamp(680px, 72vh, 860px);
  }

  .hero-grid {
    min-height: clamp(680px, 72vh, 860px);
    grid-template-columns: minmax(0, .86fr) minmax(560px, 1.14fr);
    gap: clamp(36px, 4vw, 86px);
  }

  .hero-copy {
    max-width: 760px;
    padding: clamp(70px, 5vw, 96px) 0 clamp(58px, 4vw, 82px);
  }

  .hero h1 {
    max-width: 760px;
    font-size: clamp(62px, 4.25vw, 82px);
    line-height: .98;
  }

  .lead {
    max-width: 700px;
    font-size: clamp(17px, 1.05vw, 20px);
    margin: 22px 0 30px;
  }

  .hero-visual picture {
    width: 116%;
    margin-right: -12%;
  }

  .hero-visual img {
    object-position: 56% 50%;
  }

  .section {
    padding: clamp(92px, 6vw, 128px) 0;
  }
}

@media (min-width: 1600px) {
  :root { --max: 1760px; }

  .container { width: min(var(--max), calc(100% - 96px)); }
  .main-nav { gap: clamp(24px, 1.6vw, 34px); }
  .main-nav a { font-size: 14px; }
  .btn { min-height: 52px; padding-inline: 26px; font-size: 12px; }

  .hero {
    min-height: clamp(760px, 74vh, 920px);
  }

  .hero-grid {
    min-height: clamp(760px, 74vh, 920px);
    grid-template-columns: minmax(0, .82fr) minmax(690px, 1.18fr);
    gap: clamp(52px, 4.5vw, 110px);
  }

  .hero-copy { max-width: 820px; }
  .hero h1 { max-width: 820px; font-size: clamp(76px, 4.15vw, 94px); }
  .lead { max-width: 740px; font-size: 19px; }
  .hero-services span { font-size: 14px; padding-right: 32px; }

  .section-head { max-width: 820px; }
  .section-head h2 { font-size: clamp(40px, 3vw, 58px); }
  .section-head>p:last-child { font-size: 17px; }
  .service-card { min-height: 530px; }
}

@media (min-width: 2000px) {
  :root { --max: 1960px; }

  .container { width: min(var(--max), calc(100% - 120px)); }
  .header-inner { height: 108px; }
  .logo-with-mark .brand-mark { width: 68px; height: 68px; }
  .logo-with-mark .brand-text { font-size: 32px; }
  .logo-with-mark .brand-text strong { font-size: 35px; }

  .hero {
    min-height: clamp(830px, 75vh, 990px);
  }

  .hero-grid {
    min-height: clamp(830px, 75vh, 990px);
    grid-template-columns: minmax(0, .8fr) minmax(820px, 1.2fr);
    gap: clamp(70px, 5vw, 130px);
  }

  .hero-copy { max-width: 920px; }
  .hero h1 { max-width: 900px; font-size: clamp(86px, 4vw, 104px); }
  .eyebrow { font-size: 14px; }
  .hero-slogan { font-size: 13px; letter-spacing: 3.8px; }
  .lead { max-width: 820px; font-size: 20px; }
  .hero-actions { gap: 20px; }
  .btn { min-height: 56px; padding-inline: 30px; font-size: 13px; }
  .hero-services { margin-top: 42px; }
  .hero-services span { font-size: 15px; }

  .hero-visual picture { width: 118%; margin-right: -10%; }

  .service-grid { gap: 30px; }
  .service-card { min-height: 570px; }
  .service-body h3 { font-size: 31px; }
  .service-body p { font-size: 15px; }
  .benefit-grid h3 { font-size: 16px; }
  .benefit-grid p { font-size: 14px; }
  .workflow-grid { gap: 48px; }
  .workflow-step h3 { font-size: 19px; }
  .workflow-step p { font-size: 15px; max-width: 280px; }
}

@media (min-width: 2560px) {
  :root { --max: 2280px; }

  .container { width: min(var(--max), calc(100% - 160px)); }
  .header-inner { height: 122px; }
  .main-nav a { font-size: 16px; }
  .header-cta { min-height: 60px; padding-inline: 34px; }

  .hero {
    min-height: clamp(920px, 76vh, 1120px);
  }

  .hero-grid {
    min-height: clamp(920px, 76vh, 1120px);
    grid-template-columns: minmax(0, .78fr) minmax(980px, 1.22fr);
    gap: clamp(90px, 5vw, 150px);
  }

  .hero-copy { max-width: 1040px; }
  .hero h1 { max-width: 1040px; font-size: clamp(100px, 3.75vw, 116px); }
  .eyebrow { font-size: 16px; letter-spacing: 2px; }
  .hero-slogan { margin-top: 24px; font-size: 15px; letter-spacing: 4px; }
  .hero-slogan>span { width: 48px; }
  .lead { max-width: 900px; font-size: 22px; line-height: 1.65; margin: 28px 0 34px; }
  .btn { min-height: 62px; padding-inline: 34px; font-size: 14px; }
  .hero-services { margin-top: 50px; }
  .hero-services span { font-size: 16px; padding-right: 38px; }

  .hero-visual picture { width: 120%; margin-right: -8%; }

  .section { padding: 138px 0; }
  .section-head { max-width: 980px; margin-bottom: 54px; }
  .section-head.centered { margin-bottom: 58px; }
  .section-head h2 { font-size: clamp(52px, 2.6vw, 68px); }
  .section-head>p:last-child { font-size: 20px; }

  .service-grid { gap: 38px; }
  .service-card { min-height: 650px; }
  .service-icon { left: 36px; top: 36px; width: 64px; height: 64px; font-size: 34px; }
  .service-body { left: 36px; right: 36px; bottom: 34px; }
  .service-body h3 { font-size: 36px; }
  .service-body strong { font-size: 15px; }
  .service-body p { font-size: 17px; }
  .service-body a { font-size: 14px; }

  .process-showcase { gap: 22px; }
  .process-number { min-width: 72px; height: 64px; font-size: 25px; }
  .process-caption { min-height: 126px; padding: 24px; }
  .process-caption h3 { font-size: 19px; }
  .process-caption p { font-size: 14px !important; }
  .process-showcase>.arrow { font-size: 42px; }

  .benefit-grid span { font-size: 50px; }
  .benefit-grid>div { padding: 42px 24px; }
  .benefit-grid h3 { font-size: 18px; }
  .benefit-grid p { font-size: 16px; }

  .circle { width: 108px; height: 108px; font-size: 38px; }
  .workflow-grid:before { top: 68px; }
  .workflow-step>span { font-size: 18px; }
  .workflow-step h3 { font-size: 22px; }
  .workflow-step p { font-size: 17px; max-width: 330px; }

  .material-grid span { min-height: 96px; font-size: 18px; }
  .checks { gap: 40px; font-size: 16px; }

  .cta { padding: 96px 0; }
  .cta p { font-size: 18px; }
  .cta h2 { font-size: clamp(50px, 2.6vw, 72px); }

  .footer-grid { gap: 74px; }
  .footer-grid p,.footer-grid a { font-size: 16px; }
  .footer-grid h4 { font-size: 18px; }
  .footer-bottom { font-size: 14px; }
}

@media (min-width: 3200px) {
  :root { --max: 2920px; }

  .container { width: min(var(--max), calc(100% - 220px)); }
  .header-inner { height: 136px; }
  .logo-with-mark .brand-mark { width: 82px; height: 82px; }
  .logo-with-mark .brand-text { font-size: 40px; }
  .logo-with-mark .brand-text strong { font-size: 44px; }
  .logo-with-mark .brand-text small { font-size: 9px; }
  .main-nav { gap: 40px; }
  .main-nav a { font-size: 18px; }
  .header-cta { min-height: 68px; padding-inline: 38px; font-size: 15px; }

  .hero {
    min-height: clamp(1060px, 78vh, 1260px);
  }

  .hero-grid {
    min-height: clamp(1060px, 78vh, 1260px);
    grid-template-columns: minmax(0, .8fr) minmax(1220px, 1.2fr);
    gap: clamp(110px, 5vw, 190px);
  }

  .hero-copy { max-width: 1260px; padding-block: 110px 96px; }
  .hero h1 { max-width: 1240px; font-size: clamp(118px, 3.45vw, 142px); letter-spacing: -3px; }
  .eyebrow { font-size: 18px; }
  .hero-slogan { font-size: 17px; letter-spacing: 4.8px; }
  .lead { max-width: 1080px; font-size: 25px; line-height: 1.65; }
  .btn { min-height: 70px; padding-inline: 40px; font-size: 16px; }
  .hero-services span { font-size: 18px; padding-right: 46px; }
  .hero-visual picture { width: 122%; margin-right: -6%; }

  .section { padding: 158px 0; }
  .section-head { max-width: 1180px; }
  .section-head h2 { font-size: 76px; }
  .section-head>p:last-child { font-size: 22px; }

  .service-card { min-height: 760px; }
  .service-body h3 { font-size: 42px; }
  .service-body p { font-size: 19px; }
  .benefit-grid h3 { font-size: 21px; }
  .benefit-grid p { font-size: 18px; }
  .workflow-step h3 { font-size: 25px; }
  .workflow-step p { font-size: 19px; max-width: 380px; }
}


/* =========================================================
   2026-08-23 - Gebalanceerde desktop / 4K schaal
   Breder op grote schermen zonder dat typografie gigantisch wordt.
   ========================================================= */
@media (min-width: 1600px) {
  :root { --max: 1680px; }
  .container { width: min(var(--max), calc(100% - 96px)); }
  .header-inner { height: 96px; }
  .hero { min-height: clamp(720px, 70vh, 860px); }
  .hero-grid {
    min-height: clamp(720px, 70vh, 860px);
    grid-template-columns: minmax(0, .86fr) minmax(650px, 1.14fr);
    gap: clamp(48px, 4vw, 90px);
  }
  .hero-copy { max-width: 760px; padding: 76px 0 66px; }
  .hero h1 { max-width: 760px; font-size: clamp(68px, 3.7vw, 84px); line-height: .99; }
  .lead { max-width: 700px; font-size: 18px; }
  .section-head { max-width: 800px; }
  .section-head h2 { font-size: clamp(38px, 2.55vw, 54px); }
  .section-head>p:last-child { font-size: 16px; }
  .service-card { min-height: 520px; }
}

@media (min-width: 2000px) {
  :root { --max: 1900px; }
  .container { width: min(var(--max), calc(100% - 120px)); }
  .header-inner { height: 102px; }
  .hero { min-height: clamp(780px, 70vh, 900px); }
  .hero-grid {
    min-height: clamp(780px, 70vh, 900px);
    grid-template-columns: minmax(0, .84fr) minmax(760px, 1.16fr);
    gap: clamp(56px, 4vw, 105px);
  }
  .hero-copy { max-width: 820px; }
  .hero h1 { max-width: 810px; font-size: clamp(74px, 3.45vw, 90px); }
  .eyebrow { font-size: 13px; }
  .hero-slogan { font-size: 12px; letter-spacing: 3.5px; }
  .lead { max-width: 760px; font-size: 19px; }
  .btn { min-height: 54px; padding-inline: 28px; font-size: 12px; }
  .hero-services span { font-size: 14px; }
  .section { padding: 110px 0; }
  .section-head h2 { font-size: clamp(42px, 2.35vw, 58px); }
  .service-card { min-height: 550px; }
  .service-body h3 { font-size: 30px; }
  .service-body p { font-size: 15px; }
}

@media (min-width: 2560px) {
  :root { --max: 2200px; }
  .container { width: min(var(--max), calc(100% - 160px)); }
  .header-inner { height: 108px; }
  .main-nav a { font-size: 14px; }
  .header-cta { min-height: 56px; padding-inline: 30px; }
  .hero { min-height: clamp(820px, 68vh, 940px); }
  .hero-grid {
    min-height: clamp(820px, 68vh, 940px);
    grid-template-columns: minmax(0, .84fr) minmax(900px, 1.16fr);
    gap: clamp(70px, 4vw, 120px);
  }
  .hero-copy { max-width: 880px; padding-block: 82px 72px; }
  .hero h1 { max-width: 860px; font-size: clamp(78px, 3vw, 94px); letter-spacing: -2px; }
  .eyebrow { font-size: 14px; }
  .hero-slogan { margin-top: 20px; font-size: 13px; letter-spacing: 3.6px; }
  .hero-slogan>span { width: 40px; }
  .lead { max-width: 800px; font-size: 20px; line-height: 1.6; margin: 24px 0 30px; }
  .btn { min-height: 56px; padding-inline: 30px; font-size: 13px; }
  .hero-services { margin-top: 40px; }
  .hero-services span { font-size: 14px; padding-right: 32px; }
  .hero-visual picture { width: 116%; margin-right: -8%; }
  .section { padding: 118px 0; }
  .section-head { max-width: 900px; margin-bottom: 48px; }
  .section-head.centered { margin-bottom: 50px; }
  .section-head h2 { font-size: clamp(46px, 2.05vw, 60px); }
  .section-head>p:last-child { font-size: 17px; }
  .service-grid { gap: 30px; }
  .service-card { min-height: 570px; }
  .service-icon { left: 30px; top: 30px; width: 56px; height: 56px; font-size: 30px; }
  .service-body { left: 30px; right: 30px; bottom: 28px; }
  .service-body h3 { font-size: 31px; }
  .service-body strong { font-size: 13px; }
  .service-body p { font-size: 15px; }
  .service-body a { font-size: 12px; }
  .process-number { min-width: 62px; height: 56px; font-size: 22px; }
  .process-caption { min-height: 110px; padding: 20px; }
  .process-caption h3 { font-size: 16px; }
  .benefit-grid span { font-size: 44px; }
  .benefit-grid>div { padding: 34px 20px; }
  .benefit-grid h3 { font-size: 15px; }
  .benefit-grid p { font-size: 14px; }
  .circle { width: 94px; height: 94px; font-size: 33px; }
  .workflow-grid:before { top: 61px; }
  .workflow-step h3 { font-size: 19px; }
  .workflow-step p { font-size: 15px; max-width: 290px; }
  .material-grid span { min-height: 84px; font-size: 16px; }
  .checks { font-size: 14px; }
  .cta { padding: 82px 0; }
  .cta p { font-size: 16px; }
  .cta h2 { font-size: clamp(42px, 2.1vw, 60px); }
  .footer-grid p,.footer-grid a { font-size: 14px; }
  .footer-grid h4 { font-size: 16px; }
  .footer-bottom { font-size: 12px; }
}

@media (min-width: 3200px) {
  :root { --max: 2460px; }
  .container { width: min(var(--max), calc(100% - 220px)); }
  .header-inner { height: 112px; }
  .logo-with-mark .brand-mark { width: 68px; height: 68px; }
  .logo-with-mark .brand-text { font-size: 32px; }
  .logo-with-mark .brand-text strong { font-size: 35px; }
  .logo-with-mark .brand-text small { font-size: 7px; }
  .main-nav { gap: 30px; }
  .main-nav a { font-size: 15px; }
  .header-cta { min-height: 58px; padding-inline: 32px; font-size: 13px; }
  .hero { min-height: clamp(860px, 66vh, 980px); }
  .hero-grid {
    min-height: clamp(860px, 66vh, 980px);
    grid-template-columns: minmax(0, .84fr) minmax(1040px, 1.16fr);
    gap: clamp(78px, 4vw, 135px);
  }
  .hero-copy { max-width: 920px; padding-block: 86px 74px; }
  .hero h1 { max-width: 900px; font-size: clamp(84px, 2.55vw, 98px); letter-spacing: -2px; }
  .eyebrow { font-size: 14px; }
  .hero-slogan { font-size: 13px; letter-spacing: 3.8px; }
  .lead { max-width: 820px; font-size: 20px; line-height: 1.6; }
  .btn { min-height: 58px; padding-inline: 32px; font-size: 13px; }
  .hero-services span { font-size: 15px; padding-right: 34px; }
  .section { padding: 124px 0; }
  .section-head { max-width: 960px; }
  .section-head h2 { font-size: 60px; }
  .section-head>p:last-child { font-size: 18px; }
  .service-card { min-height: 600px; }
  .service-body h3 { font-size: 33px; }
  .service-body p { font-size: 16px; }
}

/* CTA: inhoud compacter en meer gecentreerd op brede schermen */
@media (min-width: 761px) {
  .cta-grid {
    grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr);
    max-width: none;
    gap: clamp(48px, 6vw, 90px);
  }
  .cta-action {
    justify-self: center;
  }
}

@media (min-width: 1600px) {
  .cta-grid { max-width: none; }
}


/* Projectfoto galerij - zonder extern JavaScript */
.process-zoom{position:relative;display:block;width:100%;height:100%;cursor:pointer}
.process-zoom picture{display:block;width:100%;height:100%}
.process-zoom:hover img{transform:scale(1.025)}
.process-zoom:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}

.photo-lightbox{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;padding:clamp(18px,3vw,56px)}
.photo-lightbox:target{display:flex}
.photo-lightbox-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.9);backdrop-filter:blur(8px)}
.photo-lightbox-content{position:relative;z-index:1;width:min(94vw,1800px);max-height:94vh;display:flex;align-items:center;justify-content:center;padding:0 clamp(48px,5vw,90px)}
.photo-lightbox-figure{margin:0;max-width:100%;max-height:94vh;display:flex;flex-direction:column;align-items:center}
.photo-lightbox-figure picture{display:block;max-width:100%;min-height:0}
.photo-lightbox-figure img{display:block;width:auto;height:auto;max-width:100%;max-height:78vh;object-fit:contain;border:1px solid #263441;border-radius:10px 10px 0 0;box-shadow:0 30px 90px rgba(0,0,0,.65)}
.photo-lightbox-figure figcaption{width:100%;padding:16px 20px 18px;background:#0b1118;border:1px solid #263441;border-top:0;border-radius:0 0 10px 10px;text-align:left}
.photo-lightbox-figure figcaption strong{display:block;text-transform:uppercase;font-size:15px;letter-spacing:.2px;color:#fff}
.photo-lightbox-figure figcaption span{display:block;margin-top:3px;color:var(--muted);font-size:13px}
.photo-lightbox-close{position:absolute;z-index:3;right:0;top:-12px;width:46px;height:46px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.3);border-radius:50%;background:#0a1119;color:#fff;font-size:30px;line-height:1;box-shadow:0 8px 24px rgba(0,0,0,.45)}
.photo-lightbox-close:hover{background:#142536;color:var(--blue2)}
.photo-lightbox-nav{position:absolute;z-index:3;top:50%;transform:translateY(-50%);width:56px;height:72px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.24);border-radius:8px;background:rgba(8,17,26,.82);color:#fff;font-size:52px;line-height:1;transition:.2s}
.photo-lightbox-nav:hover{background:#102a42;color:var(--blue2);border-color:var(--blue)}
.photo-lightbox-prev{left:0}.photo-lightbox-next{right:0}

@media(max-width:760px){
  .photo-lightbox{padding:10px}
  .photo-lightbox-content{width:100%;padding:0 42px}
  .photo-lightbox-close{right:4px;top:-48px;width:40px;height:40px}
  .photo-lightbox-nav{width:36px;height:58px;font-size:38px}
  .photo-lightbox-prev{left:0}.photo-lightbox-next{right:0}
  .photo-lightbox-figure img{max-height:72vh}
  .photo-lightbox-figure figcaption{padding:12px 14px 14px}
}


/* Gelijke contentbreedte: workflow, materialen en CTA */
@media (min-width: 761px) {
  .workflow > .container,
  .materials > .container,
  .cta > .container {
    width: min(var(--max), calc(100% - 72px));
    max-width: var(--max);
    margin-left: auto;
    margin-right: auto;
  }

  .material-grid-six {
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
  }

  .cta-grid {
    width: min(var(--max), calc(100% - 72px));
    max-width: var(--max);
    grid-template-columns: minmax(0, 1fr) minmax(320px, .72fr);
    gap: clamp(48px, 7vw, 140px);
  }

  .cta-grid > div:first-child {
    justify-self: start;
    max-width: 900px;
  }

  .cta-action {
    justify-self: end;
  }
}

@media (min-width: 1600px) {
  .workflow > .container,
  .materials > .container,
  .cta > .container,
  .cta-grid {
    width: min(var(--max), calc(100% - 120px));
  }
}

@media (min-width: 2400px) {
  .workflow > .container,
  .materials > .container,
  .cta > .container,
  .cta-grid {
    width: min(var(--max), calc(100% - 160px));
  }
}

@media (min-width: 3200px) {
  .workflow > .container,
  .materials > .container,
  .cta > .container,
  .cta-grid {
    width: min(var(--max), calc(100% - 220px));
  }
}

/* =========================================================
   Definitieve uitlijning met visuele breedte van workflow
   De workflow heeft 4 kolommen; de buitenste stappen staan
   op 12.5% en 87.5%. Materialen en CTA gebruiken daarom
   dezelfde zichtbare span: 75% van de hoofdcontainer.
   ========================================================= */
@media (min-width: 1060px) {
  .materials .material-grid-six,
  .materials .checks,
  .cta .cta-grid {
    width: 75% !important;
    max-width: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .materials .section-head.centered {
    width: 75%;
    max-width: 960px;
  }

  .cta .cta-grid {
    grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr);
    gap: clamp(48px, 5vw, 100px);
  }

  .cta .cta-grid > div:first-child {
    max-width: none;
  }

  .cta .cta-action {
    justify-self: end;
  }
}

@media (min-width: 1060px) and (max-width: 1599px) {
  .materials .material-grid-six,
  .materials .checks,
  .cta .cta-grid {
    width: 82% !important;
  }
}

@media (max-width: 1059px) {
  .materials .material-grid-six,
  .materials .checks,
  .cta .cta-grid {
    width: 100% !important;
  }
}

/* CTA exact dezelfde zichtbare breedte als workflow/materialen */
@media (min-width: 1060px) {
  .cta .cta-grid {
    width: 75% !important;
    max-width: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
    grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr);
    gap: clamp(40px, 4vw, 80px);
  }
  .cta .cta-action { justify-self: end; }
}
@media (min-width: 1060px) and (max-width: 1599px) {
  .cta .cta-grid { width: 82% !important; }
}

/* Project starten: exact dezelfde zichtbare breedte als Materialen & Mogelijkheden.
   Materialen is een geneste 75%-grid binnen de hoofdcontainer; de CTA is zelf
   de container en krijgt daarom per desktop-breakpoint dezelfde berekende maat. */
@media (min-width: 1060px) and (max-width: 1599px) {
  .cta .cta-grid {
    width: calc(82% - 33px) !important;
    max-width: 1017px !important;
    margin-inline: auto !important;
  }
}
@media (min-width: 1600px) and (max-width: 1999px) {
  .cta .cta-grid {
    width: calc(75% - 72px) !important;
    max-width: 1320px !important;
    margin-inline: auto !important;
  }
}
@media (min-width: 2000px) and (max-width: 2559px) {
  .cta .cta-grid {
    width: min(1470px, calc(75% - 90px)) !important;
    max-width: 1470px !important;
    margin-inline: auto !important;
  }
}
@media (min-width: 2560px) and (max-width: 3199px) {
  .cta .cta-grid {
    width: 1710px !important;
    max-width: 1710px !important;
    margin-inline: auto !important;
  }
}
@media (min-width: 3200px) {
  .cta .cta-grid {
    width: 2190px !important;
    max-width: 2190px !important;
    margin-inline: auto !important;
  }
}

/* Footer: dezelfde zichtbare breedte als Materialen & Mogelijkheden */
@media (min-width: 1060px) and (max-width: 1599px) {
  .site-footer > .container {
    width: calc(82% - 33px) !important;
    max-width: 1017px !important;
  }
}
@media (min-width: 1600px) and (max-width: 1999px) {
  .site-footer > .container {
    width: calc(75% - 72px) !important;
    max-width: 1320px !important;
  }
}
@media (min-width: 2000px) and (max-width: 2559px) {
  .site-footer > .container {
    width: min(1470px, calc(75% - 90px)) !important;
    max-width: 1470px !important;
  }
}
@media (min-width: 2560px) and (max-width: 3199px) {
  .site-footer > .container {
    width: 1710px !important;
    max-width: 1710px !important;
  }
}
@media (min-width: 3200px) {
  .site-footer > .container {
    width: 2190px !important;
    max-width: 2190px !important;
  }
}

/* Footer desktop: kolommen strak over dezelfde breedte verdelen.
   Contact wordt tegen de rechterrand uitgelijnd. */
@media (min-width: 1060px) {
  .site-footer .footer-grid {
    grid-template-columns: minmax(0, 2fr) minmax(150px, .8fr) minmax(180px, .9fr) minmax(190px, .9fr);
    column-gap: clamp(42px, 4vw, 90px);
    align-items: start;
  }

  .site-footer .footer-grid > div:nth-child(2) {
    justify-self: center;
  }

  .site-footer .footer-grid > div:nth-child(3) {
    justify-self: center;
  }

  .site-footer .footer-grid > div:nth-child(4) {
    justify-self: end;
    text-align: left;
    min-width: 190px;
  }

  .site-footer .footer-bottom {
    width: 100%;
  }
}


/* Mobiel: extra zijruimte voor het kopstuk */
@media (max-width: 760px) {
  .hero-copy {
    padding-left: 14px;
    padding-right: 14px;
  }
}