/* Loodgietersbedrijf Waterdicht (installateur b) · "het leidingwerk"
   N6 dock onderin · H3 reuzenkop · R1 volle banden. Rubik (OFL) + Barlow. */
@font-face { font-family: "Rubik"; font-weight: 300 900; font-display: swap; src: url("../../fonts/Rubik-Variable.woff2") format("woff2"); }

body.s-installateur-b {
  --porselein: #f4f3ef; --tegel: #e4e1da; --wit: #fcfcfa;
  --inkt: #10232a; --inkt2: #3c4f55;
  --nacht: #0e2a30; --nacht2: #163a42; --nacht3: #0a1f24; --op-nacht: #e6eeed; --op-nacht2: #b4c6c6;
  --koper: #b5652f; --koper-d: #8f4a1f; --koper-l: #e2a271; --koper-band: #efe2d3;
  --messing: #c9a24a; --groen: #1d7a4a; --rood: #c8352a; --staal: #8e999c;
  --buis: linear-gradient(90deg, #6f3818 0%, #b8693a 22%, #f0c39d 42%, #c98250 58%, #8a4720 100%);
  --buis-h: linear-gradient(180deg, #6f3818 0%, #b8693a 22%, #f0c39d 42%, #c98250 58%, #8a4720 100%);
  --wmax: 1180px; --px: max(16px, calc((100% - var(--wmax)) / 2)); --bx: calc(var(--px) + 14px); --bw: 14px;
  --a: #0e2a30; --a2: #b5652f; --bg2: #dfe3e1;
  margin: 0; background: var(--porselein); color: var(--inkt);
  font: 400 18px/1.6 "Barlow", system-ui, sans-serif;
  -webkit-font-smoothing: antialiased; overflow-x: clip;
}
body.s-installateur-b :where(.wd-kop, .wd-vel, .wd-dock, .wd-band, .wd-fotoband, .wd-voet) a { color: inherit; }
body.s-installateur-b :where(.wd-vel, .wd-band, .wd-fotoband, .wd-voet) :is(h1, h2, h3) { font-family: "Rubik", "Barlow", sans-serif; margin: 0; line-height: 1.18; }
body.s-installateur-b :where(.wd-kop, .wd-vel, .wd-dock, .wd-band, .wd-fotoband, .wd-voet) p { margin: 0; }
body.s-installateur-b .wd-i { width: 1em; height: 1em; flex: none; }
body.s-installateur-b .wd-w { position: relative; max-width: var(--wmax); margin: 0 auto; padding: 0 32px 0 76px; }
body.s-installateur-b .ph { height: 100%; }

/* ── Kop: alleen merk en "Over deze website" ─────────────────── */
body.s-installateur-b .wd-kop { position: relative; z-index: 5; display: flex; align-items: center; justify-content: space-between; gap: 20px;
  padding: 18px max(16px, calc((100% - var(--wmax)) / 2 + 16px)); background: var(--porselein); }
body.s-installateur-b .wd-logo { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; color: var(--inkt); }
body.s-installateur-b .wd-merk { width: 44px; height: 44px; }
body.s-installateur-b .wd-naam { font: 700 26px/1 "Rubik", sans-serif; letter-spacing: -.02em; display: flex; flex-direction: column; }
body.s-installateur-b .wd-naam small { font: 600 11px/1.2 "Barlow", sans-serif; letter-spacing: .16em; text-transform: uppercase; color: var(--inkt2); margin-top: 5px; }
body.s-installateur-b .wd-logo.licht, body.s-installateur-b .wd-logo.licht .wd-naam small { color: var(--op-nacht); }
body.s-installateur-b .wd-kop-r { display: flex; align-items: center; gap: 22px; }
body.s-installateur-b .wd-ods { font: 600 14px/1 "Barlow", sans-serif; text-decoration: none; padding: 10px 16px; border: 1.5px solid var(--inkt); border-radius: 999px; white-space: nowrap; }
body.s-installateur-b .wd-ods:hover, body.s-installateur-b .wd-ods[aria-current] { background: var(--inkt); color: var(--porselein); }

/* status: wie is er van dienst */
body.s-installateur-b .wd-status { display: flex; align-items: center; gap: 10px; font: 500 15px/1.35 "Barlow", sans-serif; }
body.s-installateur-b .wd-status.klein { font-size: 14px; color: var(--inkt2); }
body.s-installateur-b .wd-status.groot { font-size: 18px; margin-top: 22px; }
body.s-installateur-b .wd-lamp { width: 10px; height: 10px; border-radius: 50%; background: #3fbf6f; box-shadow: 0 0 0 0 #3fbf6f88; animation: wd-puls 2.4s infinite; flex: none; }
@keyframes wd-puls { 0% { box-shadow: 0 0 0 0 #3fbf6f88; } 70% { box-shadow: 0 0 0 9px #3fbf6f00; } 100% { box-shadow: 0 0 0 0 #3fbf6f00; } }

/* ── Dock onderin (N6) ───────────────────────────────────────── */
body.s-installateur-b .wd-dock { position: fixed; z-index: 50; left: 50%; bottom: 16px; transform: translateX(-50%); width: min(1000px, calc(100% - 32px)); }
body.s-installateur-b .wd-dock-in { display: grid; grid-template-columns: 1fr auto auto auto auto; align-items: stretch; gap: 6px; padding: 7px;
  background: var(--nacht3); color: var(--op-nacht); border-radius: 16px; box-shadow: 0 18px 40px -12px #0a1f2499, 0 0 0 1px #ffffff14 inset; position: relative; }
body.s-installateur-b .wd-dock-in::before { content: ""; position: absolute; left: 22px; right: 22px; top: -4px; height: 5px; border-radius: 3px; background: var(--buis-h); }
body.s-installateur-b .wd-dock-status { display: flex; align-items: center; padding: 0 14px; min-width: 0; }
body.s-installateur-b .wd-dock-status .wd-status { font-size: 14px; color: var(--op-nacht2); }
body.s-installateur-b .wd-dock-spoed { display: flex; align-items: center; gap: 12px; padding: 8px 20px 8px 12px; background: var(--rood); color: #fff; text-decoration: none; border-radius: 11px; }
body.s-installateur-b .wd-dock-spoed .wd-kraan { width: 46px; height: 30px; filter: drop-shadow(0 1px 0 #0003); }
body.s-installateur-b .wd-dock-spoed .wd-kraan path[fill="#d43b2c"] { fill: #fff; }
body.s-installateur-b .wd-dock-spoed .wd-kraan circle { fill: #f3d0cb; }
body.s-installateur-b .wd-dock-spoed span { display: flex; flex-direction: column; line-height: 1.1; }
body.s-installateur-b .wd-dock-spoed small { font: 600 11px/1.2 "Barlow", sans-serif; letter-spacing: .12em; text-transform: uppercase; opacity: .9; }
body.s-installateur-b .wd-dock-spoed b { font: 700 22px/1.1 "Rubik", sans-serif; letter-spacing: -.01em; }
body.s-installateur-b .wd-dock-spoed:hover { background: #b02a20; }
body.s-installateur-b .wd-dock-knop { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-width: 84px; padding: 6px 12px;
  border-radius: 11px; text-decoration: none; color: var(--op-nacht); font: 600 13px/1.1 "Barlow", sans-serif; cursor: pointer; }
body.s-installateur-b .wd-dock-knop .wd-i { width: 24px; height: 24px; color: var(--koper-l); }
body.s-installateur-b .wd-dock-knop:hover, body.s-installateur-b .wd-dock-knop.on { background: var(--nacht2); }
body.s-installateur-b .wd-menu-check:checked ~ .wd-dock .wd-dock-menu { background: var(--koper); }
body.s-installateur-b .wd-menu-check:checked ~ .wd-dock .wd-dock-menu .wd-i { color: #fff; }

/* menuvel: schuift boven het dock open */
body.s-installateur-b .wd-vel { position: fixed; inset: 0; z-index: 45; display: flex; align-items: flex-end; justify-content: center; padding: 0 16px 104px;
  visibility: hidden; opacity: 0; transition: opacity .2s, visibility .2s; }
body.s-installateur-b .wd-vel-dicht { position: absolute; inset: 0; background: #0a1f24b3; z-index: -1; cursor: pointer; }
body.s-installateur-b .wd-menu-check:checked ~ .wd-vel { visibility: visible; opacity: 1; }
body.s-installateur-b .wd-vel-in { width: min(1000px, 100%); background: var(--porselein); border-radius: 18px; padding: 28px 32px 22px; transform: translateY(20px); transition: transform .25s; max-height: calc(100vh - 140px); overflow: auto; }
body.s-installateur-b .wd-menu-check:checked ~ .wd-vel .wd-vel-in { transform: none; }
body.s-installateur-b .wd-vel-lijst { list-style: none; margin: 18px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 28px; }
body.s-installateur-b .wd-vel-lijst a { display: flex; align-items: baseline; gap: 12px; padding: 14px 0; border-top: 1.5px solid var(--tegel); text-decoration: none;
  font: 600 clamp(24px, 3vw, 34px)/1.1 "Rubik", sans-serif; letter-spacing: -.02em; }
body.s-installateur-b .wd-vel-lijst .nr { font: 500 13px/1 "Barlow", sans-serif; color: var(--koper-d); letter-spacing: .08em; }
body.s-installateur-b .wd-vel-lijst a:hover, body.s-installateur-b .wd-vel-lijst a.on { color: var(--koper-d); }
body.s-installateur-b .wd-vel-lijst a.on { border-top-color: var(--koper); }
body.s-installateur-b .wd-vel-voet { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; margin-top: 20px; padding-top: 16px; border-top: 1.5px solid var(--tegel); font-size: 16px; }
body.s-installateur-b .wd-vel-voet a { font-weight: 600; }
body.s-installateur-b .wd-vel-ods { padding: 8px 14px; border: 1.5px solid var(--inkt); border-radius: 999px; text-decoration: none; }

/* ── Leidingwerk: hoofdleiding, koppelingen, rozetten, aftakkingen ── */
body.s-installateur-b .wd-band { position: relative; padding: clamp(72px, 9vw, 128px) 0; }
body.s-installateur-b .wd-leiding { position: absolute; top: 0; bottom: 0; left: var(--bx); width: var(--bw); background: var(--buis); z-index: 1; }
body.s-installateur-b .wd-leiding::before, body.s-installateur-b .wd-leiding::after { content: ""; position: absolute; left: -5px; width: calc(var(--bw) + 10px); height: 18px;
  background: linear-gradient(90deg, #8c6a22, #d8b45c 35%, #f3dc93 48%, #c9a24a 62%, #8c6a22); border-radius: 2px; }
body.s-installateur-b .wd-leiding::before { top: 0; }
body.s-installateur-b .wd-leiding::after { bottom: 0; }
body.s-installateur-b .wd-leiding-in::before { display: none; }
body.s-installateur-b .wd-rozet { position: absolute; left: calc(var(--bx) - 9px); width: 32px; height: 32px; border-radius: 50%; z-index: 3;
  background: radial-gradient(circle at 38% 35%, #ffffff 0, #dfe4e6 30%, #9aa5a9 70%, #6f7a7e 100%); box-shadow: 0 2px 6px #0004; }
body.s-installateur-b .wd-rozet::after { content: ""; position: absolute; inset: 9px; border-radius: 50%; background: radial-gradient(circle, #3a2a1e 0 45%, #b8693a 50%, #f0c39d 70%, #8a4720); }
body.s-installateur-b .wd-rozet-boven { top: -16px; }
body.s-installateur-b .wd-rozet-onder { bottom: -16px; }

body.s-installateur-b .wd-tak { margin-bottom: clamp(28px, 4vw, 48px); max-width: 900px; }
body.s-installateur-b .wd-tak-buis { position: relative; display: flex; align-items: center; margin-left: -62px; margin-bottom: 18px; }
body.s-installateur-b .wd-tak-buis::before { content: ""; width: 62px; height: 12px; background: var(--buis-h); flex: none; }
body.s-installateur-b .wd-tak h2 { font-weight: 700; font-size: clamp(34px, 4.6vw, 62px); line-height: 1.02; letter-spacing: -.03em; text-wrap: balance; }
body.s-installateur-b .wd-tak-groot h2 { font-size: clamp(42px, 6.4vw, 92px); }

/* leidingmarkering: sticker met stroompijl */
body.s-installateur-b .wd-marker { display: inline-flex; align-items: center; height: 30px; padding: 0 26px 0 14px; background: var(--groen); color: #fff;
  font: 600 12.5px/1 "Barlow", sans-serif; letter-spacing: .16em; text-transform: uppercase; white-space: nowrap; position: relative;
  clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 50%, calc(100% - 14px) 100%, 0 100%); }
body.s-installateur-b .wd-marker::after { content: "→"; margin-left: 10px; font-size: 15px; letter-spacing: 0; }
body.s-installateur-b .wd-m-warmwater { background: linear-gradient(90deg, var(--rood) 0 9px, var(--groen) 9px); padding-left: 21px; }
body.s-installateur-b .wd-m-afvoer { background: #59646a; }
body.s-installateur-b .wd-nacht .wd-m-afvoer { background: #6b777c; }

/* ── Banden ─────────────────────────────────────────────────── */
body.s-installateur-b .wd-porselein { background: var(--porselein); }
body.s-installateur-b .wd-nacht { background: var(--nacht); color: var(--op-nacht); }
body.s-installateur-b .wd-koper { background: var(--koper-band); }
body.s-installateur-b .wd-lead { font-size: clamp(18px, 1.6vw, 21px); line-height: 1.6; max-width: 62ch; color: var(--inkt2); }
body.s-installateur-b .wd-nacht .wd-lead { color: var(--op-nacht2); }
body.s-installateur-b .wd-noot { font-size: 15px; color: var(--inkt2); margin-top: 28px; }
body.s-installateur-b .wd-nacht .wd-noot { color: var(--op-nacht2); }
body.s-installateur-b .wd-h3 { font-size: 22px; font-weight: 600; margin: 36px 0 14px; }
body.s-installateur-b .wd-verder { margin-top: 40px; }
body.s-installateur-b .wd-verder a, body.s-installateur-b .wd-link { display: inline-flex; align-items: center; gap: 10px; font: 600 18px/1.2 "Rubik", sans-serif; text-decoration: none;
  padding-bottom: 6px; border-bottom: 3px solid var(--koper); }
body.s-installateur-b .wd-verder a:hover, body.s-installateur-b .wd-link:hover { color: var(--koper-d); }
body.s-installateur-b .wd-nacht .wd-verder a:hover, body.s-installateur-b .wd-link.licht:hover { color: var(--koper-l); }

/* ── Opening (H3): reuzentekst op wandtegels ──────────────── */
body.s-installateur-b .wd-open { padding: clamp(56px, 8vw, 120px) 0 clamp(64px, 8vw, 110px);
  background-color: var(--porselein);
  background-image: linear-gradient(var(--tegel) 1.5px, transparent 1.5px), linear-gradient(90deg, var(--tegel) 1.5px, transparent 1.5px);
  background-size: 96px 96px; background-position: -1px -1px; }
body.s-installateur-b .wd-open .wd-w { z-index: 2; }
body.s-installateur-b .wd-open-kicker { font: 600 14px/1.3 "Barlow", sans-serif; letter-spacing: .16em; text-transform: uppercase; color: var(--koper-d); margin-bottom: 26px; }
body.s-installateur-b .wd-reus { font-weight: 800; font-size: clamp(64px, 13.4vw, 212px); line-height: .88; letter-spacing: -.045em; color: var(--inkt); margin-left: -.04em; }
body.s-installateur-b .wd-reus em { font-style: normal; color: var(--koper); }
body.s-installateur-b .wd-open-sub .wd-reus { font-size: clamp(52px, 9.6vw, 150px); }
body.s-installateur-b .wd-open-lead { font-size: clamp(19px, 1.9vw, 24px); line-height: 1.5; max-width: 40ch; margin-top: clamp(28px, 3.5vw, 44px); color: var(--inkt2); }

body.s-installateur-b .wd-belblok { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 30px; margin-top: 40px; }
body.s-installateur-b .wd-belknop { display: inline-flex; align-items: center; gap: 16px; padding: 14px 28px 14px 18px; background: var(--nacht); color: #fff; text-decoration: none;
  border-radius: 14px; box-shadow: 0 14px 30px -14px #0e2a30; }
body.s-installateur-b .wd-belknop:hover { background: var(--nacht2); }
body.s-installateur-b .wd-belknop .wd-kraan { width: 64px; height: 40px; }
body.s-installateur-b .wd-belknop span { display: flex; flex-direction: column; line-height: 1.1; }
body.s-installateur-b .wd-belknop small { font: 600 12px/1.3 "Barlow", sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--koper-l); }
body.s-installateur-b .wd-belknop b { font: 700 clamp(26px, 2.6vw, 34px)/1.1 "Rubik", sans-serif; letter-spacing: -.01em; }
body.s-installateur-b .wd-belblok.groot .wd-belknop b { font-size: clamp(30px, 3.4vw, 44px); }
body.s-installateur-b .wd-appknop { display: inline-flex; align-items: center; gap: 10px; font-weight: 600; text-decoration: none; border-bottom: 2px solid var(--koper); padding-bottom: 3px; }
body.s-installateur-b .wd-appknop .wd-i { width: 24px; height: 24px; color: var(--groen); }

body.s-installateur-b .wd-klokregel { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 14px; margin-top: 30px; font-size: 16px; color: var(--inkt2); }
body.s-installateur-b .wd-klok-label { font: 600 12px/1 "Barlow", sans-serif; letter-spacing: .16em; text-transform: uppercase; }

/* telrollen van de watermeter */
body.s-installateur-b .wd-teller { display: inline-flex; align-items: stretch; padding: 3px; gap: 2px; background: #15191a; border-radius: 7px;
  box-shadow: 0 0 0 3px #c7cdcf, 0 0 0 4px #8e999c, 0 6px 14px -6px #0006; font: 600 1em/1 "Barlow", sans-serif; vertical-align: middle; }
body.s-installateur-b .wd-teller i { font-style: normal; display: grid; place-items: center; width: .74em; padding: .14em 0 .1em; color: #fff;
  background: linear-gradient(180deg, #000 0%, #2b2f31 26%, #45494b 50%, #2b2f31 74%, #000 100%); border-radius: 2px; }
body.s-installateur-b .wd-teller i.r { background: linear-gradient(180deg, #5a0f0b 0%, #b5281f 28%, #d7493d 50%, #b5281f 72%, #5a0f0b 100%); }
body.s-installateur-b .wd-teller b { color: #fff; display: grid; place-items: center; width: .32em; font-weight: 600; }
body.s-installateur-b .wd-klok { font-size: 22px; }

body.s-installateur-b .wd-keuze { margin-top: clamp(48px, 6vw, 80px); }
body.s-installateur-b .wd-keuze p { font: 600 13px/1 "Barlow", sans-serif; letter-spacing: .16em; text-transform: uppercase; color: var(--inkt2); margin-bottom: 14px; }
body.s-installateur-b .wd-keuze ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 0 20px; }
body.s-installateur-b .wd-keuze a { display: flex; align-items: center; gap: 14px; padding: 18px 0; border-top: 2px solid var(--inkt); text-decoration: none; font: 600 19px/1.2 "Rubik", sans-serif; }
body.s-installateur-b .wd-keuze .wd-i { width: 40px; height: 40px; color: var(--koper); stroke-width: 1.8; }
body.s-installateur-b .wd-keuze a:hover { color: var(--koper-d); border-top-color: var(--koper); }

/* ── Fotobanden: de leiding gaat de muur in ────────────────── */
body.s-installateur-b .wd-fotoband { position: relative; background: var(--nacht3); }
body.s-installateur-b .wd-fotoband .wd-foto { width: 100%; object-fit: cover; display: block; }
body.s-installateur-b .wd-fb-breed .wd-foto { height: clamp(340px, 50vw, 680px); }
body.s-installateur-b .wd-fb-laag .wd-foto { height: clamp(260px, 30vw, 440px); }
body.s-installateur-b .wd-onderschrift { position: absolute; right: max(16px, calc((100% - var(--wmax)) / 2 + 16px)); bottom: 24px; max-width: 380px; z-index: 2;
  background: #0a1f24e6; color: var(--op-nacht); font: 500 15px/1.45 "Barlow", sans-serif; padding: 12px 16px; border-left: 4px solid var(--koper); }

body.s-installateur-b .wd-fb-split { display: grid; grid-template-columns: 1.25fr 1fr; background: var(--nacht2); color: var(--op-nacht); }
body.s-installateur-b .wd-fbs-om { grid-template-columns: 1fr 1.25fr; }
body.s-installateur-b .wd-fbs-om .wd-fbs-foto { order: 2; }
body.s-installateur-b .wd-fbs-foto { min-height: clamp(380px, 46vw, 640px); }
body.s-installateur-b .wd-fbs-foto .wd-foto { height: 100%; min-height: inherit; }
body.s-installateur-b .wd-fbs-tekst { padding: clamp(48px, 6vw, 96px) clamp(28px, 5vw, 80px); align-self: center; max-width: 620px; }
body.s-installateur-b .wd-fbs-tekst h2 { font-size: clamp(32px, 3.8vw, 52px); line-height: 1.04; letter-spacing: -.03em; font-weight: 700; margin: 22px 0 20px; }
body.s-installateur-b .wd-fbs-tekst p { color: var(--op-nacht2); font-size: 18px; margin-bottom: 14px; }
body.s-installateur-b .wd-fbs-tekst .wd-fbs-klein { font-size: 15px; margin-bottom: 30px; }
body.s-installateur-b .wd-fbs-tekst .wd-link { color: #fff; }
body.s-installateur-b .wd-bus-lijst { list-style: none; padding: 0; margin: 18px 0 0; }
body.s-installateur-b .wd-bus-lijst li { padding: 10px 0 10px 30px; border-top: 1px solid #ffffff1f; position: relative; color: var(--op-nacht); }
body.s-installateur-b .wd-bus-lijst li::before { content: ""; position: absolute; left: 0; top: 19px; width: 16px; height: 6px; background: var(--buis-h); border-radius: 1px; }

body.s-installateur-b .wd-fb-team .wd-foto { height: clamp(460px, 56vw, 760px); }
body.s-installateur-b .wd-fb-team::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 30%, #0a1f24d9 78%); pointer-events: none; }
body.s-installateur-b .wd-fbt-tekst { position: absolute; z-index: 2; right: max(16px, calc((100% - var(--wmax)) / 2 + 16px)); top: 50%; transform: translateY(-50%); max-width: 440px; color: #fff; }
body.s-installateur-b .wd-fbt-tekst h2 { font-size: clamp(36px, 4.4vw, 60px); line-height: 1; letter-spacing: -.03em; font-weight: 700; margin-bottom: 20px; }
body.s-installateur-b .wd-fbt-tekst p { color: var(--op-nacht); margin-bottom: 26px; }

/* ── Zelf doen terwijl wij rijden ─────────────────────────── */
body.s-installateur-b .wd-zelf { display: grid; grid-template-columns: 1fr 1.15fr; gap: clamp(32px, 6vw, 96px); align-items: start; }
body.s-installateur-b .wd-zelf-lead { color: var(--op-nacht2); font-size: 20px; max-width: 36ch; }
body.s-installateur-b .wd-meterkast { margin: 40px 0 0; max-width: 300px; }
body.s-installateur-b .wd-meterkast svg { width: 100%; height: auto; display: block; }
body.s-installateur-b .wd-meterkast figcaption { font: 500 14px/1.4 "Barlow", sans-serif; color: var(--op-nacht2); margin-top: 12px; }
body.s-installateur-b .wd-mk-hendel { transform-origin: 110px 203px; animation: wd-dicht 5s ease-in-out infinite; }
@keyframes wd-dicht { 0%, 30% { transform: rotate(-90deg); } 45%, 85% { transform: rotate(0); } 100% { transform: rotate(-90deg); } }
@media (prefers-reduced-motion: reduce) { body.s-installateur-b .wd-mk-hendel, body.s-installateur-b .wd-lamp { animation: none; } }
body.s-installateur-b .wd-zelf-lijst { list-style: none; margin: 0; padding: 0; }
body.s-installateur-b .wd-zelf-lijst li { display: grid; grid-template-columns: 64px 1fr; column-gap: 20px; padding: 28px 0; border-top: 1px solid #ffffff22; }
body.s-installateur-b .wd-zelf-lijst li:first-child { border-top: 0; padding-top: 6px; }
body.s-installateur-b .wd-zelf-nr { grid-row: span 2; width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; font: 700 24px/1 "Rubik", sans-serif;
  color: var(--nacht); background: radial-gradient(circle at 35% 30%, #fff, #dfe4e6 40%, #9aa5a9 100%); }
body.s-installateur-b .wd-zelf-lijst h3 { font-size: 24px; font-weight: 600; margin-bottom: 6px; color: #fff; }
body.s-installateur-b .wd-zelf-lijst p { color: var(--op-nacht2); }

/* ── Dienstrijen ──────────────────────────────────────────── */
body.s-installateur-b .wd-drijen { list-style: none; margin: 0; padding: 0; border-bottom: 1.5px solid var(--inkt); }
body.s-installateur-b .wd-drij a { display: grid; grid-template-columns: 72px minmax(0, 1fr) 170px 150px 40px; gap: 24px; align-items: center; padding: 28px 8px;
  border-top: 1.5px solid var(--inkt); text-decoration: none; transition: background .2s; }
body.s-installateur-b .wd-drij a:hover { background: var(--wit); }
body.s-installateur-b .wd-drij-ic .wd-i { width: 60px; height: 60px; color: var(--koper); stroke-width: 1.6; }
body.s-installateur-b .wd-drij-t h3 { font-size: clamp(24px, 2.4vw, 32px); font-weight: 700; letter-spacing: -.02em; margin-bottom: 4px; }
body.s-installateur-b .wd-drij-t span { color: var(--inkt2); }
body.s-installateur-b .wd-drij-m { font: 600 17px/1.3 "Barlow", sans-serif; }
body.s-installateur-b .wd-drij-m small { display: block; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--inkt2); font-weight: 500; margin-bottom: 4px; }
body.s-installateur-b .wd-drij-p .wd-i { width: 28px; height: 28px; transition: transform .2s; }
body.s-installateur-b .wd-drij a:hover .wd-drij-p .wd-i { transform: translateX(6px); color: var(--koper); }

/* ── Tarieven ─────────────────────────────────────────────── */
body.s-installateur-b .wd-tarief-twee { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
body.s-installateur-b .wd-tarief-kol { position: relative; padding: 34px 36px 36px; border-radius: 18px; background: var(--wit); box-shadow: 0 1px 0 #0000000d, 0 20px 40px -30px #10232a55; }
body.s-installateur-b .wd-tarief-kol.wd-nachtk { background: var(--nacht); color: var(--op-nacht); }
body.s-installateur-b .wd-tarief-kol h3 { font-size: 28px; font-weight: 700; letter-spacing: -.02em; }
body.s-installateur-b .wd-tarief-wanneer { color: var(--inkt2); margin: 4px 0 18px; font-size: 16px; }
body.s-installateur-b .wd-nachtk .wd-tarief-wanneer, body.s-installateur-b .wd-tarief-kol.wd-nachtk p { color: var(--op-nacht2); }
body.s-installateur-b .wd-tarief-rij { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 0; border-top: 1px solid #10232a1a; }
body.s-installateur-b .wd-nachtk .wd-tarief-rij { border-top-color: #ffffff22; }
body.s-installateur-b .wd-tarief-rij span { font: 600 13px/1.2 "Barlow", sans-serif; letter-spacing: .14em; text-transform: uppercase; }
body.s-installateur-b .wd-tarief-rij .wd-teller { font-size: clamp(30px, 3.2vw, 42px); letter-spacing: 0; text-transform: none; }
body.s-installateur-b .wd-tarief-rij .wd-teller::before { content: "€"; color: #c7cdcf; font: 600 .6em/1 "Barlow", sans-serif; display: grid; place-items: center; padding: 0 .3em 0 .2em; }
body.s-installateur-b .wd-tarief-kol > p:last-child { margin-top: 18px; font-size: 16px; color: var(--inkt2); }
body.s-installateur-b .wd-tarief-kol.wd-nachtk > p:last-child { color: var(--op-nacht2); }
body.s-installateur-b .wd-tarief-noot { margin-top: 28px; font-size: 16px; color: var(--inkt2); max-width: 70ch; }
body.s-installateur-b [data-nu="dag"] .wd-dag::before, body.s-installateur-b [data-nu="nacht"] .wd-nachtk::before {
  content: "Geldt nu"; position: absolute; top: 18px; right: 20px; font: 600 11px/1 "Barlow", sans-serif; letter-spacing: .16em; text-transform: uppercase;
  padding: 7px 10px 6px; border-radius: 999px; background: #3fbf6f; color: #062814; }

body.s-installateur-b .wd-etmaal { margin: 8px 0 18px; }
body.s-installateur-b .wd-etmaal-balk { display: grid; grid-template-columns: repeat(24, 1fr); height: 64px; border-radius: 10px; overflow: hidden; box-shadow: inset 0 0 0 1px #10232a22; }
body.s-installateur-b .wd-etmaal-balk span { position: relative; border-right: 1px solid #ffffff40; }
body.s-installateur-b .wd-etmaal-balk .d { background: var(--koper-l); }
body.s-installateur-b .wd-etmaal-balk .n { background: var(--nacht); }
body.s-installateur-b .wd-etmaal-balk i { position: absolute; left: 6px; bottom: 6px; font: 600 12px/1 "Barlow", sans-serif; font-style: normal; color: var(--inkt); opacity: 0; }
body.s-installateur-b .wd-etmaal-balk .n i { color: var(--op-nacht); }
body.s-installateur-b .wd-etmaal-balk .h i, body.s-installateur-b .wd-etmaal-balk span:nth-child(8) i, body.s-installateur-b .wd-etmaal-balk span:nth-child(18) i { opacity: 1; }
body.s-installateur-b .wd-etmaal-leg { display: flex; flex-wrap: wrap; gap: 10px 36px; margin-bottom: 44px; font-size: 16px; }
body.s-installateur-b .wd-etmaal-leg span { display: inline-block; width: 14px; height: 14px; border-radius: 3px; margin-right: 8px; vertical-align: -1px; }
body.s-installateur-b .wd-etmaal-leg .d { background: var(--koper-l); }
body.s-installateur-b .wd-etmaal-leg .n { background: var(--nacht); }
body.s-installateur-b .wd-etmaal-leg b { margin-right: 6px; }

/* prijslijst */
body.s-installateur-b .wd-pgroepen { display: grid; grid-template-columns: 1fr 1fr; gap: 56px 64px; margin-top: 48px; }
body.s-installateur-b .wd-prijslijst { list-style: none; margin: 18px 0 0; padding: 0; }
body.s-installateur-b .wd-prijslijst li { display: grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items: baseline; padding: 14px 0; border-top: 1px solid #ffffff1f; }
body.s-installateur-b .wd-pr-n { font-weight: 600; font-size: 18px; color: #fff; }
body.s-installateur-b .wd-pr-n small { display: block; font-weight: 400; font-size: 14.5px; color: var(--op-nacht2); }
body.s-installateur-b .wd-prijslijst i { border-bottom: 2px dotted #ffffff38; transform: translateY(-5px); }
body.s-installateur-b .wd-prijslijst b { font: 600 20px/1.2 "Rubik", sans-serif; color: var(--koper-l); white-space: nowrap; }

body.s-installateur-b .wd-voorbeelden { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
body.s-installateur-b .wd-voorbeeld { background: var(--wit); border-radius: 16px; padding: 28px 28px 24px; display: flex; flex-direction: column; }
body.s-installateur-b .wd-voorbeeld h3 { font-size: 22px; font-weight: 600; letter-spacing: -.01em; margin-bottom: 18px; }
body.s-installateur-b .wd-voorbeeld ul { list-style: none; margin: 0 0 auto; padding: 0; font-size: 16px; }
body.s-installateur-b .wd-voorbeeld li { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-top: 1px solid var(--tegel); color: var(--inkt2); }
body.s-installateur-b .wd-voorbeeld li b { color: var(--inkt); font-weight: 600; white-space: nowrap; }
body.s-installateur-b .wd-voorbeeld-tot { display: flex; justify-content: space-between; align-items: baseline; margin-top: 16px; padding-top: 14px; border-top: 3px solid var(--inkt); }
body.s-installateur-b .wd-voorbeeld-tot span { font-size: 14px; color: var(--inkt2); }
body.s-installateur-b .wd-voorbeeld-tot b { font: 700 30px/1 "Rubik", sans-serif; color: var(--koper-d); }

body.s-installateur-b .wd-afspr-lijst, body.s-installateur-b .wd-zeker { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; }
body.s-installateur-b .wd-afspr-lijst li, body.s-installateur-b .wd-zeker li { border-top: 3px solid var(--inkt); padding-top: 20px; }
body.s-installateur-b .wd-afspr-lijst h3 { font-size: 22px; font-weight: 600; margin-bottom: 10px; }
body.s-installateur-b .wd-afspr-lijst p, body.s-installateur-b .wd-zeker span { color: var(--inkt2); font-size: 17px; }
body.s-installateur-b .wd-zeker b { display: block; font: 700 24px/1.15 "Rubik", sans-serif; margin-bottom: 10px; letter-spacing: -.01em; }

/* ── Werkgebied als leidingschema ─────────────────────────── */
body.s-installateur-b .wd-schema { width: 100%; height: auto; display: block; margin-top: 40px; overflow: visible; }
body.s-installateur-b .wd-schema .hl { stroke: #b8693a; stroke-width: 14; }
body.s-installateur-b .wd-schema .hl-glans { stroke: #f0c39d; stroke-width: 3; opacity: .65; }
body.s-installateur-b .wd-schema .tk { stroke: #b8693a; stroke-width: 8; }
body.s-installateur-b .wd-schema .tstuk { fill: #c9a24a; }
body.s-installateur-b .wd-schema .eind { fill: var(--nacht); stroke: #e2a271; stroke-width: 4; }
body.s-installateur-b .wd-schema .pl { fill: #fff; font: 600 19px "Rubik", sans-serif; text-anchor: middle; }
body.s-installateur-b .wd-schema .min { fill: #e2a271; font: 600 15px "Barlow", sans-serif; }
body.s-installateur-b .wd-schema .bron { fill: #c9a24a; }
body.s-installateur-b .wd-schema .bron-t { fill: var(--op-nacht2); font: 600 12px "Barlow", sans-serif; text-anchor: middle; letter-spacing: .1em; text-transform: uppercase; }
body.s-installateur-b .wd-schema-lijst { display: none; list-style: none; margin: 28px 0 0; padding: 0; }
body.s-installateur-b .wd-schema-lijst li { display: grid; grid-template-columns: auto 1fr auto; gap: 12px; align-items: baseline; padding: 11px 0; border-top: 1px solid #ffffff22; }
body.s-installateur-b .wd-schema-lijst span { font: 600 19px "Rubik", sans-serif; color: #fff; }
body.s-installateur-b .wd-schema-lijst i { height: 6px; background: var(--buis-h); border-radius: 2px; align-self: center; }
body.s-installateur-b .wd-schema-lijst b { color: var(--koper-l); font-weight: 600; }

/* ── Slotband ─────────────────────────────────────────────── */
body.s-installateur-b .wd-slotband { padding-bottom: clamp(80px, 10vw, 140px); }
body.s-installateur-b .wd-slot-tekst { font-size: clamp(19px, 1.8vw, 23px); color: var(--op-nacht2); max-width: 46ch; }
body.s-installateur-b .wd-slot-tel { display: inline-block; margin: 26px 0 30px; font: 800 clamp(52px, 10vw, 156px)/.95 "Rubik", sans-serif; letter-spacing: -.04em;
  color: var(--koper-l); text-decoration: none; white-space: nowrap; }
body.s-installateur-b .wd-slot-tel:hover { color: #fff; }
body.s-installateur-b .wd-slot-sub { color: var(--op-nacht2); }
body.s-installateur-b .wd-slot-sub a { color: #fff; font-weight: 600; text-decoration-color: var(--koper); text-underline-offset: 4px; text-decoration-thickness: 2px; }

/* ── Diensten-pagina ──────────────────────────────────────── */
body.s-installateur-b .wd-sprong { margin-top: 48px; }
body.s-installateur-b .wd-sprong p { font: 600 13px/1 "Barlow", sans-serif; letter-spacing: .16em; text-transform: uppercase; color: var(--inkt2); margin-bottom: 14px; }
body.s-installateur-b .wd-sprong ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
body.s-installateur-b .wd-sprong a { display: inline-flex; align-items: center; gap: 10px; padding: 10px 14px 10px 12px; border: 1.5px dashed #10232a66; border-radius: 10px;
  text-decoration: none; font-weight: 600; background: #fcfcfacc; }
body.s-installateur-b .wd-sprong a > span .wd-i { width: 26px; height: 26px; color: var(--koper); }
body.s-installateur-b .wd-sprong a i .wd-i { width: 16px; height: 16px; color: var(--inkt2); }
body.s-installateur-b .wd-sprong a:hover { border-style: solid; border-color: var(--koper); }
body.s-installateur-b .wd-band[id] { scroll-margin-top: 20px; }
body.s-installateur-b .wd-dienst-kort { font: 500 clamp(20px, 2vw, 26px)/1.35 "Rubik", sans-serif; max-width: 34ch; margin-top: -18px; color: var(--koper-d); }
body.s-installateur-b .wd-nacht .wd-dienst-kort { color: var(--koper-l); }
body.s-installateur-b .wd-dienst-grid { display: grid; grid-template-columns: 1.35fr 1fr; gap: clamp(32px, 6vw, 96px); margin-top: 40px; }
body.s-installateur-b .wd-stappen { list-style: none; margin: 0; padding: 0; }
body.s-installateur-b .wd-stappen li { display: flex; gap: 16px; align-items: baseline; padding: 12px 0; border-top: 1px solid #10232a1a; }
body.s-installateur-b .wd-nacht .wd-stappen li { border-top-color: #ffffff1f; }
body.s-installateur-b .wd-stappen span { font: 700 15px/1 "Rubik", sans-serif; color: var(--koper-d); min-width: 22px; }
body.s-installateur-b .wd-nacht .wd-stappen span { color: var(--koper-l); }
body.s-installateur-b .wd-dienst-feiten { align-self: start; background: var(--wit); color: var(--inkt); border-radius: 18px; padding: 30px; border-top: 6px solid var(--koper); }
body.s-installateur-b .wd-nacht .wd-dienst-feiten { background: var(--nacht2); color: var(--op-nacht); }
body.s-installateur-b .wd-dienst-ic .wd-i { width: 64px; height: 64px; color: var(--koper); stroke-width: 1.5; }
body.s-installateur-b .wd-nacht .wd-dienst-ic .wd-i { color: var(--koper-l); }
body.s-installateur-b .wd-dienst-feiten dl { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 20px; margin: 18px 0 20px; }
body.s-installateur-b .wd-dienst-feiten dt { grid-row: 1; font: 600 12px/1.2 "Barlow", sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--inkt2); }
body.s-installateur-b .wd-nacht .wd-dienst-feiten dt { color: var(--op-nacht2); }
body.s-installateur-b .wd-dienst-feiten dd { grid-row: 2; margin: 0; font: 600 21px/1.2 "Rubik", sans-serif; }
body.s-installateur-b .wd-punten { list-style: none; margin: 0; padding: 0; }
body.s-installateur-b .wd-punten li { padding: 9px 0 9px 28px; position: relative; border-top: 1px solid #10232a14; }
body.s-installateur-b .wd-nacht .wd-punten li { border-top-color: #ffffff1a; }
body.s-installateur-b .wd-punten li::before { content: ""; position: absolute; left: 0; top: 19px; width: 16px; height: 6px; background: var(--buis-h); border-radius: 1px; }
body.s-installateur-b .wd-tip { margin-top: 20px; padding: 16px 18px; background: var(--koper-band); color: var(--inkt); border-radius: 10px; font-size: 16px; }
body.s-installateur-b .wd-tip b { display: block; font: 600 12px/1.3 "Barlow", sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--koper-d); margin-bottom: 4px; }

/* ── Over ons ─────────────────────────────────────────────── */
body.s-installateur-b .wd-kolommen { columns: 2; column-gap: 56px; font-size: 19px; color: var(--inkt2); }
body.s-installateur-b .wd-kolommen p { margin-bottom: 20px; break-inside: avoid; }
body.s-installateur-b .wd-citaat { margin: 6px 0 26px; padding: 4px 0 4px 26px; border-left: 6px solid var(--koper); break-inside: avoid;
  font: 600 clamp(24px, 2.4vw, 30px)/1.25 "Rubik", sans-serif; color: var(--inkt); letter-spacing: -.015em; }
body.s-installateur-b .wd-citaat cite { display: block; margin-top: 12px; font: 500 15px/1 "Barlow", sans-serif; font-style: normal; color: var(--inkt2); letter-spacing: .04em; }
body.s-installateur-b .wd-team { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 48px 40px; }
body.s-installateur-b .wd-team li { border-top: 1px solid #ffffff26; padding-top: 24px; }
body.s-installateur-b .wd-team-letter { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; margin-bottom: 18px;
  font: 700 28px/1 "Rubik", sans-serif; color: var(--nacht); background: radial-gradient(circle at 35% 30%, #f6d2b3, #d38b56 45%, #8a4720 100%); }
body.s-installateur-b .wd-team h3 { font-size: 28px; font-weight: 700; color: #fff; letter-spacing: -.02em; }
body.s-installateur-b .wd-team-rol { font: 600 13px/1.3 "Barlow", sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--koper-l); margin: 6px 0 12px; }
body.s-installateur-b .wd-team p:last-child { color: var(--op-nacht2); }
body.s-installateur-b .wd-werkwijze { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; position: relative; }
body.s-installateur-b .wd-werkwijze::before { content: ""; position: absolute; left: 0; right: 0; top: 27px; height: 10px; background: var(--buis-h); }
body.s-installateur-b .wd-werkwijze li { position: relative; }
body.s-installateur-b .wd-ww-nr { position: relative; display: grid; place-items: center; width: 64px; height: 64px; border-radius: 12px; margin-bottom: 22px;
  font: 700 26px/1 "Rubik", sans-serif; color: var(--inkt); background: linear-gradient(90deg, #8c6a22, #d8b45c 35%, #f3dc93 48%, #c9a24a 62%, #8c6a22);
  clip-path: polygon(25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%); }
body.s-installateur-b .wd-werkwijze h3 { font-size: 24px; font-weight: 700; margin-bottom: 8px; letter-spacing: -.01em; }
body.s-installateur-b .wd-werkwijze p { color: var(--inkt2); }

/* ── Contact ──────────────────────────────────────────────── */
body.s-installateur-b .wd-contact { display: grid; grid-template-columns: 1fr 1.15fr; gap: clamp(32px, 6vw, 88px); align-items: start; }
body.s-installateur-b .wd-tijden { display: grid; grid-template-columns: auto 1fr; gap: 8px 20px; margin: 30px 0; font-size: 17px; }
body.s-installateur-b .wd-tijden dt { font-weight: 600; }
body.s-installateur-b .wd-tijden dd { margin: 0; color: var(--inkt2); }
body.s-installateur-b .wd-gegevens { list-style: none; margin: 0; padding: 0; }
body.s-installateur-b .wd-gegevens li { display: flex; align-items: center; gap: 14px; padding: 13px 0; border-top: 1px solid var(--tegel); font-size: 18px; }
body.s-installateur-b .wd-gegevens .wd-i { width: 26px; height: 26px; color: var(--koper); }
body.s-installateur-b .wd-gegevens a { font-weight: 600; text-decoration: none; }
body.s-installateur-b .wd-gegevens a:hover { color: var(--koper-d); }
body.s-installateur-b .wd-form { background: var(--wit); border-radius: 20px; padding: clamp(24px, 3.5vw, 44px); box-shadow: 0 30px 60px -40px #10232a66; border-top: 6px solid var(--groen); }
body.s-installateur-b .wd-form fieldset { border: 0; margin: 0 0 24px; padding: 0; min-width: 0; }
body.s-installateur-b .wd-form legend { font: 600 20px/1.2 "Rubik", sans-serif; margin-bottom: 12px; padding: 0; }
body.s-installateur-b .wd-chips { display: flex; flex-wrap: wrap; gap: 8px; }
body.s-installateur-b .wd-chip input { position: absolute; opacity: 0; pointer-events: none; }
body.s-installateur-b .wd-chip span { display: inline-flex; align-items: center; gap: 8px; padding: 10px 14px; border: 1.5px solid #10232a33; border-radius: 10px; cursor: pointer; font-weight: 600; font-size: 16px; }
body.s-installateur-b .wd-chip .wd-i { width: 22px; height: 22px; color: var(--koper); }
body.s-installateur-b .wd-chip input:checked + span { background: var(--nacht); color: #fff; border-color: var(--nacht); }
body.s-installateur-b .wd-chip input:checked + span .wd-i { color: var(--koper-l); }
body.s-installateur-b .wd-chip input:focus-visible + span { outline: 3px solid var(--koper); outline-offset: 2px; }
body.s-installateur-b .wd-velden { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
body.s-installateur-b .wd-velden label { display: flex; flex-direction: column; gap: 6px; font: 600 14px/1.2 "Barlow", sans-serif; letter-spacing: .02em; }
body.s-installateur-b .wd-velden .vol { grid-column: 1 / -1; }
body.s-installateur-b .wd-velden input, body.s-installateur-b .wd-velden textarea { font: 400 17px/1.4 "Barlow", sans-serif; padding: 12px 14px; border: 1.5px solid #10232a33; border-radius: 10px; background: var(--porselein); color: var(--inkt); width: 100%; }
body.s-installateur-b .wd-velden input:focus, body.s-installateur-b .wd-velden textarea:focus { outline: none; border-color: var(--koper); background: #fff; }
body.s-installateur-b .wd-verstuur { margin-top: 22px; display: inline-flex; align-items: center; gap: 12px; padding: 16px 26px; border: 0; border-radius: 12px; background: var(--groen); color: #fff;
  font: 600 18px/1 "Rubik", sans-serif; cursor: pointer; }
body.s-installateur-b .wd-verstuur:hover { background: #155f39; }
body.s-installateur-b .wd-formnoot { margin-top: 14px; font-size: 14px; color: var(--inkt2); }
body.s-installateur-b .wd-faq { max-width: 900px; border-bottom: 1.5px solid var(--inkt); }
body.s-installateur-b .wd-faq details { border-top: 1.5px solid var(--inkt); }
body.s-installateur-b .wd-faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 20px; padding: 22px 0; font: 600 clamp(19px, 1.8vw, 23px)/1.3 "Rubik", sans-serif; }
body.s-installateur-b .wd-faq summary::-webkit-details-marker { display: none; }
body.s-installateur-b .wd-faq summary::after { content: ""; flex: none; width: 26px; height: 26px; margin-top: 2px; border-radius: 50%; background:
  linear-gradient(var(--koper), var(--koper)) center / 12px 2.5px no-repeat, linear-gradient(var(--koper), var(--koper)) center / 2.5px 12px no-repeat; box-shadow: inset 0 0 0 2px var(--koper); transition: transform .2s; }
body.s-installateur-b .wd-faq details[open] summary::after { transform: rotate(45deg); }
body.s-installateur-b .wd-faq details p { padding: 0 0 24px; max-width: 64ch; color: var(--inkt2); }

/* ── Voet: de leiding eindigt in een afvoerputje ──────────── */
body.s-installateur-b .wd-voet { position: relative; background: var(--nacht3); color: var(--op-nacht2); padding: 96px 0 136px; font-size: 16px; }
body.s-installateur-b .wd-voet-put { position: absolute; top: 0; left: var(--bx); width: var(--bw); height: 34px; background: var(--buis); }
body.s-installateur-b .wd-voet-put span { position: absolute; left: 50%; top: 30px; transform: translateX(-50%); width: 52px; height: 52px; border-radius: 6px;
  background: repeating-linear-gradient(90deg, #2b3336 0 4px, #c9cfd1 4px 8px), #c9cfd1; box-shadow: 0 0 0 4px #9aa5a9, 0 0 0 5px #6f7a7e; }
body.s-installateur-b .wd-voet-grid { display: grid; grid-template-columns: 1.5fr 1fr 1.1fr 1.2fr; gap: 40px; }
body.s-installateur-b .wd-voet-zin { margin: 22px 0 18px; color: var(--op-nacht); font: 500 19px/1.4 "Rubik", sans-serif; max-width: 26ch; }
body.s-installateur-b .wd-voet-tel { font: 700 34px/1 "Rubik", sans-serif; color: var(--koper-l); text-decoration: none; letter-spacing: -.02em; }
body.s-installateur-b .wd-voet-h { font: 600 12.5px/1 "Barlow", sans-serif; letter-spacing: .16em; text-transform: uppercase; color: var(--op-nacht); margin-bottom: 16px; }
body.s-installateur-b .wd-voet-links { list-style: none; margin: 0; padding: 0; }
body.s-installateur-b .wd-voet-links li { padding: 4px 0; }
body.s-installateur-b .wd-voet-links a, body.s-installateur-b .wd-voet-adres a { text-decoration: none; color: var(--op-nacht2); }
body.s-installateur-b .wd-voet-links a:hover, body.s-installateur-b .wd-voet-adres a:hover { color: #fff; }
body.s-installateur-b .wd-voet-tijden { margin: 0; }
body.s-installateur-b .wd-voet-tijden dt { color: var(--op-nacht); font-weight: 600; }
body.s-installateur-b .wd-voet-tijden dd { margin: 0 0 12px; }
body.s-installateur-b .wd-voet-adres { font-style: normal; line-height: 1.6; }
body.s-installateur-b .wd-voet-plaatsen { margin-top: 16px; font-size: 14px; line-height: 1.5; }
body.s-installateur-b .wd-voet-onder { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 10px 24px; margin-top: 64px; padding-top: 22px; border-top: 1px solid #ffffff1a; font-size: 14px; }
body.s-installateur-b .wd-voet-onder a { color: var(--koper-l); }

/* ── Tablet ───────────────────────────────────────────────── */
@media (max-width: 1080px) {
  body.s-installateur-b .wd-drij a { grid-template-columns: 60px minmax(0, 1fr) 140px 40px; }
  body.s-installateur-b .wd-drij-m:nth-of-type(3) { display: none; }
  body.s-installateur-b .wd-afspr-lijst, body.s-installateur-b .wd-zeker { grid-template-columns: 1fr 1fr; }
  body.s-installateur-b .wd-voet-grid { grid-template-columns: 1fr 1fr; }
  body.s-installateur-b .wd-dock-status { display: none; }
  body.s-installateur-b .wd-dock-in { grid-template-columns: 1fr auto auto auto; }
}
@media (max-width: 860px) {
  body.s-installateur-b .wd-zelf, body.s-installateur-b .wd-dienst-grid, body.s-installateur-b .wd-contact, body.s-installateur-b .wd-tarief-twee,
  body.s-installateur-b .wd-pgroepen, body.s-installateur-b .wd-voorbeelden { grid-template-columns: 1fr; }
  body.s-installateur-b .wd-fb-split, body.s-installateur-b .wd-fbs-om { grid-template-columns: 1fr; }
  body.s-installateur-b .wd-fbs-om .wd-fbs-foto { order: 0; }
  body.s-installateur-b .wd-fbs-foto { min-height: 320px; }
  body.s-installateur-b .wd-fbs-tekst { padding-left: 76px; }
  body.s-installateur-b .wd-keuze ul { grid-template-columns: 1fr 1fr; }
  body.s-installateur-b .wd-team { grid-template-columns: 1fr 1fr; }
  body.s-installateur-b .wd-werkwijze { grid-template-columns: 1fr 1fr; }
  body.s-installateur-b .wd-werkwijze::before { display: none; }
  body.s-installateur-b .wd-kolommen { columns: 1; }
  body.s-installateur-b .wd-schema { display: none; }
  body.s-installateur-b .wd-schema-lijst { display: block; }
  body.s-installateur-b .wd-vel-lijst { grid-template-columns: 1fr 1fr; }
}

/* ── Telefoon ─────────────────────────────────────────────── */
@media (max-width: 600px) {
  body.s-installateur-b { font-size: 17px; --bx: 14px; --bw: 8px; }
  body.s-installateur-b .wd-w { padding: 0 18px 0 42px; }
  body.s-installateur-b .wd-kop { padding: 14px 16px; }
  body.s-installateur-b .wd-kop-dienst { display: none; }
  body.s-installateur-b .wd-merk { width: 36px; height: 36px; }
  body.s-installateur-b .wd-naam { font-size: 21px; }
  body.s-installateur-b .wd-naam small { font-size: 9.5px; letter-spacing: .12em; }
  body.s-installateur-b .wd-ods { font-size: 12.5px; padding: 8px 11px; }
  body.s-installateur-b .wd-leiding::before, body.s-installateur-b .wd-leiding::after { left: -4px; height: 12px; }
  body.s-installateur-b .wd-rozet { left: 4px; width: 28px; height: 28px; }
  body.s-installateur-b .wd-rozet::after { inset: 9px; }
  body.s-installateur-b .wd-tak-buis { margin-left: -28px; }
  body.s-installateur-b .wd-tak-buis::before { width: 28px; height: 8px; }
  body.s-installateur-b .wd-marker { height: 26px; font-size: 11px; letter-spacing: .12em; padding: 0 22px 0 10px; }
  body.s-installateur-b .wd-reus { font-size: clamp(54px, 17vw, 80px); }
  body.s-installateur-b .wd-open-sub .wd-reus { font-size: clamp(42px, 13.2vw, 64px); }
  body.s-installateur-b .wd-open { background-size: 64px 64px; }
  body.s-installateur-b .wd-belknop { padding: 12px 18px 12px 12px; gap: 12px; width: 100%; }
  body.s-installateur-b .wd-belknop .wd-kraan { width: 50px; height: 32px; }
  body.s-installateur-b .wd-belknop b, body.s-installateur-b .wd-belblok.groot .wd-belknop b { font-size: 26px; }
  body.s-installateur-b .wd-keuze ul { grid-template-columns: 1fr; }
  body.s-installateur-b .wd-keuze a { padding: 14px 0; font-size: 18px; }
  body.s-installateur-b .wd-keuze .wd-i { width: 32px; height: 32px; }
  body.s-installateur-b .wd-onderschrift { left: 42px; right: 12px; bottom: 14px; font-size: 13.5px; }
  body.s-installateur-b .wd-fbs-tekst { padding: 48px 18px 56px 42px; }
  body.s-installateur-b .wd-fb-team .wd-foto { height: 560px; }
  body.s-installateur-b .wd-fb-team::after { background: linear-gradient(180deg, transparent 25%, #0a1f24e6 70%); }
  body.s-installateur-b .wd-fbt-tekst { top: auto; bottom: 40px; transform: none; left: 42px; right: 18px; }
  body.s-installateur-b .wd-drij a { grid-template-columns: 44px minmax(0, 1fr) 28px; gap: 14px; padding: 22px 0; }
  body.s-installateur-b .wd-drij-ic .wd-i { width: 40px; height: 40px; }
  body.s-installateur-b .wd-drij-m { display: none; }
  body.s-installateur-b .wd-tarief-kol { padding: 26px 20px; }
  body.s-installateur-b .wd-tarief-rij .wd-teller { font-size: 28px; }
  body.s-installateur-b .wd-tarief-rij span { font-size: 11.5px; letter-spacing: .1em; }
  body.s-installateur-b [data-nu] .wd-tarief-kol::before { top: 12px; right: 12px; }
  body.s-installateur-b .wd-etmaal-balk { height: 44px; }
  body.s-installateur-b .wd-etmaal-balk i { font-size: 10px; left: 2px; bottom: 4px; }
  body.s-installateur-b .wd-etmaal-balk span:nth-child(8) i, body.s-installateur-b .wd-etmaal-balk span:nth-child(18) i { opacity: 0; }
  body.s-installateur-b .wd-prijslijst li { grid-template-columns: 1fr auto; }
  body.s-installateur-b .wd-prijslijst i { display: none; }
  body.s-installateur-b .wd-afspr-lijst, body.s-installateur-b .wd-zeker, body.s-installateur-b .wd-team, body.s-installateur-b .wd-werkwijze { grid-template-columns: 1fr; gap: 28px; }
  body.s-installateur-b .wd-velden { grid-template-columns: 1fr; }
  body.s-installateur-b .wd-slot-tel { font-size: clamp(40px, 12.4vw, 60px); }
  body.s-installateur-b .wd-zelf-lijst li { grid-template-columns: 48px 1fr; column-gap: 14px; }
  body.s-installateur-b .wd-zelf-nr { width: 44px; height: 44px; font-size: 20px; }
  body.s-installateur-b .wd-zelf-lijst h3 { font-size: 21px; }
  body.s-installateur-b .wd-voet { padding: 104px 0 110px; }
  body.s-installateur-b .wd-voet-grid { grid-template-columns: 1fr; gap: 32px; }
  body.s-installateur-b .wd-voet-put span { width: 40px; height: 40px; }
  body.s-installateur-b .wd-vel { padding: 0 0 78px; }
  body.s-installateur-b .wd-vel-in { border-radius: 18px 18px 0 0; padding: 22px 20px 18px; }
  body.s-installateur-b .wd-vel-lijst { grid-template-columns: 1fr; }
  body.s-installateur-b .wd-vel-lijst a { padding: 11px 0; font-size: 24px; }

  /* dock wordt een app-balk over de hele breedte */
  body.s-installateur-b .wd-dock { left: 0; bottom: 0; transform: none; width: 100%; }
  body.s-installateur-b .wd-dock-in { grid-template-columns: 1.6fr 1fr 1fr 1fr; border-radius: 0; gap: 4px; padding: 6px 6px calc(6px + env(safe-area-inset-bottom)); }
  body.s-installateur-b .wd-dock-in::before { left: 0; right: 0; top: 0; height: 3px; border-radius: 0; }
  body.s-installateur-b .wd-dock-spoed { padding: 8px 8px; gap: 7px; min-width: 0; }
  body.s-installateur-b .wd-dock-spoed .wd-kraan { width: 26px; height: 17px; flex: none; }
  body.s-installateur-b .wd-dock-spoed small { font-size: 9px; letter-spacing: .08em; white-space: nowrap; }
  body.s-installateur-b .wd-dock-spoed small::before { content: "Spoed · 24/7"; }
  body.s-installateur-b .wd-dock-spoed small span { display: none; }
  body.s-installateur-b .wd-dock-spoed b { font-size: 15px; white-space: nowrap; }
  body.s-installateur-b .wd-dock-knop { min-width: 0; padding: 6px 2px; font-size: 11.5px; }
  body.s-installateur-b .wd-dock-knop .wd-i { width: 22px; height: 22px; }
}
