/* Live geometry, real process state, no decorative raster artwork. */
.spatial-demo { position:relative; min-width:0; margin:0; border:1px solid #5e75a04d; border-radius:1rem; background:linear-gradient(155deg,#182842b0,#09121cc9 60%); overflow:hidden; box-shadow:inset 0 1px #c1daff12,0 30px 70px #0002; isolation:isolate; }
.spatial-heading { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:1rem 1.1rem .8rem; border-bottom:1px solid #96bce91a; }
.spatial-heading p { margin:0; font-family:var(--mono); font-size:.64rem; text-transform:uppercase; letter-spacing:.07em; color:#abbfd7; }.spatial-heading strong { display:block; margin-top:.35rem; font-size:1rem; line-height:1.35; letter-spacing:-.025em; }
.spatial-status { display:flex; align-items:center; gap:.4rem; color:#93e5d1; font-family:var(--mono); font-size:.6rem; white-space:nowrap; }.spatial-status::before { content:''; width:5px; height:5px; background:currentColor; border-radius:50%; box-shadow:0 0 10px #68ebd866; }
.spatial-stage { position:relative; aspect-ratio:1.5; min-height:220px; overflow:hidden; background:radial-gradient(ellipse at 50% 70%,#34668c20,transparent 67%); }
.spatial-stage canvas { display:block; width:100%; height:100%; position:absolute; inset:0; touch-action:pan-y pinch-zoom; cursor:grab; }
.spatial-stage canvas:active { cursor:grabbing; }
.spatial-stage::after { pointer-events:none; content:''; position:absolute; inset:0; box-shadow:inset 0 -30px 32px -35px #75cbe1; }
.spatial-markers { position:absolute; inset:0; pointer-events:none; }
.spatial-marker { position:absolute; display:grid; place-items:center; width:23px; height:23px; font:500 .62rem var(--mono); color:#bbd4f2; border:1px solid #7393bd88; border-radius:50%; background:#081222e6; transform:translate(-50%,-50%); opacity:.65; }
.spatial-marker.is-active { color:#08121e; background:#8eeedc; border-color:#afffec; opacity:1; box-shadow:0 0 18px #71e5d34d; }
.spatial-tabs { position:relative; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.3rem; padding:0 .8rem; }
.spatial-tabs button { display:grid; align-content:start; gap:.4rem; min-width:0; min-height:4.5rem; text-align:left; padding:.65rem .55rem; background:#ffffff03; color:#aabed5; border:1px solid transparent; border-radius:.4rem; line-height:1.25; font-size:.78rem; }
.spatial-tabs button span { color:#718cac; font:500 .58rem var(--mono); }.spatial-tabs button[aria-pressed=true] { border-color:#8af0d577; color:#d3fff5; background:#64dfbe0c; }.spatial-tabs button[aria-pressed=true] span { color:#8eeedc; }
.spatial-copy { display:grid; padding:.85rem 1.1rem .5rem; min-height:4.8rem; }
.spatial-copy p { grid-area:1/1; margin:0; font-size:.87rem; line-height:1.55; color:#becddd; visibility:hidden; opacity:0; }.spatial-copy p.is-active { visibility:visible; opacity:1; transition:opacity 240ms; }
.spatial-controls { display:flex; align-items:center; gap:.4rem; padding:.4rem .85rem .85rem; flex-wrap:wrap; }.spatial-controls button { min-height:44px; padding:.45rem .6rem; border:1px solid #6c88ae3d; border-radius:.35rem; background:transparent; color:#b2cbe4; font-size:.72rem; }
.spatial-controls button:hover { background:#89afff14; border-color:#8eafdc; }.spatial-compare { color:#a5f4dd!important; }.spatial-hint { color:#91abc5; font-size:.67rem; }
.spatial-controls { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.45rem; }
.spatial-controls .spatial-hint,.spatial-controls .spatial-compare { grid-column:1/-1; }
.spatial-controls .spatial-hint { display:block; padding:.35rem 0; text-align:center; }
.spatial-controls button:focus-visible { outline:2px solid #a5f4dd; outline-offset:2px; }
.spatial-marker-name { position:absolute; bottom:calc(100% + 7px); left:50%; transform:translateX(-50%); width:max-content; max-width:125px; padding:.3rem .45rem; border:1px solid #8debd54d; border-radius:.3rem; background:#101f30; color:#c9fff2; font:500 .67rem/1.25 var(--font, sans-serif); text-align:center; }
.spatial-stage canvas.is-dragging { cursor:grabbing; }
.spatial-copy { padding-bottom:1.1rem; }
.method-roadmap { padding:1rem 0 1rem 1.6rem; border-left:1px solid #8db8e13d; }
.method-roadmap > .eyebrow { margin-bottom:1.6rem; }
.method-roadmap ol { list-style:none; margin:0; padding:0; display:grid; gap:1.5rem; }
.method-roadmap li { display:grid; grid-template-columns:2rem 1fr; gap:.9rem; position:relative; }
.roadmap-number { font:500 .7rem var(--mono); color:#91e3d3; padding-top:.3rem; }
.method-roadmap h2 { margin:0 0 .4rem; font-size:1.08rem; line-height:1.3; letter-spacing:-.025em; }
.method-roadmap li p { color:#a7b8ca; margin:0; font-size:.88rem; line-height:1.6; max-width:36ch; }
@media(max-width:800px) { .method-roadmap { padding:.3rem 0 .3rem 1rem; }.method-roadmap ol { gap:1.1rem; }.method-roadmap h2 { font-size:1rem; } }
.clarity-example { min-width:0; padding:1.4rem 0 1.4rem 1.5rem; border-left:1px solid #87b3d34d; }
.clarity-example > h2 { font-size:clamp(1.4rem,2.2vw,1.9rem); line-height:1.18; margin:.8rem 0 1.4rem; letter-spacing:-.04em; }
.clarity-example ol { list-style:none; padding:0; margin:0; display:grid; gap:1rem; }
.clarity-example li { padding:0 0 1rem; border-bottom:1px solid #8db8e125; }
.example-label { color:#91e3d3; font:500 .62rem/1.5 var(--mono); text-transform:uppercase; letter-spacing:.04em; }
.clarity-example h3 { font-size:1rem; line-height:1.3; margin:.45rem 0 .35rem; }
.clarity-example li p { color:#a7b8ca; font-size:.84rem; line-height:1.6; margin:0; }
.clarity-example .example-note { font-size:.7rem; line-height:1.5; margin:1rem 0 0; color:#8196ae; }
.clarity-example.is-visible li { animation:example-enter 550ms var(--example-delay,0ms) both; }
@keyframes example-enter { from { opacity:.55; transform:translateY(5px); } to { opacity:1; transform:none; } }
@media(max-width:800px) { .clarity-example { padding:.3rem 0 .3rem 1rem; }.clarity-example > h2 { font-size:1.5rem; } }
@media(prefers-reduced-motion:reduce) { .clarity-example.is-visible li { animation:none; } }
.spatial-fallback { padding:1.3rem; color:#b3c5d8; font-size:.88rem; line-height:1.6; }.spatial-fallback ol { padding-left:1.1rem; }.spatial-ready .spatial-fallback { display:none; }
.spatial-failed .spatial-markers { display:none; }.spatial-failed .spatial-stage { min-height:0; aspect-ratio:auto; }.spatial-failed .spatial-stage canvas { display:none; }
.spatial-failed [data-spatial-rotate],.spatial-failed [data-spatial-reset],.spatial-failed .spatial-hint,.spatial-failed .spatial-compare { display:none; }
.spatial-site .hero-grid { grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); gap:2.5rem; }.spatial-site .hero { min-height:0; padding-block:4.2rem; }
.spatial-site .solutions-console { display:none; }
.spatial-site .page-intro > .spatial-intro-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.95fr); align-items:center; gap:3rem; }.spatial-intro-grid > .intro-copy { min-width:0; }.spatial-intro-grid h1 { font-size:clamp(2.6rem,4.5vw,4.7rem); }
.spatial-site .page-intro { padding-block:3.5rem; }
.spatial-site .legal .spatial-demo { margin:1.5rem 0; }.spatial-site .legal .spatial-stage { min-height:150px; max-height:230px; }.spatial-site .legal .spatial-demo { max-width:600px; }
.spatial-site .hero-visual { min-width:0; }.spatial-site .hero-visual .signal-board,.spatial-site .sculpture-pause { display:none; }
.spatial-loading .spatial-tabs,.spatial-loading .spatial-controls { display:none; }
@media(max-width:1050px) { .spatial-site .hero-grid,.spatial-site .page-intro > .spatial-intro-grid { gap:1.5rem; }.spatial-heading { padding:.8rem; }.spatial-heading strong { font-size:.9rem; }.spatial-hint { display:none; } }
@media(max-width:800px) { .spatial-site .hero-grid,.spatial-site .solutions-hero__grid,.spatial-site .solution-hero__grid,.spatial-site .page-intro > .spatial-intro-grid { grid-template-columns:1fr; gap:1.8rem; }.spatial-demo { width:100%; max-width:580px; justify-self:center; }.spatial-site .hero { padding:2rem 0 2rem; }.spatial-site .page-intro { padding-block:2.4rem; }.spatial-intro-grid h1 { font-size:clamp(2.4rem,8vw,3.8rem); } }
@media(max-width:480px) { .spatial-stage { min-height:220px; aspect-ratio:1.48; }.spatial-heading { gap:.5rem; }.spatial-heading strong { font-size:.9rem; }.spatial-status { font-size:.53rem; }.spatial-tabs { gap:.2rem; padding-inline:.55rem; }.spatial-tabs button { font-size:.7rem; padding:.6rem .3rem; min-height:4.2rem; }.spatial-copy { padding:.75rem .85rem .35rem; min-height:5rem; }.spatial-copy p { font-size:.82rem; }.spatial-controls { padding-inline:.55rem; }.spatial-controls button { font-size:.69rem; }.spatial-marker { width:21px; height:21px; } }
@media(max-width:700px) { .spatial-site[data-spatial-page="home"] .section { padding-block:2rem; }.spatial-site[data-spatial-page="home"] .hero { padding-top:1.5rem; } }
@media(prefers-reduced-motion:reduce) { .spatial-copy p.is-active { transition:none; } }
.spatial-site[data-spatial-page="home"] .solutions-preview .solution-card-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
/* The contact route prioritises reading and sending, with no decorative motion. */
body[data-spatial-page="contact"] *,body[data-spatial-page="contact"] *::before,body[data-spatial-page="contact"] *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
body[data-spatial-page="contact"] .ambient-field,body[data-spatial-page="contact"] .section-signal,body[data-spatial-page="contact"] .intro-telemetry,body[data-spatial-page="contact"] .scroll-progress,body[data-spatial-page="contact"] .cursor-signal,body[data-spatial-page="contact"] .depth-light { display:none!important; }
body[data-spatial-page="contact"] [data-reveal],body[data-spatial-page="contact"] [data-depth] { opacity:1!important; transform:none!important; }
body[data-spatial-page="contact"] .brand-outer,body[data-spatial-page="contact"] .brand-inner { stroke-dashoffset:0!important; }
body[data-spatial-page="contact"] .brand-tip { opacity:1!important; transform:none!important; }
body[data-spatial-page="contact"] .page-intro { padding-block:2.5rem 1.3rem; }
@media(max-width:480px) { body[data-spatial-page="contact"] .page-intro { padding-block:1.7rem 1rem; } }
@media(max-width:700px) { body[data-spatial-page="contact"] .contact-form-wrap { order:-1; } body[data-spatial-page="contact"] .contact-layout { gap:2rem; } }
/* Legal documents are intentionally quiet, static reading pages. */
body[data-spatial-page="privacy"] *,body[data-spatial-page="privacy"] *::before,body[data-spatial-page="privacy"] *::after,body[data-spatial-page="terms"] *,body[data-spatial-page="terms"] *::before,body[data-spatial-page="terms"] *::after { animation:none!important; transition:none!important; }
body[data-spatial-page="privacy"] .ambient-field,body[data-spatial-page="privacy"] .section-signal,body[data-spatial-page="privacy"] .scroll-progress,body[data-spatial-page="privacy"] .cursor-signal,body[data-spatial-page="terms"] .ambient-field,body[data-spatial-page="terms"] .section-signal,body[data-spatial-page="terms"] .scroll-progress,body[data-spatial-page="terms"] .cursor-signal { display:none!important; }
body[data-spatial-page="privacy"] .brand-outer,body[data-spatial-page="privacy"] .brand-inner,body[data-spatial-page="terms"] .brand-outer,body[data-spatial-page="terms"] .brand-inner { stroke-dashoffset:0!important; }
body[data-spatial-page="privacy"] .brand-tip,body[data-spatial-page="terms"] .brand-tip { opacity:1!important; transform:none!important; }
