@font-face{font-family:Ppneuemontreal;src:url(../../preview-v7/vendor/fonts/ppneuemontreal-bold.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Tr 3 A";src:url(../../preview-v7/vendor/fonts/tr3a-regular.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Tr 3 A";src:url(../../preview-v7/vendor/fonts/tr3a-bold.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}

:root{--orange:#f2502f;--paper:#f7f6f2;--ink:#111;--muted:#a7a49d;--header-h:88px;--footer-h:112px;--slide-w:min(25vw,390px);--slide-h:min(64vh,610px);--slide-gap:0px;--ease:cubic-bezier(.16,.9,.3,1)}
*{box-sizing:border-box}
html,body{width:100%;height:100%;margin:0;overflow:hidden;background:var(--paper);color:var(--ink)}
body{font-family:"Tr 3 A",Arial,sans-serif;font-size:12px;letter-spacing:.02em;opacity:0;transition:opacity .35s ease}
body.ready{opacity:1}
html.project-preloading body{opacity:1}
a{color:inherit;text-decoration:none}
button{border:0;background:none;color:inherit;font:inherit}
img,video{display:block;width:100%;height:100%;object-fit:cover}
.constellation-grid{position:fixed;z-index:1;inset:0;display:block;width:100vw;height:100vh;pointer-events:none;opacity:.28;mix-blend-mode:multiply}

.project-intro{position:fixed;z-index:1000;inset:0;display:grid;place-items:center;background:var(--orange);color:#fff;clip-path:inset(0);transition:clip-path 1s .2s var(--ease);pointer-events:none}
.project-intro>span{font-family:Ppneuemontreal,Arial,sans-serif;font-size:clamp(72px,15vw,230px);font-weight:700;letter-spacing:-.08em;transform:translateY(0);transition:transform .8s var(--ease)}
.project-intro sup{font-size:.18em;vertical-align:top}
body.ready .project-intro{clip-path:inset(0 0 100%)}
body.ready .project-intro>span{transform:translateY(-35vh)}

/* Shared portfolio preloader. The existing intro becomes a real, bounded
   critical-asset loader instead of disappearing on the first animation frame. */
html.project-preloading body.ready .project-intro{clip-path:inset(0)}
html.project-preloading body.ready .project-intro>.project-preloader-word{transform:translateY(-1.5vh)}
.project-intro.is-preloader{display:flex;align-items:center;justify-content:center;background:var(--paper);color:var(--orange)}
.project-intro.is-preloader::before{content:"";position:absolute;left:50%;top:50%;width:min(74vw,1160px);aspect-ratio:2.8;transform:translate(-50%,-45%);background:radial-gradient(ellipse at center,color-mix(in srgb,var(--orange) 11%,transparent),transparent 68%);filter:blur(24px);pointer-events:none}
.project-intro.is-preloader>.project-preloader-word{position:relative;width:min(91vw,1450px);font-size:initial;line-height:normal;letter-spacing:normal;transform:translateY(-1.5vh);transition:none;will-change:transform,opacity,filter}
.project-preloader-word svg{display:block;width:100%;height:auto;overflow:visible}
.project-preloader-word text{font-family:Ppneuemontreal,Arial,sans-serif;font-size:310px;font-weight:700;letter-spacing:-.075em}
.project-preloader-outline{fill:color-mix(in srgb,var(--orange) 3.5%,transparent);stroke:color-mix(in srgb,var(--orange) 34%,transparent);stroke-width:2}
.project-preloader-liquid{fill:var(--orange);will-change:transform}
.project-preloader-wave{animation:project-preloader-wave 1.15s linear infinite;will-change:transform}
.project-preloader-meta{position:absolute;left:50%;bottom:clamp(28px,5vh,62px);display:block;transform:translateX(-50%);color:var(--orange);font-family:Ppneuemontreal,Arial,sans-serif;font-variant-numeric:tabular-nums}
.project-preloader-meta em{display:flex;align-items:flex-start;font-size:clamp(28px,3vw,54px);font-style:normal;font-weight:700;line-height:1;letter-spacing:-.055em}
.project-preloader-meta small{margin:.08em 0 0 .15em;font-size:.32em;letter-spacing:0}
@keyframes project-preloader-wave{to{transform:translateX(-480px)}}
@media(max-width:600px){
  .project-intro.is-preloader>.project-preloader-word{width:96vw}
  .project-preloader-meta{bottom:26px}
}

.project-header{position:fixed;z-index:30;left:0;right:0;top:0;height:var(--header-h);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 3.1vw;text-transform:uppercase;opacity:0;transform:translateY(-20px);transition:opacity .7s .72s var(--ease),transform .7s .72s var(--ease)}
body.ready .project-header{opacity:1;transform:none}
.project-brand-block{justify-self:start;display:flex;align-items:center;gap:18px}
.project-brand{font-family:Ppneuemontreal,Arial,sans-serif;font-size:24px;font-weight:700;letter-spacing:-.06em}
.project-brand sup{font-size:8px;vertical-align:top}
.project-back{display:flex;align-items:center;gap:6px;color:#8d8982;font-size:9px;font-weight:700;letter-spacing:.08em;transition:color .3s,transform .35s var(--ease)}
.project-back b{color:var(--orange);font-size:14px}
.project-back:hover{color:var(--ink);transform:translateX(-3px)}
.project-heading{text-align:center;line-height:1.05}
.project-heading>span{display:block;margin-bottom:4px;color:var(--orange);font-size:8px;font-weight:700;letter-spacing:.13em}
.project-heading h1{margin:0;font-size:12px;letter-spacing:.16em}
.project-heading p{margin:3px 0 0;color:var(--muted);font-size:10px;letter-spacing:.12em}
.project-header nav{justify-self:end;display:flex;align-items:center;gap:2.6vw;color:#9d9a94;font-weight:700}
.roll-link{position:relative;display:block;height:1.2em;overflow:hidden}
.roll-link>span{display:block;transition:transform .45s var(--ease),color .35s}
.roll-link>span+span{position:absolute;left:0;top:100%;color:var(--orange)}
.roll-link:hover>span{transform:translateY(-100%)}

.project-viewer{position:fixed;z-index:5;left:0;right:0;top:var(--header-h);bottom:var(--footer-h);display:flex;align-items:center;overflow:hidden;touch-action:none;cursor:grab;transition:top 1s cubic-bezier(.77,0,.175,1),bottom 1s cubic-bezier(.77,0,.175,1)}
.project-viewer.is-dragging{cursor:grabbing}
.project-track{display:flex;align-items:center;width:max-content;gap:var(--slide-gap);will-change:transform;opacity:0;filter:blur(18px);transform:translate3d(50vw,0,0);transition:opacity .8s .58s var(--ease),filter .9s .58s var(--ease),gap 1s cubic-bezier(.77,0,.175,1)}
body.ready .project-track{opacity:1;filter:blur(0)}
.project-slide{position:relative;flex:0 0 var(--slide-w);width:var(--slide-w);height:var(--slide-h);margin:0;overflow:hidden;background:#111;transform:scale(.96);filter:saturate(.82);transition:flex-basis 1s cubic-bezier(.77,0,.175,1),width 1s cubic-bezier(.77,0,.175,1),height 1s cubic-bezier(.77,0,.175,1),transform .55s var(--ease),filter .55s var(--ease),opacity .55s var(--ease);user-select:none}
.project-slide.is-active{z-index:2;transform:scale(1);filter:none}
.project-slide.is-active{cursor:none}
.project-slide img,.project-slide video{pointer-events:none;transform:scale(1.015);transition:transform 1.1s var(--ease)}
.project-slide.is-active img,.project-slide.is-active video{transform:scale(1)}
.project-slide figcaption{position:absolute;z-index:2;left:14px;bottom:14px;padding:6px 8px;background:#111c;color:#fff;font-size:9px;letter-spacing:.12em;opacity:0;transform:translateY(8px);transition:opacity .35s,transform .45s var(--ease);pointer-events:none}
.project-slide.is-active:hover figcaption{opacity:1;transform:none}
/* Static poster projects use a horizontal, art-directed case-study canvas. */
.poster-project{--slide-w:min(72vw,1180px);--slide-h:min(40.5vw,664px)}
.poster-project .project-slide{background:#e9e5db}
.poster-project .project-slide img{object-fit:cover;transform:scale(1.04);transform-origin:center;transition:transform 1.35s var(--ease),filter .55s var(--ease)}
.poster-project .project-slide:nth-child(3n+1) img{transform-origin:left center}
.poster-project .project-slide:nth-child(3n+2) img{transform-origin:right center}
.poster-project .project-slide.is-active img{transform:scale(1);animation:poster-camera 8s 1.2s ease-in-out infinite alternate}
@keyframes poster-camera{to{transform:scale(1.035)}}
body.zoom-open .project-viewer{z-index:25;top:0;bottom:0}
body.zoom-open .project-track{gap:30.5vw}
body.zoom-open .project-slide{flex-basis:56.25vh;width:56.25vh;height:100vh;transform:scale(1);filter:none}
.poster-project.zoom-open .project-track{gap:12vw}
.poster-project.zoom-open .project-slide{flex-basis:min(100vw,177.78vh);width:min(100vw,177.78vh);height:min(56.25vw,100vh)}
body.zoom-open .project-slide figcaption{opacity:0!important}
.next-project{position:relative;flex:0 0 min(54vw,880px);width:min(54vw,880px);height:var(--slide-h);display:flex;flex-direction:column;justify-content:center;padding:clamp(32px,5vw,84px);background:var(--paper);color:var(--ink);text-transform:uppercase}
.next-project>span{margin-bottom:12px;font-size:11px;font-weight:700;letter-spacing:.08em}
.next-project>strong{font-family:Ppneuemontreal,Arial,sans-serif;font-size:clamp(54px,6.2vw,112px);font-weight:700;line-height:.76;letter-spacing:-.065em}
.next-project>small{margin-top:24px;color:var(--muted);font-size:12px;letter-spacing:.12em}
.next-project-button{position:absolute;right:7%;bottom:9%;display:flex;align-items:center;gap:10px;font-weight:700;font-style:normal}
.next-project-button>em{font-size:10px;font-style:normal;letter-spacing:.08em}
.next-project-button>i{display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:var(--orange);color:#fff;font-size:23px;font-style:normal;transition:transform .45s var(--ease)}
.next-project-button:hover>i,.next-project:focus-visible .next-project-button>i{transform:rotate(45deg) scale(1.08)}
.next-project-tooltip{position:absolute;right:0;bottom:calc(100% + 14px);width:min(360px,48vw);padding:24px 26px;background:#fff;color:var(--ink);box-shadow:0 24px 70px #0002;text-align:left;opacity:0;visibility:hidden;filter:blur(8px);transform:translateY(12px) scale(.96);transform-origin:bottom right;transition:opacity .35s var(--ease),filter .45s var(--ease),transform .45s var(--ease),visibility 0s .45s;pointer-events:none}
.next-project-button:hover .next-project-tooltip,.next-project:focus-visible .next-project-tooltip{opacity:1;visibility:visible;filter:blur(0);transform:none;transition-delay:0s}
.next-project-tooltip>small{display:block;margin:0 0 9px;color:var(--ink);font-size:9px;letter-spacing:.08em}
.next-project-tooltip>strong{display:block;font-family:Ppneuemontreal,Arial,sans-serif;font-size:clamp(36px,4vw,62px);line-height:.78;letter-spacing:-.06em}
.next-project-tooltip>strong.next-title-long{font-size:clamp(28px,3vw,44px);line-height:.84;letter-spacing:-.045em}
.next-project-tooltip>em{display:block;margin-top:17px;color:var(--muted);font-size:9px;font-style:normal;letter-spacing:.1em}

.project-controls{position:fixed;z-index:30;left:0;right:0;bottom:0;height:var(--footer-h);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 3.1vw 22px;opacity:0;transform:translateY(24px);transition:opacity .7s .82s var(--ease),transform .7s .82s var(--ease)}
body.ready .project-controls{opacity:1;transform:none}
.control-button{position:relative;height:16px;overflow:hidden;padding:0;cursor:pointer;font-size:11px;font-weight:700;text-transform:uppercase}
.control-button span{display:block;transition:transform .45s var(--ease),color .35s}
.control-button span+span{position:absolute;left:0;top:100%;color:var(--orange)}
.control-button:hover span,.control-button[aria-pressed="true"] span{transform:translateY(-100%)}
.control-button:disabled{color:#aaa;cursor:default}.control-button:disabled span{transform:none!important}
.project-counter{align-self:start;display:grid;justify-items:center;min-width:26px;margin-top:7px;font-weight:700;line-height:1}
.project-counter strong{font-size:12px}.project-counter span{color:var(--muted);font-size:11px}.project-counter i{width:20px;height:1px;margin:4px 0;background:var(--ink)}
.project-actions{justify-self:end;display:flex;gap:3.2vw}
.project-ruler{position:absolute;left:0;right:0;bottom:0;height:31px;background:repeating-linear-gradient(90deg,#c9c6c0 0 1px,transparent 1px 24px)}
.project-ruler::after{content:"";position:absolute;left:0;right:0;bottom:0;height:11px;background:repeating-linear-gradient(90deg,#d9d6d0 0 1px,transparent 1px 8px)}
.project-ruler i{position:absolute;z-index:2;left:0;top:-3px;width:2px;height:34px;background:var(--orange);transform:translateX(-1px);transition:left .65s var(--ease)}
.project-ruler i::before{content:"";position:absolute;left:50%;top:-1px;border-left:6px solid transparent;border-right:6px solid transparent;border-top:8px solid var(--orange);transform:translateX(-50%)}

.intro-done .project-intro{display:none}

.zoom-cursor{position:fixed;z-index:120;left:0;top:0;display:grid;place-items:center;width:68px;height:68px;border-radius:50%;background:var(--orange);color:#fff;font-size:9px;font-weight:700;letter-spacing:.06em;opacity:0;transform:translate3d(-50%,-50%,0) scale(.72);transition:opacity .2s,transform .28s var(--ease);pointer-events:none}
.zoom-cursor.is-visible{opacity:1;transform:translate3d(-50%,-50%,0) scale(1)}

@media(max-width:820px){
 :root{--header-h:92px;--footer-h:104px;--slide-w:72vw;--slide-h:min(64vh,620px);--slide-gap:14px}
 .project-header{grid-template-columns:auto 1fr auto;padding:0 18px}
 .project-brand{font-size:21px}.project-heading{padding:0 12px}.project-heading h1{font-size:9px;letter-spacing:.09em}.project-heading p{font-size:8px}
 .project-header nav{gap:12px}.project-header nav a:nth-child(2),.project-header nav a:nth-child(3){display:none}
 .project-viewer{align-items:center}
 .project-slide{border-radius:2px}
 .poster-project{--slide-w:88vw;--slide-h:49.5vw}
 .next-project{flex-basis:86vw;width:86vw;padding:34px}.next-project>strong{font-size:clamp(52px,14vw,86px)}
 .next-project-tooltip{width:min(330px,76vw)}
 .project-controls{grid-template-columns:1fr auto 1fr;padding:0 18px 20px}.project-actions{gap:14px}
 .project-ruler{height:25px}
}

@media(max-width:520px){
 :root{--header-h:78px;--footer-h:96px;--slide-w:78vw;--slide-h:min(62vh,560px)}
 .project-heading{display:none}
 .project-header{grid-template-columns:1fr auto}.project-header nav a:first-child{display:block}
 .project-controls{padding-inline:14px}.control-button{font-size:9px}.project-actions #sound-toggle{font-size:9px}
 .project-brand-block{gap:10px}.project-back{font-size:0}.project-back b{font-size:18px}
 .project-slide figcaption{display:none}
}

@media(prefers-reduced-motion:reduce){.constellation-grid{opacity:.18}}