/* Full supplied image compositions, without cover cropping or hover zoom. */
.intro-mark{opacity:0;transform:translateY(12px) scale(.88)}
.intro-mark path{animation:none;stroke-dasharray:330;stroke-dashoffset:330}
.intro-wordmark{animation:none;opacity:0;transform:translateY(10px)}
.site-intro.logo-animate .intro-mark{animation:logo-arrive 1.45s cubic-bezier(.2,.75,.2,1) .12s forwards}
.site-intro.logo-animate .intro-mark path{animation:logo-draw 1.85s cubic-bezier(.63,0,.25,1) .12s forwards}
.site-intro.logo-animate .intro-wordmark{animation:logo-name .62s ease 1.65s forwards}
@keyframes logo-arrive{to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes logo-draw{to{stroke-dashoffset:0}}
@keyframes logo-name{to{opacity:1;transform:translateY(0)}}
.project-photo{aspect-ratio:1638/2048}
.project-photo>img{object-fit:contain}
.hero-panel{transform:translateY(102%);animation:hero-panel-reveal 1.15s cubic-bezier(.72,0,.12,1) forwards;animation-play-state:paused}
.hero-panel:nth-child(2){animation-delay:.12s}
.hero-panel:nth-child(3){animation-delay:.24s}
.hero-panel:nth-child(4){animation-delay:.36s}
.hero-title{opacity:0;transform:translateY(24px);animation:hero-title-reveal .9s cubic-bezier(.2,.72,.2,1) 1.48s forwards;animation-play-state:paused}
body.hero-reveal .hero-panel,body.hero-reveal .hero-title{animation-play-state:running}
@keyframes hero-panel-reveal{to{transform:translateY(0)}}
@keyframes hero-title-reveal{to{opacity:1;transform:translateY(0)}}
.header{position:fixed;z-index:20;transition:background .25s,height .25s}
.header.scrolled{background:rgba(16,16,15,.94);backdrop-filter:blur(12px);height:80px}
.hamburger{display:flex;flex-direction:column;gap:7px;width:30px}
.hamburger i{display:block;width:30px;height:2px;background:currentColor;transition:transform .25s,opacity .25s}
.menu-toggle[aria-expanded=true] i:nth-child(1){transform:translateY(9px) rotate(45deg)}
.menu-toggle[aria-expanded=true] i:nth-child(2){opacity:0}
.menu-toggle[aria-expanded=true] i:nth-child(3){transform:translateY(-9px) rotate(-45deg)}
.gallery[open]{display:grid;grid-template-columns:minmax(240px,.7fr) minmax(0,1.3fr);grid-template-rows:minmax(0,1fr) auto;gap:24px 5vw;padding:70px var(--gutter) 30px}
.gallery-top{grid-column:1;grid-row:1;align-self:center}
.gallery-top h2{font-size:clamp(32px,3.7vw,60px);max-width:520px}
#gallery-description{margin-top:28px;max-width:460px;color:var(--muted);font-size:16px;line-height:1.8}
.close-gallery{position:absolute;top:20px;right:var(--gutter)}
.gallery-image{grid-column:2;grid-row:1;min-height:0;height:100%;overflow:hidden}
.gallery-image img{width:100%;height:100%;max-height:100%;aspect-ratio:auto;object-fit:contain}
.gallery-bottom{grid-column:2;grid-row:2;justify-content:center}
@media(max-width:800px){
 .hero-images{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}
 .hero-panel:nth-child(n+3){display:block}
 .menu-toggle{display:flex;position:relative;z-index:2;background:none;padding:12px;min-width:48px;min-height:48px;align-items:center;justify-content:center}
 .header nav{display:none;position:absolute;inset:0 0 auto;background:#151511;padding:100px var(--gutter) 32px;flex-direction:column;gap:12px;border-bottom:1px solid var(--line)}
 .header nav.open{display:flex}
 .header nav a{font-size:25px}
 .brand{position:relative;z-index:2}
 html{scroll-padding-top:100px}
 .gallery[open]{display:flex;flex-direction:column;gap:22px;padding:65px 20px 120px;overscroll-behavior:contain}
 .gallery-top{align-self:stretch;flex:none}
 .gallery-top h2{max-width:none;font-size:30px}
 #gallery-description{font-size:14px;line-height:1.65;margin-top:14px;max-width:none}
 .gallery-image{flex:none;width:100%;height:auto;min-height:0;overflow:visible}
 .gallery-image img{width:100%;height:auto;max-height:none;aspect-ratio:auto;object-fit:contain}
 .gallery-bottom{flex:none;align-items:center;min-height:0}
 .gallery-controls{position:fixed;z-index:30;left:50%;bottom:calc(16px + env(safe-area-inset-bottom));transform:translateX(-50%);display:grid;grid-template-columns:52px 64px 52px;align-items:center;gap:8px;padding:8px 10px;background:rgba(16,16,15,.9);border:1px solid rgba(255,255,255,.18);border-radius:999px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
 .gallery-controls button{display:grid;place-items:center;width:52px;height:52px;margin:0;padding:0;line-height:1;text-align:center}
 .gallery-controls span{display:grid;place-items:center;min-width:64px;height:52px;text-align:center;line-height:1}
}
@media(prefers-reduced-motion:reduce){
 .hero-panel,.hero-title{animation:none;opacity:1;transform:none}
}