@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--bg:#000000;--fg:#f3f2ed;--muted:#969693;--accent:#f36b35}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:95px}body{margin:0;background:var(--bg);color:var(--fg);font-family:'DM Sans',sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button:disabled{cursor:default;opacity:.25}a:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--accent);outline-offset:5px}header{height:72px;padding:0 4%;position:sticky;top:0;background:#000000ef;backdrop-filter:blur(16px);border-bottom:1px solid #ffffff18;display:flex;align-items:center;justify-content:space-between;z-index:10}.brand{font-size:14px;font-weight:800;letter-spacing:-.2px}nav{display:flex;gap:32px;font-size:13px}nav a:hover{color:var(--accent)}main{overflow:hidden}.intro{position:relative;min-height:850px;height:calc(100svh - 72px);max-height:1150px;margin:0 4%;isolation:isolate}.portrait{position:absolute;inset:0 0 0 20%;z-index:-2;overflow:hidden}.portrait img{height:100%;width:100%;object-fit:contain;object-position:85% center;filter:brightness(.6) saturate(.5)}.portrait:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#000000 0%,transparent 40%),linear-gradient(0deg,#000000 0%,transparent 30%,transparent 90%,#000000)}.scroll-hint{position:absolute;top:42px;left:0;font-size:10px;letter-spacing:1px}.scroll-hint span{font-size:18px;color:var(--accent);margin-right:10px}.placeholder-note{position:absolute;top:47px;right:0;font-size:8px;letter-spacing:1.5px;color:#777}.intro-copy{position:absolute;bottom:50px;left:0;right:0}.profession{font-size:16px;margin:0 0 14px}h1{font-family:Manrope,sans-serif;font-size:clamp(55px,8.5vw,150px);font-weight:800;line-height:1.03;letter-spacing:-.065em;margin:0}.hero-disciplines{font-size:11px;letter-spacing:1px;color:var(--accent);margin-top:26px}.hero-bottom{display:flex;align-items:center;justify-content:space-between;gap:30px}.hero-bottom p{font-size:17px;color:var(--muted);line-height:1.6}.orange-button{background:var(--accent);color:#000000;padding:15px 22px;display:inline-flex;gap:30px;align-items:center;font-size:12px;font-weight:700;transition:background .2s,transform .2s}.orange-button:hover{background:#ff8555;transform:translateY(-2px)}.eyebrow{font-size:10px;font-weight:500;letter-spacing:1px;color:var(--accent);text-transform:uppercase}.dot{display:none}.work{padding:105px 0 30px}.section-head{padding:0 4%;display:flex;align-items:end;justify-content:space-between;gap:30px}.section-head h2,.about h2{font:700 clamp(36px,4.5vw,64px)/1.1 Manrope,sans-serif;letter-spacing:-2.8px;margin:20px 0 0}.section-head p{font-size:15px;color:var(--muted);line-height:1.7;margin:0}.work-toolbar{display:flex;justify-content:space-between;align-items:center;padding:32px 4% 24px;gap:20px}.filters{display:flex;gap:8px;flex-wrap:wrap}.filters button{background:transparent;color:var(--muted);border:1px solid #ffffff25;border-radius:30px;padding:9px 15px;font-size:11px}.filters button[aria-pressed=true]{background:var(--accent);color:#000000;border-color:var(--accent)}.arrows{display:flex;gap:8px}.arrows button{width:42px;height:42px;border:1px solid #ffffff30;background:transparent;color:white;border-radius:50%;font-size:20px}.arrows button:not(:disabled):hover{border-color:var(--accent);color:var(--accent)}.grid{display:flex;gap:24px;overflow-x:auto;padding:3px 4% 22px;scroll-padding-inline:4vw;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:#663321 transparent;overscroll-behavior-x:contain;cursor:grab}.grid.dragging{scroll-snap-type:none;cursor:grabbing;user-select:none}.card{flex:0 0 min(62vw,920px);min-width:0;scroll-snap-align:start}.card button{display:block;width:100%;aspect-ratio:16/9;position:relative;border:1px solid #ffffff20;border-radius:10px;overflow:hidden;padding:0;background:#181818;color:white}.card img{width:100%;height:100%;object-fit:cover;transition:transform .7s,filter .7s;pointer-events:none}.card button:hover img{transform:scale(1.035);filter:brightness(.7)}.watch{position:absolute;inset:0;display:grid;place-items:center;font-size:14px;text-shadow:0 2px 12px #000}.duration{position:absolute;right:15px;bottom:15px;background:#000b;font-size:10px;padding:5px 8px;border-radius:3px}.card-row{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-top:20px}.card h3{font:600 clamp(20px,2.1vw,30px) Manrope,sans-serif;letter-spacing:-1px;margin:0}.index{font-size:10px;color:var(--muted)}.card p{font-size:16px;margin:6px 0 12px;color:#cececa}.card small{font-size:10px;letter-spacing:1px;color:var(--accent);text-transform:uppercase}.project-credits{display:flex;gap:30px;border-top:1px solid #ffffff18;margin-top:16px;padding-top:14px;font-size:11px;line-height:1.8;color:#c5c5c0;flex-wrap:wrap}.project-credits span{color:#888883;display:inline-block;margin-right:12px;font-size:9px;letter-spacing:.6px;text-transform:uppercase}.gallery-bottom{padding:12px 4% 0;display:flex;justify-content:space-between;font-size:9px;letter-spacing:1px;color:#888}.about{padding:110px 4%;display:grid;grid-template-columns:1fr 1fr;gap:8vw}.about-copy p{font-size:18px;line-height:1.8;color:var(--muted);margin:0 0 25px}.skills{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}.skills span{font-size:11px;padding:9px 13px;border:1px solid #ffffff25;border-radius:3px}footer{border-top:1px solid #ffffff20;padding:70px 4% 25px}.contact-layout{display:flex;align-items:center;justify-content:space-between;gap:40px}footer h2{font:600 clamp(32px,4.5vw,65px)/1.15 Manrope,sans-serif;letter-spacing:-2.5px;margin:22px 0}footer h2 span{color:var(--accent)}footer p{font-size:14px;line-height:1.8;color:var(--muted)}.socials{display:flex;gap:12px;margin:38px 0 65px}.socials a{border:1px solid #ffffff30;min-width:145px;padding:14px 18px;font-size:12px;display:flex;justify-content:space-between;gap:30px}.socials a:hover{border-color:var(--accent)}.socials span{color:var(--accent)}.bottom{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #ffffff18;padding-top:23px;font-size:10px;color:var(--muted)}dialog{background:#0c0c0c;color:var(--fg);border:1px solid #ffffff30;width:min(1100px,94vw);padding:20px}dialog::backdrop{background:#000e;backdrop-filter:blur(12px)}.dialog-top{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:14px}#videoTitle{font-size:15px;margin:0}#close{background:none;color:white;border:1px solid #ffffff40;padding:8px 12px}.frame{aspect-ratio:16/9}iframe{width:100%;height:100%;border:0}.video-link{font-size:11px;display:inline-block;margin-top:15px;color:var(--accent)}.video-credits{font-size:12px;color:var(--muted);line-height:1.6}
.collaborators{margin:100px 4% 0;border-top:1px solid #ffffff20;border-bottom:1px solid #ffffff20;padding:35px 0}.logo-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:32px}.logo-heading h2{font:600 28px Manrope,sans-serif;letter-spacing:-1px;margin:12px 0 0}.logo-heading button{background:none;color:var(--muted);border:1px solid #ffffff30;border-radius:30px;font-size:10px;padding:9px 14px;white-space:nowrap}.logo-label{font-size:9px;letter-spacing:1.5px;color:#888;margin-bottom:20px}.partner-label{margin-top:30px}.logo-window{overflow:hidden;mask-image:linear-gradient(to right,transparent,#000 5%,#000 95%,transparent)}.logo-track{display:flex;width:max-content;animation:logos 110s linear infinite}.logo-group{display:flex;align-items:center;flex-shrink:0;gap:65px;padding-right:65px}.logo-track.reverse{animation-direction:reverse;animation-duration:65s}.brand-wordmark{font:700 25px/56px Manrope,sans-serif;letter-spacing:-1px;white-space:nowrap;color:#bcbcb7}.brand-wordmark:nth-child(3n){font-family:Georgia,serif;font-weight:400}.brand-wordmark:nth-child(4n){text-transform:uppercase;font-size:21px;letter-spacing:.5px}.brand-logo{height:56px;display:flex;align-items:center;gap:10px;white-space:nowrap;font-size:24px;font-weight:600}.brand-logo img{width:auto;max-width:130px;height:36px;filter:grayscale(1) brightness(0) invert(.75)}.logo-window:hover .logo-track,.collaborators.paused .logo-track{animation-play-state:paused}@keyframes logos{to{transform:translateX(-50%)}}
@media(min-width:1800px){.intro{max-width:1800px;margin:auto}.section-head,.work-toolbar,.gallery-bottom,.about,footer{padding-left:max(4%,calc((100vw - 1800px)/2));padding-right:max(4%,calc((100vw - 1800px)/2))}}@media(max-width:800px){.intro{min-height:740px;height:calc(92svh - 72px)}.portrait{left:0}.portrait img{object-position:80% 20%;object-fit:cover}.portrait:after{background:linear-gradient(0deg,#000000 3%,#00000020 70%),linear-gradient(90deg,#00000070,transparent)}.intro-copy{bottom:20px}.hero-bottom{align-items:start}.hero-bottom p{font-size:14px}.hero-disciplines{font-size:9px}.section-head h2,.about h2{letter-spacing:-1.5px}.card{flex-basis:80vw}.about{grid-template-columns:1fr;gap:35px;padding-top:75px;padding-bottom:75px}.contact-layout{align-items:start;flex-direction:column;gap:15px}.socials{margin-top:30px}footer h2{letter-spacing:-1.4px}.project-credits{gap:15px}}@media(max-width:500px){header{height:64px}nav{gap:18px;font-size:11px}.brand{font-size:12px}.intro{min-height:730px}.portrait{inset:0 -10% 100px 0}.portrait img{object-position:65% top}.scroll-hint{top:28px;font-size:8px}.placeholder-note{top:30px;font-size:6px}h1{font-size:14.1vw;line-height:1.05}.profession{font-size:13px}.hero-bottom{flex-direction:column;gap:12px}.hero-disciplines{line-height:1.7;letter-spacing:.4px;margin-top:18px}.hero-bottom p{margin:0}.orange-button{padding:13px 17px;font-size:11px}.section-head{align-items:start;flex-direction:column;gap:18px}.section-head p{font-size:13px}.work{padding-top:70px}.work-toolbar{align-items:start;gap:12px}.filters{gap:5px}.filters button{font-size:9px;padding:8px 10px}.arrows button{width:32px;height:32px;font-size:16px}.card{flex-basis:87vw}.card h3{font-size:22px}.card p{font-size:14px}.card small{font-size:9px}.project-credits{display:block}.collaborators{margin-top:70px}.logo-heading h2{font-size:21px}.brand-wordmark{font-size:22px}.logo-group{gap:40px;padding-right:40px}.about-copy p{font-size:16px}.socials{gap:8px}.socials a{min-width:0;flex:1;padding:12px 10px;font-size:11px;gap:15px}.bottom{font-size:8px}.gallery-bottom{font-size:8px}footer{padding-top:50px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.logo-window{overflow-x:auto}.logo-group[aria-hidden]{display:none}}

.contact-email{margin:28px 0 0}.contact-email a{color:var(--fg);border-bottom:1px solid var(--accent);padding-bottom:5px}.contact-email a:hover{color:var(--accent)}

/* Two continuous film rows, with matching clickable copies for a seamless loop. */
.pause-work{border:1px solid #ffffff35;border-radius:30px;background:transparent;color:var(--muted);font-size:11px;padding:10px 16px;white-space:nowrap}.pause-work:hover{color:var(--accent);border-color:var(--accent)}
.grid{display:flex;flex-direction:column;gap:38px;overflow:hidden;padding:0 0 20px;scroll-snap-type:none;cursor:default}.work-lane{width:100%;overflow:hidden}.work-track{display:flex;width:max-content;animation:films var(--duration,65s) linear infinite;will-change:transform}.work-track.reverse{animation-direction:reverse}.work-group{display:flex;align-items:stretch;gap:22px;padding-right:22px;flex-shrink:0}.grid .card{flex:0 0 auto;width:clamp(300px,35vw,620px);scroll-snap-align:none}.grid .card button{border-radius:8px}.grid .card h3{font-size:22px}.grid .card p{font-size:14px}.grid .card small{font-size:9px}.grid .project-credits{display:block;font-size:10px;margin-top:13px;padding-top:10px}.grid .card-row{margin-top:14px}.work-lane:hover .work-track,.work-lane:focus-within .work-track,.work-lane.touch-paused .work-track,.grid.paused .work-track,.video-open .work-track{animation-play-state:paused}@keyframes films{to{transform:translateX(-50%)}}
@media(max-width:600px){.grid{gap:28px}.grid .card{width:79vw}.grid .card h3{font-size:19px}.work-group{gap:14px;padding-right:14px}.pause-work{font-size:9px;padding:8px 10px}.gallery-bottom{font-size:7px;letter-spacing:.5px}}@media(prefers-reduced-motion:reduce){.work-lane{overflow-x:auto;scrollbar-width:thin;scrollbar-color:var(--accent) transparent}.work-track{animation:none;will-change:auto}.work-group[aria-hidden]{display:none}.work-group{padding-left:4vw}.pause-work{display:none}}

/* Keep each film and its credits together within the thumbnail. */
.grid .card button{aspect-ratio:16/10;text-align:left;isolation:isolate}.grid .card button:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.04) 20%,rgba(0,0,0,.28) 40%,rgba(0,0,0,.84) 100%);z-index:0;pointer-events:none}.card-overlay{position:absolute;inset:auto 22px 19px;z-index:1;display:block;text-shadow:0 1px 8px #0005;pointer-events:none}.grid .card-overlay .card-row{margin-top:0;gap:10px}.grid .card-overlay h3{font-size:21px;line-height:1.2;letter-spacing:-.6px;color:#fff}.grid .card-overlay .index{font-size:9px;color:#d0d0ca}.grid .card-overlay p{font-size:12px;line-height:1.4;color:#f0eeea;margin:5px 0 9px}.grid .card-overlay small{display:block;font-size:8px;line-height:1.4;letter-spacing:.7px;color:#ffad83}.grid .card-overlay .project-credits{border-top:1px solid #ffffff28;padding-top:8px;margin-top:9px;font-size:9px;line-height:1.6;color:#f1efeb;display:flex;flex-wrap:wrap;gap:0 18px}.grid .card-overlay .project-credits span{color:#bdbbb6;font-size:7px;letter-spacing:.5px;margin-right:7px}.grid .watch{inset:18px auto auto 20px;display:block;font-size:10px;z-index:1;opacity:.85}.grid .duration{top:15px;bottom:auto;right:15px;z-index:1;font-size:9px}.grid .card button:hover img{filter:brightness(.9)}.grid .card button:hover .watch{color:var(--accent);opacity:1}.grid{gap:22px}.work-group{align-items:stretch}@media(max-width:600px){.grid .card-overlay{inset:auto 16px 15px}.grid .card-overlay h3{font-size:19px}.grid .card-overlay p{font-size:11px;margin:5px 0 7px}.grid .card-overlay small{font-size:7px}.grid .card-overlay .project-credits{font-size:8px;line-height:1.5;gap:0 12px;padding-top:7px;margin-top:7px}.grid .watch{top:15px;left:16px;font-size:9px}.grid{gap:14px}}

/* Larger frames, with two concise lines anchored to the bottom. */
.grid .card{width:clamp(480px,49vw,880px)}.grid .card button{aspect-ratio:16/9}.card-overlay{inset:auto 26px 24px}.film-headline{display:block;color:#fff;font:600 clamp(17px,1.65vw,25px)/1.35 Manrope,sans-serif;letter-spacing:-.5px}.film-details{display:block;color:#d8d5cf;font:400 11px/1.6 'DM Sans',sans-serif;margin-top:7px;letter-spacing:.1px}.grid .watch,.grid .duration{display:none}.grid .card button:after{background:linear-gradient(180deg,transparent 35%,rgba(0,0,0,.18) 58%,rgba(0,0,0,.8) 100%)}.grid .card button:hover .film-headline{color:#ffaf88}@media(max-width:800px){.grid .card{width:76vw;min-width:0}.film-headline{font-size:18px}.film-details{font-size:10px}}@media(max-width:500px){.grid .card{width:92vw}.card-overlay,.grid .card-overlay{inset:auto 17px 16px}.film-headline{font-size:15px;line-height:1.3;letter-spacing:-.3px}.film-details{font-size:9px;line-height:1.45;margin-top:6px}.grid .card button{aspect-ratio:16/10}}

.brand-logo img[src$="samsung.svg"]{height:36px;width:auto;max-width:none}

.portrait img{filter:none;object-position:85% center}@media(max-width:800px){.portrait img{object-position:65% 20%}}@media(max-width:500px){.portrait img{object-position:60% top}}

/* Compact cinematic frames keep three film rows in view. */
.grid .card{width:clamp(300px,31vw,540px)}.grid{gap:16px}.work-group{gap:16px;padding-right:16px}.grid .card-overlay{inset:auto 18px 16px}.film-headline{font-size:clamp(14px,1.1vw,19px);line-height:1.3;letter-spacing:-.25px}.film-details{font-size:9px;line-height:1.4;margin-top:5px}@media(max-width:800px){.grid .card{width:55vw}.film-headline{font-size:15px}.film-details{font-size:9px}}@media(max-width:500px){.grid .card{width:80vw}.grid .card button{aspect-ratio:16/9}.grid .card-overlay{inset:auto 14px 13px}.film-headline{font-size:13px}.film-details{font-size:8px}.grid{gap:12px}.work-group{gap:12px;padding-right:12px}}

.brand-logo{height:62px;min-width:70px;justify-content:center}.brand-logo img{height:34px;max-width:240px;width:auto;object-fit:contain;filter:grayscale(1) brightness(0) invert(.85)}.brand-logo img[src$="rijksmuseum.svg"]{height:25px;max-width:250px}.brand-logo img[src$="microsoft.svg"]{height:34px}.brand-logo img[src$="samsung.svg"]{height:30px;max-width:none}.brand-logo img[src$="feyenoord.svg"],.brand-logo img[src$="etos.svg"],.brand-logo img[src$="postnl.svg"]{height:48px}.brand-logo img[src$="kwf.png"],.brand-logo img[src$="adam-toren.png"]{height:44px}.socials{gap:12px}.socials a{min-width:0;width:48px;height:48px;flex:none;padding:12px;justify-content:center;align-items:center;border-radius:50%}.socials img{display:block;width:22px;height:22px;filter:brightness(0) invert(1)}.socials a:hover{background:var(--accent);border-color:var(--accent)}.socials a:hover img{filter:brightness(0)}@media(max-width:500px){.brand-logo img{max-width:190px}.brand-logo img[src$="rijksmuseum.svg"]{max-width:210px;height:22px}.brand-logo img[src$="samsung.svg"]{height:27px}.socials a{width:44px;height:44px;padding:11px}.socials img{width:20px;height:20px}}

.brand-logo img[src$="feyenoord.svg"],.brand-logo img[src$="duyvis.svg"],.brand-logo img[src$="noise.svg"]{filter:grayscale(1) brightness(1.6)}.brand-logo img[src$="gladderr.png"]{filter:grayscale(1) invert(1);height:48px}

.brand-logo img[src$="duyvis.svg"]{height:40px}.brand-logo img[src$="gladderr.png"]{height:60px}.brand-logo img[src$="modu.png"]{height:44px}.brand-logo img[src$="mediamarkt.svg"]{height:29px;max-width:230px}
