:root{--ease:cubic-bezier(.22,1,.36,1)}[hidden]{display:none!important}html{scroll-behavior:smooth}body{color:#141414}header{height:64px;padding:0;position:fixed;left:0;right:0;top:0;justify-content:center;background:transparent;gap:14px;pointer-events:none}header>*{pointer-events:auto}.wordmark{font-size:15px;letter-spacing:-1px;white-space:nowrap}.wordmark span{font-size:14px;letter-spacing:-1px;margin-left:1px}nav{gap:3px;font-family:Georgia,serif;font-size:14px}nav a{padding:3px 9px;min-height:32px;border-radius:4px;background:rgba(245,245,244,.88);backdrop-filter:blur(8px);transition:background .25s}nav a[aria-current]{text-decoration:none;background:#ececea}nav sup{font-family:Arial,sans-serif;font-size:9px;margin-left:6px}header .availability{display:none}main{padding-top:64px}footer{font-size:10px}.page-home footer{display:none}.page-home{overflow:hidden}.page-home main{height:100svh}.scene{height:calc(100svh - 64px);min-height:0}.scene-stage{overflow:hidden;isolation:isolate}.intro{inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:none;opacity:1;padding-bottom:50px;transition:opacity .55s var(--ease),transform .8s var(--ease)}.intro h1{font-family:Georgia,serif;font-size:clamp(25px,3vw,43px);font-weight:400;letter-spacing:-.045em;line-height:1.1;margin:0}.intro .eyebrow{font-size:9px;margin-bottom:22px}.intro .role{font-size:11px;line-height:1.5;margin-top:24px}.reveal{bottom:28px;background:transparent;font-size:11px;min-height:44px;transition:opacity .3s}.scene-index{bottom:43px;left:24px;font-size:10px}.scene-count{bottom:43px;right:24px;font-size:10px}.constellation{inset:auto;left:50%;top:45%;width:min(54vw,750px);height:min(60vh,530px);transform:translate(-50%,-50%) scale(.45);opacity:0;transition:transform 1s var(--ease),opacity .6s var(--ease);pointer-events:none;touch-action:pan-y}.tile{width:clamp(46px,5.2vw,86px);height:clamp(58px,7.4vw,112px);left:var(--x);top:var(--y);transform:translate(calc(-50% + var(--px,0px)),calc(-50% + var(--py,0px)));transition:transform .65s var(--ease),opacity .45s var(--ease);transition-delay:var(--delay);background:transparent}.tile:nth-child(3n){width:clamp(58px,6.6vw,105px);height:clamp(42px,5.4vw,86px)}.tile img{object-fit:contain;filter:saturate(.95)}.tile:hover,.tile:focus-visible{transform:translate(calc(-50% + var(--px,0px)),calc(-50% + var(--py,0px))) scale(1.12);z-index:10;transition-delay:0s}.tile-ai{position:absolute;bottom:0;right:0;font-size:7px;background:#fff;padding:2px}.scene[data-state=collage] .constellation{opacity:1;transform:translate(-50%,-50%) scale(1);pointer-events:auto}.scene:not([data-state=intro]) .intro{opacity:0;transform:translateY(-22px);pointer-events:none}.scene[data-state=preview] .constellation,.scene[data-state=overview] .constellation{opacity:0;transform:translate(-50%,-50%) scale(1.25)}.scene[data-state=preview] .reveal,.scene[data-state=overview] .reveal,.scene[data-state=preview] .scene-index,.scene[data-state=overview] .scene-index{visibility:hidden}.scene-hint{position:absolute;left:0;right:0;bottom:85px;text-align:center;font-size:10px;opacity:0;pointer-events:none;transition:opacity .5s}.scene[data-state=collage] .scene-hint{opacity:.5}.selected-preview{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:50px 20px 65px;overflow:auto;background:#fff}.preview-close{position:absolute;top:8px;left:22px;background:none;border:0;font-size:10px;min-height:44px}.preview-close span{margin-left:15px}.preview-stage{position:relative;width:min(52vw,700px);height:min(61svh,640px);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:height .65s var(--ease),width .65s var(--ease)}#preview-image{display:block;width:100%;height:100%;object-fit:contain;transform-origin:top left}.preview-ai{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);background:white;font-size:9px;padding:5px;white-space:nowrap}.preview-caption{text-align:center;margin-top:24px;max-width:650px}.preview-caption h2{font:400 14px Georgia,serif;margin:0;display:inline}.preview-category{font:11px Arial,sans-serif;display:inline;margin-left:8px}.preview-actions{display:flex;gap:24px;align-items:center;justify-content:center;margin-top:8px}.overview-toggle,.view-case{font-size:11px;border:0;background:none;min-height:44px;padding:10px 5px}.overview-toggle{text-decoration:underline;text-underline-offset:4px}#preview-overview{max-width:440px;text-align:center;font:16px/1.4 Georgia,serif;margin:25px 20px 0}.preview-description{margin:0}.scene[data-state=overview] .preview-stage{height:min(40svh,370px);width:min(40vw,480px)}.scene[data-state=overview] .preview-caption{margin-top:20px}.no-js{text-align:center;padding:25px}.index-heading{padding:105px 20px 100px}.index-heading .eyebrow,.index-heading>p:last-child{display:none}.index-heading h1{font:400 clamp(19px,2vw,28px)/1.2 Georgia,serif;letter-spacing:-.04em;margin:0}.project-grid{padding:0 8px 100px;gap:55px 8px}.card-media{aspect-ratio:4/5.1;background:#f4f4f3}.card-caption{padding:0 8px;margin-top:12px}.project-card p{padding:0 8px}.card-media img{transition:opacity .65s var(--ease),transform 1.2s var(--ease)}.card-media .card-alternate{position:absolute;inset:0;opacity:0;transform:scale(1.025)}.is-playing .card-media .card-alternate{opacity:1;transform:scale(1)}.project-card a:hover img{transform:none}.case-heading{padding:95px 15% 65px}.case-heading h1{font-size:clamp(36px,4.2vw,68px)}.case-heading .eyebrow{font-size:10px}.back{top:25px;left:22px}.info-open{position:fixed;left:18px;top:86px;z-index:8;background:rgba(245,245,244,.9);backdrop-filter:blur(8px);border-radius:3px;min-height:44px;padding:10px 15px}.case-gallery{padding:0 8px 80px;gap:65px 16px}.case-gallery.identity .case-item:first-child{padding:0}.case-gallery.editorial .case-item:first-child{background:#efefeb;padding:5% 16%}.case-gallery.poster .case-item{background:#151515}.case-gallery.poster{padding:70px 5%}.case-gallery.ai .source-reference{background:#f1f0ed;padding:25px}.source-reference figcaption{background:#e1e0da!important}.case-gallery.ai .case-item:not(.source-reference) figcaption{background:#e9ede4}.next-project{background:white;border-top:1px solid #eee}.next-project>a{font-size:clamp(35px,4.2vw,65px)}dialog{width:min(510px,94vw);padding:35px;box-shadow:-20px 0 80px #00000010}dialog::backdrop{background:#ffffff80;backdrop-filter:blur(8px)}dialog h2{margin-top:75px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.about-world{position:relative;perspective:1000px}.portrait-sculpture{position:sticky;top:28svh;height:0;z-index:2;pointer-events:none;display:flex;justify-content:center;transform:translateY(var(--lift,0px)) rotateY(var(--turn,0deg)) rotateZ(var(--tilt,0deg));transform-style:preserve-3d;will-change:transform}.portrait-sculpture img{width:clamp(210px,26vw,390px);height:clamp(210px,26vw,390px);object-fit:contain;filter:contrast(1.06);transform:translateY(-8%)}.about-opening{height:calc(100svh - 64px);min-height:620px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:70px 8% 100px;text-align:center}.about-opening .eyebrow{position:absolute;top:70px;font-size:10px}.about-opening h1{font:400 clamp(45px,6.6vw,108px)/1.15 Georgia,serif;letter-spacing:-.045em;margin:0;max-width:1250px}.about-byline{font-size:11px;position:absolute;top:75svh}.about-services{height:100svh;min-height:650px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:60px;text-align:center}.about-services p{font:20px/1.1 Georgia,serif}.about-services a{font-size:11px;border-bottom:1px solid;padding:10px}.about-chapter{height:110svh;min-height:760px;position:relative;padding:60px 10%;display:grid;grid-template-columns:1fr 1fr 1fr;align-content:center;column-gap:30px}.chapter-label{position:absolute;top:80px;left:0;right:0;display:flex;gap:30px;align-items:center;justify-content:center}.chapter-label>span:first-child{font-size:10px}.chapter-label h2{font-size:12px;font-weight:400}.chapter-label .roman{font:50px Georgia,serif}.chapter-left,.chapter-right{font:clamp(16px,1.55vw,23px)/1.45 Georgia,serif;max-width:330px;letter-spacing:-.02em;position:relative;transition:transform 1s var(--ease),opacity 1s var(--ease)}.chapter-left{grid-column:1;transform:translateY(-30px);opacity:.4}.chapter-right{grid-column:3;margin-top:170px;transform:translateY(30px);opacity:.4}.in-view .chapter-left,.in-view .chapter-right{transform:none;opacity:1}.chapter-left::after,.chapter-right::after{content:'';position:absolute;inset:20% -10% 30% 50%;background:radial-gradient(ellipse,#9b7cff55,transparent 65%);filter:blur(15px);opacity:0;mix-blend-mode:multiply;pointer-events:none;transition:opacity .8s}.in-view .chapter-left::after,.in-view .chapter-right::after{opacity:.6}.about-ending{position:relative;z-index:3;background:#fff;min-height:60svh;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:20px;padding:60px 6%;text-align:center}.about-ending>a:first-of-type{font:clamp(24px,4vw,60px) Georgia,serif;letter-spacing:-.04em}.contact{padding-top:110px}.contact h1{font-size:clamp(55px,7vw,100px)}@media(max-width:700px){header{height:60px;gap:9px}.wordmark{font-size:13px}.wordmark span{font-size:12px}nav{font-size:12px;gap:2px}nav a{min-height:40px;padding:4px 8px}nav sup{font-size:8px;margin-left:4px}main{padding-top:60px}.scene{height:calc(100svh - 60px)}.intro h1{font-size:27px}.intro .role{font-size:10px}.intro .eyebrow{font-size:8px}.constellation{width:84vw;height:48svh;top:45%}.tile{width:41px;height:59px}.tile:nth-child(3n){width:57px;height:43px}.scene-index{left:16px;bottom:28px}.scene-count{right:16px;bottom:28px}.reveal{bottom:13px;font-size:10px;padding:12px 4px}.scene-hint{bottom:75px;font-size:9px}.selected-preview{padding:55px 15px 50px;justify-content:center}.preview-close{top:0;left:10px;font-size:9px}.preview-stage{width:90vw;height:58svh}.preview-caption{margin-top:18px}.preview-caption h2{font-size:13px}.preview-category{display:block;font-size:10px;margin:6px 0 0}.preview-actions{gap:25px;margin-top:0}.scene[data-state=overview] .preview-stage{width:69vw;height:34svh}#preview-overview{font-size:15px;max-width:310px;margin:20px 8px 0}.scene[data-state=overview] .preview-caption{margin-top:15px}.index-heading{padding:75px 10% 65px}.index-heading h1{font-size:23px;max-width:340px;margin:auto}.project-grid{padding:0 8px 65px;gap:38px;grid-template-columns:1fr}.card-media{aspect-ratio:4/5}.case-heading{padding:90px 8% 45px}.case-heading h1{font-size:43px}.back{left:15px;top:18px}.info-open{top:auto;bottom:17px;left:50%;transform:translateX(-50%);box-shadow:0 2px 20px #0000000c}.case-gallery{padding:0 8px 50px;gap:20px}.case-gallery.editorial .case-item:first-child{padding:6%}.case-item.half-left,.case-item.half-right{grid-column:1/-1;margin:0}.case-gallery.ai .source-reference{padding:12px}.next-project{padding:60px 6% 90px}dialog{width:100vw;height:75dvh;inset:auto 0 0;border-radius:12px 12px 0 0;padding:25px}dialog h2{font-size:38px;margin-top:45px}dialog p{font-size:15px}.portrait-sculpture{top:33svh}.portrait-sculpture img{width:210px;height:210px}.about-opening{height:calc(100svh - 60px);min-height:620px;padding:50px 5% 100px}.about-opening h1{font-size:clamp(39px,10.8vw,65px);line-height:1.2}.about-opening .eyebrow{top:45px;font-size:8px}.about-byline{top:77svh;font-size:10px}.about-services{min-height:700px}.about-chapter{height:115svh;min-height:820px;grid-template-columns:1fr 1fr;padding:160px 7% 70px;gap:15px;align-content:space-between}.chapter-label{top:55px;gap:22px}.chapter-label .roman{font-size:40px}.chapter-left,.chapter-right{font-size:17px;max-width:215px;line-height:1.4}.chapter-left{grid-column:1/-1;align-self:start}.chapter-right{grid-column:1/-1;justify-self:end;margin:220px 0 0}.about-ending{min-height:50svh}.contact{padding-top:90px}.contact-email{font-size:24px}footer{padding-bottom:85px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.portrait-sculpture{transform:none!important;will-change:auto}.chapter-left,.chapter-right{transform:none;opacity:1}.chapter-left::after,.chapter-right::after{display:none}.tile{--px:0px!important;--py:0px!important}.card-alternate{display:none!important}}

.scene[data-state=intro],.scene[data-state=collage]{touch-action:none}.in-view .chapter-left,.in-view .chapter-right{filter:url(#text-warp)}.effect-defs{position:absolute;pointer-events:none}.page-home main{padding-top:64px}@media(max-width:700px){.page-home main{padding-top:60px}}@media(prefers-reduced-motion:reduce){.in-view .chapter-left,.in-view .chapter-right{filter:none}}
/* Clip perspective paint overflow without creating a scrolling ancestor for sticky content. */
html,body{overflow-x:clip}
/* Real-time 3D portrait: the canvas owns its pose; the sticky wrapper never tilts. */
.portrait-sculpture{transform:none!important;pointer-events:none;will-change:auto;z-index:4}.head-interactive{position:relative;display:block;pointer-events:auto;width:clamp(240px,29vw,420px);height:clamp(240px,29vw,420px);transform:translateY(-8%);padding:0;border:0;background:none;cursor:grab;touch-action:pan-y;-webkit-tap-highlight-color:transparent;flex:none}.head-interactive:active{cursor:grabbing}.head-interactive canvas{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .35s}.head-interactive.is-ready canvas{opacity:1}.portrait-sculpture .head-fallback{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transform:none;transition:opacity .35s}.is-ready .head-fallback{opacity:0}.head-interactive:disabled{cursor:default}.head-interactive:focus-visible{outline:1px solid #858c94;outline-offset:3px;border-radius:35%}@media(max-width:700px){.head-interactive{width:245px;height:245px}}@media(prefers-reduced-motion:reduce){.head-interactive.is-nudged{outline:1px solid #aaa;outline-offset:-20px;border-radius:40%}}

/* Approved trial: restore the earlier chrome portrait and its scroll motion. */
.portrait-sculpture{transform:translateY(var(--lift,0px)) rotateY(var(--turn,0deg)) rotateZ(var(--tilt,0deg))!important;pointer-events:none;z-index:4;will-change:transform}@media(prefers-reduced-motion:reduce){.portrait-sculpture{transform:none!important;will-change:auto}}
/* Spatial revision: portrait angle is fixed; only a quiet vertical float remains. */
.portrait-sculpture{top:35svh;transform:none!important;will-change:auto;z-index:4}
.portrait-float{position:relative;width:clamp(210px,26vw,360px);height:clamp(210px,26vw,360px);pointer-events:auto;animation:portrait-float 7s ease-in-out infinite}
.portrait-sculpture .portrait-float img{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transform:none;filter:none}
.portrait-gold{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .25s;background:radial-gradient(circle 85px at var(--gold-x,50%) var(--gold-y,50%),#ffedacbb,#d99528a0 38%,transparent 100%);mix-blend-mode:color;mask:url('/assets/ja-chrome.webp') center/contain no-repeat;-webkit-mask:url('/assets/ja-chrome.webp') center/contain no-repeat}
.has-gold .portrait-gold{opacity:1}
@keyframes portrait-float{0%,100%{translate:0 -3px}50%{translate:0 3px}}
.about-chapter{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:110px;min-height:950px;height:125svh;padding:160px 16px}
.chapter-label{position:relative;top:auto;left:auto;right:auto;gap:18px;justify-content:center;flex-wrap:wrap;width:max-content;max-width:90vw;transition:none}
.chapter-label .roman{font-size:34px}
.chapter-left,.chapter-right,.in-view .chapter-left,.in-view .chapter-right{width:min(340px,36vw);max-width:none;margin:0;text-align:center;opacity:1;transform:none;font-size:20px;transition:none}
.chapter-left::after,.chapter-right::after{display:none!important}
.about-services{gap:70px;min-height:1050px;padding:140px 16px}.about-services>div{width:min(340px,40vw);text-align:center}.about-services p{margin:0 0 20px}.about-services>a{display:block;text-align:center;width:max-content;max-width:90vw}
.repel-line{display:table;margin:0 auto;white-space:nowrap;position:relative;transition:none}
.about-opening h1{position:relative;z-index:1}.about-world{perspective:none}
.constellation{width:min(70vw,900px);height:min(72svh,680px);top:46%}
.constellation .tile{transform:translate(-50%,-50%) scale(var(--orb-scale,1));transition:opacity .4s;transition-delay:0s;will-change:auto}
.constellation .tile:hover,.constellation .tile:focus-visible{transform:translate(-50%,-50%) scale(calc(var(--orb-scale,1)*1.1));outline-offset:5px}
@media(max-width:700px){.portrait-float{width:145px;height:195px}.portrait-sculpture{top:38svh}.chapter-left,.chapter-right,.in-view .chapter-left,.in-view .chapter-right{width:43vw;font-size:15px;line-height:1.5}.chapter-label{font-size:10px;gap:8px}.chapter-label .roman{font-size:22px}.chapter-label h2{font-size:11px}.about-services>div{width:43vw}.about-services p{font-size:16px}.constellation{width:94vw;height:62svh;top:46%}.constellation .tile{width:43px;height:62px}.constellation .tile:nth-child(3n){width:57px;height:44px}.about-chapter{gap:120px;min-height:1050px}.about-services{min-height:1000px}}
@media(prefers-reduced-motion:reduce){.portrait-float{animation:none;translate:none}.portrait-sculpture{transform:none!important}.portrait-gold{transition:none}}

@media(max-width:700px){.chapter-left,.chapter-right,.in-view .chapter-left,.in-view .chapter-right{width:25vw}.about-services>div{width:25vw}.about-services>a{font-size:10px;max-width:25vw}.repel-line{white-space:nowrap}}
/* Anticipatory exclusion zone and compositor-only portrait float. */
.portrait-float{animation:portrait-drift 9s ease-in-out infinite;will-change:transform;translate:none;backface-visibility:hidden;transform:translate3d(0,0,0)}
@keyframes portrait-drift{0%,100%{transform:translate3d(0,-2px,0)}50%{transform:translate3d(0,2px,0)}}
.about-opening h1,.chapter-left,.chapter-right{filter:none!important}.repel-line{backface-visibility:hidden}.chapter-label{white-space:nowrap}
.constellation{width:min(49vw,660px);height:min(59svh,540px);top:46%;touch-action:none}
.constellation .tile,.constellation .tile:nth-child(3n){left:50%!important;top:50%!important;width:clamp(38px,4.4vw,64px);height:clamp(57px,6.6vw,96px);transform:translate(-50%,-50%) translate3d(var(--orb-x,0px),var(--orb-y,0px),0) scale(var(--orb-scale,1));transition:none;cursor:grab;user-select:none;-webkit-user-drag:none}
.constellation .tile img{width:100%;height:100%;object-fit:contain;pointer-events:none}.constellation .tile:hover,.constellation .tile:focus-visible{transform:translate(-50%,-50%) translate3d(var(--orb-x,0px),var(--orb-y,0px),0) scale(calc(var(--orb-scale,1)*1.06))}.is-dragging,.is-dragging .tile{cursor:grabbing!important}
.selected-preview{gap:0;padding:32px 20px 45px}.preview-stage{width:min(42vw,570px);height:56svh;flex-shrink:0}.preview-caption{order:1;margin:16px 0 0}.preview-caption h2{font-size:15px}.preview-category{font-size:11px}#preview-overview{display:block;order:2;max-width:480px;margin:16px 15px 0;font-size:16px;line-height:1.5}.preview-description{margin:0}.preview-actions,.preview-close{display:none!important}
.space-cursor{display:none;position:fixed;top:0;left:0;z-index:100;pointer-events:none;color:white;mix-blend-mode:difference;font:10px/1 Arial,sans-serif}.space-cursor.visible{display:block}.space-cursor i{display:block;width:10px;height:10px;margin:-5px;background:white;border-radius:50%}.space-cursor>span{display:none;position:absolute;top:14px;left:-12px}.space-cursor.can-close>span{display:block}.space-cursor.over-image i{width:15px;height:15px;margin:-7.5px}
@media(hover:hover) and (pointer:fine){.selected-preview,.selected-preview *{cursor:none}}
@media(max-width:700px){.portrait-float{width:130px;height:174px}.constellation{width:80vw;height:49svh}.constellation .tile,.constellation .tile:nth-child(3n){width:35px;height:53px}.preview-stage{width:79vw;height:51svh}.selected-preview{padding:25px 16px 40px}.preview-caption{max-width:85vw}.preview-caption h2{font-size:14px}#preview-overview{font-size:14px;max-width:310px;margin-top:14px}.chapter-label{font-size:9px;gap:5px}.chapter-label h2{font-size:10px}.chapter-label .roman{font-size:20px}}
@media(hover:none){.space-cursor{display:none!important}}
@media(prefers-reduced-motion:reduce){.portrait-float{animation:none;transform:none;will-change:auto}}
@media(min-width:701px) and (max-width:1100px){.chapter-left,.chapter-right,.in-view .chapter-left,.in-view .chapter-right{width:24vw;font-size:18px}.about-services>div{width:24vw}}
/* Current page expands; the other pages remain compact numbered squares. */
nav .nav-page{display:flex;align-items:center;justify-content:center;gap:0;width:34px;height:34px;min-height:34px;padding:0;flex:none;white-space:nowrap}
nav .nav-page .nav-name,nav .nav-page .nav-index{display:none}nav .nav-page .nav-number{display:block;font:15px/1 Georgia,serif}
nav .nav-page[aria-current]{width:auto;padding:0 12px;gap:6px}nav .nav-page[aria-current] .nav-name{display:inline}nav .nav-page[aria-current] .nav-index{display:inline;align-self:flex-start;margin:6px 0 0;font:8px/1 Arial,sans-serif}nav .nav-page[aria-current] .nav-number{display:none}
nav .nav-page:focus-visible{outline:2px solid #888;outline-offset:3px}.wordmark{view-transition-name:brand}.nav-page-1{view-transition-name:tab-one}.nav-page-2{view-transition-name:tab-two}.nav-page-3{view-transition-name:tab-three}
@view-transition{navigation:auto}
main{view-transition-name:notebook}
::view-transition-old(root),::view-transition-new(root){animation:none}
::view-transition-group(notebook){perspective:1800px;animation-duration:.65s;isolation:isolate}
::view-transition-old(notebook){transform-origin:left center;animation:sheet-out .65s cubic-bezier(.4,0,.2,1) both;backface-visibility:hidden}
::view-transition-new(notebook){transform-origin:right center;animation:sheet-in .65s cubic-bezier(.22,1,.36,1) both;backface-visibility:hidden}
::view-transition-group(tab-one),::view-transition-group(tab-two),::view-transition-group(tab-three){animation-duration:.5s;animation-timing-function:cubic-bezier(.22,1,.36,1);z-index:10}
@keyframes sheet-out{from{opacity:1;transform:rotateY(0) translateX(0)}to{opacity:0;transform:rotateY(-17deg) translateX(-6%)}}
@keyframes sheet-in{from{opacity:0;transform:rotateY(13deg) translateX(7%)}to{opacity:1;transform:rotateY(0) translateX(0)}}
html[data-page-direction=backward]::view-transition-old(notebook){transform-origin:right center;animation-name:sheet-back-out}html[data-page-direction=backward]::view-transition-new(notebook){transform-origin:left center;animation-name:sheet-back-in}
@keyframes sheet-back-out{from{opacity:1;transform:none}to{opacity:0;transform:rotateY(17deg) translateX(6%)}}
@keyframes sheet-back-in{from{opacity:0;transform:rotateY(-13deg) translateX(-7%)}to{opacity:1;transform:none}}
.page-leaving main{animation:sheet-out .24s ease-in both;transform-origin:left center}
.scene[data-state=intro] .intro .eyebrow{animation:entry-line .9s var(--ease) both}.scene[data-state=intro] .intro h1{animation:entry-line 1s .12s var(--ease) both}.scene[data-state=intro] .intro .role{animation:entry-line 1s .24s var(--ease) both}
@keyframes entry-line{from{opacity:0;transform:translate3d(0,16px,0);filter:blur(3px)}to{opacity:1;transform:none;filter:none}}
@media(max-width:700px){nav .nav-page{width:34px;height:36px;min-height:36px}nav .nav-page[aria-current]{padding:0 10px}nav .nav-page .nav-number{font-size:14px}nav .nav-page[aria-current] .nav-index{font-size:8px;margin-top:6px}}
@media(prefers-reduced-motion:reduce){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}.page-leaving main{animation:none}.scene[data-state=intro] .intro>*{animation:none!important}}

/* Contour revision: stationary chapter labels; ink-reactive wordmark. */
.chapter-label{transform:none!important;transition:none!important;align-self:center}
.wordmark.brand-contrast{position:fixed;z-index:60;color:#fff;mix-blend-mode:difference;pointer-events:auto;background:none;text-decoration:none}
/* Text carries the link; decoration is removed throughout the portfolio. */
a,a:hover,a:visited{ text-decoration:none!important }a,.text-link,.about-loop-contact a{border-bottom:0!important;cursor:pointer}.text-link::after,a::after{border-bottom:0!important}a:focus-visible,button:focus-visible{outline:1px solid currentColor;outline-offset:5px}a:hover{opacity:.68}.tile:hover,.project-card a:hover,.brand-contrast:hover{opacity:1}
.about-group{min-height:0;padding:85px 16px 65px;display:flex;flex-direction:column;align-items:center;gap:35px}.group-heading{font:11px/1.4 Arial,sans-serif;text-align:center;margin:0;font-weight:400;position:relative;z-index:1}.about-list{width:min(280px,27vw);text-align:center}.about-list p{font:16px/1.65 Georgia,serif;margin:0 0 7px}.about-list .experience-copy{font-size:16px;line-height:1.65;margin-bottom:28px}.about-loop-contact{min-height:65svh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;text-align:center;padding:90px 16px}.about-loop-contact>a{font:16px/1.5 Georgia,serif;max-width:90vw}.about-loop-contact>a:first-of-type{font-size:clamp(16px,2.5vw,30px)}
.page-about footer{display:none}.page-about .portrait-sculpture{position:fixed;left:0;right:0;top:35svh}.page-about .about-world{overflow:clip;overflow-clip-margin:0}.about-cycle{display:flow-root}.about-opening>h2{font:400 clamp(45px,6.6vw,108px)/1.15 Georgia,serif;letter-spacing:-.045em;margin:0;max-width:1250px}.about-opening{position:relative}.about-opening .eyebrow{left:0;right:0}.about-byline{left:0;right:0}.about-loop-contact [data-repel]{width:max-content}.page-about .group-heading{transform:none!important}
@media(max-width:700px){.about-group{padding:65px 12px 45px;gap:28px}.about-list{width:25vw}.about-list p,.about-list .experience-copy{font-size:13px;line-height:1.6}.group-heading{font-size:10px}.about-loop-contact>a{font-size:13px}.about-loop-contact>a:first-of-type{font-size:14px}.about-opening>h2{font-size:clamp(39px,10.8vw,65px);line-height:1.2}.page-about .portrait-sculpture{top:38svh}}
@media(min-width:701px) and (max-width:1100px){.about-list{width:24vw}}

html.about-loop-page{scrollbar-width:none}html.about-loop-page::-webkit-scrollbar{display:none}
/* Four restored chapters hold the expanded tools and experience groups. */
.about-book-chapter{padding:90px 0 30px}.about-book-chapter>.chapter-label{position:relative;display:flex;width:max-content;max-width:90vw;margin:0 auto 50px;top:auto;left:auto;right:auto;gap:16px;transform:none!important}.about-book-chapter .chapter-label .roman{font:34px/1 Georgia,serif}.chapter-summary{width:min(280px,27vw);margin:0 auto 35px;text-align:center}.chapter-summary p{font:16px/1.65 Georgia,serif;margin:0 0 35px}
/* Straight, 20%-of-height total travel. Tiny bottom recoil, no rotation or squash. */
.portrait-float{animation:portrait-breathe 6.4s infinite;animation-timing-function:cubic-bezier(.45,0,.55,1);transform:translate3d(0,-10%,0);will-change:transform}
@keyframes portrait-breathe{0%,100%{transform:translate3d(0,-10%,0)}44%{transform:translate3d(0,10%,0)}56%{transform:translate3d(0,8.1%,0)}65%{transform:translate3d(0,8.7%,0)}}
nav .nav-page{width:25px;height:36px;min-height:36px;border-radius:4px}nav .nav-page[aria-current]{width:auto;padding:0 11px}nav .nav-page .nav-number{font-size:13px}
/* Anticipation is visible before navigation; content then accelerates and settles. */
.nav-charging main{animation:page-tension .32s cubic-bezier(.55,0,.8,.4) both;transform-origin:left center}
@keyframes page-tension{0%,25%{transform:none}100%{transform:translate3d(-12px,0,0) scaleX(.987)}}
html[data-page-direction=backward].nav-charging main{transform-origin:right center;animation-name:page-tension-back}
@keyframes page-tension-back{0%,25%{transform:none}100%{transform:translate3d(12px,0,0) scaleX(.987)}}
::view-transition-group(notebook){animation-duration:.82s;perspective:1800px}
::view-transition-old(notebook){animation:pull-away .52s cubic-bezier(.75,0,.2,1) both;transform-origin:left center}
::view-transition-new(notebook){animation:pull-arrive .82s .04s cubic-bezier(.72,0,.16,1) both;transform-origin:right center}
@keyframes pull-away{0%,12%{opacity:1;transform:none}100%{opacity:0;transform:translateX(-30%) rotateY(-12deg)}}
@keyframes pull-arrive{0%{opacity:0;transform:translateX(28%) rotateY(10deg)}18%{opacity:.3;transform:translateX(25%) rotateY(9deg)}80%,100%{opacity:1;transform:none}}
html[data-page-direction=backward]::view-transition-old(notebook){animation-name:pull-away-back}html[data-page-direction=backward]::view-transition-new(notebook){animation-name:pull-arrive-back}
@keyframes pull-away-back{0%,12%{opacity:1;transform:none}100%{opacity:0;transform:translateX(30%) rotateY(12deg)}}
@keyframes pull-arrive-back{0%{opacity:0;transform:translateX(-28%) rotateY(-10deg)}18%{opacity:.3;transform:translateX(-25%) rotateY(-9deg)}80%,100%{opacity:1;transform:none}}
@media(max-width:700px){nav .nav-page{width:23px;height:34px;min-height:34px}nav .nav-page[aria-current]{padding:0 9px}.about-book-chapter{padding-top:70px}.about-book-chapter>.chapter-label{gap:10px;margin-bottom:35px}.about-book-chapter .chapter-label .roman{font-size:28px}.chapter-summary{width:25vw}.chapter-summary p{font-size:13px;line-height:1.6}}
@media(min-width:701px) and (max-width:1100px){.chapter-summary{width:24vw}}
@media(prefers-reduced-motion:reduce){.portrait-float{animation:none!important;transform:none!important;will-change:auto}.nav-charging main{animation:none!important}::view-transition-old(*),::view-transition-new(*),::view-transition-group(*){animation:none!important}}
/* Keep the fixed portrait in viewport space during anticipation on About. */
.nav-charging .page-about main{animation:none;transform:none}.nav-charging .page-about .about-cycle{animation:page-tension .32s cubic-bezier(.55,0,.8,.4) both;transform-origin:left center}html[data-page-direction=backward].nav-charging .page-about .about-cycle{animation-name:page-tension-back;transform-origin:right center}
@media(prefers-reduced-motion:reduce){.nav-charging .page-about .about-cycle{animation:none!important}}

/* Capture a viewport-sized root, never the tall cyclic main box. This prevents
   native group geometry interpolation from becoming a vertical page flight. */
main{view-transition-name:none!important}
::view-transition-group(root){animation:none!important;perspective:1800px;isolation:isolate}
::view-transition-old(root){animation:pull-away .52s cubic-bezier(.75,0,.2,1) both;transform-origin:left center;backface-visibility:hidden}
::view-transition-new(root){animation:pull-arrive .82s .04s cubic-bezier(.72,0,.16,1) both;transform-origin:right center;backface-visibility:hidden}
html[data-page-direction=backward]::view-transition-old(root){animation-name:pull-away-back}
html[data-page-direction=backward]::view-transition-new(root){animation-name:pull-arrive-back}
html.about-loop-page{scroll-behavior:auto;overflow-anchor:none}
@media(prefers-reduced-motion:reduce){::view-transition-old(root),::view-transition-new(root){animation:none!important}}
/* One continuous compositor-only path: no perspective rotation, scale or
   intermediate keyframe corners. A short pull flows into a restrained slide. */
.nav-charging main,.nav-charging .page-about .about-cycle{animation:smooth-charge .2s cubic-bezier(.45,0,.75,.45) both;transform-origin:center}
html[data-page-direction=backward].nav-charging main,html[data-page-direction=backward].nav-charging .page-about .about-cycle{animation-name:smooth-charge-back}
.nav-charging .page-about main{animation:none;transform:none}
@keyframes smooth-charge{from{transform:translate3d(0,0,0)}to{transform:translate3d(-6px,0,0)}}
@keyframes smooth-charge-back{from{transform:translate3d(0,0,0)}to{transform:translate3d(6px,0,0)}}
::view-transition-group(root){perspective:none}
::view-transition-old(root){animation:smooth-slide-out .54s cubic-bezier(.5,0,.2,1) both;transform-origin:center;mix-blend-mode:normal;backface-visibility:visible}
::view-transition-new(root){animation:smooth-slide-in .66s cubic-bezier(.5,0,.18,1) both;transform-origin:center;mix-blend-mode:normal;backface-visibility:visible}
html[data-page-direction=backward]::view-transition-old(root){animation-name:smooth-slide-out-back}
html[data-page-direction=backward]::view-transition-new(root){animation-name:smooth-slide-in-back}
@keyframes smooth-slide-out{from{opacity:1;transform:translate3d(0,0,0)}to{opacity:0;transform:translate3d(-7vw,0,0)}}
@keyframes smooth-slide-in{from{opacity:0;transform:translate3d(9vw,0,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@keyframes smooth-slide-out-back{from{opacity:1;transform:translate3d(0,0,0)}to{opacity:0;transform:translate3d(7vw,0,0)}}
@keyframes smooth-slide-in-back{from{opacity:0;transform:translate3d(-9vw,0,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@media(prefers-reduced-motion:reduce){.nav-charging main,.nav-charging .page-about .about-cycle{animation:none!important}::view-transition-old(root),::view-transition-new(root){animation:none!important}}
/* Timed title sequence, then the image sphere opens without a control strip. */
.scene[data-state=intro] .intro .eyebrow{animation:title-rise .8s .08s cubic-bezier(.22,1,.36,1) both}
.scene[data-state=intro] .intro h1{animation:none!important}
.scene[data-state=intro] .intro h1 span{display:inline-block;animation:title-rise 1s .2s cubic-bezier(.22,1,.36,1) both}
.scene[data-state=intro] .intro h1 span+span{animation-delay:.34s}
.scene[data-state=intro] .intro .role{animation:title-rise .9s .5s cubic-bezier(.22,1,.36,1) both}
@keyframes title-rise{from{opacity:0;transform:translate3d(0,13px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
.intro{transition:opacity .65s ease,transform .85s cubic-bezier(.22,1,.36,1)}
.scene:not([data-state=intro]) .intro{transform:translate3d(0,-18px,0);opacity:0}
.constellation{transition:transform 1.15s cubic-bezier(.22,1,.36,1),opacity .8s ease;transform:translate(-50%,-50%) scale(.72)}
.scene[data-state=collage] .constellation{transform:translate(-50%,-50%) scale(1)}
.scene[data-state=intro] .tile{opacity:0}.scene[data-state=collage] .tile{opacity:1;transition:opacity .65s ease var(--delay,0ms)}
.scene-hint{bottom:35px}
@media(prefers-reduced-motion:reduce){.scene[data-state=intro] .intro h1 span,.scene[data-state=intro] .intro .eyebrow,.scene[data-state=intro] .intro .role{animation:none!important}.intro,.constellation,.tile{transition:none!important}}
.intro h1 span{font:inherit}.intro h1 span+span{margin-left:.12em}
/* Five-second full-viewport white opening, isolated from the site navigation. */
body.page-home:has(.scene[data-state=intro]) header,body.page-home:has(.scene[data-state=intro])>.brand-contrast{visibility:hidden!important;pointer-events:none!important}
.page-home main{padding-top:0}.page-home .scene{height:100svh}.page-home .constellation{top:50%}
.intro{z-index:5;background:white;padding:0;overflow:hidden;transition:opacity .25s ease;pointer-events:none}
.intro-copy{position:relative;z-index:2;text-align:center;max-width:80vw}.intro h1{font-size:clamp(30px,3.4vw,50px);line-height:1.2;white-space:nowrap}.intro .eyebrow{font-size:9px;letter-spacing:.13em;margin:0 0 24px}.intro .role{font-size:11px;line-height:1.55;margin:23px auto 0;max-width:290px}
.intro-orbit{position:absolute;inset:0;z-index:1;pointer-events:none}
.intro-photo{position:absolute;left:50%;top:50%;width:clamp(75px,9vw,135px);height:auto;aspect-ratio:2/3;margin:0;transform-origin:center;will-change:transform,opacity}
.intro-photo img{display:block;width:100%;height:100%;object-fit:contain;box-shadow:0 10px 34px #00000008}
.intro-photo-0{--ix:-31vw;--iy:-22vh;--ir:-7deg}.intro-photo-1{--ix:-3vw;--iy:-32vh;--ir:4deg}.intro-photo-2{--ix:29vw;--iy:-22vh;--ir:7deg}.intro-photo-3{--ix:35vw;--iy:12vh;--ir:-4deg}.intro-photo-4{--ix:13vw;--iy:31vh;--ir:5deg}.intro-photo-5{--ix:-18vw;--iy:29vh;--ir:-6deg}.intro-photo-6{--ix:-35vw;--iy:10vh;--ir:4deg}
.scene[data-state=intro] .intro{animation:white-opening 5s linear both}
.scene[data-state=intro] .intro-photo{animation:photo-opening 5s var(--photo-delay) cubic-bezier(.25,.7,.2,1) both}
.scene[data-state=intro] .intro .eyebrow{animation:opening-copy 5s linear both}
.scene[data-state=intro] .intro h1 span,.scene[data-state=intro] .intro h1 span+span{animation:opening-name 5s cubic-bezier(.22,1,.36,1) both}
.scene[data-state=intro] .intro .role{animation:opening-role 5s linear both}
@keyframes photo-opening{0%{opacity:0;transform:translate(-50%,-50%) translate3d(0,0,0) scale(.12) rotate(0)}18%{opacity:1;transform:translate(-50%,-50%) translate3d(var(--ix),var(--iy),0) scale(.94) rotate(var(--ir))}64%{opacity:1;transform:translate(-50%,-50%) translate3d(var(--ix),var(--iy),0) scale(1) rotate(var(--ir))}100%{opacity:0;transform:translate(-50%,-50%) translate3d(0,0,0) scale(.025) rotate(0)}}
@keyframes opening-name{0%{opacity:0;transform:translate3d(0,12px,0)}18%,66%{opacity:1;transform:none}84%,100%{opacity:0;transform:translate3d(0,-9px,0)}}
@keyframes opening-copy{0%,5%{opacity:0;transform:translate3d(0,6px,0)}22%,65%{opacity:1;transform:none}82%,100%{opacity:0;transform:translate3d(0,-6px,0)}}
@keyframes opening-role{0%,13%{opacity:0;transform:translate3d(0,6px,0)}30%,65%{opacity:1;transform:none}82%,100%{opacity:0;transform:translate3d(0,-6px,0)}}
@keyframes white-opening{0%,84%{opacity:1}100%{opacity:0}}
.scene[data-state=intro] .constellation{animation:opening-globe 5s cubic-bezier(.22,1,.36,1) both;pointer-events:none}
.scene[data-state=intro] .tile{opacity:1;transition:none}
@keyframes opening-globe{0%,85%{opacity:0;transform:translate(-50%,-50%) scale(.68)}100%{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.scene:not([data-state=intro]) .intro{opacity:0;transform:none;visibility:hidden}
@media(max-width:700px){.intro h1{font-size:clamp(23px,6.5vw,31px)}.intro-copy{max-width:94vw}.intro .eyebrow{font-size:7px;letter-spacing:.08em;margin-bottom:18px}.intro .role{font-size:9px;max-width:210px;margin-top:17px}.intro-photo{width:clamp(44px,13vw,64px)}.intro-photo-0{--ix:-30vw;--iy:-23vh}.intro-photo-1{--ix:-1vw;--iy:-32vh}.intro-photo-2{--ix:30vw;--iy:-23vh}.intro-photo-3{--ix:33vw;--iy:17vh}.intro-photo-4{--ix:14vw;--iy:31vh}.intro-photo-5{--ix:-15vw;--iy:30vh}.intro-photo-6{--ix:-33vw;--iy:16vh}}
@media(prefers-reduced-motion:reduce){.scene[data-state=intro] .intro,.scene[data-state=intro] .intro-photo,.scene[data-state=intro] .intro-copy>*{animation:none!important}.scene[data-state=intro] .intro h1 span{animation:none!important}.scene[data-state=intro] .intro-photo{opacity:1;transform:translate(-50%,-50%) translate(var(--ix),var(--iy));will-change:auto}.scene[data-state=intro] .constellation{animation:none!important;opacity:0}}

.scene.intro-paused .intro,.scene.intro-paused .intro *,.scene.intro-paused .constellation{animation-play-state:paused!important}

/* Pointer capture keeps globe drags active outside the sphere boundary. */
.page-home .scene-stage{touch-action:none}.scene.is-dragging{user-select:none}.scene.is-dragging .tile{pointer-events:auto}

/* Spherical footprint; all 18 cards share a focal-depth scale and stay billboarded. */
.page-home .constellation{width:min(68vw,74svh,720px);height:min(68vw,74svh,720px)}
@media(max-width:700px){.page-home .constellation{width:88vw;height:88vw}}
/* Constant-speed fill: one linear sweep, with no intermediate easing stops. */
.page-about .portrait-float{animation:portrait-breathe 6.4s cubic-bezier(.45,0,.55,1) infinite,portrait-fill 2s 0s linear both;will-change:transform,clip-path}
@keyframes portrait-fill{
 from{clip-path:polygon(0 102%,12% 103%,25% 102%,38% 103%,50% 102%,63% 103%,75% 102%,88% 103%,100% 102%,100% 105%,0 105%)}
 to{clip-path:polygon(0 -5%,12% -4%,25% -5%,38% -4%,50% -5%,63% -4%,75% -5%,88% -4%,100% -5%,100% 105%,0 105%)}
}
@media(prefers-reduced-motion:reduce){.page-about .portrait-float{animation:none!important;clip-path:none;will-change:auto}}

/* Shared-image flight: the globe stays behind a separately fading white veil. */
.scene[data-state=preview] .constellation{opacity:1;transform:translate(-50%,-50%) scale(1);pointer-events:none}
.selected-preview{background:transparent;isolation:isolate}
.selected-preview::before{content:'';position:fixed;inset:0;background:#fff;z-index:-1;pointer-events:none;opacity:1}
.selected-preview.is-opening::before{animation:preview-veil-in .7s .18s ease both}
.selected-preview.is-opening .preview-caption,.selected-preview.is-opening #preview-overview{animation:preview-details-in .4s .65s ease both}
.selected-preview.is-closing::before{animation:preview-veil-out .5s ease both}
.selected-preview.is-closing .preview-caption,.selected-preview.is-closing #preview-overview{opacity:0}
.preview-flight{position:fixed;z-index:45;pointer-events:none;object-fit:contain;transform-origin:0 0;will-change:transform}
@keyframes preview-veil-in{from{opacity:0}to{opacity:1}}
@keyframes preview-veil-out{from{opacity:1}to{opacity:0}}
@keyframes preview-details-in{from{opacity:0;transform:translate3d(0,8px,0)}to{opacity:1;transform:none}}
/* Letter-led five-second entrance, no photographs. */
.intro-doors{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:.12em;font:400 clamp(80px,13vw,180px)/1 Georgia,serif;letter-spacing:-.08em;perspective:900px;z-index:3;pointer-events:none}
.intro-door{display:block;backface-visibility:hidden}
.intro-door-j{transform-origin:left center}.intro-door-d{transform-origin:right center}
.scene[data-state=intro] .intro-door-j{animation:initial-j 5s cubic-bezier(.5,0,.2,1) both}
.scene[data-state=intro] .intro-door-d{animation:initial-d 5s cubic-bezier(.5,0,.2,1) both}
@keyframes initial-j{0%{opacity:0;transform:translateY(12px)}10%,22%{opacity:1;transform:none}48%,100%{opacity:0;transform:translateX(-180px) rotateY(-65deg)}}
@keyframes initial-d{0%,7%{opacity:0;transform:translateY(12px)}17%,22%{opacity:1;transform:none}48%,100%{opacity:0;transform:translateX(180px) rotateY(65deg)}}
.scene[data-state=intro] .intro h1 .name-jawad{animation:unfold-jawad 5s cubic-bezier(.22,1,.36,1) both}
.scene[data-state=intro] .intro h1 .name-abdulqader{animation:unfold-abdulqader 5s cubic-bezier(.22,1,.36,1) both}
@keyframes unfold-jawad{0%,24%{opacity:0;clip-path:inset(0 0 0 100%);transform:translateX(16px)}50%,78%{opacity:1;clip-path:inset(0);transform:none}95%,100%{opacity:0;clip-path:inset(0);transform:translateY(-6px)}}
@keyframes unfold-abdulqader{0%,24%{opacity:0;clip-path:inset(0 100% 0 0);transform:translateX(-16px)}50%,78%{opacity:1;clip-path:inset(0);transform:none}95%,100%{opacity:0;clip-path:inset(0);transform:translateY(-6px)}}
.scene[data-state=intro] .intro .eyebrow,.scene[data-state=intro] .intro .role{animation:letter-intro-detail 5s linear both}
@keyframes letter-intro-detail{0%,40%{opacity:0;transform:translateY(5px)}56%,78%{opacity:1;transform:none}95%,100%{opacity:0;transform:translateY(-5px)}}
.page-about .portrait-float{animation-play-state:running,paused}
.portrait-entered .page-about .portrait-float{animation-play-state:running,running}
@media(prefers-reduced-motion:reduce){.selected-preview::before,.selected-preview.is-opening .preview-caption,.selected-preview.is-opening #preview-overview{animation:none!important}.scene[data-state=intro] .intro-doors{display:none}.scene[data-state=intro] .intro h1 span,.scene[data-state=intro] .intro .eyebrow,.scene[data-state=intro] .intro .role{animation:none!important;opacity:1;transform:none;clip-path:none}}

/* Projects: aligned portrait tiles, narrow regular gutters, stable hover media. */
.page-work .index-heading{padding:110px 18px 90px;min-height:240px;display:grid;place-content:center}
.page-work .index-heading h1{font:400 clamp(20px,2vw,28px)/1.3 Georgia,serif;letter-spacing:-.025em;margin:0}
.page-work .index-heading>p{display:none}
.page-work .project-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:48px 8px;padding:0 8px 80px}
.page-work .card-media{aspect-ratio:3/4;background:#f6f6f5}
.page-work .card-media img,.page-work .card-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:var(--cover-fit,contain);transform:none!important;transition:opacity .22s ease}
.page-work .card-alternate,.page-work .card-video{opacity:0}
.page-work .is-previewing .card-alternate,.page-work .is-previewing .card-video{opacity:1}
.page-work .card-caption{margin-top:10px}.page-work .card-caption h2{font:400 13px/1.3 Arial,sans-serif}.page-work .project-card p{font:400 16px/1.3 Georgia,serif;color:#141414;margin:4px 0 0}
.project-view-cursor{position:fixed;left:0;top:0;z-index:90;pointer-events:none;mix-blend-mode:difference;color:#fff;font:13px/1 Arial,sans-serif;opacity:0}.project-view-cursor.visible{opacity:1}
@media(hover:hover) and (pointer:fine){.page-work .card-media{cursor:none}}
/* Editorial galleries: full-width image followed by a level pair. */
.page-work .case-heading{padding:105px 16px 80px;min-height:240px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.page-work .case-heading h1{font:400 18px/1.3 Arial,sans-serif;letter-spacing:-.02em;order:0;margin:0 0 8px}
.page-work .case-heading>.eyebrow{font:400 22px/1.3 Georgia,serif;text-transform:none;letter-spacing:0;order:1;margin:0}
.page-work .case-heading .back{left:10px;top:18px}.page-work .info-open{position:fixed;left:8px;right:auto;top:8px;bottom:auto;transform:none;z-index:6;background:#f1f1efdd;backdrop-filter:blur(8px);border-radius:4px;padding:9px 11px;font:16px Georgia,serif}
.page-work .case-gallery{padding:0 8px 60px;gap:8px;background:white;align-items:stretch}
.page-work .case-item,.page-work .case-item.half-left,.page-work .case-item.half-right{margin:0;padding:0!important;min-width:0;background:#f6f6f5}
.page-work .case-item.half-left{grid-column:1}.page-work .case-item.half-right{grid-column:2}
.page-work .case-item img{display:block;width:100%;height:auto;max-height:110svh;object-fit:contain}
.page-work .case-item.half-left,.page-work .case-item.half-right{display:grid;grid-template-rows:1fr auto}
.page-work .case-item.half-left img,.page-work .case-item.half-right img{height:100%;max-height:95svh;object-fit:contain}
.page-work dialog{inset:68px auto auto 8px;width:min(430px,calc(100vw - 16px));height:auto;max-height:calc(100dvh - 84px);padding:20px;background:#eeeeeedf;backdrop-filter:blur(16px);border-radius:4px}
.page-work dialog::backdrop{background:#0000000b}.page-work dialog h2{font:400 23px Georgia,serif;margin:32px 0 22px}.page-work dialog p{font:16px/1.5 Georgia,serif}.page-work dialog dl{margin-top:25px}.page-work .info-close{font-size:13px}
.lens-defs{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}
.edge-lens{position:fixed;left:0;height:54px;z-index:4;pointer-events:none;overflow:hidden;contain:paint;user-select:none}
.edge-lens-top{top:0;mask-image:linear-gradient(#000 45%,transparent)}.edge-lens-bottom{bottom:0;mask-image:linear-gradient(transparent,#000 55%)}
.edge-lens-window{width:100%;height:100%;overflow:hidden}.edge-lens-surface{position:absolute;left:0;top:0;width:100%;transform-origin:0 0;will-change:transform}
.edge-lens main{padding-top:64px!important}.edge-lens .card-media img{transition:none}.nav-charging .edge-lens{visibility:hidden}
@media(max-width:1000px){.page-work .project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.page-work .project-grid{grid-template-columns:1fr;padding:0 6px 60px;gap:34px}.page-work .index-heading{padding:80px 18px 65px;min-height:210px}.page-work .case-heading{padding:95px 14px 60px;min-height:225px}.page-work .case-gallery{padding:0 6px 45px;gap:6px}.page-work .case-item.half-left,.page-work .case-item.half-right{grid-column:1/-1}.page-work .info-open{font-size:11px;top:65px;left:6px;padding:7px 9px}.edge-lens{height:32px}.edge-lens main{padding-top:60px!important}}
@media(prefers-reduced-motion:reduce){.edge-lens{display:none}.page-work .card-media img{transition:none}}

/* Direct backdrop glass replaces duplicated lens strips and separated RGB edges. */
.project-glass{position:fixed;left:0;right:0;height:48px;z-index:4;pointer-events:none;user-select:none;backdrop-filter:blur(2.4px) saturate(1.025);-webkit-backdrop-filter:blur(2.4px) saturate(1.025);background:linear-gradient(90deg,#ffffff04,#ffffff0b 45%,#ffffff04)}
.project-glass-top{top:0;mask-image:linear-gradient(#000,transparent);-webkit-mask-image:linear-gradient(#000,transparent)}
.project-glass-bottom{bottom:0;mask-image:linear-gradient(transparent,#000);-webkit-mask-image:linear-gradient(transparent,#000)}
.nav-charging .project-glass{visibility:hidden}
@media(max-width:700px){.project-glass{height:30px;backdrop-filter:blur(1.8px);-webkit-backdrop-filter:blur(1.8px)}}
@media(prefers-reduced-motion:reduce){.project-glass{display:none}}

/* A continuous displacement field meets the clear page at zero distortion. */
.project-glass{height:48px;background:transparent;mask-image:none;-webkit-mask-image:none}
.project-glass-top{backdrop-filter:url(#edge-glass-top);-webkit-backdrop-filter:url(#edge-glass-top)}
.project-glass-bottom{backdrop-filter:url(#edge-glass-bottom);-webkit-backdrop-filter:url(#edge-glass-bottom)}
@media(max-width:700px){.project-glass{height:30px}}