@font-face{font-family:Stetz;src:local("Arial")}*{box-sizing:border-box}html{background:#101010;color:#f5f5f5;scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;font-family:Stetz,Arial,sans-serif;letter-spacing:0}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid #ffffff;outline-offset:7px}svg{width:20px;height:20px;stroke-width:1.5;flex-shrink:0}.navigation{height:92px;position:fixed;top:0;left:0;width:100%;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:0 42px;mix-blend-mode:difference;color:#fff;pointer-events:none}.navigation a{pointer-events:auto;display:flex;gap:9px;align-items:center;font-size:14px}.navigation .wordmark,.wordmark{font-size:31px;font-weight:750}.wordmark img{width:25px;height:25px;object-fit:contain}.archive-brand{position:absolute;left:40px;top:110px;font-size:92px;line-height:1;margin:0;font-weight:850;pointer-events:none}.niches{position:fixed;top:50%;transform:translateY(-40%);left:42px;z-index:12;display:flex;flex-direction:column;align-items:flex-start;gap:4px}.niches button{font-size:12px;padding:9px 0;color:#929292;min-height:33px;transition:color .2s;display:flex;align-items:center;gap:12px}.niches button:before{content:"";width:5px;height:5px;background:currentColor;border-radius:50%;opacity:0}.niches button[aria-pressed=true]{color:#ffffff}.niches button[aria-pressed=true]:before{opacity:1}.niches button:hover{color:white}.film-roll{width:min(58%,780px);margin:0 auto;padding:112px 0 90px}.film-frame{width:100%;min-height:72svh;padding:38px 0;display:flex;justify-content:center;align-items:center;position:relative}.film-window{display:block;padding:0;position:relative;width:min(100%,calc(64svh * var(--ratio)));aspect-ratio:var(--ratio);background:#191919;max-height:64svh;isolation:isolate}.film-window:before,.film-window:after{content:"";position:absolute;top:0;bottom:0;width:8px;background:repeating-linear-gradient(to bottom,#434343 0 9px,transparent 9px 19px);opacity:.35}.film-window:before{left:-17px}.film-window:after{right:-17px}.film-window video{width:100%;height:100%;object-fit:contain;display:block;filter:grayscale(.65) brightness(.55) contrast(1.13);transition:filter .5s}.film-window:hover video,.film-window:focus-visible video{filter:none}.film-frame:not(.active){opacity:.55;transition:opacity .5s}.film-frame.active{opacity:1}.play-mark{position:absolute;inset:0;display:grid;place-items:center;opacity:0;transition:opacity .2s}.play-mark svg{width:34px;height:34px;filter:drop-shadow(0 1px 6px #000)}.film-window:hover .play-mark,.film-window:focus-visible .play-mark{opacity:1}.archive-position{position:fixed;right:43px;top:50%;display:flex;align-items:center;gap:14px;writing-mode:vertical-rl;font:11px monospace;z-index:10}.position-line{width:1px;height:90px;background:#5c5c5c}.sound-control{position:fixed;right:32px;bottom:28px;z-index:15}.icon-button{width:44px;height:44px;display:grid;place-items:center;border:1px solid #666;border-radius:50%}.icon-button:hover{background:#fff;color:#111}.viewer-top{position:sticky;top:0;display:flex;justify-content:space-between;align-items:center;padding:20px 35px;z-index:5;background:linear-gradient(#101010,transparent)}dialog{padding:0;position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;border:0;background:#101010;color:#fff;overflow-y:auto;overscroll-behavior:contain}dialog::backdrop{background:#101010}.viewer-stage{min-height:calc(88svh - 84px);display:grid;place-items:center;padding:18px 5%}.camera-body{width:100%;position:relative}.camera-screen{position:relative;width:100%;height:calc(80svh - 100px);background:#090909}.camera-screen video{width:100%;height:100%;object-fit:contain}.camera-handle,.camera-lens,.camera-label,.cassette,.record-light{display:none}.viewer-controls{display:flex;justify-content:space-between;align-items:center;margin:0 5%;padding:24px 0;border-bottom:1px solid #454545;font:12px monospace}.viewer-controls button{display:flex;gap:10px;align-items:center;min-height:44px;padding:0 10px}.viewer-controls button:hover{color:#ffffff}.viewer-controls button:disabled{opacity:.4}.shoot-details{padding:65px 5% 110px}.shoot-details h2{font-weight:400;font-size:32px;max-width:700px;overflow-wrap:anywhere}.shoot-details dl{display:grid;grid-template-columns:repeat(4,1fr);gap:30px}.shoot-details dt{color:#999;font-size:11px;text-transform:uppercase;margin:0 0 15px}.shoot-details dd{font-size:15px;margin:0}.vhs .camera-body{width:min(900px,85vw);padding:55px 80px 45px 35px;border-radius:12px 45px 32px 12px;background:linear-gradient(135deg,#434344,#202021 50%,#343435);box-shadow:inset 0 2px 2px #777,0 25px 80px #000;border:1px solid #555}.vhs .camera-screen{height: min(48svh,450px);border:12px solid #141414;border-radius:5px;box-shadow:0 0 0 1px #575757}.vhs .camera-handle{display:block;position:absolute;width:55%;height:40px;left:23%;top:-32px;border:12px solid #373737;border-bottom:0;border-radius:20px 20px 0 0}.vhs .camera-lens{display:block;position:absolute;right:-28px;top:27%;height:42%;width:45px;border-radius:0 12px 12px 0;background:repeating-linear-gradient(90deg,#242424 0 3px,#535353 4px 5px)}.vhs .camera-label{display:block;position:absolute;top:20px;left:35px;color:#ccc;font:11px monospace}.vhs .record-light{display:block;position:absolute;right:34px;top:30px;width:6px;height:6px;background:#fb5555;border-radius:50%;box-shadow:0 0 10px #fb5555}.vhs .cassette{display:block;position:absolute;right:28px;top:52%;width:150px;height:88px;background:#111;border:2px solid #555;border-radius:3px;z-index:3;padding:8px;opacity:0;pointer-events:none}.cassette>span{display:block;background:#eee;color:#111;font-weight:bold;font-size:13px;padding:2px 5px}.reels{display:flex;justify-content:space-between;margin:5px 12px}.reels b{width:25px;height:25px;border:5px dashed #aaa;border-radius:50%}.eject .cassette{animation:eject .36s both}.insert .cassette{animation:insert .42s both}.vhs.eject .camera-screen,.vhs.insert .camera-screen{opacity:.25}@keyframes eject{from{opacity:0;transform:translate(0,0) rotate(0)}to{opacity:1;transform:translate(50px,-100px) rotate(-12deg)}}@keyframes insert{from{opacity:1;transform:translate(50px,-100px) rotate(-12deg)}to{opacity:0;transform:translate(0,0) rotate(0)}}#video-error{position:absolute;inset:35% 10%;text-align:center;background:#111;padding:25px}#video-error[hidden]{display:none}#camera-cursor{display:none;position:fixed;top:0;left:0;pointer-events:none;z-index:1000;color:white;mix-blend-mode:difference;will-change:transform}#camera-cursor svg{width:27px;height:27px;transition:transform .18s}#camera-cursor.over svg{transform:scale(1.3) rotate(-10deg)}#camera-cursor.clicked svg{transform:scale(.8)}#camera-cursor span{position:absolute;inset:-9px;border:1px solid white;border-radius:50%;opacity:0}#camera-cursor.clicked span{opacity:1}.cursor-ready,.cursor-ready a,.cursor-ready button{cursor:none}.contact-page{background:#f4f4f2;color:#171717;min-height:100svh}.contact-page .navigation{mix-blend-mode:normal;color:#171717;border-bottom:1px solid #bdbdbb}.contact-page .wordmark img{filter:invert(1)}.contact-layout{min-height:100svh;display:grid;grid-template-columns:1fr 23%;padding-top:92px}.contact-main{padding:90px 6% 40px;display:flex;flex-direction:column;justify-content:center}.contact-main h1{font-size:100px;line-height:1;margin:0 0 90px;font-weight:850}.contact-people{display:grid;grid-template-columns:1fr 1fr;gap:30px}.contact-people h2{font-size:16px;font-weight:400;margin:0 0 28px}.contact-people a{display:flex;align-items:center;gap:8px;font-size:13px;overflow-wrap:anywhere;margin-bottom:15px;width:fit-content;max-width:100%;min-height:30px}.contact-people a:hover{text-decoration:underline}.contact-people svg{width:15px}.contact-strip{border-left:1px solid #bdbdbb;display:flex;flex-direction:column;overflow:hidden;max-height:calc(100svh - 92px)}.contact-strip img{width:100%;height:33.333%;min-height:0;object-fit:cover;filter:grayscale(1)}.contact-strip img:hover{filter:none}.contact-back{margin-top:90px;display:flex;gap:10px;align-items:center;font-size:12px;width:fit-content}
#reactive-background{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}body>main{position:relative;z-index:1}.film-window{transition:transform .35s cubic-bezier(.2,.7,.2,1);transform-origin:center}.film-window:focus-visible{transform:scale(1.045)}@media(hover:hover) and (pointer:fine){.film-window:hover{transform:scale(1.045);z-index:2}}@media(prefers-reduced-motion:reduce){.film-window:hover,.film-window:focus-visible{transform:none}}
@media(min-width:1450px){.archive-brand{font-size:112px}.film-roll{width:60%}}
@media(max-width:1000px){.archive-brand{font-size:60px;left:25px;top:115px}.navigation{padding:0 25px}.niches{left:25px}.film-roll{width:60%}.archive-position{right:25px}.contact-main h1{font-size:72px}.contact-people{grid-template-columns:1fr;gap:30px}.contact-main{padding:50px 7%}.contact-main h1{margin-bottom:55px}.contact-back{margin-top:45px}}
@media(max-width:640px){.navigation{height:72px;padding:0 20px}.navigation .wordmark{font-size:27px}.wordmark img{width:22px;height:22px}.navigation a{font-size:12px}.archive-brand{position:relative;left:auto;top:auto;font-size:64px;margin:100px 20px 24px}.niches{position:sticky;top:70px;left:auto;transform:none;flex-direction:row;align-items:center;overflow-x:auto;gap:22px;padding:8px 20px;background:#101010ee;backdrop-filter:blur(10px);scrollbar-width:none}.niches button{white-space:nowrap;padding:8px 0;min-height:40px}.niches button:before{display:none}.film-roll{width:calc(100% - 66px);padding:0 0 65px}.film-frame{min-height:64svh;padding:25px 0}.film-window{width:min(100%,calc(57svh * var(--ratio)));max-height:57svh}.film-window video{filter:brightness(.8) contrast(1.05)}.film-frame.active video{filter:none}.archive-position{right:9px;gap:9px;font-size:9px}.position-line{height:45px}.sound-control{right:16px;bottom:16px;background:#101010}.viewer-top{padding:14px 20px}.viewer-stage{padding:22px 12px;min-height:72svh}.camera-screen{height:65svh}.vhs .camera-body{padding:40px 30px 25px 15px;width:90%;border-radius:8px 25px 20px 8px}.vhs .camera-screen{height:45svh;border-width:7px}.vhs .camera-lens{width:20px;right:-15px}.vhs .camera-label{left:20px;top:17px;font-size:9px}.vhs .record-light{top:20px;right:18px}.vhs .cassette{width:100px;height:70px}.viewer-controls{margin:0 20px;padding:12px 0}.shoot-details{padding:35px 20px 70px}.shoot-details h2{font-size:25px}.shoot-details dl{grid-template-columns:1fr 1fr;gap:30px 20px}.contact-layout{padding-top:72px;grid-template-columns:1fr}.contact-main{padding:55px 22px}.contact-main h1{font-size:56px;margin-bottom:50px}.contact-people a{font-size:14px}.contact-strip{border-top:1px solid #bdbdbb;border-left:0;flex-direction:row;height:200px}.contact-strip img{width:33.333%;height:100%}.contact-back{margin-top:50px}}
@media(min-width:641px) and (max-width:1000px){.archive-brand{position:relative;left:auto;top:auto;margin:110px 25px 0}.film-roll{padding-top:0}}
@media(min-width:641px) and (max-height:760px){.archive-brand{font-size:48px}.niches{top:190px;transform:none;gap:0}.niches button{padding:3px 0;min-height:26px;font-size:11px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.001ms!important;transition-duration:.001ms!important}}
