:root{color-scheme:dark;--bg:#050505;--fg:#f3f2ed;--muted:#969691;--line:#333330}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--bg);color:var(--fg);font-family:Arial,Helvetica,sans-serif;font-weight:400;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{color:inherit;font:inherit;cursor:pointer}button,a,summary{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,summary:focus-visible,.gallery:focus-visible{outline:2px solid #d8ff73;outline-offset:6px}button{border:0}nav a,.text-link{transition:opacity .2s}nav a:hover,.text-link:hover{opacity:.6}.nav{height:90px;padding:0 3.2%;display:flex;align-items:center;justify-content:space-between;font-size:12px;position:relative;z-index:3}.brand{display:flex;align-items:center;gap:13px}.brand-mark{font-size:24px}nav{display:flex;gap:36px}.hero{min-height:690px;height:calc(100svh - 90px);max-height:1050px;position:relative;display:flex;align-items:center;justify-content:center;padding-bottom:65px;isolation:isolate}.hero-art{position:absolute;top:9%;left:50%;width:245px;height:327px;transform:translateX(-50%);z-index:-1}.stack{position:absolute;width:100%;height:100%;object-fit:cover}.back{transform:rotate(15deg) translate(20px,-8px)}.middle{transform:rotate(7deg) translate(3px,1px)}.front{transform:rotate(-4deg);animation:arrive 1.2s cubic-bezier(.2,.7,.2,1) both}.hero h1{width:86%;margin:50px 0 0;font-size:clamp(80px,10.7vw,166px);font-weight:300;line-height:.8;letter-spacing:-.079em;animation:title-in 1s ease both}.hero h1 span{display:block}.hero h1 span:nth-child(2){text-align:center}.hero h1 span:last-child{text-align:right;padding-right:8%}.hero-bottom{position:absolute;bottom:25px;left:3.2%;right:3.2%;display:flex;justify-content:space-between;align-items:flex-end;font-size:10px;line-height:1.2}.hero-caption{text-align:center}.hero-bottom a span{display:inline-block;margin-left:15px;font-size:20px}.work{padding-top:80px;overflow:hidden}.section-top{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.025em;padding:0 3.2%;margin-bottom:40px}.muted{color:var(--muted)}.gallery{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:0 3.2% 8px;overscroll-behavior-x:contain}.gallery::-webkit-scrollbar{display:none}.project{flex:0 0 23%;min-width:210px;background:none;padding:0;text-align:center;scroll-snap-align:start;scroll-margin-left:3.2%}.project img{display:block;width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;transition:transform .4s ease}.project:hover img{transform:translateY(-5px)}.project-title{display:block;margin-top:19px;font-size:12px}.project-type{display:block;font-size:8px;color:var(--muted);margin-top:7px;letter-spacing:.03em}.gallery-controls{display:flex;justify-content:space-between;align-items:center;padding:20px 3.2% 45px}.gallery-hint{font-size:9px;color:var(--muted)}.arrows{display:flex;gap:10px}.circle{width:46px;height:46px;border:1px solid #4b4b46;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:transparent;font-size:23px;transition:background .2s,color .2s}.circle:hover{background:var(--fg);color:var(--bg)}.circle:disabled{opacity:.25;cursor:default;background:none;color:inherit}.gallery-bottom{border-top:1px solid var(--line);margin:0 3.2%;display:flex;justify-content:space-between;align-items:center;line-height:1;font-size:clamp(70px,10vw,155px);letter-spacing:-.07em;padding:18px 0}.gallery-bottom h2{font-size:inherit;line-height:inherit;font-weight:300;margin:0}.about{padding:140px 0 110px}.about-intro{display:grid;grid-template-columns:1.3fr 1fr;gap:9%;padding:0 3.2% 100px}.about h2{font-size:clamp(40px,5.8vw,86px);font-weight:300;letter-spacing:-.055em;line-height:.98;margin:0}.serif{font-family:Georgia,'Times New Roman',serif;font-style:italic;font-weight:400}.about-copy p{font-size:21px;line-height:1.45;margin:0 0 24px;letter-spacing:-.025em}.about-copy p.muted{font-size:15px;letter-spacing:0;line-height:1.6}.text-link{font-size:11px;display:inline-flex;align-items:center;gap:45px;background:none;padding:12px 0;border-bottom:1px solid var(--line)}.services{display:grid;grid-template-columns:1fr 2fr;gap:30px;padding:0 3.2%}.service-label{font-size:10px;padding-top:25px}.small{display:block;font-size:8px;margin-top:12px}.service-list details{border-top:1px solid var(--line)}.service-list details:last-child{border-bottom:1px solid var(--line)}summary{list-style:none;display:flex;align-items:center;gap:25px;padding:23px 0;font-size:28px;letter-spacing:-.035em;cursor:pointer}summary::-webkit-details-marker{display:none}.service-number{font-size:10px;letter-spacing:0;color:var(--muted)}.plus{margin-left:auto;font-size:26px;font-weight:300;transition:transform .2s}details[open] .plus{transform:rotate(45deg)}details p{max-width:540px;margin:0 30px 25px 40px;color:var(--muted);font-size:15px;line-height:1.6}.contact{border-top:1px solid var(--line);padding:35px 0 60px}.contact h2{font-weight:300;font-size:clamp(54px,9vw,138px);line-height:.98;letter-spacing:-.055em;margin:75px 3.2% 65px;position:relative}.contact-star{position:absolute;right:0;top:0;font-size:110px}.contact-bottom{display:flex;justify-content:space-between;align-items:flex-end;padding:0 3.2%}.contact-bottom p{font-size:13px;line-height:1.8;margin:0}.contact-placeholder{font-size:20px;border-bottom:1px solid #555;padding-bottom:13px;display:flex;gap:80px}footer{border-top:1px solid var(--line);padding:26px 3.2%;display:flex;justify-content:space-between;font-size:9px}footer>span{color:var(--muted)}dialog{width:min(1000px,92vw);max-height:90svh;border:1px solid var(--line);background:#101010;color:var(--fg);padding:55px 35px 35px}dialog::backdrop{background:#000c}.dialog-close{position:absolute;right:15px;top:15px;width:32px;height:32px}.dialog-content{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}.dialog-content img{width:100%;height:auto;max-height:65svh;object-fit:contain}.dialog-content h2{font-size:40px;font-weight:400;letter-spacing:-.04em}.dialog-content p{line-height:1.6;font-size:14px}.eyebrow{font-size:9px}.reveal{transition:opacity .7s ease,transform .7s ease}.reveal.waiting{opacity:0;transform:translateY(18px)}@keyframes arrive{from{opacity:0;transform:rotate(5deg) translateY(25px)}to{opacity:1;transform:rotate(-4deg)}}@keyframes title-in{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1600px){body{max-width:1800px;margin:auto}.hero-art{width:310px;height:414px}}@media(max-width:800px){.nav{height:75px;padding:0 5%;font-size:10px}nav{gap:18px}.brand-mark{display:none}.hero{min-height:620px;height:calc(90svh - 75px);max-height:800px}.hero-art{width:200px;height:267px;top:13%}.hero h1{font-size:12.3vw;width:92%;margin-top:60px}.hero h1 span:last-child{padding-right:2%}.hero-bottom{left:5%;right:5%;font-size:8px}.hero-bottom>span:first-child{max-width:75px}.hero-caption{display:none}.work{padding-top:65px}.section-top{padding:0 5%;font-size:8px;margin-bottom:30px}.project{flex-basis:43%;min-width:180px}.gallery{gap:16px;padding-left:5%;padding-right:5%}.gallery-controls{padding-left:5%;padding-right:5%}.gallery-bottom{margin:0 5%}.about{padding:95px 0 75px}.about-intro{grid-template-columns:1fr;gap:35px;padding:0 5% 65px}.about h2{font-size:12vw}.about-copy{max-width:520px}.about-copy p{font-size:20px}.services{grid-template-columns:1fr;gap:22px;padding:0 5%}.service-label{display:flex;justify-content:space-between}.small{margin:0}.contact h2{font-size:11vw;margin:60px 5% 40px}.contact-star{font-size:50px}.contact-bottom{padding:0 5%;gap:28px;align-items:flex-start;flex-direction:column}.contact-placeholder{font-size:16px;gap:55px}footer{padding:25px 5%;font-size:8px;gap:20px;flex-wrap:wrap}footer>span{order:3;flex-basis:100%}footer a:last-child{margin-left:auto}.dialog-content{grid-template-columns:1fr;gap:15px}.dialog-content img{max-height:45svh}.dialog-content h2{font-size:28px}.dialog-content p{font-size:13px}.dialog-content .eyebrow{display:none}.section-top .muted{max-width:125px;text-align:right}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.reveal.waiting{opacity:1;transform:none}}
/* Motion uses transforms and opacity; no animation engine or continuous timer. */
.hero h1{font-size:clamp(80px,12.8vw,192px);line-height:.88;margin-top:85px;animation:none;pointer-events:none}
.hero h1 span{animation:hero-line 1.1s cubic-bezier(.16,1,.3,1) both}
.hero h1 span:nth-child(2){text-align:right;padding-right:8%;font-size:1.35em;animation-delay:.14s}
.hero-motion{width:100%;height:100%;transform:translate3d(var(--pointer-x,0px),calc(var(--hero-scroll,0px) + var(--pointer-y,0px)),0) rotate(var(--pointer-rotate,0deg));transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.stack{transition:transform .65s cubic-bezier(.16,1,.3,1)}
.hero-art .back{animation:back-in 1.2s cubic-bezier(.16,1,.3,1) backwards}
.hero-art .middle{animation:middle-in 1.2s cubic-bezier(.16,1,.3,1) backwards}
.hero-bottom{animation:hero-line 1s .35s both}
.nav a{position:relative}.nav nav a:after{content:'';position:absolute;left:0;right:0;bottom:-7px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .3s ease}.nav nav a:hover:after,.nav nav a:focus-visible:after{transform:scaleX(1);transform-origin:left}
.brand-mark{display:inline-block;transition:transform .6s cubic-bezier(.16,1,.3,1)}.brand:hover .brand-mark{transform:rotate(90deg)}
.circle{transition:transform .25s cubic-bezier(.2,.8,.2,1),background .2s,color .2s,border-color .2s}.circle:not(:disabled):hover{transform:translateY(-3px) rotate(-8deg)}.circle:not(:disabled):active{transform:scale(.88)}
.project img{transition:transform .55s cubic-bezier(.16,1,.3,1)}.project-title{transition:transform .3s ease}.project:hover .project-title,.project:focus-visible .project-title{transform:translateY(3px)}.project:active img{transform:scale(.98)}
.text-link span,.hero-bottom a span,footer a{transition:transform .3s ease}.text-link:hover span{transform:translate(4px,-4px)}.hero-bottom a:hover span{transform:translateY(5px)}footer a:hover{transform:translateY(-3px)}
summary{transition:color .25s,padding .3s}summary:hover{padding-left:9px;color:#fff}details[open] p{animation:detail-in .35s ease both}
.reveal{transition:opacity .8s ease,transform .8s cubic-bezier(.16,1,.3,1);transition-delay:var(--reveal-delay,0ms)}.reveal.waiting{transform:translateY(32px)}
.gallery-bottom h2{transition:transform .9s cubic-bezier(.16,1,.3,1)}.gallery-bottom.waiting h2{transform:translateX(45px)}
.contact-star{transition:transform .9s cubic-bezier(.16,1,.3,1)}.contact h2.waiting .contact-star{transform:rotate(-100deg) scale(.65)}
dialog[open]{animation:dialog-in .3s cubic-bezier(.16,1,.3,1)}dialog[open]::backdrop{animation:backdrop-in .3s ease}
@media(hover:hover) and (pointer:fine){.hero:hover .back{transform:rotate(21deg) translate(35px,-15px)}.hero:hover .middle{transform:rotate(10deg) translate(10px,-4px)}.project:hover img,.project:focus-visible img{transform:translateY(-6px) scale(.985)}}
@supports(animation-timeline:scroll()){body:before{content:'';position:fixed;z-index:10;top:0;left:0;width:100%;height:2px;background:#f3f2ed;transform:scaleX(0);transform-origin:left;animation:reading-progress linear both;animation-timeline:scroll()}}
@keyframes reading-progress{to{transform:scaleX(1)}}@keyframes hero-line{from{opacity:0;transform:translateY(45px)}to{opacity:1;transform:translateY(0)}}@keyframes back-in{from{opacity:0;transform:rotate(-3deg) translate(0,25px)}to{opacity:1;transform:rotate(15deg) translate(20px,-8px)}}@keyframes middle-in{from{opacity:0;transform:rotate(-3deg) translate(0,25px)}to{opacity:1;transform:rotate(7deg) translate(3px,1px)}}@keyframes detail-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes dialog-in{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes backdrop-in{from{opacity:0}to{opacity:1}}
@media(max-width:800px){.hero h1{font-size:13.6vw;line-height:.95;margin-top:90px}.hero h1 span:nth-child(2){font-size:1.4em;padding-right:2%}.brand-mark{display:none}}
@media(prefers-reduced-motion:reduce){.hero-motion{transform:none}.reveal.waiting,.gallery-bottom.waiting h2{opacity:1;transform:none}.contact h2.waiting .contact-star{transform:none}body:before{display:none}}

/* Preserve the complete artwork inside the reference-style portrait frames. */
.project img{object-fit:contain;background:#090909}.stack{object-fit:contain;background:#090909}.dialog-content img{background:#090909}
/* Native touch scrolling plus direct mouse dragging. */
.gallery{cursor:grab;touch-action:pan-x pan-y;user-select:none;-webkit-user-select:none}.gallery .project{cursor:grab}.gallery img{-webkit-user-drag:none}.gallery.dragging,.gallery.dragging .project{cursor:grabbing}.gallery.dragging,.gallery.free-scroll{scroll-snap-type:none}.gallery.dragging .project img{transform:none}.gallery.dragging .project-title{transform:none}
.brand-logo{width:34px;height:34px;object-fit:contain;transition:transform .7s cubic-bezier(.16,1,.3,1)}.brand:hover .brand-logo{transform:rotate(60deg)}
.contact-links{display:flex;flex-direction:column;align-items:flex-start;gap:13px}.contact-email{font-size:clamp(14px,2vw,26px);letter-spacing:-.035em;border-bottom:1px solid var(--line);padding:10px 0;display:flex;gap:25px;align-items:center;overflow-wrap:anywhere}.contact-email span{display:inline-block;transition:transform .3s}.contact-email:hover span{transform:translate(4px,-4px)}
.service-label{position:relative}.service-emblem{display:block;font-size:92px;line-height:1;margin-top:45px;transition:transform .75s cubic-bezier(.16,1,.3,1);transform-origin:46px 46px}.services:has(details:hover) .service-emblem,.services:has(details[open]) .service-emblem{transform:rotate(90deg)}
.service-list details{position:relative;overflow:hidden;transition:background .3s,border-color .3s,opacity .8s,transform .8s}.service-list details:before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:#f3f2ed;transform:scaleX(0);transform-origin:left;transition:transform .5s cubic-bezier(.16,1,.3,1)}.service-list details:hover:before,.service-list details[open]:before,.service-list details:focus-within:before{transform:scaleX(1)}.service-list details:hover,.service-list details[open]{background:#101010}.service-list summary{position:relative;padding-right:10px}.service-list .plus{width:34px;height:34px;border:1px solid #333330;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;transition:transform .35s,background .35s,color .35s}.service-list details[open] .plus{background:var(--fg);color:var(--bg)}.service-number{transition:transform .35s,color .35s}.service-list details:hover .service-number{transform:translateY(-3px);color:var(--fg)}.service-list details[open] p{animation:service-copy .45s ease both}@keyframes service-copy{from{opacity:0;transform:translate(12px,6px)}to{opacity:1;transform:translate(0,0)}}
/* A four-second brand introduction, then the existing hero entrance plays. */
.intro[hidden]{display:none}.intro{position:fixed;inset:0;z-index:100;background:#050505;color:#f3f2ed;display:flex;flex-direction:column;justify-content:space-between;padding:32px 4%;transition:opacity .4s ease,visibility .4s;overscroll-behavior:contain}.intro.leaving{opacity:0;visibility:hidden;pointer-events:none}.intro-active{overflow:hidden}.intro-active .hero h1 span,.intro-active .hero .stack,.intro-active .hero-bottom{animation-play-state:paused}.intro-top,.intro-bottom>div:last-child{display:flex;align-items:center;justify-content:space-between;font-size:10px;letter-spacing:.07em}.intro-center{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:30px}.intro-orbit{position:relative;width:clamp(175px,25vw,310px);aspect-ratio:1}.intro-orbit img{width:100%;height:100%;object-fit:contain;animation:seal-arrive 3.6s cubic-bezier(.22,.65,.2,1) both}.intro-core{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:15px;letter-spacing:.3em;animation:core-arrive 1.5s .5s both}.intro-center p{font-size:10px;letter-spacing:.24em;animation:core-arrive 1s .3s both}.intro-track{height:1px;background:#30302c;overflow:hidden;margin-bottom:20px}.intro-track span{display:block;width:100%;height:100%;background:#f3f2ed;transform:scaleX(0);transform-origin:left;animation:intro-time 3.6s linear forwards}.intro-bottom button{font-size:10px;letter-spacing:.06em;padding:10px 0 10px 15px;background:none;transition:opacity .2s}.intro-bottom button:hover{opacity:.55}
@keyframes seal-arrive{0%{opacity:0;transform:rotate(-100deg) scale(.75)}20%{opacity:1}75%{transform:rotate(0) scale(1)}100%{opacity:1;transform:rotate(12deg) scale(1)}}@keyframes core-arrive{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes intro-time{to{transform:scaleX(1)}}
@media(max-width:800px){.brand-logo{width:25px;height:25px}.brand{gap:8px}.service-emblem{display:none}.contact-links{max-width:100%}.contact-email{font-size:clamp(13px,3.7vw,23px);gap:12px}.intro{padding:25px 5%}.intro-top{font-size:8px}.intro-top span:last-child{max-width:95px;text-align:right}.intro-bottom>div:last-child{font-size:8px}.intro-center p{font-size:8px;letter-spacing:.18em}}
@media(prefers-reduced-motion:reduce){.intro-orbit img,.intro-core,.intro-center p{opacity:1;transform:none}.intro-track span{transform:scaleX(1)}.service-emblem,.services:has(details:hover) .service-emblem,.services:has(details[open]) .service-emblem{transform:none}}