@font-face{ font-family: 'IBM Plex Sans Hebrew'; font-style: normal; font-display: swap; font-weight: 300; src:url(/assets/fonts/ibm-plex-sans-hebrew-hebrew-300-normal.woff2) format('woff2'); unicode-range: U+0307-0308,U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F; }
@font-face{ font-family: 'IBM Plex Sans Hebrew'; font-style: normal; font-display: swap; font-weight: 300; src:url(/assets/fonts/ibm-plex-sans-hebrew-latin-300-normal.woff2) format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face{ font-family: 'IBM Plex Sans Hebrew'; font-style: normal; font-display: swap; font-weight: 400; src:url(/assets/fonts/ibm-plex-sans-hebrew-hebrew-400-normal.woff2) format('woff2'); unicode-range: U+0307-0308,U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F; }
@font-face{ font-family: 'IBM Plex Sans Hebrew'; font-style: normal; font-display: swap; font-weight: 400; src:url(/assets/fonts/ibm-plex-sans-hebrew-latin-400-normal.woff2) format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face{ font-family: 'IBM Plex Sans Hebrew'; font-style: normal; font-display: swap; font-weight: 500; src:url(/assets/fonts/ibm-plex-sans-hebrew-hebrew-500-normal.woff2) format('woff2'); unicode-range: U+0307-0308,U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F; }
@font-face{ font-family: 'IBM Plex Sans Hebrew'; font-style: normal; font-display: swap; font-weight: 500; src:url(/assets/fonts/ibm-plex-sans-hebrew-latin-500-normal.woff2) format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face{font-family:'Switzer';font-style:normal;font-weight:300;font-display:swap;src:url(/assets/fonts/switzer-300-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2190-2199,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Switzer';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/switzer-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2190-2199,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Switzer';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/switzer-500-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2190-2199,U+2212,U+2215,U+FEFF,U+FFFD}
:root{
  --mist:#E3E9ED;--mist-2:#D6DFE5;--wit:#FCFCFB;--inkt:#13233A;--zacht:#5A6876;--lijn:rgba(19,35,58,.14);--terra:#B04F2A;--terra-d:#94401F;
  --sans:"Switzer","IBM Plex Sans Hebrew","Helvetica Neue",Arial,sans-serif;
  --rand:clamp(20px,5vw,72px);--max:1400px
}
[lang=he]{--sans:"IBM Plex Sans Hebrew","Switzer","Helvetica Neue",Arial,sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--wit);color:var(--inkt);font:400 1.0625rem/1.65 var(--sans);-webkit-font-smoothing:antialiased;overflow-wrap:break-word}
[lang=he] body{font-size:1.08rem;line-height:1.75}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3,p,figure{margin:0}
address{font-style:normal}
.wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--rand)}
.skip{position:absolute;inset-inline-start:-999px;top:8px;background:var(--inkt);color:#fff;padding:8px 14px;z-index:100}
.skip:focus{inset-inline-start:8px}
:focus-visible{outline:2px solid var(--terra);outline-offset:3px}
.zacht{color:var(--zacht);max-width:46ch}

.h1{font:300 clamp(2.6rem,6vw,5.8rem)/1.02 var(--sans);letter-spacing:-.04em;color:var(--inkt);max-width:16ch}
.h2{font:300 clamp(1.9rem,3.4vw,3rem)/1.08 var(--sans);letter-spacing:-.03em;color:var(--inkt)}
[lang=he] .h1,[lang=he] .h2{letter-spacing:-.005em;line-height:1.12}
.drie{font:300 clamp(2.1rem,3.5vw,3.6rem)/1.08 var(--sans);letter-spacing:-.04em;color:var(--inkt)}
.drie span{display:block;text-wrap:balance}
.drie span+span{margin-top:.12em}
[lang=he] .drie{letter-spacing:-.005em;line-height:1.16}
.groot{font:300 clamp(1.3rem,2vw,1.75rem)/1.4 var(--sans);letter-spacing:-.015em;color:var(--inkt)}
[lang=he] .groot{letter-spacing:0}

.knop{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 26px;background:var(--terra);color:#fff;text-decoration:none;font:500 .98rem/1 var(--sans);border:0;cursor:pointer;transition:background .2s}
.knop:hover{background:var(--terra-d)}
.knop.klein{min-height:42px;padding:0 18px;font-size:.9rem}
.lijn{display:inline-flex;align-items:center;gap:10px;min-height:44px;font-weight:500;text-decoration:none;color:var(--inkt);border-bottom:1px solid var(--inkt);transition:gap .25s}
.lijn:hover{gap:16px}
.pijl{width:18px;height:18px}
.knoppen{display:flex;flex-wrap:wrap;align-items:center;gap:14px 28px}

/* kop */
.kop{background:var(--mist)}
.kop-in{max-width:var(--max);margin-inline:auto;padding:18px var(--rand);display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:28px;position:relative}
.logo img{width:clamp(150px,12vw,180px)}
.menu ul{display:flex;justify-content:center;gap:28px;list-style:none;margin:0;padding:0}
.menu a{text-decoration:none;font-size:.95rem;color:var(--inkt);padding:6px 0}
.menu a[aria-current]{box-shadow:inset 0 -1px var(--inkt)}
.kop-rechts{display:flex;align-items:center;gap:18px}
.taal{text-decoration:none;font-size:.9rem;color:var(--zacht)}
.menu-knop{display:none}

/* held: tekst en vrijstaand portret op hetzelfde vlak */
.vlak{background:var(--mist)}
.held-in{max-width:var(--max);margin-inline:auto;padding:clamp(28px,5vw,64px) var(--rand) 0;display:grid;grid-template-columns:minmax(0,7.5fr) minmax(0,4.5fr);gap:24px clamp(24px,4vw,64px);align-items:end;min-height:min(calc(100svh - 80px),860px)}
.held-tekst{display:flex;flex-direction:column;gap:30px;align-self:center;padding-bottom:clamp(40px,6vw,80px)}
.held-sub{max-width:48ch;color:var(--zacht);font-size:clamp(1.02rem,1.25vw,1.15rem)}
.held-foto{align-self:end;display:flex;justify-content:center}
.held-foto img{height:min(76svh,780px);width:auto;max-width:100%;object-fit:contain;object-position:bottom}
.held-pagina .held-in{min-height:min(calc(100svh - 80px),760px)}

/* vakgebieden */
.blok{padding-block:clamp(72px,10vw,140px)}
.blok-kop{display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap;margin-bottom:clamp(32px,4vw,56px)}
.rijen{border-top:1px solid var(--inkt)}
.rij{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,4fr) minmax(0,5fr);gap:16px clamp(24px,4vw,56px);padding:clamp(28px,3.5vw,44px) clamp(0px,1.5vw,20px);border-bottom:1px solid var(--lijn);transition:background .3s}
.rij:hover{background:var(--mist)}
.rij h3{font:300 clamp(1.5rem,2.3vw,2.1rem)/1.12 var(--sans);letter-spacing:-.025em}
[lang=he] .rij h3{letter-spacing:0}
.rij-intro{color:var(--zacht)}
.rij ul{list-style:none;margin:0;padding:0}
.rij li{padding:7px 0;border-top:1px solid var(--lijn);font-size:.97rem;line-height:1.45}
.rij li:first-child{border-top:0;padding-top:0}

.over{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:40px clamp(32px,6vw,104px);align-items:center;background:linear-gradient(var(--lijn),var(--lijn)) top center/calc(100% - 2*var(--rand)) 1px no-repeat}
.over.geen-lijn,.geen-lijn{background:none}
.over figure img{width:100%;aspect-ratio:4/5;object-fit:cover}
.over-tekst{display:flex;flex-direction:column;gap:22px;align-items:flex-start;max-width:62ch}
.lees{display:flex;flex-direction:column;gap:24px;align-items:flex-start;max-width:900px}

/* contact */
.contact-in{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:32px clamp(32px,6vw,96px);padding-block:clamp(72px,10vw,130px);align-items:end}
.contact-in>div:first-child{display:flex;flex-direction:column;gap:18px}
.contact-rechts{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.contact-rechts address{display:flex;flex-direction:column}
.tel{font:300 clamp(2.8rem,6vw,5.6rem)/1 var(--sans);letter-spacing:-.04em;color:var(--inkt);text-decoration:none;direction:ltr;unicode-bidi:isolate}
.tel:hover{color:var(--terra)}

/* pagina's */
.paginakop{padding-block:clamp(48px,7vw,104px) clamp(16px,3vw,32px);display:flex;flex-direction:column;gap:24px}
.kruimel{font-size:.88rem;color:var(--zacht)}
.kruimel a{text-decoration:none}
.contact-pagina{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:48px clamp(32px,6vw,96px);align-items:start}
.formulier{display:grid;gap:18px;padding:clamp(22px,3vw,40px);background:var(--mist)}
.formulier label{display:grid;gap:6px;font-size:.88rem;color:var(--zacht)}
.formulier input,.formulier textarea{width:100%;font:inherit;font-size:1rem;color:var(--inkt);background:var(--wit);border:1px solid transparent;padding:12px 14px;border-radius:0}
.formulier input:focus,.formulier textarea:focus{outline:2px solid var(--inkt);outline-offset:0}
.formulier .knop{justify-self:start}
.melding{color:var(--inkt)}

/* voet */
.voet{background:var(--inkt);color:#B8C2CE;font-size:.92rem}
.voet-in{max-width:var(--max);margin-inline:auto;padding:64px var(--rand) 36px;display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:32px}
.voet-logo{width:170px;filter:brightness(0) invert(1)}
.voet address,.voet-tel{display:flex;flex-direction:column;margin:0}
.voet a{color:#fff}
.voet-nav{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.voet-nav a{text-decoration:none}
.voet-nav a:hover{text-decoration:underline}
.voet-onder{max-width:var(--max);margin-inline:auto;padding:18px var(--rand) 84px;border-top:1px solid rgba(255,255,255,.12);display:flex;justify-content:space-between;font-size:.8rem}

.js [data-in]{opacity:0;transform:translateY(18px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.2,1)}
.js [data-in].in{opacity:1;transform:none}
.drie span,.held .held-sub,.held .knoppen{animation:op 1s cubic-bezier(.2,.7,.2,1) both}
.drie span:nth-child(2){animation-delay:.1s}.drie span:nth-child(3){animation-delay:.2s}.held .held-sub{animation-delay:.3s}.held .knoppen{animation-delay:.38s}
.held-foto img{animation:foto 1.4s cubic-bezier(.2,.7,.2,1) both}
@keyframes op{from{opacity:0;transform:translateY(16px)}}
@keyframes foto{from{opacity:0;transform:translateY(24px)}}
@media (prefers-reduced-motion:reduce){.js [data-in],.drie span,.held .held-sub,.held .knoppen,.held-foto img{opacity:1;transform:none;transition:none;animation:none}}

@media (max-width:1100px){
  .menu-knop{display:inline-grid;place-content:center;gap:6px;width:44px;height:44px;background:none;border:1px solid var(--inkt);cursor:pointer}
  .menu-knop span{display:block;width:18px;height:1.5px;background:var(--inkt);transition:transform .25s}
  .menu-open .menu-knop span:first-child{transform:translateY(3.75px) rotate(45deg)}
  .menu-open .menu-knop span:last-child{transform:translateY(-3.75px) rotate(-45deg)}
  .kop-rechts{grid-column:3}
  .menu{display:none;position:absolute;inset-inline:0;top:100%;background:var(--mist);padding:8px var(--rand) 28px;z-index:30}
  .menu-open .menu{display:block}
  .menu ul{flex-direction:column;gap:0}
  .menu li a{display:block;padding:14px 0;font:300 1.7rem/1.15 var(--sans);border-bottom:1px solid var(--lijn)}
}
@media (max-width:900px){
  .held-in,.held-pagina .held-in{grid-template-columns:1fr;min-height:0}
  .held-tekst{padding-bottom:8px}
  .held-foto img{height:auto;width:min(100%,420px)}
  .rij{grid-template-columns:1fr;padding-inline:0}
  .rij:hover{background:none}
  .over,.contact-in,.contact-pagina{grid-template-columns:1fr}
  .voet-in{grid-template-columns:1fr 1fr}
  .voet-logo{grid-column:1/-1}
}
@media (max-width:560px){
  .kop-rechts .knop{display:none}
  .knoppen .knop{width:100%}
  .voet-in{grid-template-columns:1fr}
}

/* kantoor, beeldbanden */
.kantoor .blok-kop>div{display:flex;flex-direction:column;gap:10px}
.galerij{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(8px,1.2vw,16px)}
.galerij img{width:100%;aspect-ratio:3/4;object-fit:cover}
.band-foto img{width:100%;aspect-ratio:21/8;object-fit:cover}

/* WhatsApp */
.wa{position:fixed;bottom:18px;inset-inline-end:18px;z-index:80;display:flex;align-items:center;gap:10px;padding-block:6px;padding-inline:6px 18px;background:#fff;color:var(--inkt);border-radius:999px;text-decoration:none;font:500 .98rem/1 var(--sans);box-shadow:0 10px 30px -8px rgba(19,35,58,.35),0 1px 3px rgba(19,35,58,.12);transition:transform .2s,box-shadow .2s}
.wa:hover{transform:translateY(-2px);box-shadow:0 14px 34px -8px rgba(19,35,58,.42),0 1px 3px rgba(19,35,58,.12)}
.wa-rond{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#25D366;color:#fff}
.wa-rond svg{width:26px;height:26px}
.wa-knop{background:#0F7A5A;gap:10px}
.wa-knop:hover{background:#0B5E45}
.wa-knop svg{width:20px;height:20px}
@media (max-width:900px){
  .galerij{grid-template-columns:repeat(2,minmax(0,1fr))}
  .band-foto img{aspect-ratio:4/3}
}
@media print{.wa{display:none}}

.ow{position:fixed;bottom:14px;left:50%;transform:translateX(-50%);max-width:calc(100vw - 24px);z-index:90;display:flex;align-items:center;gap:2px;padding:4px;border-radius:999px;background:rgba(17,17,17,.86);color:#fff;font:500 12px/1 system-ui,-apple-system,sans-serif;letter-spacing:.02em;box-shadow:0 6px 24px rgba(0,0,0,.18);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.ow a,.ow span{display:inline-grid;place-items:center;min-width:30px;height:30px;padding:0 10px;border-radius:999px;color:inherit;text-decoration:none}
.ow a:hover{background:rgba(255,255,255,.14)}
.ow [aria-current]{background:#fff;color:#111}
.ow .ow-label{opacity:.6;padding:0 6px 0 4px}
.ow .ow-terug{padding:0 12px;border-inline-end:1px solid rgba(255,255,255,.2);border-radius:999px 0 0 999px;margin-inline-end:2px}
@media print{.ow{display:none}}