:root{--paper:#f1efe8;--ink:#242522;--muted:#96958f;--ease:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0}html{background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}body{overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;border:0;background:none;cursor:pointer;padding:0}button:focus-visible,a:focus-visible{outline:2px solid currentColor;outline-offset:7px}button:disabled{opacity:.3;cursor:default}[hidden]{display:none!important}::selection{background:var(--ink);color:var(--paper)}
.header{position:fixed;z-index:40;inset:0 0 auto;display:flex;align-items:center;justify-content:space-between;padding:24px 30px;pointer-events:none;transition:color .5s}.header a{pointer-events:auto}.brand{display:flex;align-items:center}.brand img{display:block;width:160px;height:auto;object-fit:contain}.header nav{font-size:16px;font-weight:600;letter-spacing:-.6px}.header nav a{position:relative}.header nav a:after{content:'';position:absolute;left:0;right:0;bottom:-2px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .3s}.header nav a:hover:after,.header nav a.active:after{transform:scaleX(1)}body.full .header{color:var(--paper)}body.full .brand img{filter:invert(1);mix-blend-mode:screen}
.work{position:fixed;inset:0;isolation:isolate;touch-action:none;overflow:hidden}.image-field,.full-field{position:absolute;inset:0;perspective:1200px}.image-field{z-index:2}.tile{position:absolute;left:0;top:0;will-change:transform,opacity;width:100px;height:100px;display:flex;align-items:center;justify-content:center;transform-style:preserve-3d}.tile img{display:block;width:100%;height:100%;object-fit:contain;transition:transform .6s var(--ease);user-select:none;-webkit-user-drag:none}.tile:hover img{transform:scale(1.13)}.tile:focus-visible{outline-offset:4px}.film-tile:after{content:'↗';position:absolute;font-size:16px;bottom:5px;right:5px;color:white;mix-blend-mode:difference}.full-field{z-index:1;opacity:0;background:#22231f;pointer-events:none}
.category-lockup{position:absolute;z-index:8;bottom:28px;left:50%;transform:translateX(-50%);text-align:center;white-space:nowrap;transition:color .6s,opacity .35s}.category-title{display:inline-flex;align-items:flex-start;letter-spacing:-.065em;font-size:clamp(54px,5.1vw,110px);font-weight:600;line-height:1.04}.category-name-out{animation:nameOut .18s both}.category-name-in{animation:nameIn .45s var(--ease) both}@keyframes nameOut{to{opacity:0;transform:translateY(-20px)}}@keyframes nameIn{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}body.full .category-lockup,body.full .view-switch,body.full .scroll-hint,body.full .category-nav{color:var(--paper)}.view-switch{position:absolute;bottom:27px;right:30px;z-index:12;display:flex;gap:20px;align-items:center;transition:color .6s}.view-button{width:26px;height:27px;opacity:.25;transition:opacity .3s,transform .3s;display:grid;place-items:center}.view-button.active,.view-button:hover{opacity:1}.view-button:hover{transform:translateY(-2px)}.view-button svg{width:23px;height:23px;fill:currentColor}.scroll-hint{position:absolute;z-index:8;bottom:29px;left:30px;font-size:11px;letter-spacing:-.2px;opacity:.65;transition:opacity 1s,color .6s}.scroll-hint span{margin-left:10px}.category-nav{position:absolute;left:50%;bottom:13px;transform:translateX(-50%);display:none;gap:12px;z-index:14}.category-nav button{height:16px;width:16px;display:grid;place-items:center}.category-nav button:after{content:'';width:4px;height:4px;border-radius:50%;background:currentColor;opacity:.25;transition:opacity .3s}.category-nav button.selected:after{opacity:1}
.panel{position:fixed;inset:0;z-index:20;background:var(--paper);overflow-y:auto;overscroll-behavior:contain}.about{display:grid;grid-template-columns:44% 56%}.about-image{height:100dvh;position:sticky;top:0;display:grid;align-content:center;background:#e7e3da}.about-image img{display:block;max-width:100%;max-height:100dvh;width:100%;object-fit:contain}.about-copy{min-height:100dvh;padding:15.5vh 7vw 30px 6.5vw;display:flex;flex-direction:column}.about h1{font-size:16px;line-height:1.5;font-weight:600;letter-spacing:-.6px;margin:0;text-decoration:underline;text-underline-offset:3px}.about-statement{font-size:clamp(26px,2.5vw,52px);font-weight:600;line-height:1.18;letter-spacing:-.05em;margin:14vh 0 20px}.about-detail{font-size:16px;line-height:1.5;letter-spacing:-.3px;max-width:490px;margin:0;color:#65655f}.contact-links{display:grid;grid-template-columns:115px 1fr;gap:6px 20px;margin:12vh 0 24px;font-size:14px;line-height:1.35;font-weight:600;letter-spacing:-.4px}.contact-links dt,.contact-links dd{margin:0}.contact-links a:hover{text-decoration:underline;text-underline-offset:3px}.about-return{font-size:14px;text-decoration:underline;text-underline-offset:4px;align-self:flex-start;margin:24px 0 60px}footer{display:flex;justify-content:space-between;margin-top:auto;font-size:10px;color:#797971}
.gallery{overflow:hidden}.gallery-meta{position:absolute;top:50%;left:30px;display:flex;align-items:center;gap:12px;font-size:14px;z-index:3;letter-spacing:-.5px}.gallery-meta>span:first-child{color:#96968e}.gallery-meta h1{font-size:14px;margin:0;font-weight:600}.gallery-stage{position:absolute;left:19%;right:15%;top:10%;bottom:12%;display:grid;place-items:center;touch-action:pan-y;perspective:1000px}.gallery-slide{position:absolute;inset:0;display:grid;place-items:center}.gallery-slide img,.gallery-slide video{display:block;max-width:100%;max-height:100%;width:100%;height:100%;object-fit:contain}.gallery-caption{position:absolute;left:19%;bottom:7%;font-size:11px;color:#75756e;max-width:60%;line-height:1.4}.gallery-controls{display:flex;gap:25px;position:absolute;left:30px;bottom:30px;z-index:4}.gallery-controls button{font-size:25px;width:36px;height:36px;transition:transform .3s}.gallery-controls button:hover{transform:translateX(4px)}.thumbnail-rail{position:absolute;inset:0;width:100%;height:100%;overflow-y:auto;overflow-x:hidden;scrollbar-width:none;display:flex;flex-direction:column;gap:8px;padding:calc(35dvh - 26px) 5px;touch-action:pan-y;overscroll-behavior-y:contain;scroll-snap-type:y mandatory;user-select:none;-webkit-user-select:none}.thumbnail-rail::-webkit-scrollbar{display:none}.thumbnail-rail button{width:62px;min-height:52px;height:52px;opacity:.38;transition:opacity .4s;flex-shrink:0;position:relative;scroll-snap-align:center}.thumbnail-rail button.active,.thumbnail-rail button:hover{opacity:1}.thumbnail-rail img{width:100%;height:100%;object-fit:contain;display:block}.thumbnail-rail .video-thumb{background:#dad7ce;display:grid;place-items:center;height:100%;font-size:12px;letter-spacing:1px}.gallery-enquiry{position:absolute;right:30px;bottom:35px;font-size:12px;text-decoration:underline;text-underline-offset:4px}
.page-wipe{position:fixed;inset:0;background:var(--paper);z-index:35;pointer-events:none;transform:translateY(102%)}.page-wipe.running{animation:wipe 1.05s var(--ease) both}@keyframes wipe{0%{transform:translateY(102%)}45%,55%{transform:translateY(0)}100%{transform:translateY(-102%)}}.sr-only,.skip-link{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link:focus{position:fixed;top:90px;left:30px;padding:12px;width:auto;height:auto;clip:auto;z-index:200;background:var(--paper)}
.thumbnail-strip{position:absolute;right:4.5%;width:72px;top:15%;bottom:15%}.thumbnail-selection{position:absolute;left:50%;top:50%;width:68px;height:58px;transform:translate(-50%,-50%);border:1px solid #b3b1a7;pointer-events:none}

@media(max-width:700px){.header{padding:19px 20px}.brand img{width:140px;height:auto}.header nav{font-size:14px}.category-lockup{bottom:77px}.category-title{font-size:clamp(36px,10vw,68px);letter-spacing:-.065em}.view-switch{bottom:32px;right:auto;left:50%;transform:translateX(-50%);gap:19px}.view-button{width:22px;height:22px}.view-button svg{width:19px;height:19px}.scroll-hint{font-size:9px;left:20px;bottom:17px}.category-nav{display:flex;left:auto;right:14px;transform:none;bottom:9px;gap:3px}.about{display:flex;flex-direction:column}.about-copy{order:0;min-height:100dvh;padding:125px 24px 20px}.about h1{font-size:13px}.about-statement{font-size:29px;letter-spacing:-1.2px;margin:90px 0 22px}.about-detail{font-size:14px;max-width:100%}.contact-links{font-size:12px;grid-template-columns:85px 1fr;gap:7px 8px;margin:65px 0 8px}.about-return{font-size:12px;margin:28px 0 50px}.about-image{order:1;height:auto;position:relative;padding:0}.about-image img{max-height:none;height:auto}.gallery-meta{top:100px;left:20px;gap:10px;font-size:12px}.gallery-meta h1{font-size:12px}.gallery-stage{left:20px;right:20px;top:19%;bottom:24%}.gallery-caption{left:20px;bottom:19%;font-size:10px;max-width:90%}.thumbnail-strip{left:20px;right:20px;top:auto;bottom:80px;width:auto;height:53px}.thumbnail-rail{inset:0;width:auto;height:100%;flex-direction:row;gap:8px;padding:4px calc(50% - 24px);overflow-x:auto;overflow-y:hidden;touch-action:pan-x;overscroll-behavior-x:contain;overscroll-behavior-y:auto;scroll-snap-type:x mandatory;user-select:none;-webkit-user-select:none}.thumbnail-rail button{width:48px;min-height:42px;height:42px;scroll-snap-align:center}.thumbnail-selection{display:block;position:absolute;left:50%;top:1px;width:54px;height:48px;transform:translateX(-50%);border:1px solid #b3b1a7;pointer-events:none}.gallery-controls{left:16px;bottom:22px;gap:15px}.gallery-enquiry{font-size:11px;right:20px;bottom:36px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}.intro{display:none}}

/* Keep portrait media within the gallery's available frame. */
/* The gallery lifts as one shaded sheet while the grid settles underneath. */
.route-sheet{z-index:30;background:var(--paper);will-change:transform;pointer-events:none;overflow:hidden}
.route-shade{position:fixed;inset:0;z-index:31;background:#000;pointer-events:none;will-change:transform,opacity}
body.work-returning .category-lockup,body.work-returning .view-switch,body.work-returning .category-nav,body.work-returning .scroll-hint{will-change:transform,opacity;transition:none}
body.work-returning .tile,body.work-returning .tile img,body.about-entering .tile,body.about-entering .tile img{transition:none!important}
body.work-returning .tile img,body.about-entering .tile img{transform:none!important}
.about-line{display:block;overflow:hidden}
.about-line-content{display:block;white-space:pre}
.about{scrollbar-gutter:stable}
/* Keep the mobile text section stable as browser bars open and close. */
@media(max-width:700px){.about-copy{min-height:100svh;flex-shrink:0}.about-image{flex-shrink:0}}
body.about-entering .about-line-content{will-change:transform}
body.about-entering .header{color:var(--ink)}
.gallery-slide{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr)}
.gallery-slide img,.gallery-slide video{min-height:0;min-width:0}
body.full .brand img{filter:invert(1);mix-blend-mode:normal}body.full:has(.work[hidden]) .brand img{filter:none}

/* The portrait stays beside the copy until the closing section takes over. */
.about{display:block;scrollbar-gutter:auto;scroll-behavior:auto}
.about-profile{display:grid;grid-template-columns:44% 56%;align-items:start}
.about-image{height:100svh;position:sticky;top:0;padding:0;background:#e8e6e0;overflow:hidden}
.about-image img{width:100%;height:100%;max-height:none;object-fit:contain}
.about-copy{display:block;min-height:100svh;padding:14vh 6.5vw 16vh}
.about h1{font-size:16px;line-height:1.4;letter-spacing:-.5px}
.about-statement{font-size:clamp(25px,2.6vw,46px);line-height:1.18;letter-spacing:-.05em;margin:11vh 0 24px}
.about-detail{font-size:15px;line-height:1.45;max-width:470px;color:var(--ink)}
.contact-links{grid-template-columns:90px minmax(0,1fr);gap:4px 12px;margin:10vh 0 0;font-size:14px;line-height:1.4}
.contact-links dd{min-width:0;overflow-wrap:anywhere}
.about-services{margin-top:19vh}
.about-services h2{font-size:14px;line-height:1.4;letter-spacing:-.4px;text-decoration:underline;text-underline-offset:3px;margin:0 0 32px;font-weight:600}
.services-list{display:grid;grid-template-columns:52px minmax(0,1fr);gap:14px 24px;font-size:clamp(14px,1.2vw,18px);line-height:1.35;font-weight:600;letter-spacing:-.4px;margin:0}
.services-list dt,.services-list dd{margin:0}
.services-list dt{font-variant-numeric:tabular-nums}
.services-list dd span{display:block;font-size:.85em;font-weight:400;letter-spacing:-.2px;margin-top:4px}
/* Native scrolling drives a pinned closing scene. Only the photo's transform changes. */
.about-closing{display:block;position:relative;height:250svh;margin:0;color:var(--ink);background:var(--paper);font-size:14px}
.closing-stage{position:sticky;top:0;height:100svh;overflow:hidden;isolation:isolate}
.closing-word{position:absolute;left:1.5%;right:1.5%;top:72px;font-size:min(12.75vw,22svh);line-height:.9;font-weight:800;letter-spacing:-.075em;white-space:nowrap;text-align:center;padding-right:.04em}
.closing-photo{position:absolute;left:50%;top:56%;width:min(58vw,70svh);max-width:850px;transform:translate(-50%,-50%) scale(var(--closing-scale,.18));transform-origin:center;will-change:transform}
.closing-photo img{display:block;width:100%;height:auto}
.closing-register{position:absolute;top:50%;width:16px;height:16px;transform:translate(-50%,-50%)}
.closing-register-left{left:17%}.closing-register-right{left:83%}
.closing-register:before,.closing-register:after{content:'';position:absolute;left:50%;top:50%;width:11px;height:1px;background:currentColor;transform:translate(-50%,-50%)}
.closing-register:after{transform:translate(-50%,-50%) rotate(90deg)}
.closing-bottom{position:absolute;bottom:max(24px,env(safe-area-inset-bottom));left:30px;right:30px;display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:20px;font-weight:600;letter-spacing:-.4px}
.closing-bottom .about-return{grid-column:2;font-size:14px;line-height:1.4;margin:0;align-self:end;text-decoration:underline;text-underline-offset:4px}
.closing-counter{justify-self:end;font-size:32px;line-height:1;letter-spacing:-1.7px;font-variant-numeric:tabular-nums}
@media(max-width:700px){
  .about-profile{display:block}
  .about-image{position:relative;height:auto;background:#e8e6e0}
  .about-image img{height:auto;max-height:none}
  .about-copy{padding:72px 24px 100px;min-height:0}
  .about h1{font-size:14px}
  .about-statement{font-size:29px;letter-spacing:-1.2px;margin:65px 0 22px}
  .about-detail{font-size:14px}
  .contact-links{margin-top:65px;font-size:12px;grid-template-columns:77px minmax(0,1fr);gap:6px 8px}
  .about-services{margin-top:110px}
  .services-list{font-size:14px;grid-template-columns:32px minmax(0,1fr);gap:15px 16px}
  .closing-word{top:82px;font-size:12.3vw;left:3%;right:3%}
  .closing-photo{width:min(74vw,78svh);top:51%}
  .closing-register-left{left:8%}.closing-register-right{left:92%}
  .closing-register:before,.closing-register:after{width:9px}
  .closing-bottom{left:20px;right:20px;gap:12px;grid-template-columns:1fr auto}
  .closing-bottom .about-return{grid-column:1;grid-row:1;font-size:13px;justify-self:start}
  .closing-counter{grid-column:2;grid-row:1 / 3}
}
@media(prefers-reduced-motion:reduce){
  .about-closing{height:100svh}
  .closing-photo{transform:translate(-50%,-50%);will-change:auto}
  .closing-counter{display:none}
}

/* One image field morphs between both views; all color follows its timeline. */

.image-field{perspective:1400px;perspective-origin:50% 45%}
.tile{backface-visibility:hidden}
.grid-sector{display:contents}
/* The mobile grid composites whole galleries; thumbnails stay flat and still. */
.mobile-grid{perspective:none}
.mobile-grid .grid-sector{display:block;position:absolute;inset:0;will-change:transform,opacity;contain:layout style;pointer-events:none}
.mobile-grid .tile{will-change:auto;transform-style:flat;backface-visibility:visible;pointer-events:auto}
.strip-tile{transform-origin:center}
.strip-tile img{object-fit:cover;flex-shrink:0}
.mobile-morph .strip-tile img{will-change:transform}
.filmstrip-surface{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}
/* Screen-space side shading follows the reference's wider, soft vignette.
   Keep it separate from the very narrow downward bend and above all covers. */
.strip-vignette{position:absolute;inset:0;z-index:4;pointer-events:none;opacity:0;will-change:opacity;background:linear-gradient(90deg,rgba(0,0,0,.8) 0%,rgba(0,0,0,.741) 5%,rgba(0,0,0,.593) 10%,rgba(0,0,0,.4) 15%,rgba(0,0,0,.207) 20%,rgba(0,0,0,.059) 25%,transparent 30%,transparent 70%,rgba(0,0,0,.059) 75%,rgba(0,0,0,.207) 80%,rgba(0,0,0,.4) 85%,rgba(0,0,0,.593) 90%,rgba(0,0,0,.741) 95%,rgba(0,0,0,.8) 100%)}
.curved-strip .strip-tile img{opacity:var(--strip-dom-opacity,0)}
body .header,body.full .header,.category-lockup,body.full .category-lockup,.view-switch,body.full .view-switch,.scroll-hint,body.full .scroll-hint,.category-nav,body.full .category-nav{color:var(--view-ink,var(--ink));transition-property:opacity}
body:has(.work[hidden]) .header{color:var(--ink)}
.tile img{transition:none}
.tile:hover img{transform:none}
@media(hover:hover) and (pointer:fine){body:not(.full):not(.view-changing) .tile img{transition:transform .6s var(--ease)}body:not(.full):not(.view-changing) .tile:hover img{transform:scale(1.13)}}
body.full .film-tile:after{bottom:12px;right:12px}

/* The opening photo grows while its sheet lifts; the gallery unwinds underneath. */
.intro{position:fixed;inset:0;z-index:100;background:#e8e5dd;overflow:hidden;pointer-events:auto;will-change:transform,clip-path}
.intro-word{position:absolute;z-index:2;left:1.5%;right:1.5%;top:1.5%;display:flex;justify-content:space-between;align-items:flex-start;font-size:14.1vw;line-height:.9;font-weight:800;letter-spacing:-.075em;white-space:nowrap;animation:none;padding:0;max-width:none}
.intro-letter{display:block;overflow:hidden;height:.97em;opacity:0;padding-right:.04em;margin-right:-.04em}
.intro-reel{display:flex;flex-direction:column;will-change:transform}
.intro-reel>span{display:block;height:.97em;line-height:.9;flex-shrink:0}
.intro-space{width:.16em;flex-shrink:0}
.intro-photo{position:absolute;left:50%;top:22%;height:56%;aspect-ratio:1997/3000;max-width:76vw;transform:translateX(-50%);transform-origin:center;opacity:0;will-change:transform}
.intro-photo img{width:100%;height:100%;display:block;object-fit:contain;transform:scale(var(--photo-reveal,1.06))}
.intro-register{position:absolute;top:50%;width:20px;height:20px;transform:translate(-50%,-50%)}
.intro-register-left{left:17%}.intro-register-right{left:83%}
.intro-register:before,.intro-register:after{content:'';position:absolute;left:50%;top:50%;width:15px;height:1px;background:var(--ink);transform:translate(-50%,-50%)}
.intro-register:after{transform:translate(-50%,-50%) rotate(90deg)}
.intro-bottom{position:absolute;z-index:3;bottom:max(26px,env(safe-area-inset-bottom));left:1.7%;right:1.7%;display:grid;grid-template-columns:1fr 1.4fr 1fr;align-items:end;gap:30px;font-size:14px;font-weight:600;line-height:1.25;letter-spacing:-.45px;animation:introDetails .45s .15s backwards}
.intro-bottom p{margin:0}.intro-description{text-align:center;max-width:550px;justify-self:center}
.intro-bottom>span{font-size:48px;line-height:1;letter-spacing:-3px;font-variant-numeric:tabular-nums;justify-self:end}
@keyframes introDetails{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
body.introducing .header{opacity:0;pointer-events:none}
body.introducing .view-switch,body.introducing .category-nav,body.introducing .scroll-hint{opacity:var(--intro-ui,0)}
body.introducing .category-lockup{opacity:0;transition:none}
body.introducing .tile,body.introducing .header,body.introducing .view-switch,body.introducing .category-nav,body.introducing .scroll-hint{transition:none}
body.introducing .tile img{transition:none!important;transform:none!important}
body.introducing.intro-exiting .header{opacity:1}
@media(max-width:700px){
  .intro-word{top:20px;left:4%;right:4%;font-size:13.25vw;line-height:.9}
  .intro-photo{top:22%;height:52%;max-width:74vw}
  .intro-register-left{left:8%}.intro-register-right{left:92%}
  .intro-register:before,.intro-register:after{width:10px}
  .intro-bottom{left:20px;right:20px;bottom:max(24px,env(safe-area-inset-bottom));grid-template-columns:1fr auto;gap:18px;font-size:11px;letter-spacing:-.2px}
  .intro-bottom .intro-description{grid-column:1;grid-row:1;text-align:left;justify-self:start;max-width:215px;font-size:12px}
  .intro-location{grid-column:1;grid-row:2;color:#72716b}
  .intro-bottom>span{grid-column:2;grid-row:1 / 3;font-size:42px;letter-spacing:-2px}
}
@media(prefers-reduced-motion:reduce){.intro{display:none}body.introducing .header{opacity:1}}

/* Long titles on direct-link galleries stay clear of the main photograph. */
/* JavaScript settles the strip once input stops. Native snap must not compete
   with centering or re-snap when hover opacity changes a thumbnail layer. */
.thumbnail-rail{scroll-snap-type:none;overflow-anchor:none}
.gallery[data-unlisted] .gallery-meta{max-width:calc(19vw - 50px);flex-direction:column;align-items:flex-start;gap:8px}
.gallery[data-unlisted] .gallery-meta h1{line-height:1.45}
@media(max-width:700px){
  .gallery[data-unlisted] .gallery-meta{max-width:calc(100% - 40px);flex-direction:row;gap:10px}
  .gallery[data-unlisted] .gallery-meta h1{max-width:calc(100vw - 130px);line-height:1.35}
  .gallery[data-unlisted] .gallery-caption{bottom:max(19%,145px)}
}