/* Interaction and accessibility pass — one scroll controller, reversible surfaces. */
:root{--ease-drawer:cubic-bezier(.32,.72,0,1);--muted:#605e62;--focus:#182d70}
html{scroll-behavior:auto;scrollbar-gutter:stable;scroll-padding-top:var(--scroll-offset,120px)}
body{overflow-x:clip}
main:focus{outline:none}
.has-plain-header main>.sr-only{padding:0}
.has-plain-header main>.sr-only+*{padding-top:180px}
:where(a,button,input,textarea,select,summary):focus-visible{outline:2px solid var(--focus);outline-offset:4px;box-shadow:0 0 0 4px #fff}
.contact-form input:focus-visible,.contact-form textarea:focus-visible{outline:2px solid var(--focus);outline-offset:5px;border-color:var(--focus)}
.contact-form input,.contact-form textarea{caret-color:var(--brand);border-bottom-color:#74727a}
.privacy-check{min-height:44px;cursor:pointer}.privacy-check input{min-width:20px;min-height:20px;max-width:20px}
.footer-links a,.footer-bottom a{min-height:44px;display:inline-flex;align-items:center}
.footer-brand p,.footer-label,.footer-bottom{color:#cbc9ce}
.site-footer .footer-large{color:#d0d5eb}
.process-steps.is-enhanced .process-step{opacity:1}
.process-steps .process-step{transition:border-color 180ms var(--ease-out)}
.process-step.is-active{border-top-color:var(--brand)}
.process-step.is-active .process-number{color:var(--brand);font-weight:600}
.process-intro{top:var(--scroll-offset,120px)}
.team-photo figcaption,.team-role{color:var(--muted)}
.hero:after,.home-hero:after{background:linear-gradient(90deg,rgba(4,13,30,.64),rgba(4,13,30,.58) 48%,rgba(4,13,30,.50)),linear-gradient(0deg,rgba(4,13,30,.22),transparent 65%)}
.hero-intro,.hero-kicker,.hero-scroll{color:#fff}
.hero-kicker{font-size:11px}.hero-kicker>span{opacity:1}
.hero-photo,.project-photo{will-change:auto}

/* The background moves independently; the header never animates layout. */
.site-header,.site-header.is-scrolled{padding:22px 30px;background:transparent;backdrop-filter:none;isolation:isolate;transition:color 180ms var(--ease-out)}
.site-header:before{content:'';position:absolute;inset:0;z-index:-1;background:var(--paper);border-bottom:1px solid var(--line);opacity:0;transform:translate3d(0,-8px,0);transition:opacity 220ms var(--ease-out),transform 240ms var(--ease-out)}
.site-header.is-scrolled:before,.menu-open .site-header:before,.has-plain-header .site-header:before{opacity:1;transform:translate3d(0,0,0)}
.site-header.is-scrolled,.menu-open .site-header,.has-plain-header .site-header{color:var(--ink);background:transparent}
.site-brand{background:#0c173c;color:#fff;padding:9px 12px;border:1px solid rgba(255,255,255,.25);transition:background-color 180ms var(--ease-out),color 180ms var(--ease-out),border-color 180ms var(--ease-out)}
.site-header.is-scrolled .site-brand,.menu-open .site-brand,.has-plain-header .site-brand{background:transparent;border-color:transparent;color:var(--ink)}
.brand-type small{font-size:10px;line-height:1.65}
.menu-toggle{width:48px;height:48px;flex-shrink:0;transform:none;transition:background-color 160ms var(--ease-out),transform 160ms var(--ease-out)}
.menu-toggle:hover{transform:none}
.menu-toggle>span{position:absolute;left:50%;top:50%;margin:0;width:18px;height:1.5px;transition:transform 240ms var(--ease-out);transform:translate(-50%,-50%) translateY(-3px)}
.menu-toggle>span:last-child{transform:translate(-50%,-50%) translateY(3px)}
.menu-toggle[aria-expanded=true]>span:first-child{transform:translate(-50%,-50%) rotate(45deg)}
.menu-toggle[aria-expanded=true]>span:last-child{transform:translate(-50%,-50%) rotate(-45deg)}
.menu-toggle:active{transform:scale(.96)}

.menu-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(200px,.42fr);gap:64px;padding-top:132px;align-content:start;opacity:0;transform:translate3d(0,-16px,0);transform-origin:top right;pointer-events:none;transition:opacity 200ms var(--ease-out),transform 240ms var(--ease-drawer)}
.menu-panel.is-open{opacity:1;transform:translate3d(0,0,0);pointer-events:auto;transition-duration:240ms,280ms}
.menu-panel nav{min-width:0;gap:0}
.menu-panel nav a{font-size:clamp(36px,4.4vw,64px);font-weight:400;line-height:1.18;padding:10px 0;min-height:44px;opacity:0;transform:translate3d(0,14px,0);transition:opacity 180ms var(--ease-out),transform 180ms var(--ease-out);gap:20px}
.menu-panel.is-open nav a{opacity:1;transform:translate3d(0,0,0)}
.menu-panel:not(.is-open) nav a{transition-delay:0ms!important;transition-duration:120ms}
.menu-panel nav a[aria-current=page]{color:var(--brand)}
.menu-panel nav a>span:last-child{font-size:12px;flex-shrink:0}
.menu-contact{position:static;right:auto;bottom:auto;align-self:end;margin:0;gap:12px;font-size:16px;max-width:310px;color:var(--ink);opacity:0;transform:translate3d(0,10px,0);transition:opacity 160ms var(--ease-out),transform 180ms var(--ease-out)}
.menu-panel.is-open .menu-contact{opacity:1;transform:translate3d(0,0,0);transition-delay:80ms}
.menu-contact a{min-height:44px;display:flex;align-items:center;overflow-wrap:anywhere}
.menu-panel.is-instant,.menu-panel.is-instant nav a,.menu-panel.is-instant .menu-contact{transition:none!important}

.lightbox{opacity:0;transform:translate3d(0,10px,0) scale(.985);transform-origin:center;transition:opacity 180ms var(--ease-out),transform 240ms var(--ease-out)}
.lightbox.is-open{opacity:1;transform:translate3d(0,0,0) scale(1)}
.lightbox:not(.is-open){pointer-events:none}
.lightbox::backdrop{background:rgba(9,12,20,.96);opacity:0;transition:opacity 180ms var(--ease-out)}
.lightbox.is-open::backdrop{opacity:1}
.lightbox.is-instant{transition:none!important}
.lightbox.is-instant::backdrop{transition:none!important}
.lightbox button{width:48px!important;height:48px!important;min-width:44px;min-height:44px;transition:transform 140ms var(--ease-out),background-color 140ms var(--ease-out)}
.lightbox button:active{transform:scale(.96)}
.lightbox img{opacity:1;transform:translate3d(0,0,0);transition:opacity 160ms var(--ease-out),transform 180ms var(--ease-out)}
.lightbox.is-image-loading img,.lightbox.is-image-error img{opacity:0;transform:translate3d(0,5px,0)}
.lightbox-bottom{color:#e4e5ec;min-height:24px}
.lightbox-layout{overflow:auto;overscroll-behavior:contain}
.page-transition{background:var(--studio-blue);transition:transform 240ms var(--ease-in-out)}
.cinema-page .page-transition:not(.is-entered){transform:translateY(0)}
.service-row{transition:background-color 160ms var(--ease-out)}
.service-row:hover{padding-left:0;padding-right:0}
.text-link .arrow-circle{transition:background-color 160ms var(--ease-out),color 160ms var(--ease-out),transform 220ms var(--ease-out)}
.roll-text>span{transition:transform 220ms var(--ease-out)}
@media(hover:hover) and (pointer:fine){
 .menu-toggle:hover{background:#dfe2ef}.menu-panel nav a:hover{color:var(--brand)}
 .lightbox button:hover{background:#dfe2ef}
}
@media(hover:none),(pointer:coarse){
 .text-link:hover .arrow-circle{transform:none;background:transparent;color:inherit}
 .hero-card .text-link:hover .arrow-circle{transform:none;background:transparent;color:inherit}
 a:hover>.roll-text>span{transform:none}.service-row:hover{background:transparent}
 .gallery-item:hover .gallery-image-wrap img,.gallery-item:focus-visible .gallery-image-wrap img{transform:none}
 .gallery-item:hover .gallery-arrow{transform:none}.team-card:hover .team-photo img{filter:grayscale(1)}
 .project-track:hover .project-photo{filter:none}.menu-toggle:hover{transform:none}
}
@media(max-height:780px) and (min-width:701px){.menu-panel{padding-top:112px;padding-bottom:30px}.menu-panel nav a{font-size:clamp(30px,3.7vw,52px);padding:6px 0}}
@media(max-width:1000px){.menu-panel{grid-template-columns:minmax(0,1fr);gap:32px}.menu-contact{max-width:none;display:grid;grid-template-columns:1fr 1fr;gap:8px 30px}.menu-contact>span{grid-column:1/-1}}
@media(max-width:700px){
 .site-header,.site-header.is-scrolled{padding:18px 17px;align-items:center}
 .site-brand{gap:9px;padding:7px 9px;max-width:calc(100% - 60px)}
 .brand-type{font-size:16px}.brand-type small{font-size:8px;letter-spacing:.12em}
 .site-brand img{width:40px;height:27px}.menu-toggle{width:46px;height:46px}
 .menu-panel{padding:112px 25px 32px;gap:28px}
 .menu-panel nav a{font-size:clamp(32px,8.7vw,46px);padding:9px 0}
 .menu-contact{display:flex;gap:5px;font-size:15px}
 .hero-kicker{font-size:9px;gap:15px}.hero-kicker>span{line-height:1.6}
 .hero-scroll{font-size:0}.lightbox{padding:80px 50px 72px}
 .lightbox-prev{left:4px}.lightbox-next{right:4px}
 .lightbox-bottom{font-size:13px}.footer-label{font-size:13px}
}
@media(max-width:359px){.hero-kicker{font-size:8px}.menu-panel{padding-inline:22px}.brand-type{font-size:14px}.brand-type small{font-size:7px}}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto!important}.menu-panel,.menu-panel nav a,.menu-contact,.lightbox,.lightbox img,.site-header,.site-header:before,.menu-toggle,.menu-toggle>span,.page-transition{transition:none!important;animation:none!important}
 .menu-panel.is-open,.menu-panel.is-open nav a,.menu-panel.is-open .menu-contact,.lightbox.is-open{transform:none}
 .lightbox::backdrop{transition:none!important}
 .process-steps.is-enhanced .process-step{opacity:1}.page-transition{display:none}
}
@media(forced-colors:active){
 :where(a,button,input,textarea,summary):focus-visible{outline:2px solid Highlight;box-shadow:none}
 .site-brand{border:1px solid CanvasText}.site-header:before{background:Canvas}
 .menu-toggle>span{background:ButtonText}.hero{color:CanvasText}.hero-content{background:Canvas}
}