@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;600&family=Manrope:wght@300;400;500;600&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#ecf2f4;background:#05090d;font-synthesis:none;color-scheme:dark;font-weight:300}*{box-sizing:border-box}html,body,#root{margin:0;width:100%;height:100%;overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:wait;opacity:.65}button,a{touch-action:manipulation}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:2px solid #d9b3ff;outline-offset:6px}button{background:none;border:0}h1,h2,p,figure{margin:0}h1,h2{font-family:'Manrope',sans-serif;font-weight:300;letter-spacing:-.065em;line-height:1.06}em{font-family:Georgia,serif;font-weight:400;color:#cfbce0}h1:focus{outline:none}.passage{position:relative;width:100%;height:100dvh;min-height:320px;isolation:isolate;overflow:hidden;background:#05090d}.scene-layer,.cave-backdrop,.vignette,.opening,.campaign,.opening-gradient{position:absolute;inset:0}.scene-layer{z-index:0}.scene-layer canvas{touch-action:pan-x}.cave-backdrop{background:url('/portfolio-2027/assets/corridor-portals.jpg') center 56%/cover no-repeat;filter:brightness(.7);transform:scale(1.03)}.scene-layer>div:not(.cave-backdrop):not(.light-portals){position:absolute!important;inset:0}.vignette{pointer-events:none;z-index:1;background:linear-gradient(180deg,rgba(3,7,11,.64),transparent 24%,transparent 48%,rgba(3,7,11,.88)),linear-gradient(90deg,rgba(3,7,11,.24),transparent 70%)}.passage-header{position:absolute;top:0;left:0;right:0;padding:30px 4vw;display:flex;justify-content:space-between;align-items:center;z-index:8;gap:18px}.brand{font-family:'Manrope',sans-serif;text-align:left;font-size:31px;letter-spacing:-1.6px;line-height:1;white-space:nowrap}.brand sup{font-size:8px;vertical-align:top;letter-spacing:0}.brand>span{display:block;font-family:'DM Sans',sans-serif;font-size:7px;letter-spacing:2px;line-height:3}.passage-header nav{display:flex;gap:34px;align-items:center}.text-button{font-size:12px;display:inline-flex;align-items:center;gap:14px;padding:12px 0;white-space:nowrap}.text-button:hover{color:#d9b3ff}.nav-count{border:1px solid #5b606b;border-radius:12px;padding:4px 6px;font-size:9px}.micro{font-size:9px;font-weight:500;letter-spacing:2px;line-height:1.8;text-transform:uppercase;color:#afbac4}.opening{z-index:3}.campaign{width:100%;height:100%;object-fit:cover;object-position:center}.opening-gradient{background:linear-gradient(180deg,rgba(4,6,10,.3),transparent 17%,transparent 65%,#05090ddd)}.home .passage-header{opacity:0;pointer-events:none;visibility:hidden}.opening-mobile{display:none}.entry-bar{position:absolute;bottom:max(28px,env(safe-area-inset-bottom));left:4vw;right:4vw;display:flex;align-items:center;justify-content:space-between;gap:24px}.entry-caption{display:flex;align-items:center;gap:14px;font-size:9px;letter-spacing:2px;flex-wrap:wrap}.github-showcase-link{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:32px;padding:0 10px;border:1px solid #c7abd64d;border-radius:999px;background:#071018b8;backdrop-filter:blur(10px);color:#e9edf2;text-decoration:none;font-size:8px;letter-spacing:1.15px;white-space:nowrap;transition:border-color .25s,background .25s,color .25s}.github-showcase-link:hover,.github-showcase-link:focus-visible{border-color:#ead4ff;background:#1a1723;color:#fff;outline:none}.github-showcase-link span{font-size:13px;line-height:1}.light-point{width:5px;height:5px;box-shadow:0 0 20px 3px #c59cda;background:#dfcdf8;border-radius:50%}.entry-hint{font-size:8px;letter-spacing:2px;color:#b5adb8}.enter{min-height:54px;min-width:220px;display:inline-flex;gap:36px;align-items:center;justify-content:space-between;padding:15px 24px;border:1px solid #c7abd66b;border-radius:2px;background:linear-gradient(105deg,#332039dd,#141421bb);box-shadow:inset 0 0 20px #ab69c312;backdrop-filter:blur(12px);font-size:12px;letter-spacing:.3px;transition:background .3s,border-color .3s}.enter:hover{border-color:#ead4ff;background:linear-gradient(105deg,#56355c,#1b2434)}.enter>span{font-size:22px;font-weight:300}.chapter{position:absolute;top:150px;left:4vw;display:flex;align-items:center;gap:16px;z-index:3;font-size:10px;color:#a9bdc9}.chapter-line{width:45px;height:1px;background:#9ac2d0}.world-copy{position:absolute;z-index:3;left:4vw;bottom:135px;width:470px;max-width:44vw;transition:opacity .5s,transform .5s}.world-copy>.micro{color:var(--accent);margin-bottom:16px}.world-copy h1{font-size:clamp(40px,4.3vw,76px);text-wrap:balance;animation:title-in .7s ease both}.world-description{max-width:380px;color:#bcc8cf;line-height:1.65;font-size:13px;margin:22px 0 27px}.travelling .world-copy{opacity:.65}.passage-footer{position:absolute;bottom:max(27px,env(safe-area-inset-bottom));left:4vw;right:4vw;display:flex;align-items:center;justify-content:space-between;z-index:4}.journey-cue{font-size:8px;letter-spacing:1.7px;color:#9baebc;width:230px}.world-selector{display:flex;align-items:center;gap:16px}.round{display:grid;place-items:center;width:44px;height:44px;flex:0 0 44px;border:1px solid #a3b6c440;border-radius:50%;background:#0a1118aa;backdrop-filter:blur(12px);font-size:20px}.round:hover{border-color:var(--accent,#d9b3ff);background:#242735}.current-world{display:flex;align-items:center;gap:13px;font-size:10px;padding:16px 0}.journey-track{display:block;width:112px;height:1px;background:#75829255}.journey-track i{display:block;height:1px;background:var(--accent);box-shadow:0 0 10px var(--accent);transition:width 1.4s}.motion-toggle{width:230px;text-align:right;font-size:10px;color:#afbac4}.work-view{position:absolute;inset:0;z-index:10;background:#05090d;animation:work-in .65s ease both;display:grid;grid-template-rows:74px minmax(0,1fr) auto 64px;padding:0 4vw;gap:0}.work-backdrop{position:absolute;inset:0;filter:blur(60px);background-size:cover;background-position:center;opacity:.13;z-index:-1}.work-header{display:flex;justify-content:space-between;align-items:center;gap:20px;border-bottom:1px solid #b1c0d016}.work-stage{min-height:0;display:flex;align-items:center;justify-content:center;padding:20px 0 16px;overflow:hidden}.work-stage>img,.work-stage>video{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;box-shadow:0 15px 90px #0005}.work-stage video{min-width:min(680px,100%);background:#000}.work-caption{display:flex;justify-content:space-between;align-items:center;gap:20px;position:relative}.work-caption h1{font-size:clamp(22px,2.7vw,38px);line-height:1.2;margin:5px 0 8px}.work-description{font-size:12px;line-height:1.55;color:#aebdc7;max-width:760px}.documentation{font-size:11px;border-bottom:1px solid #857296;padding:12px 0;max-width:210px;flex-shrink:0;line-height:1.5}.work-notes{position:absolute;bottom:0;left:0;right:0;padding:25px;background:#101823f5;border:1px solid #687188;border-radius:3px;font-size:13px;line-height:1.7;z-index:3;box-shadow:0 -20px 100px #0009;max-height:50dvh;overflow:auto}.work-notes p+p{margin-top:12px;color:#c6aedc}.work-pagination{display:flex;justify-content:center;align-items:center;gap:20px}.work-pagination .round{width:36px;height:36px;flex-basis:36px;font-size:17px}.work-progress{height:1px;width:180px;background:#6978884d}.work-progress span{height:1px;background:var(--accent);display:block;transition:width .3s}.link-work{position:relative;height:100%;max-width:100%}.link-work img{height:100%;max-width:100%;object-fit:contain;opacity:.45}.link-work a{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);max-width:95%;text-align:center}.media-error{text-align:center;line-height:2}.media-error a{text-decoration:underline}.passage-modal{color:#edf0f5;width:min(780px,94vw);max-height:92dvh;border:1px solid #65718855;background:#0b111df5;box-shadow:0 40px 150px #000d;padding:0;overscroll-behavior:contain}.passage-modal::backdrop{background:#02040ad9;backdrop-filter:blur(16px)}.modal-inner{padding:60px;position:relative}.close-modal{position:absolute;right:20px;top:20px}.modal-inner h2{font-size:clamp(40px,5vw,66px);margin:18px 0 28px}.modal-inner>p:not(.micro){font-size:14px;line-height:1.85;color:#bdc7d3;margin-bottom:19px;max-width:560px}.modal-inner .disciplines{color:#d2b9e3!important;border-left:1px solid #8a629c;padding-left:18px;margin:30px 0!important}.world-index{display:flex;flex-direction:column;margin:26px 0 22px}.world-index button{display:flex;align-items:center;gap:23px;padding:14px 0;border-top:1px solid #8796b122;text-align:left}.world-index button>span:first-child{font-size:10px;color:#97a4b4;width:15px}.world-index strong{font-size:23px;font-weight:300;flex:1}.world-index small{font-size:10px;color:#9aaaba}.world-index button:hover strong,.world-index [aria-current=true] strong{color:#d6b7ee}.contact-email{display:inline-block;font-size:clamp(18px,3vw,28px);border-bottom:1px solid #bc91d3;padding:12px 0;margin:10px 0 40px}.light-portals{position:absolute;inset:0;perspective:1000px;animation:title-in 1s ease both}.light-portal{position:absolute;overflow:hidden;border:1px solid #cdebf0;box-shadow:0 0 12px #abdfef66,inset 0 0 12px #abdfef44;background:#10222b}.light-portal img{width:100%;height:100%;object-fit:cover}.light-portal.selected{height:49vh;width:24vh;right:23%;top:18%;transform:rotateY(-20deg)}.light-portal.middle{height:27vh;width:13vh;right:9%;top:30%;transform:rotateY(-24deg);filter:brightness(.7)}.light-portal.distant{height:15vh;width:7vh;right:4%;top:37%;opacity:.5;transform:rotateY(-24deg)}.still *{animation:none!important;transition:none!important}@keyframes title-in{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@keyframes work-in{from{opacity:0;transform:scale(.985)}to{opacity:1;transform:scale(1)}}
@media(min-width:1600px){.world-copy{bottom:150px;max-width:35vw}.light-portal.selected{right:30%}}
@media(max-width:800px){.passage-header{padding:22px 23px}.brand{font-size:25px}.brand>span{font-size:5.6px;letter-spacing:1.3px}.passage-header nav{gap:17px}.text-button{font-size:10px;gap:9px}.contact-button{display:none}.chapter{top:115px;left:24px}.world-copy{left:24px;bottom:130px;max-width:65vw;width:450px}.world-copy h1{font-size:43px}.world-description{font-size:12px;max-width:340px}.passage-footer{left:24px;right:24px}.journey-cue{display:none}.motion-toggle{width:auto}.light-portal.selected{right:19%;height:40vh;width:21vh;top:17%}.light-portal.middle{right:5%;height:22vh;width:11vh;top:26%}.light-portal.distant{right:0;top:31%}.work-view{padding:0 24px}.modal-inner{padding:50px 28px 30px}.entry-hint{display:none}}
@media(min-width:561px) and (max-width:800px) and (orientation:portrait){
.home .campaign{object-position:42% center;opacity:1;filter:contrast(1.02) saturate(1.02)}
.home .opening-gradient{z-index:1;background:linear-gradient(180deg,#0307112e 0%,transparent 32%,#04071080 58%,#05090de8 92%)}
.home .opening-mobile{display:block;position:absolute;z-index:5;left:32px;right:32px;bottom:194px;max-width:430px;text-shadow:0 3px 24px #000}
.home .opening-mobile h1{font-size:58px;margin:10px 0 18px;line-height:1.01}
.home .opening-mobile>p:last-child{font-size:13px;color:#d3d7de}
.home .entry-bar{z-index:6;bottom:max(42px,calc(env(safe-area-inset-bottom) + 28px));left:32px;right:32px;flex-direction:column-reverse;align-items:stretch;gap:18px}
.home .entry-bar .enter{width:100%;min-width:0;min-height:58px;font-size:13px;padding:15px 22px}
.home .entry-caption{justify-content:center;font-size:8px;letter-spacing:1.6px}
.home .entry-hint{display:none}
.home .passage-header{opacity:1;pointer-events:auto;visibility:visible;z-index:8}
.home .passage-header .brand{filter:drop-shadow(0 2px 15px #000)}
.home .contact-button,.home .passage-header nav>.text-button:last-child{display:inline-flex}
.home .passage-header nav{gap:16px}
}
@media(max-width:800px){
.signal-work .work-stage{position:relative;width:100vw;margin-left:-24px;padding:0;isolation:isolate;overflow:hidden;background:#05090d}
.signal-work .signal-stage::before{content:"";position:absolute;inset:-42px;background:var(--signal-art) center/cover no-repeat;filter:blur(30px) brightness(.34) saturate(1.18);transform:scale(1.08);z-index:0}
.signal-work .signal-stage::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#05090d66 0%,transparent 18%,transparent 82%,#05090d77 100%),linear-gradient(90deg,#05090d55 0%,transparent 18%,transparent 82%,#05090d55 100%);z-index:0;pointer-events:none}
.signal-work .work-stage>img{position:relative;z-index:1;width:100vw;height:min(75vw,540px);max-width:none;max-height:none;object-fit:cover;object-position:center;box-shadow:0 18px 90px #0009;border-block:1px solid #b5d8ff33}
}
@media(max-width:560px) and (orientation:portrait){.signal-work .work-stage{margin-left:-20px}.campaign{object-position:42% center;opacity:1;filter:contrast(1.02) saturate(1.02)}.opening-gradient{background:linear-gradient(180deg,#03071122 0%,transparent 35%,#04071099 58%,#05090d 89%)}.opening-mobile{display:block;position:absolute;left:25px;right:25px;bottom:165px}.opening-mobile h1{font-size:54px;margin:10px 0 20px}.opening-mobile>p:last-child{font-size:12px;color:#c1c5d0}.entry-bar{bottom:max(36px,env(safe-area-inset-bottom));left:25px;right:25px;flex-direction:column-reverse;align-items:stretch;gap:22px}.entry-caption{font-size:7px;letter-spacing:1.4px;justify-content:center}.entry-bar .enter{min-height:54px}.home .passage-header{opacity:1;pointer-events:auto;visibility:visible}.home .passage-header .brand{filter:drop-shadow(0 2px 15px #000)}.home .contact-button,.home .passage-header nav>.text-button:last-child{display:inline-flex}.home .brand{font-size:20px}.home .brand>span{display:none}.home .passage-header{padding:20px 18px}.home .passage-header nav{gap:10px}.home .passage-header .text-button{font-size:8.5px;padding:8px 0}.home .nav-count{display:none}.brand{font-size:23px}.brand>span{font-size:5px;letter-spacing:1.2px}.passage-header{padding:23px 22px;gap:10px}.passage-header nav{gap:16px}.passage-header .text-button{font-size:10px}.nav-count{font-size:8px;padding:3px 5px}.chapter{top:105px;gap:12px;font-size:9px}.chapter .micro{font-size:7px}.chapter-line{width:26px}.world-copy{bottom:120px;left:25px;right:25px;max-width:none;width:auto}.world-copy h1{font-size:39px;max-width:350px}.world-copy>.micro{font-size:8px;margin-bottom:10px}.world-description{font-size:11px;line-height:1.55;margin:13px 0 20px;max-width:320px}.world-copy .enter{min-height:48px;min-width:215px;font-size:11px;padding:10px 18px}.passage-footer{bottom:max(28px,env(safe-area-inset-bottom));left:25px;right:25px}.world-selector{gap:10px}.journey-track{width:54px}.current-world{font-size:9px;gap:10px}.motion-toggle{font-size:9px}.round{width:38px;height:38px;flex-basis:38px}.light-portal.selected{height:31vh;width:18vh;top:20%;right:21%;transform:rotateY(-13deg)}.light-portal.middle{height:19vh;width:10vh;right:5%;top:26%}.light-portal.distant{right:0;top:30%;height:11vh;width:6vh}.vignette{background:linear-gradient(180deg,#04080ccd,transparent 25%,transparent 35%,#04080cdd 66%,#04080c 94%)}.work-view{grid-template-rows:62px minmax(0,1fr) auto 72px;padding:0 20px}.work-header{gap:9px}.work-header>.micro{display:none}.work-header .text-button{font-size:10px}.work-stage{padding:18px 0}.work-caption{display:block}.work-caption .micro{font-size:7px;letter-spacing:1.3px}.work-caption h1{font-size:24px;margin:7px 0 8px}.work-description{font-size:11px;line-height:1.55}.documentation{display:inline-block;font-size:10px;max-width:100%;padding:10px 0 6px}.work-notes{padding:20px;font-size:12px;max-height:55dvh}.modal-inner h2{font-size:43px}.world-index strong{font-size:21px}.world-index button{gap:17px;padding:13px 0}.world-index small{font-size:9px}.modal-inner>.micro{font-size:7px}.passage-modal{width:calc(100% - 28px);max-height:94dvh}}
@media(max-height:560px) and (orientation:landscape){.passage-header{padding:16px 25px}.brand{font-size:24px}.brand>span{display:none}.chapter{display:none}.world-copy{left:25px;bottom:80px;max-width:43vw}.world-copy h1{font-size:30px}.world-copy>.micro{margin-bottom:6px}.world-description{font-size:10px;margin:8px 0 12px;max-width:280px}.world-copy .enter{min-height:39px;font-size:10px;min-width:185px;padding:8px 15px}.passage-footer{bottom:16px;left:25px;right:25px}.journey-cue{display:none}.world-selector .round{height:33px;width:33px;flex-basis:33px}.light-portal.selected{height:60vh;width:29vh;top:15%;right:20%}.entry-bar{bottom:16px}.entry-bar .enter{min-height:44px}.entry-caption{font-size:7px}.work-view{grid-template-columns:1fr 260px;grid-template-rows:52px 1fr 48px;gap:0 25px;padding:0 25px}.work-header{grid-column:1/-1}.work-stage{grid-column:1;grid-row:2/4;padding:10px 0 15px}.work-caption{grid-column:2;grid-row:2;display:block;align-self:center}.work-caption h1{font-size:23px}.work-description{font-size:10px}.work-caption .micro{font-size:7px}.documentation{font-size:10px;display:inline-block;padding:8px 0}.work-pagination{grid-column:2;grid-row:3}.work-progress{width:100px}.work-notes{max-height:65dvh}.modal-inner{padding:45px}.modal-inner h2{font-size:36px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

.campaign-hitplane{position:absolute;width:100vw;min-width:177.7778dvh;aspect-ratio:16/9;left:50%;top:50%;transform:translate(-50%,-50%);pointer-events:none}.campaign-hotspot{position:absolute;pointer-events:auto;top:3%;height:5%;border-radius:30px}.campaign-hotspot:focus-visible{outline:2px solid #e3c7ff;outline-offset:0;background:#ffffff22}.campaign-home{left:62%;width:4%}.campaign-solutions{left:66.5%;width:5%}.campaign-studio{left:71.8%;width:4.4%}.campaign-journal{left:76.8%;width:4.4%}.campaign-contact{left:81.8%;width:4.8%}.campaign-build{left:88.5%;width:10%;height:6%}.campaign-together{left:67.3%;top:54.8%;width:14.2%;height:5.6%}.campaign-explore{left:82.2%;top:54.8%;width:8.6%;height:5.6%}@media(max-width:560px) and (orientation:portrait){.campaign-hitplane{display:none}}

.passage{overflow:clip}.render-mode{font-size:7px;letter-spacing:1px;text-transform:uppercase;color:#aac3cc;border-left:1px solid #70829155;padding-left:12px}.work-backdrop{opacity:.2;filter:blur(38px)}

@media(min-width:801px) and (orientation:landscape){
.campaign-build{width:min(10%,max(0px,calc(50vw - 38.5%)))}
}


/* Mobile first-frame lock: key off portrait shape, not only CSS width.
   Some mobile browsers can expose a wide desktop-like CSS viewport while
   remaining a tall phone. The opening must still use the portrait art
   direction in that case. */
@media(orientation:portrait) and (max-aspect-ratio:4/5){
  .home .campaign{
    object-position:34% center;
    opacity:1;
    filter:contrast(1.03) saturate(1.035);
  }
  .home .opening-gradient{
    z-index:1;
    background:
      linear-gradient(180deg,#03071138 0%,transparent 30%,#04071072 56%,#05090df2 92%),
      linear-gradient(90deg,#03071112 0%,transparent 70%);
  }
  .home .opening-mobile{
    display:block;
    position:absolute;
    z-index:5;
    left:clamp(24px,5vw,52px);
    right:clamp(24px,5vw,52px);
    bottom:clamp(185px,24dvh,360px);
    max-width:min(560px,84vw);
    text-shadow:0 4px 28px #000c;
  }
  .home .opening-mobile .micro{
    font-size:clamp(7px,1.25vw,10px);
    letter-spacing:clamp(1.5px,.25vw,2.4px);
  }
  .home .opening-mobile h1{
    font-size:clamp(50px,8vw,72px);
    margin:10px 0 16px;
    line-height:.98;
    max-width:8.2ch;
  }
  .home .opening-mobile>p:last-child{
    font-size:clamp(11px,1.65vw,14px);
    color:#d6dce2;
  }
  .home .entry-bar{
    z-index:6;
    bottom:max(clamp(28px,4dvh,54px),env(safe-area-inset-bottom));
    left:clamp(24px,5vw,52px);
    right:clamp(24px,5vw,52px);
    flex-direction:column-reverse;
    align-items:stretch;
    gap:14px;
  }
  .home .entry-bar .enter{
    width:100%;
    min-width:0;
    min-height:58px;
    padding:15px 22px;
    font-size:clamp(12px,1.5vw,14px);
  }
  .home .entry-caption{
    justify-content:center;
    gap:10px;
    font-size:clamp(7px,1.1vw,9px);
    letter-spacing:clamp(1.35px,.2vw,1.8px);
  }
  .home .github-showcase-link{
    min-height:30px;
    padding:0 9px;
    font-size:7px;
  }
  .home .entry-hint{display:none}
  .home .passage-header{
    opacity:1;
    pointer-events:auto;
    visibility:visible;
    z-index:8;
    padding:clamp(18px,3vw,28px) clamp(18px,4vw,40px);
  }
  .home .brand{
    font-size:clamp(20px,3.2vw,28px);
    filter:drop-shadow(0 2px 15px #000);
  }
  .home .brand>span{display:none}
  .home .passage-header nav{gap:clamp(9px,1.6vw,16px)}
  .home .passage-header .text-button{font-size:clamp(8.5px,1.2vw,11px);padding:8px 0}
  .home .nav-count{display:none}
  .campaign-hitplane{display:none}
}