/* Interactive approach labels share the blue and gold brand palette. */
.stage-feature{position:absolute;z-index:4;--feature:#42bdf5;--feature-tint:#12384e}
.stage-feature.code-one{top:8%;left:4%}
.stage-feature.code-two{top:78%;right:0;--feature:#85d6f3;--feature-tint:#214550}
.stage-feature.code-three{bottom:5%;left:8%;--feature:#ffce35;--feature-tint:#40381b}
.stage-trigger{display:flex;align-items:center;gap:10px;min-height:46px;padding:10px 14px;border:1px solid var(--feature);border-radius:6px;background:#0a1826;color:var(--feature);font-size:14px;font-weight:600;box-shadow:0 8px 20px #0003;transition:background .25s,box-shadow .25s,translate .25s}
.feature-number{font:12px monospace;opacity:.8}.feature-indicator{font-size:20px;line-height:1;transition:rotate .25s}
.stage-trigger:hover,.stage-trigger[aria-expanded=true]{background:var(--feature-tint);box-shadow:0 0 24px #38b8f328;translate:0 -3px}
.stage-trigger[aria-expanded=true] .feature-indicator{rotate:45deg}
.stage-feature:has([aria-expanded=true]){z-index:8}
.feature-panel{position:absolute;top:calc(100% + 10px);left:0;width:260px;padding:20px;background:#0d1b29;border:1px solid var(--feature);border-radius:8px;box-shadow:0 18px 45px #0008;animation:featureEnter .25s ease-out}
.stage-feature:before{content:'';position:absolute;inset:100% 0 -12px}
.code-two .feature-panel{left:auto;right:0;top:auto;bottom:calc(100% + 10px)}
.code-three .feature-panel{top:auto;bottom:calc(100% + 10px)}
.code-two:before,.code-three:before{inset:-12px 0 100%}
.feature-panel strong{display:block;font-size:17px;line-height:1.4;color:var(--feature)}
.hero .feature-panel p{font-size:14px;line-height:1.65;color:#c3d0d9;margin:10px 0 14px}
.feature-panel a{display:inline-flex;align-items:center;gap:12px;color:var(--feature);font-size:14px;font-weight:600;min-height:44px}
.tech-stage[data-active-feature=strategy] .orbit-one{border-color:#42bdf5;box-shadow:0 0 25px #42bdf522}
.tech-stage[data-active-feature=technology] .axis{background:#85d6f3;box-shadow:0 0 18px #42bdf5}
.tech-stage[data-active-feature=growth] .orbit-two{border-color:#ffce35;box-shadow:0 0 25px #ffce3522}
@keyframes featureEnter{from{opacity:0;translate:0 6px}to{opacity:1;translate:0 0}}
@media(max-width:760px){.stage-trigger{padding:9px 10px;gap:7px;font-size:13px}.stage-feature.code-one{left:0}.stage-feature.code-two{right:0;top:72%}.stage-feature.code-three{left:0;bottom:0}.feature-panel{width:min(260px,76vw)}}
/* Shared responsive refinements: keep the artwork and content in separate columns. */
html{scroll-padding-top:110px}
body{overflow-wrap:break-word}
main,section,.footer-grid>div,.services-grid>*{min-width:0}
.hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);height:auto;min-height:calc(100svh - 90px);max-height:none;padding:72px 6% 100px;overflow:hidden}
.hero-content{width:auto;min-width:0}
.hero h1{font-size:clamp(48px,6.1vw,88px)}
.tech-stage{position:relative;inset:auto;width:100%;max-width:490px;aspect-ratio:1;margin:auto;transform:none;contain:layout}
.logo-core{inset:13%!important;transform:rotateX(calc(var(--ty,0)*-5deg)) rotateY(calc(var(--tx,0)*8deg));animation:coreFloat 8s ease-in-out infinite}
.logo-symbol{display:flex;align-items:center;width:100%!important;height:100%!important;aspect-ratio:auto;transform:none}
.logo-symbol img{position:static;width:100%!important;height:auto!important;max-width:100%;object-fit:contain;filter:none!important;transform:none}
.stage-code{font-size:12px}.stage-coordinate{font-size:12px;left:0;right:0;text-align:center}
.hero .actions{flex-wrap:wrap}.hero .eyebrow{font-size:12px}
.page-intro h1{font-size:clamp(42px,6vw,86px)}
.page-intro p{max-width:65ch}
.footer-grid{grid-template-columns:minmax(180px,1.3fr) minmax(75px,.5fr) minmax(340px,2fr) minmax(175px,1fr);gap:32px}
.footer-services{min-width:0}.footer-service-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.footer-service-columns a{display:block;font-size:14px;color:var(--muted);margin:9px 0;line-height:1.7}
.footer-service-columns a:hover{color:#44bdf4}
.footer-grid a,.socials a{overflow-wrap:anywhere}
.footer-bottom{flex-wrap:wrap;gap:12px}
.story-journey{--timeline-x:28px}
.story-journey:before{left:calc(6% + var(--timeline-x));top:270px;bottom:120px}
.journey-progress{display:none}
.story-step{padding-left:85px;grid-template-columns:minmax(90px,150px) minmax(0,1fr);gap:32px;opacity:1}
.story-step:before{left:19px;top:86px}
.story-step p{color:#b7c6d1}
.stats,.values,.projects,.contact-layout,.form-grid{min-width:0}
.values article:focus-within{border-color:#3cb7ed}
.review-track{will-change:auto}
.review-slide .person>span{flex-shrink:0}
@media(max-width:1100px){
 .footer-grid{grid-template-columns:1fr 1fr;gap:40px}
 .footer-services{grid-column:1/-1;grid-row:2}
 .walkthrough{display:block}.walkthrough-intro{position:static;padding-bottom:32px}
 .walkthrough .walk-card{position:relative;top:auto;min-height:0;margin-bottom:28px;transform:none!important}
 .walkthrough .services-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
 .walkthrough>.button{margin-top:24px}.chapter-nav,.walk-label{display:none}
 .testimonials{gap:32px;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
 .contact-layout{gap:32px}
}
@media(max-width:1000px){
 header{height:80px;padding:0 6%}header>.button{display:none}
 .menu-toggle{display:block;color:white;min-height:44px;min-width:44px}
 header nav{display:none;position:absolute;top:80px;left:0;right:0;padding:20px 6%;background:#0d1925;border-bottom:1px solid #334756;flex-direction:column;gap:4px;max-height:calc(100svh - 80px);overflow:auto}
 header nav.open{display:flex}header nav a{font-size:18px;min-height:44px;width:max-content}
 .hero{min-height:calc(100svh - 80px);gap:24px;padding-top:64px}
 .hero h1{font-size:clamp(46px,6.5vw,66px)}
 .stage-code{font-size:11px;padding:6px}.stage-coordinate{display:none}
 .hero p{font-size:16px}.hero-content{transform:none;opacity:1}
}
@media(max-width:760px){
 .hero{grid-template-columns:minmax(0,1fr);padding:48px 6% 72px;gap:24px;height:auto;min-height:calc(100svh - 80px)}
 .hero h1{font-size:clamp(42px,9vw,64px)}
 .hero p{max-width:560px}.hero-content{width:100%}
 .tech-stage{inset:auto;width:min(100%,330px);max-width:330px;margin:0 auto;transform:none}
 .logo-core{inset:13%!important}.logo-symbol{width:100%!important;height:100%!important}
 .hero .scroll-cue{bottom:18px}.hero .actions{gap:12px}
 .walkthrough .services-grid,.testimonials,.projects,.contact-layout{grid-template-columns:minmax(0,1fr)}
 .walkthrough-intro h2{font-size:clamp(32px,8vw,42px)}
 .service h3,.walk-card h3{font-size:clamp(26px,6vw,32px);overflow-wrap:normal}
 .chapter-art{height:160px}.chapter-art>span{font-size:110px}
 .footer-grid{grid-template-columns:1fr 1fr;gap:28px}.footer-services{grid-row:auto;grid-column:1/-1}
 .footer-grid>div:last-child{grid-column:1/-1}
 .footer-service-columns{gap:20px}
 .footer-service-columns a,.footer-grid>div>a:not(.brand),.socials a{min-height:44px;margin:0;display:flex;align-items:center;padding:6px 0}
 .form-grid{grid-template-columns:minmax(0,1fr);gap:0}
 input,select,textarea{font-size:16px;max-width:100%;min-height:48px}
 .contact-info{gap:24px}.contact-info p{font-size:16px}
 .values{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.values p{font-size:16px}
 .story-journey:before{left:calc(6% + 9px);top:240px;bottom:100px}
 .story-step{grid-template-columns:minmax(0,1fr);gap:16px;padding:44px 0 44px 40px;min-height:0}
 .story-step:before{left:0;top:59px}.story-step strong{font-size:44px}
 .story-step p{font-size:16px}
 .journey-dock{bottom:calc(10px + env(safe-area-inset-bottom));max-width:calc(100% - 20px)}
 .journey-dock a{min-height:44px;font-size:12px;padding:8px 10px}.journey-dock a span{font-size:12px}
 footer{padding-bottom:calc(90px + env(safe-area-inset-bottom))}
 .review-controls{gap:8px}.quote blockquote{font-size:18px}
 .stats>div{flex-wrap:wrap;gap:12px}.stats strong{min-width:0}
}
@media(max-width:400px){
 .hero .button{gap:16px;padding:14px 16px;font-size:14px}
 .values,.contact-info{grid-template-columns:minmax(0,1fr)}
 .footer-service-columns{gap:12px}
 .stage-code{font-size:10px}.code-two{right:0}
 .review-controls button{padding:8px 10px}
}
@media(pointer:coarse){
 .cursor-ring{display:none!important}.reactive,.logo-core{transform:none!important}
 .orbit,.logo-core,.stage-code{animation:none}
 .service summary,.filters button{min-height:44px}
}
@media(max-height:720px) and (min-width:1101px){
 .walkthrough-intro{position:static}.walk-card{position:relative;top:auto;transform:none!important;margin-bottom:32px;min-height:0}
}
/* Restore the immersive presentation, retaining the lightweight assets and layout fixes. */
.hero{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(24px,3vw,48px)}
.tech-stage{max-width:620px;transform:translate(var(--move-x,0px),var(--move-y,0px));transition:transform .35s ease-out}
.logo-core{inset:0!important;transform:rotateX(calc(var(--ty,0)*-10deg)) rotateY(calc(var(--tx,0)*14deg)) rotateZ(-4deg);transition:transform .25s ease-out}
.logo-symbol{width:100%!important;height:100%!important}
.logo-symbol img{filter:drop-shadow(0 20px 25px #0005)!important}
.orbit-one{animation:orbitMove 24s linear infinite}
.orbit-two{animation:orbitMove 28s linear infinite reverse}
.stage-code{animation:coreFloat 8s ease-in-out infinite}
.code-one{top:8%;left:4%}.code-two{right:0;top:78%}.code-three{bottom:5%;left:8%}
@media(min-width:1001px) and (min-height:800px){
 .walkthrough{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,65px)}
 .walkthrough-intro{position:sticky;top:140px;padding-bottom:40px}
 .walkthrough .services-grid{display:block}
 .walkthrough .walk-card{position:sticky;top:110px;margin-bottom:120px;min-height:520px;transform:perspective(1000px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) scale(var(--card-scale,1))!important}
 .walkthrough .walk-card:last-child{margin-bottom:0}
 .chapter-nav{display:flex}.walk-label{display:block}
}
@media(hover:hover) and (pointer:fine){
 .story-step{opacity:.7;transition:opacity .5s,transform .5s}
 .story-step.active,.story-step:hover{opacity:1}
 .about-body .values article:hover,.about-body .stats>div:hover{box-shadow:0 12px 35px #079ee51c}
}
@media(max-width:1000px){
 .hero{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
 .tech-stage{max-width:460px}
}
@media(max-width:760px){
 .hero{grid-template-columns:minmax(0,1fr);gap:16px}
 .tech-stage{width:min(100%,420px);max-width:420px;transform:none}
 .logo-core{inset:0!important}
}
@media(pointer:coarse){
 .logo-core{animation:coreFloat 8s ease-in-out infinite}
 .tech-stage{transform:none}
}
@media(prefers-reduced-motion:reduce){
 .review-track{transform:translateX(var(--review-offset,0%))!important;transition:none}
 .story-step{opacity:1}.walk-card{position:relative;top:auto}
 .hero-content{opacity:1}
 .tech-stage,.walkthrough .walk-card{transform:none!important}
 .walkthrough .walk-card{position:relative;top:auto}
}
/* What We Do keeps each service detail visible without a Learn More control. */
.walkthrough .service details{display:block;border-top:1px solid #334350;margin-top:28px;padding-top:18px}
.walkthrough .service details ul{margin:0 0 16px;padding-left:18px}
.walkthrough .service .text-link{display:inline-flex;align-items:center;min-height:44px}