body{background:var(--site-bg);color:var(--paper)}.case{--title-size: clamp(2.75rem, 15vw, 5.5rem);--section-gap: clamp(5rem, 16.5vw, 15rem);padding:var(--header-h) var(--gutter) 0}@media(max-width:47.99em){html:not(.js) .case{padding-top:0}}.case-title,.case-next__name{font:400 var(--title-size)/1 var(--grotesk);letter-spacing:-0.04em}.case-title .mask{display:block;overflow:hidden;padding:0.06em 0 0.16em;margin:-0.06em 0 -0.16em}.case-title .line{display:block;will-change:transform}.case-facts,.case-label,.case-next__label,.case-werk__soort,.case-werk__feiten,.case-bij{font:400 0.75rem/1.25 var(--grotesk);letter-spacing:0.01em;text-transform:uppercase}.case-label{overflow:hidden}.case-label__in{display:block}.case-hero{display:flex;flex-direction:column;padding-top:2.25rem}.case-title{margin-top:1.5rem}.case-facts{order:1;margin-top:1.5rem}.case-hero__media{order:-1}.case-hero__frame{overflow:hidden;aspect-ratio:2000 / 1147;background:rgb(245 244 242 / 0.08)}.case-hero__frame picture{display:block;width:100%;height:100%}.case-hero__frame img{width:100%;height:100%;object-fit:cover;object-position:50% 0}.case-facts li{padding-block:0.5rem;border-top:1px solid var(--line)}@media(min-width:48em)and (max-width:61.99em){.case-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--col-gap)}}.case-text{margin-top:clamp(3.5rem,10vw,9rem);font-size:clamp(1.5rem,2.78vw,3rem);line-height:1.2;letter-spacing:-0.04em}.case-text .mask{display:block;overflow:hidden}.case-text .line{display:block}.anim .case-title .line{transform:translateY(110%)}.anim :is(.case-hero__frame,.case-show__beeld){clip-path:inset(100% 0% 0% 0%)}.anim :is(.case-facts,.case-werk__soort,.case-werk__feiten,.case-werk__terug,.case-werk .case-text){opacity:0}@media(min-width:62em){.case{--title-size: min(8vw, 14vh)}.case-hero{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:minmax(0,1fr) auto auto;column-gap:var(--col-gap);height:calc(100svh - var(--header-h));min-height:34rem;padding:clamp(1.5rem,6vh,4.5rem) 0 clamp(1.5rem,5vh,3.5rem)}.case-title{grid-column:1 / -1;grid-row:2;margin-top:clamp(1rem,3vh,2rem)}.case-facts{grid-column:1 / 5;grid-row:3;margin-top:clamp(1rem,3vh,2rem)}.case-facts li:last-child{padding-bottom:0}.case-hero__media{grid-column:5 / -1;grid-row:1;container-type:size;min-height:0;display:flex;align-items:flex-end;justify-content:flex-end}.case-hero__frame{flex:none;width:min(100cqw,174.34cqh)}.case-text{margin-left:calc((100% + var(--col-gap)) / 12 * var(--text-skip, 4))}}.case-rows{--row-h: min(66vw, 26rem);margin:var(--section-gap) calc(var(--gutter) * -1) 0}.case-rows__pin{padding-inline:var(--gutter)}.case-rows .case-label{margin-bottom:1rem}.case-rows__row{display:flex;gap:0.5rem;margin-inline:calc(var(--gutter) * -1);padding-inline:var(--gutter);overflow-x:auto;scrollbar-width:none}.case-rows__row::-webkit-scrollbar{display:none}.case-rows__row+.case-rows__row{margin-top:0.5rem}.case-rows__img{flex:none;height:var(--row-h);aspect-ratio:2 / 3;overflow:hidden;background:rgb(245 244 242 / 0.08)}.case-rows__img picture{display:block;width:100%;height:100%}.case-rows__img img{width:100%;height:100%;object-fit:cover}.case-rows.is-moving .case-rows__pin{overflow:hidden}.case-rows.is-moving .case-rows__row{width:max-content;margin-inline:0;padding-inline:0;overflow:visible;will-change:transform}@media(min-width:62em){.case-rows{--row-h: min(24.6vw, calc((100svh - var(--header-h) - 6rem) / 2))}.case-rows.is-pinned .case-rows__pin{position:sticky;top:var(--header-h);height:calc(100svh - var(--header-h));display:flex;flex-direction:column;justify-content:center}}.case-screens{display:grid;row-gap:2.5rem;margin-top:var(--section-gap)}.case-screen{margin:0}.case-screen .case-label{padding-bottom:0.75rem}.case-screen__img{overflow:hidden;background:rgb(245 244 242 / 0.08)}.case-screen__img img{width:100%;height:auto}@media(min-width:62em){.case-screens{display:block}.case-screen{position:sticky;top:var(--header-h);width:min(100%,calc((100svh - var(--header-h) - 2.5rem) * 1.7434));margin-left:auto;padding-top:0.75rem;background:var(--site-bg)}.case-screen+.case-screen{margin-top:18vh}}.case-phones{display:flex;align-items:flex-start;justify-content:center;gap:3.5%;margin:var(--section-gap) calc(var(--gutter) * -1) 0;padding:9% 5% 11%;overflow:hidden;background:var(--phones-bg)}.case-phones__phone{flex:1 1 0;min-width:0;max-width:20%;overflow:hidden;border-radius:12% / 5.5%;box-shadow:0 1.5vw 3.5vw var(--phones-shadow)}.case-phones__phone img{width:100%;height:auto}@media(min-width:48em){.case-phones__phone:nth-child(even){margin-top:5%;margin-bottom:-5%}}.case-next{display:grid;row-gap:clamp(5rem,14vw,12rem);margin-inline:calc(var(--gutter) * -1);padding:1.25rem var(--gutter) var(--gutter);border-top:1px solid var(--line);color:var(--paper);text-decoration:none}.case-next__name{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--col-gap)}.case-next__name>span{transition:transform 0.6s var(--ease)}.case-next__arrow{flex:none;width:0.8em;height:0.8em;margin-bottom:0.08em}@media(hover:hover)and (prefers-reduced-motion:no-preference){.case-next:hover .case-next__name>span{transform:translateX(0.12em)}}@media(max-width:47.99em){.case:has(.case-phones){display:flex;flex-direction:column}.case-phones{order:4}.case-screens{order:5}.case-next{order:6;margin-top:var(--section-gap)}.case-hero:not(.case-hero--portrait) .case-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--col-gap)}.case-hero:not(.case-hero--portrait) .case-facts li:first-child{grid-column:1 / -1}.case-hero:not(.case-hero--portrait) .case-hero__frame{margin-inline:calc(var(--gutter) * -1);aspect-ratio:4 / 5}.case-phones{justify-content:flex-start;gap:0.75rem;padding:2.5rem var(--gutter);overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gutter);scrollbar-width:none}.case-phones::-webkit-scrollbar{display:none}.case-phones__phone{flex:none;width:70vw;max-width:none;scroll-snap-align:start;border-radius:2rem;box-shadow:0 0.75rem 2rem var(--phones-shadow)}.case-screens{margin-inline:calc(var(--gutter) * -1);row-gap:3rem}.case-screen .case-label{padding-inline:var(--gutter)}.case-screen__img{aspect-ratio:4 / 5}.case-screen__img picture{display:block;width:100%;height:100%}.case-screen__img img{height:100%;object-fit:cover;object-position:50% 0}}.case-rows--natural .case-rows__img{aspect-ratio:var(--ar)}@media(max-width:61.99em){.case-rows--natural{--row-h: min(46vw, 20rem)}}@media(min-width:62em){.case:is([data-motion=tide],[data-motion=dusk],[data-motion=lens]) .case-screen{position:static;padding-top:0}.case:is([data-motion=tide],[data-motion=dusk],[data-motion=lens]) .case-screen+.case-screen{margin-top:clamp(6rem,12vw,12rem)}}.anim .case[data-motion=tide] :is(.case-hero__frame,.case-show__beeld){clip-path:inset(0% 100% 0% 0%)}.anim .case[data-motion=dusk] :is(.case-hero__frame,.case-show__beeld){clip-path:inset(0% 50% 0% 50%)}.anim .case[data-motion=lens] :is(.case-hero__frame,.case-show__beeld){clip-path:inset(14% 14% 14% 14%);opacity:0}.anim .case[data-motion=dawn] :is(.case-hero__frame,.case-show__beeld){clip-path:inset(0% 0% 100% 0%)}.case-werk{--werk-top: clamp(1.5rem, 4vh, 3rem);--stuk: clamp(4.5rem, 9vw, 8rem);--tel-gap: clamp(1rem, 2.2vw, 2.5rem);margin-top:var(--werk-top);counter-reset:stuk}.case-werk+.case-next{margin-top:var(--section-gap)}.case-werk__kop{margin-bottom:1.5rem}.case-werk .case-title{margin-top:0.5rem}.case-werk__feiten{display:flex;flex-wrap:wrap;gap:0.25rem 1.5rem;margin-top:1rem}.case-werk .case-text{max-width:36rem;margin:0;font-size:clamp(1.125rem,2.3vw,1.25rem);line-height:1.35;letter-spacing:-0.01em}.case-werk__beeld{display:flex;flex-direction:column;row-gap:var(--stuk);margin-top:clamp(2.5rem,7vw,4rem)}.case-bij{margin:0;padding-top:0.875rem}.case-bij::before{content:counter(stuk,decimal-leading-zero) ".";counter-increment:stuk;margin-right:1rem}.case-show{--show-ar: 3 / 2;margin:0}.case-show--heel{--show-ar: 16 / 9}.case-show__beeld{display:grid;gap:0.5rem}.case-show__dia{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);aspect-ratio:var(--show-ar);margin:0;background:var(--site-bg)}.case-show__dia picture{display:block;min-width:0;overflow:hidden;background:rgb(245 244 242 / 0.08)}.case-show__dia img{width:100%;height:100%;object-fit:cover}.case-show--heel .case-show__dia picture{background:none}.case-show--heel .case-show__dia img{object-fit:contain}.js .case-show__beeld{grid-template-areas:"dia";touch-action:pan-y}.js .case-show__dia{grid-area:dia;visibility:hidden}.js .case-show__dia:is(.is-nu,.is-weg){visibility:visible}.js .case-show__dia.is-nu{z-index:1}.case-show__onder{display:flex;align-items:center;justify-content:space-between;gap:var(--col-gap);padding-top:calc(0.875rem - 0.28125rem)}.case-show__onder .case-bij{padding:0}.case-show__knoppen{display:flex;align-items:center;gap:1rem}.case-show__knoppen[hidden],.case-show__knop[hidden]{display:none}.case-show__knop{display:inline-flex;align-items:center;justify-content:center;min-width:1.5rem;min-height:1.5rem;padding:0;border:0;color:inherit;font:400 0.75rem/1.25 var(--grotesk);letter-spacing:0.01em;text-transform:uppercase;cursor:pointer;background:linear-gradient(currentColor,currentColor) 0 calc(100% - 0.125rem) / 0 1px no-repeat;transition:background-size 0.35s var(--ease)}.case-show__knop:hover{background-size:100% 1px}.case-show__knop svg{width:0.875rem;height:0.875rem;transition:transform 0.35s var(--ease)}.case-show__knop:has(svg){background:none}@media(hover:hover)and (prefers-reduced-motion:no-preference){.case-show__knop[data-show=vorige]:hover svg{transform:translateX(-0.125rem)}.case-show__knop[data-show=volgende]:hover svg{transform:translateX(0.125rem)}}.case-werk .case-screens{display:grid;row-gap:var(--stuk);margin:0}.case-werk :is(.case-screen__img,.case-phones__phone){position:relative}.case-werk :is(.case-screen__img,.case-phones__phone)::after{content:"";position:absolute;inset:0;border:1px solid var(--line);pointer-events:none}.case-werk .case-phones{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--tel-gap);margin:0;padding:0;overflow:visible;background:none}.case-werk .case-phones__phone{width:auto;max-width:none;margin:0;border-radius:0;box-shadow:none}.case-werk .case-phones .case-bij{grid-column:1 / -1;margin-top:calc(0.875rem - var(--tel-gap));padding-top:0}.anim :is(.case-werk .case-screen__img,.case-werk .case-phones__phone){clip-path:inset(100% 0% 0% 0%)}.case-werk__terug{display:inline-flex;align-items:center;gap:0.5rem;margin-top:1.75rem;padding-block:0.375rem;font:400 0.75rem/1 var(--grotesk);letter-spacing:0.01em;text-transform:uppercase;text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 calc(100% - 0.125rem) / 0 1px no-repeat;transition:background-size 0.35s var(--ease)}.case-werk__terug:hover{background-size:100% 1px}.case-werk__terug svg{flex:none;width:0.875rem;height:0.875rem}.case-werk__site{margin-left:1.5rem}.case-werk__terug{vertical-align:middle}.case-werk__site svg{width:0.75rem;height:0.75rem}@media(min-width:62em){.case-werk{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--col-gap)}.case-werk__tekst{grid-column:1 / 4}.case-werk__plak{padding-top:clamp(1.5rem,6vh,4rem);text-align:right}.case-werk__kop{margin-bottom:clamp(2.5rem,9vh,5.5rem)}.case-werk .case-title{--title-size: clamp(1.75rem, 2.9vw, 3rem);line-height:1.05}.case-werk__feiten{justify-content:flex-end;margin-top:1.25rem}.case-werk .case-text{margin-left:auto;font-size:clamp(0.9375rem,1.11vw,1.125rem);line-height:1.4}.case-werk__beeld{grid-column:5 / -1;margin-top:0}.case .case-werk .case-screen{position:static;width:100%;margin:0;padding:0;background:none}.case .case-werk .case-screen+.case-screen{margin-top:0}}@media(min-width:62em){.case-werk__plak{position:sticky;top:calc(var(--header-h) + var(--werk-top))}.case-werk__plak.is-los{position:static}}@media(max-width:47.99em){.case-werk{--stuk: 5.5rem;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0.5rem;margin:0 calc(var(--gutter) * -1)}.case-werk__beeld{display:contents}.case-werk__tekst{grid-column:1 / -1;padding:1.5rem var(--gutter) 2rem}.case-show{grid-column:1 / -1;order:-1;min-width:0}.case-show__onder{padding-inline:var(--gutter)}.case-werk .case-screens,.case-werk .case-phones{grid-column:1 / -1;min-width:0;margin-inline:0}.case-bij{padding-inline:var(--gutter)}.case-werk .case-screens{order:2;margin-top:calc(var(--stuk) - 0.5rem)}.case-werk .case-screen__img{aspect-ratio:auto}.case-werk .case-screen__img img{height:auto;object-fit:fill}.case-werk .case-phones{order:3;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:calc(var(--stuk) - 0.5rem);padding:0 var(--gutter);scroll-snap-type:none}.case-werk .case-phones .case-bij{padding-inline:0}}