/* A compact top-left directory and expanding photographic work strips. */
:root{--rail:0px}body{padding-left:0}body>header{padding:0 28px;gap:24px;max-width:none}body>header>nav{margin-left:auto}.directory-toggle{display:block;flex-shrink:0;border:1px solid #596057;background:transparent;color:#e3e2d6;padding:8px 12px;min-height:34px;font-size:11px;letter-spacing:.12em;cursor:pointer}.directory-toggle:hover,.directory-toggle[aria-expanded=true]{color:#18221c;background:#e7e4d8;border-color:#e7e4d8}
.site-rail{position:fixed;inset:64px auto auto 16px;width:268px;max-height:calc(100svh - 80px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;background:#e9e8df;color:#171b1b;padding:0 15px;border:1px solid #9b9e92;box-shadow:0 18px 70px #0008;display:flex;flex-direction:column;z-index:120;visibility:hidden;pointer-events:none;opacity:0;transform:translateY(-8px);transition:opacity .2s,transform .2s,visibility .2s}
.directory-open .site-rail{visibility:visible;pointer-events:auto;opacity:1;transform:translateY(0)}.site-rail .rail-brand{font-size:23px;font-style:normal;letter-spacing:2px;text-align:left;padding:23px 12px 20px;line-height:1.1}.site-rail .rail-brand span{font-size:9px;font-weight:400;letter-spacing:1px;margin-top:10px}.site-rail nav{display:block;margin:17px 0}.directory-group{margin-bottom:16px}.directory-group>p{font-size:9px;color:#80857c;letter-spacing:1.7px;margin:0 12px 8px}.site-rail nav a{display:flex;flex-direction:row;gap:12px;font-size:12px;padding:10px 10px;letter-spacing:.04em;line-height:1.3;border-left:2px solid transparent}.site-rail nav a[aria-current]{background:#1a2524;color:#f2eee3;border-left-color:#dba34f}.directory-no{font:10px monospace;color:#8d927f}.directory-sub{border-left:1px solid #b7bbae;margin:6px 0 10px 21px;padding-left:7px}.site-rail .directory-sub a{font-size:11px;padding:7px 9px;color:#6c7267}.site-rail .directory-sub a:hover{color:white}.site-rail .rail-footer{writing-mode:horizontal-tb;letter-spacing:1.5px;font-size:8px;line-height:1.8;margin:0 12px 22px}
.home-shell{height:100svh;overflow:hidden}.home-shell>main{height:calc(100svh - 56px);max-width:none}.home-shell>footer{display:none}.home-shell .home-panel[hidden]{display:none!important}.home-panel{height:100%;overflow-y:auto;overscroll-behavior:contain}.home-panel:focus{outline:none}.home-shell .portfolio-cover{height:100%;min-height:0;max-height:none;overflow:hidden}.home-shell .cover-wordmark{top:12%;font-size:clamp(64px,10vw,156px)}.home-shell .cover-topline{font-size:10px;top:25px}.home-shell .cover-bottom{bottom:104px}.home-shell .cover-scene{bottom:34px}.home-shell .cover-heading{font-size:clamp(25px,3vw,46px)}.home-shell .cover-entry{width:250px}.home-shell .cover-disciplines{font-size:12px;letter-spacing:.08em}.home-shell .cover-scene>span:last-child{margin-right:270px}
.home-shell #works{background:#121716;color:#ecebe0;padding:32px 4% 82px;display:flex;flex-direction:column;gap:26px;overflow-y:auto;scrollbar-width:thin}.strip-heading{display:flex;align-items:end;justify-content:space-between;gap:25px;flex-shrink:0}.strip-heading .eyebrow{color:#b5a47d!important;font-size:10px;letter-spacing:.2em;margin:0 0 12px}.strip-heading h1{font-size:48px;line-height:1.1;letter-spacing:.05em;margin:0;font-weight:450}.strip-heading>p{color:#c5c9bc;font-size:13px;line-height:1.8;margin:0}.strip-heading small{color:#7f8b80;font-size:11px}
.work-strips{display:flex;gap:12px;flex:1;min-height:260px;width:100%;isolation:isolate}.work-strip{position:relative;flex:1;min-width:0;overflow:hidden;background:#242927;isolation:isolate;border:1px solid #8a998733;transition:flex .65s cubic-bezier(.22,.7,.2,1),border-color .3s;color:#eeece2}.work-strip.is-selected{flex:5.4;border-color:#ae9666a0}.work-strip img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% center;filter:grayscale(1) brightness(.55);transition:filter .55s,transform .8s;z-index:-3}.work-strip.is-selected img{filter:grayscale(0) brightness(.95);transform:scale(1.035)}.strip-shade{position:absolute;inset:0;background:linear-gradient(180deg,#090e0e45,transparent 35%,#050b0a99 75%,#050a09eb);z-index:-2}.strip-number{position:absolute;top:22px;left:20px;font:11px monospace;letter-spacing:2px;color:#c9c9be}.strip-label{position:absolute;bottom:29px;left:22px;right:20px}.home-shell #works .strip-label h2{font-size:25px;line-height:1.35;font-weight:450;letter-spacing:.15em;margin:0;writing-mode:vertical-rl;white-space:nowrap}.home-shell #works .work-strip.is-selected h2{writing-mode:horizontal-tb;font-size:38px;letter-spacing:.1em}.strip-label>p,.strip-open{display:none}.work-strip.is-selected .strip-label>p{display:block;font-size:12px;color:#c1c8ba;margin:14px 0 24px;line-height:1.6;white-space:nowrap}.work-strip.is-selected .strip-open{display:flex;align-items:center;justify-content:space-between;font-size:11px;padding-top:14px;border-top:1px solid #a2ab8c55;color:#e3c892;white-space:nowrap}.strip-open>span{font-size:22px}.work-strip:focus-visible{outline:2px solid #e7b870;outline-offset:3px}.strip-footer{display:flex;justify-content:space-between;color:#738073;font:9px monospace;letter-spacing:1.5px;gap:20px;flex-shrink:0}.home-shell #about{max-width:none;padding:8vh 7% 110px;align-content:start}.home-shell #about h2{font-size:42px}
@media(max-height:680px) and (min-width:761px){.home-shell .cover-wordmark{font-size:85px}.home-shell .cover-bottom{bottom:85px}.home-shell .cover-heading{font-size:30px}.home-shell #works{padding-top:20px;gap:18px;padding-bottom:78px}.strip-heading h1{font-size:36px}.work-strips{min-height:190px}.strip-label{bottom:20px}.home-shell #works .work-strip.is-selected h2{font-size:30px}.work-strip.is-selected .strip-label>p{margin:10px 0 12px}}
@media(max-width:1000px) and (min-width:761px){body>header{gap:18px}.work-strips{gap:9px}.strip-label{left:14px;right:14px}.strip-number{left:14px}.home-shell #works .strip-label h2{font-size:21px}.home-shell #works .work-strip.is-selected h2{font-size:32px}.work-strip.is-selected{flex:5.6}}
@media(max-width:760px){body>header{height:58px;padding:0 14px;gap:14px}.brand span{display:none}body>header .brand{font-size:14px;letter-spacing:2px}body>header>nav{gap:12px;font-size:10px}.directory-toggle{font-size:10px;min-height:32px;padding:7px 9px}.site-rail{inset:65px auto auto 10px;width:min(280px,calc(100vw - 20px));max-height:calc(100svh - 80px)}.home-shell>main{height:calc(100svh - 58px)}.home-shell .cover-topline{top:20px;font-size:8px}.home-shell .cover-wordmark{top:65px;right:auto;left:5%;font-size:21vw}.home-shell .cover-wordmark span{font-size:9px;margin-top:13px}.home-shell .cover-image{top:26%;height:33%;width:100%;object-fit:contain}.home-shell .cover-bottom{bottom:91px;left:5%;right:5%;display:block}.home-shell .cover-heading{font-size:26px;margin-bottom:9px}.home-shell .cover-kicker{font-size:10px;margin-bottom:9px}.home-shell .cover-entry{width:100%;margin-top:17px}.home-shell .cover-disciplines{font-size:11px}.home-shell .enter-works{padding:12px 18px;font-size:14px}.home-shell .cover-entry small{display:none}.home-shell .cover-scene{bottom:69px;padding:0;border:0;font-size:9px}.home-shell .cover-scene>span:last-child{display:none}.home-shell #works{padding:25px 14px 88px;gap:24px}.strip-heading{align-items:start;gap:8px}.strip-heading .eyebrow{font-size:8px;letter-spacing:.1em}.strip-heading h1{font-size:36px}.strip-heading>p{font-size:10px;padding-top:20px}.strip-heading small{font-size:9px}.work-strips{gap:5px;min-height:270px}.work-strip{flex:.7}.work-strip.is-selected{flex:5}.strip-number{font-size:8px;top:15px;left:50%;transform:translateX(-50%);letter-spacing:0}.work-strip.is-selected .strip-number{left:14px;transform:none;letter-spacing:2px}.strip-label{bottom:23px;left:50%;right:auto;transform:translateX(-50%)}.work-strip.is-selected .strip-label{left:14px;right:14px;transform:none}.home-shell #works .strip-label h2{font-size:16px;letter-spacing:.13em}.home-shell #works .work-strip.is-selected h2{font-size:27px}.work-strip.is-selected .strip-label>p{font-size:10px;margin:12px 0 20px;white-space:normal}.work-strip.is-selected .strip-open{font-size:10px}.strip-footer{font-size:7px;letter-spacing:.7px}.strip-footer>span:last-child{display:none}.home-shell #about{display:block;padding:35px 6% 100px}.home-shell #about h2{font-size:34px}.music-dock{right:10px;bottom:10px}}
@media(max-height:680px) and (max-width:760px){.home-shell .cover-wordmark{top:48px;font-size:17vw}.home-shell .cover-wordmark span{margin-top:9px}.home-shell .cover-image{top:23%;height:31%}.home-shell .cover-heading{font-size:22px}.home-shell .cover-bottom{bottom:90px}.home-shell .cover-kicker{margin-bottom:5px}.home-shell .cover-disciplines{font-size:9px}.home-shell .cover-entry{margin-top:12px}.home-shell .enter-works{padding:9px 15px}.home-shell #works{padding-top:20px;gap:18px}.strip-heading h1{font-size:30px}.work-strips{min-height:220px}}
@media(prefers-reduced-motion:reduce){.work-strip,.work-strip img,.site-rail{transition:none!important}}

/* Project exit and arrival use the same curtain to bridge separate HTML pages. */
html.project-arriving::before{content:"";position:fixed;inset:0;background:#e8e5d9;z-index:1999}
.project-transition{position:fixed;inset:0;z-index:2000;background:#e8e5d9;color:#202c25;display:flex;flex-direction:column;align-items:center;justify-content:center;visibility:hidden;pointer-events:none;transform:translateY(101%);transition:transform .44s cubic-bezier(.76,0,.24,1),visibility .44s;isolation:isolate}
.project-transition.is-covering,.project-transition.is-arriving{visibility:visible;pointer-events:auto;transform:translateY(0)}.project-transition.is-arriving{transition:none}.project-transition.is-arriving.is-revealing{transform:translateY(-101%);transition:transform .7s cubic-bezier(.76,0,.24,1)}
.project-transition p{font:10px monospace;letter-spacing:.25em;margin:24px 0;color:#727b68}.project-transition strong{font-size:clamp(44px,8vw,108px);font-weight:450;letter-spacing:.15em;line-height:1.3}.project-transition>span{font-size:11px;letter-spacing:.35em;margin:25px 0;color:#68745f}.transition-rule{width:min(60%,480px);height:1px;background:#acb39d}
@media(prefers-reduced-motion:reduce){.project-transition,html.project-arriving::before{display:none!important}}

.project-nav{overflow-x:auto;scrollbar-width:thin}.project-nav>a{flex-shrink:0;white-space:nowrap}
