/* One continuous document, with native scrolling and a restrained paper surface. */
html{scroll-behavior:smooth;scroll-padding-top:0;overflow-anchor:none}
body{overflow-x:clip}
#portfolio{overflow:clip}
.stage{z-index:0}
.scroll-invitation{position:absolute;bottom:74px;left:4%;display:flex;align-items:center;gap:22px;font-size:9px;letter-spacing:.18em;color:#c6d2e1;z-index:3}
.scroll-invitation i{font-style:normal;font-size:25px;animation:scroll-nudge 1.8s ease-in-out infinite}
.hero-copy{translate:0 calc(var(--hero-scroll,0) * -90px)}
.hero-footer,.hero-nav{filter:opacity(calc(1 - var(--hero-scroll,0) * .85))}
.hero-footer{justify-content:center}
#scroll-story{position:relative;z-index:1;overflow:clip;border-radius:0;margin-top:0;padding-top:0;box-shadow:none}
.story-header{position:sticky;top:0;z-index:30;min-height:80px;display:flex;justify-content:space-between;align-items:center;padding:17px 4%;background:#fafaf7f5;backdrop-filter:blur(15px);border-bottom:1px solid #dce1d6}
.current-chapter{font-size:9px;letter-spacing:.16em;color:#78826e}
.reading-progress{position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:#4c6548;transform:scaleX(var(--reading,0));transform-origin:left;pointer-events:none}
.story-section{position:relative;scroll-margin-top:80px;border-bottom:1px solid #dce2d5}
.story-section .section-content{margin:0 auto;padding:100px 5% 110px;min-height:0}
.story-section .section-heading:focus{outline:none}
#work .section-content{padding-top:55px;padding-bottom:55px}
#work.is-pinned{height:calc(100svh - 80px + var(--work-travel,180vh))}
#work.is-pinned>.section-content{position:sticky;top:80px;min-height:calc(100svh - 80px);display:flex;flex-direction:column;justify-content:center;padding-top:18px;padding-bottom:28px}
#work.is-pinned .work-layout{min-height:0;flex:1}
#work.is-pinned .project-shelf{scroll-behavior:auto;scroll-snap-type:none}
#work.is-pinned .project-card{rotate:var(--scroll-angle,0deg)}
#work.is-pinned .gallery-end{margin-top:8px}
#work.is-pinned .card-media{max-height:42vh}
#work.is-pinned .project-shelf{padding-top:35px;padding-bottom:40px}
.film-chapter{display:grid;grid-template-columns:.85fr 1.15fr;gap:7%;align-items:start}
.film-intro{position:sticky;top:135px;padding-top:25px}
.film-intro .section-heading{font-size:clamp(65px,8vw,120px)}
.film-intro .section-lead{max-width:330px;margin-bottom:28px}
.film-intro .project-description{max-width:310px;font-size:13px}
.film-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px 26px;align-items:start;padding:15px 10px}
.film-print{margin:0;min-width:0;transform:rotate(var(--scroll-turn,-2deg));transform-origin:50% 50%;background:#fff;box-shadow:0 23px 40px -30px #1c301c55;padding:13px;border:1px solid #e2e6db;scroll-margin-top:100px}
.film-print:nth-child(2n){margin-top:120px}
.film-print-top{display:flex;justify-content:space-between;font-size:7px;letter-spacing:.1em;color:#839077;padding:2px 0 12px}
.film-player video{display:block;width:100%;aspect-ratio:9/16;object-fit:contain;background:#0b1410}
.film-print:focus-within{transform:none}
.film-print figcaption{padding:10px 3px 4px}
.film-print h3{font-size:20px;font-weight:400;letter-spacing:-.04em;margin:5px 0 9px}
.film-print p{font-size:10px;line-height:1.7;color:#79816e;margin:0}
.collab-heading{display:grid;grid-template-columns:.8fr 1.2fr;gap:6%;align-items:start;margin-bottom:50px}
.collab-heading .section-kicker{padding-top:12px}
.collab-heading .section-heading{font-size:clamp(45px,5vw,76px)}
.collab-row{display:grid;grid-template-columns:35px 150px minmax(0,1fr) 40px;gap:35px;align-items:center;padding:42px 0;border-top:1px solid #dce1d5;scroll-margin-top:100px}
.collab-number{font-size:9px;color:#8b937f;align-self:start;padding-top:7px}
.collab-mark{aspect-ratio:1;background:var(--brand-bg);display:grid;place-items:center;transform:rotate(-4deg);transition:transform .8s var(--ease)}
.collab-mark img{width:86%;height:86%;object-fit:contain}
.collab-row:hover .collab-mark{transform:rotate(3deg)}
.collab-copy h3{font-size:35px;letter-spacing:-.045em;font-weight:300;margin:0 0 10px}
.collab-copy .project-discipline{font-size:8px;margin:0 0 18px}
.collab-copy>p:not(.project-discipline){font-size:13px;line-height:1.7;color:#78826c;max-width:640px;margin:8px 0}
.collab-caption{display:block;font-size:7px;letter-spacing:.1em;color:#8a947f;margin-top:17px}
.collab-arrow{font-size:34px;color:#788a68;transition:transform .6s var(--ease)}
.collab-row:hover .collab-arrow{transform:translate(5px,-5px)}
.motion-band{overflow:hidden;padding:56px 0 65px;border-bottom:1px solid #dce1d5;background:#edf0e6}
.motion-band>div{font-size:clamp(55px,9vw,150px);line-height:1.2;letter-spacing:-.055em;white-space:nowrap;transform:translateX(var(--band-x,0px));color:#718062;will-change:transform}
.motion-band em{font-family:Georgia,serif;font-weight:400;margin:0 .2em}
#experience .experience-layout>div:first-child{top:135px}
.timeline::after{content:"";position:absolute;left:0;top:10px;bottom:35px;width:1px;background:#425c3b;transform:scaleY(var(--timeline-progress,0));transform-origin:top}
.timeline .experience-row::before{z-index:1}
#lab .practice:nth-child(2n){margin-top:70px}
.study{transform:rotate(var(--scroll-turn,0deg));transition:none}
.study-0 i{rotate:var(--study-turn,0deg)}
.study-1 i{translate:calc(var(--i) * .2px) 0;rotate:calc(var(--study-turn,0deg) * .13)}
.study-2 i{rotate:calc(var(--study-turn,0deg) * -.3)}
.study-3 i{rotate:calc(var(--study-turn,0deg) * .15)}
#about .about-photo{transform:rotate(var(--scroll-turn,3deg));overflow:hidden;transition:none}
#about .about-photo-frame{overflow:hidden;isolation:isolate}
#about .about-photo img{translate:0 var(--image-shift,0px);scale:1.14}
#about .about-photo figcaption{position:relative;background:var(--paper);padding-top:15px;margin-top:0}
#contact .section-content{padding-top:130px;padding-bottom:130px}
.contact-art{rotate:var(--scroll-turn,0deg)}
.story-footer{display:flex;justify-content:space-between;align-items:center;gap:25px;padding:32px 5%;font-size:8px;letter-spacing:.15em;color:#7b876c;border-top:1px solid #d9e0d1}
.story-footer a{color:#405839}
@keyframes scroll-nudge{50%{transform:translateY(7px)}}
@media(min-width:800px) and (max-height:680px){#work.is-pinned .project-shelf{padding-block:20px}#work.is-pinned .work-intro .section-heading{font-size:45px}#work.is-pinned .card-caption{min-height:84px;padding:12px 14px}#work.is-pinned .gallery-hint{margin-top:12px}#work.is-pinned .card-caption h3{font-size:21px}#work.is-pinned .card-media{max-height:33vh}}
@media(max-width:1000px){.film-chapter{grid-template-columns:.8fr 1.2fr;gap:5%}.film-grid{gap:40px 15px;padding-inline:0}.film-print{padding:9px}.film-print p{font-size:9px}.film-intro .section-heading{font-size:70px}.collab-row{grid-template-columns:25px 120px minmax(0,1fr) 28px;gap:20px}.collab-copy h3{font-size:29px}.collab-copy>p:not(.project-discipline){font-size:12px}}
@media(max-width:799px){
 html{scroll-padding-top:0}.story-header{min-height:72px;padding:13px 25px}.current-chapter{font-size:7px;letter-spacing:.09em}.story-header .wordmark{font-size:11px}.story-header .inner-menu-toggle{font-size:8px}
 .story-section{scroll-margin-top:72px}.story-section .section-content{padding:70px 25px 80px}.work-layout{grid-template-columns:1fr}.work-intro{position:relative}.work-intro .section-heading{font-size:55px}.gallery-controls{position:absolute;right:0;bottom:28px}.project-shelf{margin-inline:-25px;padding-inline:40px}.gallery-end{margin-left:0}.work-footnote{max-width:180px}.work-intro .section-lead{margin-bottom:0}
 .film-chapter{grid-template-columns:1fr;gap:35px}.film-intro{position:static;padding:0}.film-intro .section-heading{font-size:75px}.film-intro .section-lead,.film-intro .project-description{max-width:500px}.film-grid{gap:40px 20px}.film-print:nth-child(2n){margin-top:75px}.film-print h3{font-size:20px}.film-print p{font-size:11px}.film-print-top{font-size:7px}
 .collab-heading{grid-template-columns:1fr;gap:0;margin-bottom:20px}.collab-heading .section-heading{font-size:48px}.collab-row{grid-template-columns:24px 85px minmax(0,1fr);gap:17px;padding-block:30px}.collab-copy h3{font-size:27px}.collab-arrow{display:none}.collab-copy>p:not(.project-discipline){font-size:12px}.collab-caption{font-size:7px}.collab-mark{align-self:start;margin-top:8px}.collab-row{scroll-margin-top:90px}
 .experience-layout>div:first-child{position:static!important}.motion-band{padding-block:35px}.motion-band>div{font-size:70px}#lab .practice:nth-child(2n){margin-top:0}#contact .section-content{padding-block:85px}.story-footer{flex-wrap:wrap;padding:28px 25px;line-height:1.7;font-size:7px}.story-footer span:last-child{display:none}
}
@media(max-width:480px){.film-grid{grid-template-columns:1fr;gap:45px;padding-inline:20px}.film-print:nth-child(2n){margin-top:0}.film-print{padding:13px}.film-print p{font-size:12px}.film-print h3{font-size:26px}.film-print-top{font-size:8px}.collab-row{grid-template-columns:22px 65px minmax(0,1fr);gap:12px}.collab-copy h3{font-size:24px}.collab-heading .section-heading{font-size:42px}.scroll-invitation{left:auto;right:28px;bottom:228px;gap:9px;font-size:6px;writing-mode:vertical-rl}.scroll-invitation i{font-size:19px}.hero-copy{max-width:85%}.current-chapter{max-width:120px;text-align:center;font-size:6px}.story-header{gap:10px}.project-shelf{padding-top:32px;padding-bottom:40px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-copy{translate:none}.hero-footer,.hero-nav{filter:none}.motion-band>div{transform:none}.film-print,.study,#about .about-photo,.contact-art{transform:none;rotate:none}.study i{rotate:none}#about .about-photo img{translate:none;scale:1}.scroll-invitation i{animation:none}.work-chapter{height:auto!important}}
/* Collaboration room: one changing exhibit, rather than another project list. */
.gallery-instruction{font-size:12px;line-height:1.7;color:#76816d;max-width:230px}
.brand-room{border-top:1px solid #ccd4c4}
.brand-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:28px}
.brand-tabs button{position:relative;display:flex;align-items:center;gap:12px;text-align:left;font-size:16px;letter-spacing:-.035em;min-height:75px;color:#87917c;transition:color .3s}
.brand-tabs button span{font-size:8px;letter-spacing:.1em}.brand-tabs button i{font-style:normal;margin-left:auto;opacity:0;translate:-8px 8px;transition:opacity .4s,translate .5s var(--ease)}
.brand-tabs button::before{content:"";position:absolute;left:0;right:0;top:-1px;height:2px;background:#344b30;transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease)}
.brand-tabs button[aria-selected=true]{color:#233420}.brand-tabs button[aria-selected=true]::before{transform:scaleX(1)}.brand-tabs button[aria-selected=true] i{opacity:1;translate:0 0}
.brand-tabs button:hover{color:#233420}.brand-tabs button:focus-visible{outline:1px solid #617154;outline-offset:4px}
.brand-panel{display:grid;grid-template-columns:1.15fr 1fr;gap:7%;align-items:center;min-height:500px}.brand-panel[hidden]{display:none}
.brand-canvas{position:relative;min-width:0;aspect-ratio:1;display:grid;place-items:center;overflow:hidden;background:#e9ede3;perspective:900px;isolation:isolate;touch-action:pan-y}
.brand-canvas::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(145deg,#fff5,transparent 55%);z-index:3}
.brand-watermark{position:absolute;left:-7%;top:12%;font-size:clamp(80px,11vw,150px);white-space:nowrap;letter-spacing:-.07em;color:#cdd5c4;rotate:-90deg;transform-origin:50%;translate:var(--exhibit-shift,0px) 0;opacity:.6}
.brand-object{position:relative;z-index:2;width:58%;aspect-ratio:1;background:var(--brand-bg);display:grid;place-items:center;box-shadow:20px 40px 45px -24px #243a2d66;transform:rotateX(var(--object-y,0deg)) rotateY(var(--object-x,0deg)) rotate(-8deg);translate:0 var(--exhibit-lift,0px);transition:transform .25s ease-out;will-change:transform}
.brand-object img{display:block;width:86%;height:86%;object-fit:contain}
.brand-orbit{position:absolute;width:87%;aspect-ratio:1;border:1px solid #a3b196;border-radius:50%;rotate:var(--exhibit-angle,0deg);transform:rotateX(57deg) rotateZ(-30deg)}
.brand-orbit::before,.brand-orbit::after{content:"";position:absolute;inset:12%;border:1px solid #a3b19699;border-radius:50%}.brand-orbit::after{inset:-9%;border-style:dashed;opacity:.4}
.brand-coordinate{position:absolute;left:22px;top:22px;font-size:8px;letter-spacing:.16em;color:#6d7c61;z-index:3}
.brand-medium{position:absolute;bottom:22px;right:22px;text-align:right;text-transform:uppercase;font-size:8px;letter-spacing:.12em;line-height:1.8;color:#6d7c61;z-index:3}
.brand-story{padding:15px 0}.brand-story-number{display:block;font-size:9px;letter-spacing:.2em;color:#88917e;margin-bottom:28px}
.brand-story .project-discipline{font-size:8px;margin-bottom:14px}.brand-story h3{font-size:clamp(45px,5.5vw,77px);font-weight:300;letter-spacing:-.065em;line-height:1.02;margin:0 0 24px}
.brand-summary{font-size:17px;line-height:1.6;font-weight:300;color:#59674f;max-width:370px}
.brand-contribution{border-top:1px solid #cfd7c6;margin-top:27px;padding-top:22px;max-width:390px}.brand-contribution>span{font-size:8px;letter-spacing:.16em;color:#7d8970}.brand-contribution p{font-size:12px;line-height:1.8;color:#7a856e;margin:12px 0 0}
.brand-story .project-roles{margin:22px 0}.brand-context{font-size:7px;letter-spacing:.08em;line-height:1.8;color:#88917e;display:block;max-width:310px}
.brand-room-footer{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #ccd4c4;padding:23px 0 28px;margin-top:25px;gap:20px}.brand-room-footer>span{font-size:8px;letter-spacing:.12em;color:#7f8974}.brand-room-footer>div{display:flex;align-items:center;gap:20px}.brand-counter{font-size:9px;letter-spacing:.1em;color:#737f68;white-space:nowrap}.brand-room-footer button{display:grid;place-items:center;width:43px;height:43px;border:1px solid #c8d1bf;border-radius:50%;font-size:21px;transition:background .4s,color .4s,rotate .5s var(--ease)}.brand-room-footer button:hover{background:#334a2f;color:#fff;rotate:-15deg}
/* Scroll carries motion between the headline, image, and supporting details. */
.story-section:not(#work) .section-heading{translate:var(--heading-drift,0px) 0}
.film-print{scale:var(--film-scale,1)}
.experience-row{translate:var(--row-drift,0px) 0;opacity:var(--row-opacity,1)}
.timeline .experience-row::before{scale:var(--dot-scale,1)}
.study-3 i{scale:1 var(--wave-scale,1)}
#lab .practice .eyebrow{letter-spacing:calc(.12em + var(--practice-spacing,0em))}
#about .about-details{translate:0 var(--details-rise,0px)}
#contact{overflow:hidden;isolation:isolate}
#contact::before{content:"LET’S TALK";position:absolute;bottom:3%;left:-3%;white-space:nowrap;font-size:clamp(90px,21vw,320px);font-weight:300;letter-spacing:-.07em;color:#e8ecdf;z-index:-1;translate:var(--contact-drift,0px) 0}
.contact-art .orbit-one{rotate:var(--orbit-turn,0deg)}.contact-art .orbit-two{rotate:calc(var(--orbit-turn,0deg) * -.6)}.contact-art .orbit-three{rotate:calc(var(--orbit-turn,0deg) * 1.3)}
@media(max-width:1000px){.brand-panel{gap:5%;min-height:430px}.brand-story h3{font-size:48px}.brand-summary{font-size:14px}.brand-contribution p{font-size:11px}.brand-tabs button{font-size:14px;gap:8px}.brand-story-number{margin-bottom:20px}}
@media(max-width:799px){.brand-panel{grid-template-columns:1fr;gap:20px}.brand-canvas{aspect-ratio:1.2}.brand-tabs{gap:10px;margin-bottom:20px}.brand-tabs button{font-size:12px;min-height:68px;flex-wrap:wrap;gap:4px;align-content:center;line-height:1.4}.brand-tabs button span{width:100%;font-size:7px}.brand-tabs button i{display:none}.brand-watermark{font-size:125px}.brand-object{width:49%}.brand-story{padding:10px 0}.brand-story h3{font-size:55px}.brand-story-number{margin-bottom:18px}.brand-summary{font-size:17px;max-width:100%}.brand-contribution{max-width:100%}.brand-contribution p{font-size:13px}.brand-room-footer{margin-top:10px}.brand-room-footer>span{max-width:130px;font-size:7px;line-height:1.7}.brand-room-footer>div{gap:12px}.brand-coordinate,.brand-medium{font-size:7px}.brand-story .project-discipline{font-size:8px}.brand-context{font-size:7px}}
@media(prefers-reduced-motion:reduce){.story-section .section-heading,.brand-object,.brand-watermark,.experience-row,#about .about-details,#contact::before{translate:none!important}.brand-object{transform:rotate(-8deg)}.brand-orbit,.contact-art .orbit{rotate:none!important}.experience-row{opacity:1}.film-print,.study-3 i{scale:1}.brand-object{will-change:auto}}
/* A self-contained chapter: the room stays still as the scroll selects exhibits. */
#collaborations.is-pinned{height:calc(var(--brand-travel) + 100svh - 80px)}
#collaborations.is-pinned>.section-content{position:sticky;top:80px;height:calc(100svh - 80px);padding:22px 5% 18px;display:flex;flex-direction:column}
#collaborations.is-pinned .collab-heading{grid-template-columns:.8fr 1.2fr;gap:6%;align-items:center;margin-bottom:18px;flex-shrink:0}
#collaborations.is-pinned .collab-heading .section-heading{font-size:clamp(35px,min(4.2vw,6.5vh),62px);margin:0;translate:none}
#collaborations.is-pinned .section-kicker{font-size:8px;margin:0 0 14px;padding:0}
#collaborations.is-pinned .gallery-instruction{font-size:10px;margin:0;max-width:250px}
#collaborations.is-pinned .brand-room{display:flex;flex-direction:column;flex:1;min-height:0;position:relative}
#collaborations.is-pinned .brand-room::after{content:"";position:absolute;bottom:0;left:0;width:100%;height:2px;background:#526b49;transform:scaleX(var(--brand-progress,0));transform-origin:left}
#collaborations.is-pinned .brand-tabs{flex-shrink:0;margin-bottom:12px;gap:20px}
#collaborations.is-pinned .brand-tabs button{min-height:49px;font-size:13px;flex-wrap:nowrap;gap:8px}
#collaborations.is-pinned .brand-tabs button span{width:auto}
#collaborations.is-pinned .brand-exhibits{flex:1;min-height:0;position:relative;isolation:isolate}
#collaborations.is-pinned .brand-panel{position:absolute;inset:0;height:100%;min-height:0;grid-template-columns:1.12fr 1fr;gap:6%}
#collaborations.is-pinned .brand-canvas{height:100%;aspect-ratio:auto}
#collaborations.is-pinned .brand-object{width:min(58%,32vh)}
#collaborations.is-pinned .brand-story{padding:0}
#collaborations.is-pinned .brand-story-number{margin-bottom:12px;font-size:8px}
#collaborations.is-pinned .brand-story .project-discipline{font-size:8px;margin:0 0 10px}
#collaborations.is-pinned .brand-story h3{font-size:clamp(35px,4.3vw,59px);margin:0 0 12px}
#collaborations.is-pinned .brand-summary{font-size:clamp(12px,1.2vw,16px);line-height:1.55;margin:12px 0;max-width:100%}
#collaborations.is-pinned .brand-contribution{padding-top:12px;margin-top:16px;max-width:100%}
#collaborations.is-pinned .brand-contribution p{font-size:clamp(10px,1vw,12px);line-height:1.7;margin:8px 0 0}
#collaborations.is-pinned .brand-story .project-roles{margin:12px 0;gap:5px}
#collaborations.is-pinned .project-roles span{font-size:8px;padding:5px 8px}
#collaborations.is-pinned .brand-context{font-size:6px}
#collaborations.is-pinned .brand-room-footer{flex-shrink:0;margin:12px 0 0;padding:8px 0 10px}
#collaborations.is-pinned .brand-room-footer button{width:32px;height:32px;font-size:18px}
/* Scroll is the animation clock: no invisible entrance waiting for a timer. */
#collaborations.is-pinned .brand-object{transform:rotateX(var(--object-y,0deg)) rotateY(var(--object-x,0deg)) rotate(-8deg);translate:0 var(--exhibit-lift,0px);transition:none}
#experience .experience-row{opacity:1}

/* The active tab is a distance cue: it fills while the reader explores a brand. */
#collaborations.is-pinned .brand-tabs button::before{transition:none}
#collaborations.is-pinned .brand-tabs button[aria-selected=true]::before{transform:scaleX(var(--brand-step-progress,0))}
#collaborations.is-pinned .brand-panel[inert]{pointer-events:none}

#collaborations.is-pinned .brand-panel[inert] .brand-story{visibility:hidden}

#collaborations.is-pinned .brand-panel[inert] .brand-coordinate,
#collaborations.is-pinned .brand-panel[inert] .brand-medium{visibility:hidden}
/* Hover flourishes stay brief; they do not lag behind the scroll choreography. */
.study i{transition:transform .35s var(--ease),border-radius .35s var(--ease)}
.contact-art .orbit{transition:transform .35s var(--ease)}
