/* sw12-desktop-only: these page rules were designed at 1440; below 1101px the earlier responsive layout applies */
@media (min-width:1101px){
/* sw11 round, group a (home = body.gx-home, gratis homepage = body.x-gh) */

/* ---------- home: scroll reveals settle early, so every screen reads complete ---------- */
@supports (animation-timeline:view()){
  html.b2-on body.gx-home main>section:not(.gx-hall) *:not(.g-hm-a):not(.g-hm-b):not(#a):not(#b):not(#c),
  html.b2-on body.gx-home main>section:not(.gx-hall) *:not(#a):not(#b):not(#c)::before,
  html.b2-on body.gx-home main>section:not(.gx-hall) *:not(#a):not(#b):not(#c)::after{animation-range:entry 0px entry 100px!important}
}

/* ---------- home: hero, the condition of the free design sits right under the buttons ---------- */
html:root body.gx-home .g22-side .xa-cond{margin:18px 0 0;text-align:center;font-size:15px;line-height:22px;letter-spacing:.005em;color:rgba(240,234,220,.66)}

/* ---------- home: Kies uw pakket ---------- */
html:root body.gx-home #prijzen.gx-room15:not(#a):not(#b){padding:104px 64px 48px!important}
html:root body.gx-home #prijzen .gx-rail:not(#a):not(#b){margin-top:48px!important}
/* one comparison grid: every card shares the same lines, so names, prices and lists read straight across.
   The ladder stays as the rising top edge of the four cards. */
html:root body.gx-home #prijzen .gx-rail:not(#a):not(#b):not(#c){display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;grid-template-rows:repeat(11,auto)!important;align-items:stretch!important;height:auto!important}
html:root body.gx-home #prijzen .gx-rail>.g45-row:not(#a):not(#b):not(#c){display:grid!important;grid-template-columns:minmax(0,1fr)!important;grid-template-rows:subgrid!important;grid-row:1 / span 11!important;height:auto!important;min-height:0!important;align-self:stretch!important;align-content:start}
html:root body.gx-home #prijzen .gx-rail>.g45-row:nth-child(1):not(#a):not(#b):not(#c){margin-top:66px!important}
html:root body.gx-home #prijzen .gx-rail>.g45-row:nth-child(2):not(#a):not(#b):not(#c){margin-top:44px!important}
html:root body.gx-home #prijzen .gx-rail>.g45-row:nth-child(3):not(#a):not(#b):not(#c){margin-top:22px!important}
html:root body.gx-home #prijzen .gx-rail>.g45-row:nth-child(4):not(#a):not(#b):not(#c){margin-top:0!important}
html:root body.gx-home #prijzen .g45-row>.pc-host:not(#a):not(#b):not(#c){grid-row:1!important;grid-column:1!important;align-self:start}
html:root body.gx-home #prijzen .g45-row>h3:not(#a):not(#b):not(#c){grid-row:2!important;grid-column:1!important}
html:root body.gx-home #prijzen .g45-row>.gx-price:not(#a):not(#b):not(#c){grid-row:3!important;grid-column:1!important;justify-content:flex-start!important}
html:root body.gx-home #prijzen .g45-row>.g45-wl:not(#a):not(#b):not(#c){grid-row:4!important;grid-column:1!important}
html:root body.gx-home #prijzen .g45-row>.pc-who:not(#a):not(#b):not(#c){grid-row:5!important;grid-column:1!important}
html:root body.gx-home #prijzen .g45-row>.pc-pg:not(#a):not(#b):not(#c){grid-row:6!important;grid-column:1!important;align-self:start}
html:root body.gx-home #prijzen .g45-row>.pc-base:not(#a):not(#b):not(#c){grid-row:7!important;grid-column:1!important}
html:root body.gx-home #prijzen .g45-row>.pc-get:not(#a):not(#b):not(#c){grid-row:8!important;grid-column:1!important;align-self:start;margin-bottom:26px!important}
html:root body.gx-home #prijzen .g45-row>.pc-al:not(#a):not(#b):not(#c){grid-row:9!important;grid-column:1!important;margin-top:0!important}
html:root body.gx-home #prijzen .g45-row>.g45-lt:not(#a):not(#b):not(#c){grid-row:10!important;grid-column:1!important}
html:root body.gx-home #prijzen .g45-row>.g22-om-ex:not(#a):not(#b):not(#c){grid-row:11!important;grid-column:1!important}
/* Landing Page has no "plus" label, its list starts on that line */
html:root body.gx-home #prijzen .g45-row:first-child>.pc-get:not(#a):not(#b):not(#c){grid-row:7 / span 2!important;margin-top:20px!important}
/* delivery time and example close each card as two quiet lines, label left, value right */
html:root body.gx-home #prijzen .g45-row>:is(.g45-lt,.g22-om-ex):not(#a):not(#b):not(#c){display:flex!important;justify-content:space-between!important;align-items:baseline!important;gap:8px;margin:0!important;padding:13px 0!important;border-top:1px solid rgba(246,239,220,.12)!important;white-space:nowrap;font-size:14px!important;line-height:22px!important;min-height:0!important;color:rgba(240,234,220,.62)!important}
html:root body.gx-home #prijzen .g45-row>.g22-om-ex:not(#a):not(#b):not(#c){padding-bottom:0!important}
html:root body.gx-home #prijzen .g45-row>.g45-lt :is(.g45-lt-k,.g45-lt-v):not(#a):not(#b):not(#c){font-size:14px!important;line-height:22px!important;margin:0!important}
html:root body.gx-home #prijzen .g45-row>.g45-lt .g45-lt-k:not(#a):not(#b):not(#c){color:rgba(240,234,220,.62)!important;font-weight:400!important}
html:root body.gx-home #prijzen .g45-row>.g45-lt .g45-lt-v:not(#a):not(#b):not(#c){color:#f3eee4!important;text-align:right}
html:root body.gx-home #prijzen .g45-row>.g22-om-ex a:not(#a):not(#b):not(#c){display:inline!important;min-height:0!important;margin:0!important;padding:0!important;font-size:14px!important;line-height:22px!important;text-align:right!important;color:#f3eee4!important;text-decoration:underline!important;text-decoration-thickness:1px!important;text-underline-offset:4px!important;text-decoration-color:rgba(242,205,69,.55)!important}
html:root body.gx-home #prijzen .g45-row>.pc-al:not(#a):not(#b):not(#c){margin-bottom:0!important}

/* ---------- home: Zo werken onze sites ---------- */
html:root body.gx-home #proberen.g-sec:not(#a):not(#b){padding-top:88px!important}
/* the Stilwater text column starts on the same line as the demo, no empty well above it */
html:root body.gx-home .g40-ex.g40-sw:not(#a):not(#b){align-items:start!important}
html:root body.gx-home .g40-sw .g40-ex-t:not(#a):not(#b){align-self:start!important}
html:root body.gx-home #proberen .b15-row:not(#a):not(#b){margin-top:136px!important}

/* "Meer van ons werk": one project large, two stacked beside it, pictures on one outer line */
html:root body.gx-home .b15-row-in:not(#a):not(#b){grid-template-columns:minmax(0,848fr) minmax(0,416fr)!important;grid-template-rows:auto auto;column-gap:48px!important;row-gap:34px!important;align-items:start!important}
html:root body.gx-home .b15-card:first-child:not(#a){grid-row:1 / span 2}
html:root body.gx-home .b15-card:first-child b:not(#a){font-size:38px!important;margin-top:6px}
html:root body.gx-home .b15-card:not(:first-child):not(#a){display:grid!important;grid-template-columns:minmax(0,1fr) auto;column-gap:16px;row-gap:0;align-items:baseline}
html:root body.gx-home .b15-card:not(:first-child) .b15-shot:not(#a){grid-column:1 / -1;margin:0 0 16px!important;border-radius:10px;aspect-ratio:16/9!important;overflow:hidden}
html:root body.gx-home .b15-card:not(:first-child) .b15-shot img:not(#a){width:100%!important;height:100%!important;object-fit:cover!important;object-position:50% 0!important}
html:root body.gx-home .b15-card:not(:first-child) b:not(#a){grid-column:1;grid-row:2;font-size:25px!important;line-height:1.2!important;margin:0!important}
html:root body.gx-home .b15-card:not(:first-child) .b15-k:not(#a){grid-column:2;grid-row:2;margin:0!important}
html:root body.gx-home .b15-card:not(:first-child) .b15-l:not(#a){grid-column:1 / -1;grid-row:3;margin-top:4px!important;font-size:15px!important;line-height:1.5!important}
html:root body.gx-home #proberen .g37-ex-all:not(#a):not(#b){animation:none!important;translate:none!important;opacity:1!important}

/* ---------- home: merk, the button sits on the text edge ---------- */
html:root body.gx-home a.xa-gh:not(#a):not(#b){margin-left:0!important}
html:root body.gx-home .g-team2 a.xa-gh:not(#a):not(#b){margin-top:20px!important}
html:root body.gx-home #merk .g-hm-t a.gx-lnk:not(#a):not(#b){margin-left:0!important}

/* ---------- gratis homepage: lighter, one screen to ask ---------- */
html:root body.x-gh .g37-open:not(#a):not(#b){padding-top:0!important}
html:root body.x-gh .g37-open-in:not(#a):not(#b){grid-template-columns:minmax(0,1fr) 600px!important;column-gap:88px!important;padding-bottom:96px!important;align-items:start!important}
html:root body.x-gh .g37-open-t h1:not(#a):not(#b){font-size:80px!important;line-height:1.02!important;letter-spacing:-.015em!important;margin:14px 0 20px!important;max-width:none!important}
html:root body.x-gh .g37-open-t h1 .x-g{font-style:normal;background:linear-gradient(170deg,#ffe58a 10%,#f0c83a 50%,#d7a414 95%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
html:root body.x-gh .g37-open-t .lead:not(#a):not(#b){max-width:540px!important;margin-bottom:34px!important}
html:root body.x-gh .g37-print:not(#a):not(#b){max-width:580px!important;margin:0!important}
/* the offer as three separate facts instead of one paragraph */
html:root body.x-gh .xa-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:24px;margin:0 0 24px;padding:0;max-width:580px}
html:root body.x-gh .xa-facts>div{border-top:1px solid rgba(246,239,220,.2);padding-top:14px}
html:root body.x-gh .xa-facts dt{font-family:Newsreader,Georgia,serif;font-size:21px;line-height:1.2;letter-spacing:-.005em;white-space:nowrap;color:#f3eee4;margin:0 0 6px}
html:root body.x-gh .xa-facts dd{margin:0;text-wrap:balance;font-size:15px;line-height:1.5;color:rgba(240,234,220,.7)}
html:root body.x-gh .g37-pf:not(#a):not(#b){aspect-ratio:16/9!important;overflow:hidden}
html:root body.x-gh .g37-pf img:not(#a):not(#b){width:100%!important;height:100%!important;object-fit:cover!important;object-position:50% 0!important}
html:root body.x-gh .g37-print figcaption:not(#a):not(#b){font-size:15px!important;line-height:1.5!important;margin-top:10px!important;color:rgba(235,230,220,.72)!important}

/* the form card: a light pane on the green, not a dark box */
html:root body.x-gh .g37-card:not(#a):not(#b){background:rgba(246,239,220,.055)!important;border:1px solid rgba(246,239,220,.13)!important;box-shadow:0 30px 80px -40px rgba(0,0,0,.55)!important;padding:34px 40px 32px!important;border-radius:24px!important}
html:root body.x-gh .g38-offer:not(#a):not(#b){font-size:15px!important;line-height:1.55!important;padding-bottom:18px!important;margin-bottom:22px!important}
html:root body.x-gh .g37-fhd:not(#a):not(#b){margin-bottom:20px!important}
html:root body.x-gh .g37-fh:not(#a):not(#b){font-size:28px!important;line-height:1.18!important;letter-spacing:-.005em!important;max-width:470px!important;margin:0!important}
html:root body.x-gh .g37-grid:not(#a):not(#b){row-gap:16px!important}
html:root body.x-gh .g37-fld label:not(#a):not(#b),html:root body.x-gh .g37-reply legend:not(#a):not(#b){margin-bottom:7px!important}
html:root body.x-gh .g37-in:not(#a):not(#b){height:48px!important;background:rgba(246,239,220,.07)!important;border:1px solid rgba(246,239,220,.3)!important;border-radius:12px!important}
html:root body.x-gh textarea.g37-in:not(#a):not(#b){height:auto!important}
html:root body.x-gh .g37-in:not(#a):not(#b):focus{border-color:#f0c83a!important;background:rgba(246,239,220,.1)!important}
html:root body.x-gh .g37-in::placeholder{color:rgba(246,239,220,.56)!important;opacity:1}
html:root body.x-gh .g37-pill span:not(#a):not(#b){height:44px!important}
html:root body.x-gh .g37-send:not(#a):not(#b){display:flex!important;align-items:center!important;gap:22px!important;margin-top:22px!important}
html:root body.x-gh .g37-fine:not(#a):not(#b){margin:0!important;max-width:200px!important;font-size:14px!important;line-height:1.45!important;color:rgba(235,230,220,.7)!important}

/* what you get and what happens next: two bands on the page grid, heading left, three columns right */
html:root body.x-gh .g37-after-in:not(#a):not(#b){display:block!important;padding-top:64px!important}
html:root body.x-gh .g37-after-in>div:not(#a):not(#b){display:grid!important;grid-template-columns:minmax(0,4fr) minmax(0,8fr)!important;column-gap:48px!important;align-items:start!important;margin:0!important;padding:0!important}
html:root body.x-gh .g37-after-in>div+div:not(#a):not(#b){margin-top:72px!important}
html:root body.x-gh .g37-after-in h2:not(#a):not(#b){margin:-8px 0 0!important;font-size:52px!important;line-height:1.05!important}
html:root body.x-gh .g37-after-in :is(.g37-ticks,.g37-steps):not(#a):not(#b){display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;column-gap:32px!important;row-gap:0!important;margin:0!important;padding:0!important;border:0!important;list-style:none!important;counter-reset:none!important}
html:root body.x-gh .g37-after-in :is(.g37-ticks,.g37-steps)>li:not(#a):not(#b){margin:0!important;padding:18px 0 0!important;border:0!important;border-top:1px solid rgba(246,239,220,.2)!important;min-height:0!important}
html:root body.x-gh .g37-after-in :is(.g37-ticks,.g37-steps)>li:not(#a):not(#b)::before{content:none!important;display:none!important}
html:root body.x-gh .g37-ticks>li:not(#a):not(#b){display:flex!important;align-items:flex-start!important;gap:12px!important;font-size:17px!important;line-height:1.5!important}
html:root body.x-gh .g37-ticks>li svg:not(#a):not(#b){flex:none;margin-top:5px!important}
html:root body.x-gh .g37-steps>li:not(#a):not(#b){display:block!important}
html:root body.x-gh .g37-steps>li>b:not(#a):not(#b){display:block!important;font-size:25px!important;line-height:1.2!important;margin:0 0 10px!important}
html:root body.x-gh .g37-steps>li>span:not(#a):not(#b){display:block!important;font-size:16px!important;line-height:1.55!important;color:rgba(240,234,220,.72)!important}

/* the chosen reply channel is marked, the send button stays the only solid yellow */
html:root body.x-gh .g37-pill input:checked+span:not(#a):not(#b){background:rgba(240,200,58,.1)!important;color:#f6d35a!important;box-shadow:inset 0 0 0 1.5px #f0c83a!important;border-color:transparent!important}
html:root body.x-gh .g37-after:not(#a):not(#b){padding-bottom:96px!important}

}
/* sw12 mobile: home and shared closing band below desktop */
@media (max-width:1100px){
  html:root body.gx-home #prijzen.gx-room15:not(#a):not(#b):not(#c){padding-top:var(--sw-s)!important;padding-bottom:var(--sw-s2)!important}
  html:root body.gx-home .gx-hall:not(#a):not(#b):not(#c){padding-bottom:0!important}
  html:root body.gx-home #prijzen .gx-rail:not(#a):not(#b):not(#c){margin-top:48px!important}
  html:root body.gx-home .b15-row:not(#a):not(#b):not(#c){margin-top:64px!important}
  html:root body .g-close h2:not(#a):not(#b):not(#c):not(#d){margin-bottom:20px!important}
  /* Met wie u praat: heading, portrait, then the Over ons button */
  html:root body .g-team2:not(#a):not(#b):not(#c):not(#d){display:flex!important;flex-direction:column!important;gap:0!important}
  html:root body .g-team2>div:first-child:not(#a):not(#b):not(#c):not(#d){display:contents!important}
  html:root body .g-team2>div:first-child>.lab{order:1}
  html:root body .g-team2>div:first-child>h2{order:2;margin-bottom:28px!important}
  html:root body .g-team2>.wall2{order:3}
  html:root body .g-team2>div:first-child>p:has(a){order:4;margin-top:28px!important}
  html:root body .g-team2 a.xa-gh:not(#a):not(#b){margin-top:0!important}
  html:root body .g-team2 .wall2.sw-solo:not(#a):not(#b):not(#c):not(#d){display:block!important;max-width:300px!important;margin:0!important}
  html:root body .g-team2>div:first-child>p:has(a):not(#a):not(#b):not(#c):not(#d){margin-left:0!important;padding-left:0!important;align-self:flex-start}
  html:root body .g-team2>div:first-child>p>a:not(#a):not(#b):not(#c):not(#d){margin-left:0!important}
  /* one portrait on over ons and vacatures, a clear size instead of half a grid */
  html:root body :is(.g25-team,.vac-team).sw-solo:not(#a):not(#b):not(#c){display:block!important}
  html:root body .g25-team.sw-solo>figure:not(#a):not(#b):not(#c),html:root body .vac-team.sw-solo>.vac-p:not(#a):not(#b):not(#c){width:min(260px,72vw)!important;max-width:none!important;margin:0 0 20px!important}
  /* contact and gratis homepage: no deep band under the first section */
  html:root body main>.g37-open:not(#a):not(#b):not(#c){padding-bottom:24px!important}
  html:root body main>.g37-open .g37-open-in:not(#a):not(#b):not(#c){padding-bottom:24px!important}
  /* closing band: heading and text, the example, then the buttons */
  html:root body .g-close-in:not(#a):not(#b):not(#c):not(#d){display:flex!important;flex-direction:column!important;gap:0!important}
  html:root body .g-close-in>div:first-child:not(#a):not(#b):not(#c):not(#d){display:contents!important}
  html:root body .g-close-in>div:first-child>h2{order:1}
  html:root body .g-close-in>div:first-child>.sub{order:2}
  html:root body .g-close-in>.g-close-art:not(#a):not(#b):not(#c):not(#d){order:3;margin:28px 0 0!important;width:100%!important;max-width:640px!important;align-self:flex-start!important;display:block!important}
  html:root body .g-close-in>div:first-child>.g-acts:not(#a):not(#b):not(#c):not(#d){order:4;margin-top:28px!important}
}
/* sw12 (13 Nov): one portrait, Moreno only. At desktop the single portrait sits centred in its column, no empty half. */
@media (min-width:1101px){
  html:root body :is(.g-team2,.g25-team) .wall2.sw-solo:not(#a):not(#b):not(#c):not(#d),html:root body .wall2.g25-team.sw-solo:not(#a):not(#b):not(#c):not(#d){display:grid!important;grid-template-columns:minmax(0,1fr)!important;justify-items:center!important}
  html:root body .wall2.g25-team.sw-solo>figure:not(#a):not(#b):not(#c){width:380px!important;max-width:100%!important}
  html:root body .vac-team.sw-solo:not(#a):not(#b):not(#c){display:grid!important;grid-template-columns:260px minmax(0,1fr)!important;column-gap:44px!important;align-items:end!important}
  html:root body .vac-team.sw-solo>.vac-p:not(#a):not(#b):not(#c){width:auto!important;margin:0!important}
  html:root body .vac-team.sw-solo>.vac-tc:not(#a):not(#b):not(#c){grid-column:2!important;grid-row:1!important;margin:0 0 8px!important;max-width:30ch!important;font-size:17px!important;line-height:1.55!important}
}
/* sw12 mobile: over ons on a tablet. The story reads as one column, the proposal notes sit under their row instead of a 120px side strip */
@media (min-width:700px) and (max-width:1100px){
  html:root body .g46-story-in:not(#a):not(#b):not(#c):not(#d){display:block!important}
  html:root body .g46-story-in>*+*:not(#a):not(#b):not(#c):not(#d){margin-top:28px!important;max-width:40em!important}
  html:root body .g46-story-in>ul.c-facts:not(#a):not(#b):not(#c):not(#d){display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:18px 28px!important;max-width:none!important;width:auto!important}
  html:root body .g-prop14 .pp-row:not(#a):not(#b):not(#c):not(#d){grid-template-columns:minmax(0,1fr)!important}
  html:root body .g-prop14 .pp-row>.ann:not(#a):not(#b):not(#c):not(#d){grid-column:1!important;grid-row:auto!important;width:auto!important;max-width:none!important;margin:12px 0 16px!important;padding-left:16px!important;border-left:2px solid rgba(242,205,69,.55)!important}
  html:root body .g-prop14 .pp-row>.ann:not(#a):not(#b):not(#c):not(#d)::before,html:root body .g-prop14 .pp-row>.ann:not(#a):not(#b):not(#c):not(#d)::after{display:none!important}
}