/* Shared motion is decorative: navigation, forms and job updates remain native. */
:root{--ease-out:cubic-bezier(.2,.7,.2,1)}
.sg-header{position:sticky;top:12px;z-index:30;height:72px;width:calc(100% - 40px);margin:16px auto;background:#ffffffe0;border:1px solid #ffffffd9;border-radius:18px;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);box-shadow:0 2px 18px #44202005;transition:box-shadow .3s,background .3s}
.sg-header.is-scrolled{background:#fffffff0;box-shadow:0 8px 28px #4420200e}
.sg-header nav>a:not(.button){transition:color .28s var(--ease-out)}
.project-nav{top:112px}.button{transition:transform .25s var(--ease-out),box-shadow .25s,background .25s,border-color .25s}.button-arrow{display:inline-block;transition:transform .3s var(--ease-out)}.button:hover .button-arrow{transform:translate(3px,-3px)}.button:active{transform:translateY(1px) scale(.98)}.button:disabled:active{transform:none}.project-nav nav>a{transition:background .25s,color .25s,transform .25s}.project-nav nav>a:not(.active):hover{transform:translateX(3px)}input,textarea,select{transition:border-color .2s,box-shadow .2s}.chart-bar{transform-origin:bottom}

html.motion-paused{scroll-behavior:auto}html.motion-paused *,html.motion-paused *:before,html.motion-paused *:after{animation-play-state:paused!important;transition:none!important}
html.motion-off{scroll-behavior:auto}html.motion-off *,html.motion-off *:before,html.motion-off *:after{animation:none!important;transition:none!important}
@media(max-width:800px){.sg-header{height:67px;width:calc(100% - 30px);top:8px;margin:12px auto;padding:0 18px;border-radius:15px}.project-nav{top:auto}.project-nav nav>a:not(.active):hover{transform:none}}
@media(max-width:540px){.sg-header{width:calc(100% - 20px);height:62px;padding:0 14px;gap:10px;margin:10px auto}.sg-header .sg-wordmark img{width:126px}.sg-header nav{gap:10px}.sg-header nav .button{padding:8px 11px;font-size:10px;min-height:35px;gap:7px}.sg-header nav>a{font-size:10px}.sg-header nav>a:after{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
html:not(.motion-ready) *,html:not(.motion-ready) *:before,html:not(.motion-ready) *:after{animation:none!important}
.login-story .story-art{height:335px}.login-story .floating{animation:login-float 7s ease-in-out infinite}.login-story .floating.ig{animation-delay:-3s}
@keyframes login-float{0%,100%{translate:0 0}50%{translate:0 -8px}}
@media(max-width:360px){.sg-header{padding:0 12px;gap:9px}.sg-header .sg-wordmark img{width:110px}.sg-header nav{gap:10px}.sg-header nav>a{white-space:nowrap;font-size:9px}.sg-header nav .button{font-size:9px;padding:8px 10px;gap:5px;min-height:34px}}