@font-face{font-family:Frame;src:url('assets/dm-sans.woff2');font-weight:400 800;font-display:swap}
/* The display face keeps the brand, while readable text has complete descenders. */
h1,h2,h3{font-family:Frame,Urbanist,sans-serif;line-height:1.13;letter-spacing:-.065em;overflow:visible;padding-block:.035em}
.hero h1{font-family:Frame,Urbanist,sans-serif;line-height:1.12;font-weight:500;letter-spacing:-.065em}
.hero h1 span,.hero h1 em{overflow:visible;padding-bottom:.025em}
.hero-message{top:26%}.hero-bottom>span{line-height:1.03;padding-block:.035em;overflow:visible}
.menu-dialog nav a{font-family:Frame,Urbanist,sans-serif;font-weight:500;line-height:1.25;padding:18px 0;overflow:visible;letter-spacing:-.055em}
.menu-dialog nav{overflow:visible}.menu-dialog nav small{flex-shrink:0;margin-left:15px}
.brief-art>span{font-family:Frame,Urbanist,sans-serif;line-height:1.18}
.footer-brand{line-height:1.12;padding-block:.035em}
.gallery-title h1{line-height:1.15}.detail-layout>aside h2,.confirmation-dialog h2{line-height:1.16}
.project-side{overflow:visible}.project-side figure{margin-bottom:34px}.project-side figcaption{line-height:1.5}
.project-photo-label{z-index:6;line-height:1.5}.project-main>img{transition:transform .55s var(--ease-out)}
.hero-shade{z-index:1}.hero-top,.hero-message,.hero-bottom,.viewfinder,.frame-caption{z-index:4}
.photo-iris{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;overflow:hidden;contain:paint}
.photo-iris polygon{fill:#191916;stroke:#4e4e45;stroke-width:.6;transform-box:view-box;transform-origin:500px 500px}
.lightbox-stage{position:relative;overflow:hidden}.lightbox-stage>button{position:relative;z-index:4}
.lens-story{background:#12130f;color:#f2f0e8;position:relative}
.lens-sticky{position:relative;padding:70px 5vw 45px}
.lens-heading{display:flex;justify-content:space-between;align-items:start;gap:30px;margin-bottom:35px;font-size:10px;letter-spacing:1.9px;line-height:1.6}
.lens-heading>span:last-child{text-align:right;color:#c6c4b4}
.lens-photo{margin:0 0 45px;position:relative}
.lens-image-mask{position:relative;height:80svh;min-height:460px;overflow:hidden;background:#12130f}
.lens-image-mask img{width:100%;height:100%;object-fit:cover;object-position:50% 60%}
.lens-photo:nth-child(2) .lens-image-mask img{object-position:50% 59%}
.lens-caption{padding-top:24px;max-width:1000px}
.lens-caption .eyebrow{font-size:9px;letter-spacing:2px;color:#e2dac9}
.lens-caption h2{font-size:clamp(48px,6.5vw,105px);font-weight:500;margin-top:13px;color:#fff;line-height:1.15}
.lens-caption p:last-child{font-size:14px;color:#eeece0;line-height:1.55;max-width:360px;margin-top:15px}
.lens-optics,.lens-scale,.lens-progress{display:none}
.lens-story.motion-ready{height:320svh;min-height:2100px}
.motion-ready .lens-sticky{height:100svh;min-height:640px;position:sticky;top:0;padding:0;overflow:hidden;isolation:isolate}
.motion-ready .lens-heading{position:absolute;left:5vw;right:5vw;top:115px;z-index:20;margin:0;color:#fff;text-shadow:0 1px 12px #0009}
.motion-ready .lens-photo{position:absolute;inset:0;margin:0;pointer-events:none}
.motion-ready .lens-image-mask{position:absolute;inset:0;height:100%;min-height:0;will-change:clip-path}
.motion-ready .lens-photo:nth-child(1) .lens-image-mask{z-index:1}
.motion-ready .lens-photo:nth-child(2) .lens-image-mask{z-index:2}
.motion-ready .lens-photo:nth-child(3) .lens-image-mask{z-index:3}
.motion-ready .lens-image-mask::after{content:'';position:absolute;inset:0;background:linear-gradient(#080b0644 0%,transparent 35%,#070b0655 65%,#080b07d9 100%);pointer-events:none}
.motion-ready .lens-caption{position:absolute;z-index:12;left:8vw;right:8vw;bottom:95px;padding-top:0;max-width:none;text-shadow:0 2px 22px #0004}
.motion-ready .lens-caption h2{color:#fff;max-width:none;font-size:clamp(48px,7.1vw,112px)}
.motion-ready .lens-caption p:last-child{margin-left:3px}
.motion-ready .lens-optics{display:block;position:absolute;height:115vmin;width:115vmin;left:50%;top:48%;transform:translate(-50%,-50%);z-index:10;pointer-events:none;opacity:.45;overflow:visible}
.lens-optics circle,.lens-optics line{stroke:#f8f0d6;stroke-width:.7;fill:none}
.lens-optics .lens-ticks{stroke:#f8f0d6;stroke-width:1.1}
.lens-optics .focus-square{fill:none;stroke:#f8f0d6;stroke-width:1;opacity:.8}
.motion-ready .lens-scale{display:flex;position:absolute;z-index:15;right:4vw;top:42%;gap:22px;align-items:center;writing-mode:vertical-rl;font-size:9px;letter-spacing:2px;color:#ece6d1}
.lens-scale>i{height:110px;width:1px;background:repeating-linear-gradient(to bottom,#ddd8c5 0px,#ddd8c5 1px,transparent 1px,transparent 10px);border-right:5px solid transparent}
.motion-ready .lens-progress{display:flex;position:absolute;left:5vw;right:5vw;bottom:35px;z-index:15;align-items:center;gap:22px;font-size:9px;letter-spacing:1.5px}
.lens-progress-track{height:1px;background:#fff4;flex:1;overflow:hidden}.lens-progress-track>i{display:block;width:100%;height:1px;background:#fff;transform-origin:left center;transform:scaleX(0)}
.lens-progress .lens-scroll-hint{color:#e4dfd1;font-size:8px;letter-spacing:1.5px}
.project-main::after{content:'';position:absolute;inset:19px;border:1px solid #fff5;pointer-events:none;z-index:5;opacity:0;transform:scale(.97);transition:opacity .22s,transform .3s var(--ease-out)}
@media(hover:hover) and (pointer:fine){.project-main:hover::after{opacity:1;transform:scale(1)}.film-strip button:hover img{opacity:1}.film-strip button{overflow:hidden}.film-strip img{transition:transform .5s var(--ease-out)}.film-strip button:hover img{transform:scale(1.035)}}
@media(min-width:1500px){.hero-message{top:24%}}
@media(max-width:950px){.hero-message{top:27%}.motion-ready .lens-caption{left:6vw;right:6vw}.motion-ready .lens-caption h2{font-size:8vw}}
@media(max-width:640px){
 .hero-message{top:31%}.hero h1{font-size:clamp(46px,10.9vw,62px)}.hero-bottom>span{line-height:1.1}
 .menu-dialog nav a{font-size:43px;line-height:1.24;padding:17px 0}.menu-dialog nav{margin:30px 0 40px}
 .opening h2{font-size:45px;line-height:1.16}.regard-copy h2{line-height:1.13}.client-teaser h2{line-height:1.14}.seance h2{line-height:1.13;font-size:61px}
 .lens-story.motion-ready{height:280svh;min-height:1900px}.motion-ready .lens-sticky{min-height:660px;max-height:1150px}
 .motion-ready .lens-heading{left:22px;right:22px;top:110px;font-size:8px;letter-spacing:1.2px;gap:15px}
 .motion-ready .lens-heading>span:last-child{max-width:115px;font-size:7px}
 .motion-ready .lens-caption{left:25px;right:25px;bottom:100px}.motion-ready .lens-caption h2{font-size:52px;line-height:1.16;letter-spacing:-.065em}
 .motion-ready .lens-caption p:last-child{font-size:13px;max-width:250px}.motion-ready .lens-caption .eyebrow{font-size:8px}
 .motion-ready .lens-optics{height:135vmin;width:135vmin;top:43%}.motion-ready .lens-scale{right:19px;top:32%;font-size:7px;gap:15px}
 .motion-ready .lens-progress{left:25px;right:25px;bottom:35px;gap:15px}.lens-progress .lens-scroll-hint{font-size:7px;max-width:90px;line-height:1.4}
 .lens-image-mask{height:65svh;min-height:400px}.lens-caption h2{font-size:48px}.lens-sticky{padding:55px 22px 25px}
 .motion-ready .lens-photo:first-child .lens-image-mask img{object-position:50% 58%}
 .motion-ready .lens-photo:nth-child(2) .lens-image-mask img{object-position:50% 63%}
 .motion-ready .lens-photo:nth-child(3) .lens-image-mask img{object-position:70% 50%}
 .motion-ready .lens-sticky{min-height:min(660px,100svh)}
}
@media(prefers-reduced-motion:reduce){
 .photo-iris{display:none}.project-main::after,.film-strip img{transition:none}.lens-story{height:auto!important;min-height:0!important}
 .lens-sticky{position:relative!important;height:auto!important;min-height:0!important;overflow:visible!important}.lens-heading{position:static!important;margin-bottom:30px!important}
}
