/* Service-specific architectural scenes, in the homepage's dark/cyan language. */
.service-scene-page :is(.hero,.platform-hero,.coding-hero) { background:radial-gradient(ellipse at 82% 38%,#10314870,transparent 62%),#060d15; padding-block:clamp(3rem,6vw,6rem)!important; }
.service-scene-page .service-hero-layout { display:grid!important; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr)!important; gap:clamp(1.5rem,3vw,3.5rem)!important; align-items:center; }
.service-scene-page .service-hero-layout>* { min-width:0; }
.service-scene-page .service-hero-layout :is(.btn,.bp-button) { white-space:normal; overflow-wrap:anywhere; max-width:100%; box-sizing:border-box; text-align:center; }
.service-scene-page .service-hero-layout>.hero-headline { min-width:0; max-width:unset!important; }
.service-scene-page .service-hero-layout h1 { font-family:'Space Grotesk',system-ui,sans-serif!important; font-size:clamp(2rem,3.2vw,3.5rem)!important; line-height:1.08!important; letter-spacing:-.045em; text-wrap:balance; }
.service-scene-page .service-hero-layout .hero-headline>p { font-size:1rem; line-height:1.7; max-width:60ch; color:#b0c3d1; }
.service-scene-page .service-hero-layout>.hero-card,.service-scene-page .service-hero-layout>.site-signal { grid-column:1/-1; }
.service-scene-page .service-hero-layout>:not(.hero-headline):not(.service-scene) { grid-column:1/-1; }
.service-scene-page :is(.platform-hero,.coding-hero) .service-hero-layout { grid-column:1/-1; }
.service-scene-page .hero>.article-shell.service-hero-layout { max-width:var(--container-width,1320px); }
.service-scene-page .service-hero-layout>.hero-card { width:100%; box-sizing:border-box; }
.service-scene { position:relative; min-width:0; width:100%; margin:0; isolation:isolate; scroll-margin-top:7rem; color:#ddecf5; }
.service-scene .service-scene__eyebrow { display:flex; justify-content:space-between; align-items:center; gap:.7rem; margin:0; max-width:none; color:#8dafc5; font:500 .66rem/1.5 ui-monospace,monospace; letter-spacing:.11em; text-transform:uppercase; }
.service-scene__eyebrow::before { content:''; width:.4rem; height:.4rem; border-radius:50%; background:#8fe4bc; flex:none; }
.service-scene__eyebrow span { flex:1; }
.service-scene__eyebrow small { font:inherit; color:#6d91aa; letter-spacing:.02em; }
.service-scene__stage { position:relative; width:100%; aspect-ratio:1.3; overflow:hidden; background:radial-gradient(ellipse at 48% 58%,#17374766,transparent 68%); }
.service-scene__stage::after { content:''; position:absolute; inset:9% 0; border-block:1px solid #6dcfff13; pointer-events:none; }
.service-scene__fallback,.service-scene__stage canvas { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; display:block; }
.service-scene__stage canvas { opacity:0; }
.service-scene[data-scene-state='ready'] .service-scene__stage canvas { opacity:1; }
.service-scene[data-scene-state='ready'] .service-scene__fallback { visibility:hidden; }
.service-scene__label { position:absolute; z-index:1; transform:translate(-50%,.6rem); white-space:nowrap; color:var(--node-color); font:500 clamp(.44rem,.65vw,.6rem)/1.5 ui-monospace,monospace; letter-spacing:.065em; padding:.18rem .35rem; background:#071321ce; border:1px solid #44617a33; border-radius:.2rem; pointer-events:none; }
.service-scene__label--back { transform:translate(-50%,-100%); }
.service-scene__caption { padding:.8rem 0 1rem; border-bottom:1px solid #759dbb38; font:500 .9rem/1.55 'Space Grotesk',system-ui,sans-serif; color:#d2e4ef; }
.service-scene__steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); list-style:none; gap:.8rem; padding:1rem 0 .6rem; margin:0; }
.service-scene__steps li { min-width:0; margin:0; }
.service-scene__steps button { display:block; width:100%; padding:.65rem .35rem .65rem .65rem; border:0; border-left:2px solid #3c566a; border-radius:0; text-align:left; background:transparent; color:#9bb6c9; font:500 .73rem/1.45 'Space Grotesk',system-ui,sans-serif; cursor:pointer; min-height:5.4rem; transition:color .18s,border-color .18s,background .18s; }
.service-scene__steps b { display:block; color:#6dcfff; font:500 .63rem/1.6 ui-monospace,monospace; margin-bottom:.35rem; }
.service-scene__steps button[aria-pressed='true'] { color:#e2f5ff; border-color:#8fe4bc; background:linear-gradient(90deg,#8fe4bc12,transparent); }
.service-scene__steps button:disabled { cursor:default; color:#b7cbd9; }
.service-scene__controls { display:flex; align-items:center; justify-content:space-between; gap:1rem; min-height:2rem; }
.service-scene__pause { border:1px solid #55748966; background:#0b1a26; border-radius:.35rem; color:#bcd2e2; padding:.45rem .65rem; font:500 .68rem/1.4 'Space Grotesk',system-ui,sans-serif; cursor:pointer; }
.service-scene .service-scene__note { color:#91aabb; font-size:.65rem; line-height:1.5; margin:0; }
.service-scene__choose { margin:.7rem 0 0; }
.service-scene__choose label { display:block; color:#98b7ca; font-size:.73rem; margin-bottom:.5rem; }
.service-scene__choose select { width:100%; min-width:0; max-width:100%; min-height:2.75rem; border:1px solid #44677e; border-radius:.35rem; background:#0b1925; color:#dcecf5; padding:.55rem 2rem .55rem .75rem; font:500 .83rem/1.4 'Space Grotesk',system-ui,sans-serif; }
.service-scene :is(button,select):focus-visible,.service-scene-preview:focus-visible { outline:2px solid #8fe4bc; outline-offset:4px; }
.service-scene-preview { display:inline-block; margin-top:.8rem; color:#a6deed; font-size:.8rem; text-underline-offset:4px; }
.service-scene [hidden],.service-scene-preview[hidden] { display:none!important; }
@media (max-width:1099px) {
  .service-scene-page .service-hero-layout { grid-template-columns:minmax(0,1fr)!important; }
  .service-scene { max-width:43rem; justify-self:center; }
  .service-scene__stage { aspect-ratio:1.5; }
  .service-scene__label { font-size:.6rem; }
}
@media (max-width:599px) {
  .service-scene-page :is(.hero,.platform-hero,.coding-hero)>.container { width:calc(100% - 2rem); }
  .service-scene-page .service-hero-layout h1 { font-size:clamp(1.95rem,7.8vw,2.8rem)!important; }
  .service-scene .service-scene__eyebrow { font-size:.57rem; letter-spacing:.06em; }
  .service-scene__eyebrow small { display:none; }
  .service-scene__stage { aspect-ratio:1.4; }
  .service-scene__steps { gap:.35rem; }
  .service-scene__steps button { padding:.5rem .2rem .5rem .5rem; font-size:.69rem; min-height:6rem; }
  .service-scene__caption { font-size:.82rem; }
  .service-scene__controls { align-items:flex-start; }
}
@media (prefers-reduced-motion:reduce) { .service-scene * { transition:none!important; } }
