@view-transition{navigation:auto}
::view-transition{pointer-events:none}
html{--nav-distance:36px;--nav-duration:560ms;--nav-ease:cubic-bezier(.2,.8,.2,1)}
html[data-nav-direction="back"]{--nav-distance:-28px}
::view-transition-group(root),::view-transition-group(mb-project-cover){animation-duration:var(--nav-duration);animation-timing-function:var(--nav-ease)}
::view-transition-old(root){animation:mb-page-out var(--nav-duration) var(--nav-ease) both;mix-blend-mode:normal}
::view-transition-new(root){animation:mb-page-in var(--nav-duration) var(--nav-ease) both;mix-blend-mode:normal}
::view-transition-group(mb-project-cover){z-index:2}
::view-transition-old(mb-project-cover),::view-transition-new(mb-project-cover){height:100%;width:100%;object-fit:contain;overflow:clip;mix-blend-mode:normal;border:1px solid #ffb40077}
::view-transition-new(mb-project-cover){animation:mb-cover-in var(--nav-duration) var(--nav-ease) both}
@keyframes mb-page-out{to{opacity:0;transform:translateX(calc(var(--nav-distance) * -1)) scale(.99)}}
@keyframes mb-page-in{from{opacity:0;transform:translateX(var(--nav-distance)) scale(1.015)}to{opacity:1;transform:none}}
@keyframes mb-cover-in{from{opacity:0;box-shadow:0 0 70px #ffb40055}to{opacity:1;box-shadow:0 0 0 #ffb40000}}
.nav-leaving body{animation:mb-fallback-out .15s ease both}
.nav-entering body{animation:mb-page-in .4s var(--nav-ease) both}
@keyframes mb-fallback-out{to{opacity:.7;filter:brightness(.8)}}
html.nav-restoring{scroll-behavior:auto!important}
html.nav-restoring body{visibility:hidden}
html.nav-restoring *{scroll-behavior:auto!important;animation:none!important;transition:none!important}
html.nav-restoring .entry-shutter,html.nav-restoring .case-entry-shutters{display:none!important}
html.nav-restoring .motion-reveal,html.nav-restoring [data-case-reveal],html.nav-restoring .case-solution>div{opacity:1!important;transform:none!important;clip-path:none!important}
html[data-nav-resume="true"] .case-intro>*,html[data-nav-resume="true"] .case-entry-shutters i{animation:none!important}
html[data-nav-resume="true"] .case-entry-shutters{display:none}
.nav-returned{animation:mb-return-cue 1.4s ease-out}
@keyframes mb-return-cue{0%,30%{box-shadow:0 0 0 1px #ffb400,0 0 32px #ffb40024}100%{box-shadow:0 0 0 1px #ffb40000,0 0 0 #ffb40000}}
.case-chapter-nav .case-return{display:flex;align-items:center;gap:12px;max-width:42%;color:#ffb400;min-height:62px;font-size:10px}
.case-chapter-nav .case-return-arrow{font-size:22px;color:#ffb400;margin:0}
.case-chapter-nav .case-return-label{color:#d7c89f;font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0}
.case-chapter-nav .case-return:hover .case-return-label{color:#ffb400}
html[data-nav-motion="reduced"]::view-transition-group(*),html[data-nav-motion="reduced"]::view-transition-old(*),html[data-nav-motion="reduced"]::view-transition-new(*){animation:none!important}
html[data-nav-motion="reduced"] .nav-returned{animation:none}
@media(max-width:750px){
 html{--nav-distance:18px;--nav-duration:420ms}html[data-nav-direction="back"]{--nav-distance:-18px}
 .case-chapter-nav{gap:12px}.case-chapter-nav>div{flex:1;min-width:0;width:auto;gap:8px}
 .case-chapter-nav .case-return{flex:none;width:44px;max-width:44px;min-height:56px;justify-content:center;border-right:1px solid #ffb40030;padding-right:12px}
 .case-chapter-nav .case-return-label{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden}
 .case-chapter-nav a[data-case-chapter]{font-size:9px;white-space:nowrap}
 .case-chapter-nav a[data-case-chapter]>span{display:none}
}
@media(prefers-reduced-motion:reduce){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}.nav-returned{animation:none}}