/* Service compositions: content and artwork share a grid; no overlapping background art. */
.service-page .sp-hero{padding:34px 0 46px;background:#f7faff;overflow:visible;isolation:isolate}
.service-page .sp-hero:after{display:none}
.service-page .sp-hero>.wrap{width:89.4%;max-width:1440px;padding:0}
.service-page .crumbs{margin:0 0 20px;display:flex;flex-wrap:wrap;gap:9px;font-size:13px;line-height:1.6}
.service-intro{display:grid;grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);gap:32px;align-items:center;min-height:460px}
.service-copy{min-width:0;padding:26px 0}
.service-page .service-copy .eyebrow{display:flex;align-items:center;gap:14px;color:var(--fc-blue);font:600 12px/1.4 Inter,sans-serif;letter-spacing:.16em;margin-bottom:22px;text-transform:uppercase}
.service-copy .eyebrow:before{content:attr(data-number);display:grid;place-items:center;width:32px;height:32px;border:1px solid #bbd4fa;border-radius:50%;letter-spacing:0}
.service-page .service-copy h1{font-size:clamp(38px,4.25vw,64px);line-height:1.06;letter-spacing:-.055em;max-width:100%;margin:0;text-wrap:balance;overflow-wrap:normal}
.service-page .service-copy h1 span{color:var(--fc-blue);display:block}
.service-page .service-copy>p{font-size:17px;line-height:1.65;color:#60728b;margin:24px 0 0;max-width:540px}
.service-actions{display:flex;gap:24px;align-items:center;flex-wrap:wrap;margin-top:30px}
.service-actions .btn{min-height:50px;padding:14px 24px;font-size:14px;border-radius:var(--fc-r-sm)}
.service-anchor{font-size:14px;color:#43536a;border-bottom:1px solid #bdd3f3;padding:9px 0}
.service-anchor:hover{color:var(--fc-blue)}
.service-scene{--mx:0;--my:0;position:relative;width:100%;aspect-ratio:1.2;min-width:0;touch-action:pan-y;perspective:1200px}
.scene-art{position:absolute;inset:3% -1% 1%;display:flex;align-items:center;transition:transform .35s ease-out;pointer-events:none}
.service-scene.is-tracking .scene-art{transform:rotateX(calc(var(--my)*-4deg)) rotateY(calc(var(--mx)*5deg)) translate3d(calc(var(--mx)*10px),calc(var(--my)*8px),0)}
.scene-art img{display:block;width:100%;height:auto}
.scene-tag{position:absolute;display:flex;align-items:center;gap:10px;z-index:2;border:1px solid #d2e1f5;border-radius:var(--fc-r-md);background:linear-gradient(120deg,#fff,#f6fafff2);padding:12px 16px;color:#1b3556;box-shadow:0 8px 24px #2563a313,inset 0 1px #fff;transition:transform .4s ease-out;font-size:13px;line-height:1.35;pointer-events:none}
.scene-tag svg{width:24px;height:24px;flex:none;stroke:var(--fc-blue);stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
.scene-tag b{display:block;font-weight:600}.scene-tag small{display:block;color:#72829b;font-size:12px;margin-top:3px}
.scene-tag--first{top:4%;left:4%;transform:translateZ(38px)}.scene-tag--second{bottom:6%;right:1%;transform:translateZ(54px)}
.scene-route{position:absolute;bottom:3%;left:4%;right:4%;display:flex;align-items:center;justify-content:space-between;gap:12px;color:#3068ae;font-size:12px;letter-spacing:.03em;transition:transform .4s ease-out}
.scene-route span{display:flex;align-items:center;gap:8px;white-space:nowrap}.scene-route span:before{content:'';width:5px;height:5px;background:var(--fc-blue);border-radius:50%}.scene-route i{height:1px;flex:1;min-width:12px;background:#bad3f7;position:relative}.scene-route i:after{content:'›';color:var(--fc-blue);position:absolute;right:-1px;top:-10px;font-size:16px}
.scene--crm .scene-art{inset:8% -1% 5%}.scene--crm .scene-tag--first{top:0;left:7%}.scene--crm .scene-tag--second{bottom:auto;top:11%;right:0}
.scene--support .scene-art{inset:3% 5% 3%}.scene--support .scene-tag--first{top:15%;left:-1%}.scene--support .scene-tag--second{bottom:9%;right:-1%}
.scene--web .scene-art{inset:0 -3% 0}.scene--web .scene-tag--first{top:8%;left:0}.scene--web .scene-tag--second{bottom:9%;right:2%}
.scene-code{font-family:monospace;font-size:20px;letter-spacing:-2px;color:var(--fc-blue)}
.service-page .service-flow{width:89.4%;max-width:1440px;margin:0 auto;padding:42px 0 58px;gap:20px;grid-template-columns:repeat(3,minmax(0,1fr))}
.service-page .service-flow-title{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:8px}
.service-page .service-flow-title .eyebrow{color:#7285a0;font-size:12px;letter-spacing:.12em;max-width:170px}
.service-page .service-flow-title h2{font-size:clamp(25px,2.7vw,40px);max-width:650px;margin:0;line-height:1.1}
.service-page .service-flow article{min-height:175px;padding:24px;background:#fff;border-radius:var(--fc-r-md);box-shadow:0 8px 26px #22467a06}
.service-page .service-flow article:after{display:none}
.service-page .service-flow h3{font-size:22px;margin-top:26px}.service-page .service-flow p{font-size:15px;line-height:1.5;max-width:none}
.service-page .sp-section{padding:46px 0}
.service-page .sp-section>.wrap{max-width:1440px;width:89.4%;padding:0}
.service-page .sp-cols{max-width:none;padding:0;gap:60px;grid-template-columns:minmax(0,1.4fr) minmax(280px,.8fr)}
.service-page .sp-cols h2,.service-page .sp-section>.wrap>h2{font-size:clamp(32px,3.5vw,48px)}
.service-page .sp-list li{font-size:16px;line-height:1.6;padding:20px 0}.service-page .sp-list svg{flex:none}
.service-page .sp-side{padding:26px}.service-page .sp-side .row{gap:20px;font-size:14px}.service-page .sp-side .row b{text-align:right}
.service-page .service-faq>.wrap{display:grid;grid-template-columns:minmax(200px,280px) minmax(0,1fr);gap:52px;align-items:start}
.service-page .service-faq h2{font-size:clamp(28px,3.1vw,44px);line-height:1.08}
.service-page .faq{width:100%;max-width:none;margin:0}.service-page .faq-q{font-size:16px;line-height:1.5;gap:20px;padding:22px 0}.service-page .faq-a p{font-size:16px;line-height:1.6}
.service-page .service-related{padding:50px 0}.service-page .service-related>.wrap{width:89.4%;max-width:1440px;padding:0}.service-page .service-related h2{font-size:clamp(30px,3.4vw,46px)}
.service-page .related-card p{font-size:16px;line-height:1.55}.service-page .related-card{padding:28px;min-height:190px}
.service-page #contact{padding:46px 0}.service-page #contact>.wrap{width:89.4%;max-width:1440px;padding:0}.service-page .contact{padding:50px 32px}.service-page .contact h2{font-size:clamp(30px,3.7vw,50px);line-height:1.12}
.service-page .nav{width:89.4%;max-width:1440px;padding:0;height:78px;justify-content:space-between}.service-page .nav-right{margin-left:auto}.service-page .nav-links{gap:24px}.service-page .nav-pill{padding:0}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 .service-scene.is-visible .scene-art img{animation:scene-drift 8s ease-in-out infinite;will-change:transform}
 .service-scene.is-tracking .scene-art,.service-scene.is-tracking .scene-tag,.service-scene.is-tracking .scene-route{will-change:transform}
 .service-scene.is-tracking .scene-tag--first{transform:translate3d(calc(var(--mx)*-14px),calc(var(--my)*-11px),38px)}
 .service-scene.is-tracking .scene-tag--second{transform:translate3d(calc(var(--mx)*18px),calc(var(--my)*13px),54px)}
 .service-scene.is-tracking .scene-route{transform:translate3d(calc(var(--mx)*12px),calc(var(--my)*8px),24px)}
 @keyframes scene-drift{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
}
@media(max-width:1100px){.service-intro{gap:20px;min-height:430px}.service-page .service-copy h1{font-size:clamp(36px,4.7vw,51px)}.service-page .service-copy>p{font-size:16px}.scene-tag{padding:10px 12px;font-size:12px}.scene-tag small{font-size:11px}.service-page .sp-cols{gap:35px}.service-page .nav-links{gap:16px}.service-page .nav-right>.btn{font-size:12px;padding:12px 16px}}
@media(max-width:800px){
 .service-page .nav{width:calc(100% - 40px);height:70px;padding:0}.service-page .nav-pill{padding:20px}
 .service-page .sp-hero{padding:24px 0 28px}.service-page .sp-hero>.wrap,.service-page .service-flow,.service-page .sp-section>.wrap,.service-page .service-related>.wrap,.service-page #contact>.wrap{width:calc(100% - 40px)}
 .service-page .crumbs{font-size:12px;margin-bottom:16px;gap:7px}.service-intro{grid-template-columns:1fr;gap:4px;min-height:0}.service-copy{padding:14px 0 4px}
 .service-page .service-copy .eyebrow{font-size:11px;letter-spacing:.12em;margin-bottom:18px}.service-page .service-copy h1{font-size:clamp(34px,7.8vw,54px);line-height:1.08;text-wrap:initial}
 .service-page .service-copy>p{margin-top:18px;font-size:16px;line-height:1.6}.service-actions{margin-top:24px;gap:20px}.service-actions .btn{font-size:13px;padding:13px 19px}.service-anchor{font-size:13px}
 .service-scene{display:block;max-width:520px;margin:26px auto 0;aspect-ratio:1;perspective:none}.service-scene .scene-art{inset:20% 0 4%;transition:none!important;transform:none!important}.scene-tag,.scene-route{transform:none!important;transition:none!important}.scene-tag{padding:10px;border-radius:var(--fc-r-sm);gap:7px;font-size:12px;min-height:66px;width:49%;align-items:flex-start}.scene-tag svg{width:20px;height:20px}.scene-tag small{font-size:12px}.scene-route{font-size:12px;gap:7px;bottom:0}.service-scene .scene-tag--first{left:0;top:0;bottom:auto}.service-scene .scene-tag--second{right:0;top:0;bottom:auto}
 .service-page .service-flow{padding:34px 0 38px;grid-template-columns:1fr;gap:14px}.service-page .service-flow-title{display:block;margin-bottom:6px}.service-page .service-flow-title h2{font-size:29px;margin-top:10px}.service-page .service-flow article{min-height:0;padding:22px}.service-page .service-flow h3{margin-top:18px}
 .service-page .sp-section{padding:38px 0}.service-page .sp-cols{grid-template-columns:1fr;padding:0;gap:30px}.service-page .sp-cols h2{font-size:32px;margin-bottom:24px}.service-page .sp-side{padding:22px}
 .service-page .service-faq>.wrap{grid-template-columns:1fr;gap:6px}.service-page .service-faq h2{margin-bottom:10px;font-size:31px}.service-page .faq-q{padding:20px 0}
 .service-page .service-related{padding:40px 0}.service-page .related-card{min-height:0;padding:24px}.service-page .related-card h3{font-size:22px}.service-page .related-card p{font-size:15px}
 .service-page #contact{padding:38px 0}.service-page .contact{padding:38px 22px}.service-page .contact h2{font-size:32px}.service-page .contact-cta{flex-wrap:wrap}.service-page .float-tg{width:46px;height:46px;bottom:14px;right:14px}
}
@media(max-width:480px){.service-page .nav-right>.btn{display:none}.service-scene{aspect-ratio:.92}.service-scene .scene-art{inset:24% 0 5%}}
@media(prefers-reduced-motion:reduce){.scene-art,.scene-tag,.scene-route{transform:none!important;transition:none!important}.scene-art img{animation:none!important;will-change:auto!important}.service-scene *{will-change:auto!important}}

/* homepage hero scene */
.fc-home2 .x-hero-art .service-scene{aspect-ratio:1.28}
.fc-home2 .x-hero-art .scene-tag{font-size:12.5px;padding:11px 14px}
.fc-home2 .x-hero-art .scene-tag small{font-size:11px}
