/* Tandwick motion: progressive enhancement, native scrolling, reduced-motion support. */
header{transition:box-shadow .35s,background .35s}header.scrolled{box-shadow:0 6px 30px #071a350c;background:#fffffff5}nav a[aria-current="location"]:after{width:100%}nav a[aria-current="location"]{color:#2262ae}.nav-cta,.brief-button{position:relative;overflow:hidden;isolation:isolate}.nav-cta:before,.brief-button:before{content:'';position:absolute;inset:0;transform:translateX(-130%) skewX(-20deg);background:linear-gradient(90deg,transparent,#86b6f344,transparent);z-index:-1;pointer-events:none}.nav-cta:hover:before,.brief-button:hover:before{animation:tw-sheen .7s ease-out}.nav-cta span,.brief-button span,.footer-top>a:last-child{display:inline-block;transition:transform .3s}.nav-cta:hover span,.brief-button:hover span{transform:translate(3px,-3px)}.footer-top>a:last-child:hover{transform:translateY(-3px)}.tags span{transition:background .25s,border-color .25s,transform .25s}.tags span:hover{background:#e1ebf8;border-color:#a1b5cf;transform:translateY(-2px)}.motion-control{display:block;margin:20px 0 0;border:1px solid #cbd3de;border-radius:20px;background:white;color:#102b57;font-size:12px;padding:9px 14px;cursor:pointer}.motion-control:focus-visible{outline:3px solid #458df2;outline-offset:3px}
@media(prefers-reduced-motion:no-preference){
html:not(.motion-off) .hero-grid:after{content:'';position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,#9dcaff0e 48%,transparent 62%);animation:tw-light 4s ease-out both;pointer-events:none}
html:not(.motion-off) .hero .orbit img{animation:tw-mark 2.4s cubic-bezier(.2,.7,.2,1) both}
html:not(.motion-off) .hero-top{animation:enter 1s .2s both}html:not(.motion-off) .hero-bottom{animation:enter 1s .4s both}html:not(.motion-off) .hero-foot{animation:enter 1s .6s both}
html:not(.motion-off) .hero h1 em{background:linear-gradient(100deg,#a3c4f3 10%,#f3f8ff 45%,#a3c4f3 80%);background-size:240% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;animation:tw-title 3s ease-out both}
html:not(.motion-off).js h2.reveal{clip-path:inset(0 0 100%);transform:translateY(30px);transition:clip-path 1s cubic-bezier(.2,.7,.2,1),transform 1s,opacity .8s}
html:not(.motion-off).js h2.reveal.visible{clip-path:inset(-8% -2% -8%);transform:none}
html:not(.motion-off).js .service.reveal{transform:translateY(36px);transition:opacity .9s,transform .9s}
html:not(.motion-off).js .service.reveal.visible{transform:none}
html:not(.motion-off).js .service.reveal .service-title{opacity:0;transform:translateX(-20px);transition:opacity .75s .08s,transform .85s .08s}
html:not(.motion-off).js .service.reveal.visible .service-title{opacity:1;transform:none}
html:not(.motion-off).js .service.reveal>.web-demo,html:not(.motion-off).js .service.reveal>.card-stage,html:not(.motion-off).js .service.reveal>.workflow{opacity:0;translate:0 24px;transition:opacity .85s .2s,translate .85s .2s}
html:not(.motion-off).js .service.reveal.visible>.web-demo,html:not(.motion-off).js .service.reveal.visible>.card-stage,html:not(.motion-off).js .service.reveal.visible>.workflow{opacity:1;translate:0 0}
html:not(.motion-off) .statement:before{content:'';position:absolute;inset:-25%;background:radial-gradient(ellipse at 75% 45%,#579dff30,transparent 55%);transform:translateY(var(--drift,0px));pointer-events:none}
html:not(.motion-off) .statement img{translate:0 var(--drift,0px)}
html:not(.motion-off) .steps article{position:relative}html:not(.motion-off) .steps article:before{content:'';position:absolute;top:-1px;left:0;width:100%;height:2px;background:#538ccc;transform:scaleX(0);transform-origin:left;transition:transform 1s .2s}html:not(.motion-off) .steps article.visible:before{transform:scaleX(1)}
html:not(.motion-off) .mini-shape{animation-iteration-count:1}
html:not(.motion-off) .statement-inner.visible h2 span{display:inline-block;animation:enter .9s .15s both}
html:not(.motion-off) .brief select,html:not(.motion-off) .brief textarea{transition:background .3s,border-color .3s,box-shadow .3s}
html:not(.motion-off) .brief select:focus,html:not(.motion-off) .brief textarea:focus{background:#ffffff55;border-color:#397bce;box-shadow:0 2px 0 #397bce}
}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){html:not(.motion-off) .web-demo,html:not(.motion-off) .workflow{transform:perspective(1100px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));will-change:auto}html:not(.motion-off) .workflow{background:radial-gradient(circle at var(--light-x,50%) var(--light-y,50%),#eaf3ff,white 65%)}html:not(.motion-off) .card-stage{transform:perspective(1200px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg))}}
@keyframes tw-light{from{transform:translateX(-50%);opacity:0}40%{opacity:1}to{transform:translateX(30%);opacity:.5}}@keyframes tw-title{from{background-position:100% 0}to{background-position:0 0}}@keyframes tw-mark{from{opacity:0;transform:scale(.9) rotate(-8deg)}to{opacity:1;transform:none}}@keyframes tw-sheen{to{transform:translateX(130%) skewX(-20deg)}}
html.motion-off{scroll-behavior:auto}html.motion-off *,html.motion-off *:before,html.motion-off *:after{animation:none!important;transition:none!important}html.motion-off .reveal,html.motion-off .service-title{opacity:1!important;transform:none!important;clip-path:none!important}html.motion-off .orbit{transform:rotate(-12deg)}html.motion-off .statement img{translate:none}
@media(prefers-reduced-motion:reduce){.nav-cta:before,.brief-button:before{display:none}.web-demo,.workflow,.card-stage{transform:none}.statement img{translate:none}}
