/* V3: monochrome spatial composition, progressive motion, and interface detail. */
:root {
  --glass-card:rgba(40,43,47,.86);
  --glass-edge:rgba(245,245,240,.19);
  --ambient:rgba(205,215,220,.085);
  --depth-shadow:0 26px 58px -30px #000b, inset 0 1px 0 #ffffff0d;
}
:root[data-theme=light] {
  --glass-card:rgba(255,255,253,.88);
  --glass-edge:rgba(52,57,62,.2);
  --ambient:rgba(84,95,100,.07);
  --depth-shadow:0 26px 58px -30px #252b3540, inset 0 1px 0 #fff;
}
.header { transition:box-shadow .3s,background .3s; }
.header.has-scrolled { box-shadow:0 10px 30px #0000000a; }
.reading-progress { position:absolute;left:0;right:0;bottom:-1px;height:1px;pointer-events:none; }
.reading-progress i { display:block;height:100%;background:var(--strong);transform:scaleX(0);transform-origin:left; }
.nav a { position:relative;padding:5px 0; }
.nav a:after { content:'';position:absolute;bottom:-5px;left:0;right:0;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .25s; }
.nav a[aria-current],.nav a:hover { color:var(--ink); }
.nav a[aria-current]:after,.nav a:hover:after { transform:scaleX(1); }
.button-primary { box-shadow:0 3px 0 #00000016,inset 0 1px 0 #ffffff30; }
.button-primary>span,.header-cta>span,.text-link>span { transition:transform .25s; }
.button-primary:hover>span,.header-cta:hover>span,.text-link:hover>span { transform:translate(3px,-3px); }
.hero { min-height:740px;grid-template-columns:1fr 1.08fr;overflow:clip; }
.hero-copy { padding-top:106px; }
.hero-copy h1 { position:relative; }
.hero-copy h1 em { background:linear-gradient(115deg,var(--ink),var(--muted));background-clip:text;-webkit-background-clip:text;color:transparent; }
.hero-visual { display:block;padding:67px 0 30px 20px;perspective:1200px; }
.hero-technical-label { top:21px;left:20px;right:0;padding-top:0;height:42px;align-items:center;border-top:0;border-bottom:1px solid var(--line);font-size:9px;letter-spacing:1.5px; }
.hero-technical-label>span { display:flex;align-items:center;gap:9px; }
.live-dot { width:5px;height:5px;display:inline-block;border-radius:50%;background:var(--strong);box-shadow:0 0 0 4px var(--ambient); }
#motion-toggle { width:44px;height:42px;display:grid;place-items:center;border-left:1px solid var(--line); }
#motion-toggle svg { width:17px;height:17px; }
#motion-toggle:hover { color:var(--ink); }
#motion-toggle:disabled { cursor:default;opacity:.5; }
.hero-stage { height:482px;position:relative;margin:0 -20px 0 -20px;isolation:isolate;--pointer-x:0;--pointer-y:0; }
.stage-grid { position:absolute;inset:0;z-index:-2;background-image:radial-gradient(var(--strong) .6px,transparent .9px);background-size:23px 23px;opacity:.15;mask-image:radial-gradient(ellipse,#0007,transparent 72%); }
.hero-stage:before { content:'';position:absolute;inset:3% 0 -1% 0;z-index:-2;background:radial-gradient(ellipse,var(--ambient),transparent 67%); }
.hero-stage:after { content:'';position:absolute;right:7%;bottom:34px;width:9px;height:9px;background:linear-gradient(var(--quiet),var(--quiet)) center/1px 9px no-repeat,linear-gradient(var(--quiet),var(--quiet)) center/9px 1px no-repeat; }
.stage-orbits { position:absolute;width:100%;height:100%;inset:0;color:var(--strong);z-index:-1; }
.stage-orbits ellipse { stroke:currentColor;stroke-width:.7;opacity:.16;stroke-dasharray:2 7; }
.stage-orbits ellipse:nth-child(2) { opacity:.13;stroke-dasharray:none; }
.orbit-signal { stroke:currentColor;stroke-width:1;stroke-dasharray:45 1550;stroke-linecap:round;opacity:.45;animation:orbit-flow 17s linear infinite; }
.orbit-coordinates { stroke:currentColor;stroke-width:1;opacity:.5; }
.hero-art-wrap { position:absolute;inset:9% -7% 0 -7%;display:flex;align-items:center;justify-content:center;transform:translate3d(calc(var(--pointer-x)*15px),calc(var(--pointer-y)*12px),0) rotateX(calc(var(--pointer-y)*-4deg)) rotateY(calc(var(--pointer-x)*4deg));transition:transform .7s cubic-bezier(.16,1,.3,1); }
.hero-visual .hero-art-wrap img { width:100%;max-width:none;height:auto;margin:0;filter:drop-shadow(0 30px 30px #0003);animation:sculpture-float 9s ease-in-out infinite; }
.module-pin { position:absolute;z-index:3;display:flex;align-items:center;gap:10px;padding:11px 13px 11px 10px;border:1px solid var(--glass-edge);background:var(--glass-card);backdrop-filter:blur(18px);box-shadow:var(--depth-shadow);border-radius:9px;text-align:left;min-width:132px;transition:transform .3s,border-color .3s,background .3s;transform:translate3d(calc(var(--pointer-x)*-9px),calc(var(--pointer-y)*-7px),0); }
.module-pin:before { content:'';position:absolute;width:4px;height:4px;background:var(--muted);border-radius:50%;right:10px;top:9px;transition:box-shadow .3s; }
.module-pin:hover,.module-pin[aria-pressed=true] { border-color:var(--strong);background:var(--panel); }
.module-pin[aria-pressed=true]:before { background:var(--ink);box-shadow:0 0 0 3px var(--ambient); }
.module-pin:hover { transform:translate3d(calc(var(--pointer-x)*-9px),calc(var(--pointer-y)*-7px - 4px),0); }
.module-pin-icon { display:grid;place-items:center;width:32px;height:32px;border:1px solid var(--line);border-radius:7px;color:var(--strong); }
.module-pin-icon svg { width:19px;height:19px; }
.module-pin>span:nth-child(2) { display:flex;flex-direction:column;gap:3px; }
.module-pin small { color:var(--quiet);font-size:8px;letter-spacing:1.1px; }
.module-pin strong { font-size:12px;font-weight:600; }
.module-pin>i { font-size:13px;color:var(--quiet);margin-left:7px; }
.pin-0 { top:42px;left:25%; }
.pin-1 { top:43%;left:0; }
.pin-2 { top:31%;right:0; }
.pin-3 { bottom:50px;right:3%; }
.stage-coordinate { position:absolute;left:10px;bottom:32px;font-size:8px;line-height:1.7;letter-spacing:1px;color:var(--quiet);opacity:.7; }
.hero-detail { position:relative;display:grid;grid-template-columns:49px 1fr 42px;align-items:center;column-gap:15px;min-height:117px;padding:21px 19px 25px;border:1px solid var(--glass-edge);border-radius:9px;background:linear-gradient(125deg,var(--raised),var(--panel) 70%);box-shadow:var(--depth-shadow); }
.detail-index { align-self:start;padding-top:2px;font-size:26px;font-weight:450;letter-spacing:-1px;line-height:1.2;color:var(--strong); }
.detail-index>span { display:block;font-size:8px;letter-spacing:1px;color:var(--quiet);margin-top:9px; }
.detail-copy h2 { font-size:16px;font-weight:600;letter-spacing:-.3px;line-height:1.5; }
.detail-copy p { font-size:11px;color:var(--muted);line-height:1.85;margin-top:6px;max-width:350px; }
.detail-signal { display:flex;gap:2px;align-items:center;height:32px; }
.detail-signal i { width:2px;height:calc(var(--bar)*3px);background:var(--strong);opacity:.65;transform-origin:center;animation:signal-bars 2s ease-in-out var(--delay) infinite alternate; }
.detail-track { position:absolute;left:83px;bottom:-1px;right:19px;display:flex;gap:5px; }
.detail-track i { height:2px;flex:1;background:var(--line);transition:background .3s; }
.detail-track i.selected { background:var(--strong); }
.stage-hint { font-size:10px;line-height:1.7;color:var(--quiet);margin-top:12px;padding-left:1px; }
.principles { background:var(--panel);position:relative; }
.principles>span { position:relative; }
.principles>span+span:before { content:'';position:absolute;left:-10px;height:24px;width:1px;background:var(--line); }
.demo-workspace { position:relative;box-shadow:0 45px 80px -55px #0009,inset 0 1px 0 #ffffff0a; }
.workspace-top { background:linear-gradient(115deg,var(--raised),var(--panel)); }
.workspace-demo:before { content:'';display:inline-block;width:4px;height:4px;border-radius:50%;background:var(--muted);margin:0 8px 2px 0; }
.demo-scene { background-image:radial-gradient(var(--line) .65px,transparent .8px);background-size:15px 15px;perspective:1400px; }
.demo-panel { box-shadow:0 6px 13px -10px #0008,inset 0 1px 0 #ffffff08;transition:transform .45s,box-shadow .45s,border-color .45s; }
.demo-panel.is-current { box-shadow:0 14px 25px -16px #0009,0 0 0 3px var(--ambient); }
.panel-connection { display:flex;align-items:center;position:absolute;left:100%;right:auto;top:48%;width:27px;height:24px;color:var(--strong);z-index:1; }
.panel-connection:before { content:'';height:1px;width:100%;background:var(--line); }
.panel-connection b { position:absolute;right:0;font-size:17px;font-weight:400;line-height:1; }
.panel-connection i { position:absolute;left:0;width:5px;height:5px;border-radius:50%;background:var(--ink);opacity:0; }
.demo-workspace[data-playing=true] .is-active .panel-connection i { opacity:1;animation:connection-flow 1s ease-in-out infinite; }
.demo-workspace[data-step="3"] .panel-connection:before { background:var(--strong); }
.demo-workspace[data-playing=true] .workspace-mark { animation:workspace-pulse 1.5s ease-in-out infinite; }
.demo-step>span { display:grid;place-items:center;width:24px;height:24px;border:1px solid var(--line);border-radius:50%; }
.demo-step.is-active>span { background:var(--raised);border-color:var(--strong); }
.promise-grid { gap:18px; }
.promise-grid article { position:relative;padding:22px 27px 30px;border:1px solid var(--line);border-radius:10px;background:linear-gradient(135deg,var(--panel),var(--paper));box-shadow:inset 0 1px 0 #ffffff06;transition:transform .4s,border-color .4s,box-shadow .4s; }
.promise-grid article:hover { border-color:var(--glass-edge);box-shadow:var(--depth-shadow);transform:translateY(-4px); }
.promise-grid article>svg { display:none; }
.promise-grid h3 { font-size:22px;margin:23px 0 12px; }
.promise-grid p { font-size:14px; }
.promise-sketch { height:121px;position:relative;border-bottom:1px solid var(--line);color:var(--strong); }
.sketch-index { position:absolute;top:0;left:0;font-size:9px;letter-spacing:1.3px;color:var(--quiet); }
.sketch-chat { position:absolute;left:50%;top:9px;transform:translateX(-50%);width:158px;height:95px; }
.sketch-chat>span { position:absolute;left:0;top:12px;display:flex;align-items:center;gap:6px;padding:14px 21px;border:1px solid var(--glass-edge);border-radius:12px 12px 12px 0;background:var(--raised);box-shadow:0 12px 22px #0000000d; }
.sketch-chat>span:nth-child(2) { left:59px;top:53px;padding:14px 17px;border-radius:12px 12px 0 12px; }
.sketch-chat i { width:5px;height:5px;display:block;border-radius:50%;background:var(--muted);animation:chat-dot 2.8s ease-in-out infinite; }
.sketch-chat i:nth-child(2) { animation-delay:.2s; }.sketch-chat i:nth-child(3) { animation-delay:.4s; }
.sketch-chat b { position:absolute;right:11px;top:17px;font-size:22px;font-weight:400; }
.sketch-design { position:absolute;left:50%;top:5px;width:141px;height:99px;transform:translateX(-50%); }
.sketch-design>span { position:absolute;inset:10px 0 8px;border:1px solid var(--glass-edge);padding:13px;background:var(--raised);box-shadow:0 12px 22px #0000000d;display:grid;grid-template-columns:.75fr 1fr;gap:8px;border-radius:5px;transform:rotate(-5deg); }
.sketch-design i { background:var(--muted);opacity:.3;border-radius:2px; }
.sketch-design i:first-child { grid-row:span 2;background:var(--strong);opacity:.5; }
.sketch-design b { font-size:29px;font-weight:400;position:absolute;right:15px;bottom:-3px;animation:design-adjust 5s ease-in-out infinite; }
.sketch-design em { position:absolute;left:-10px;top:0;font-size:18px;color:var(--quiet); }
.sketch-handoff { position:absolute;left:50%;top:32px;transform:translateX(-50%);width:179px;display:flex;align-items:center; }
.sketch-handoff>span,.sketch-handoff>b { display:grid;place-items:center;position:relative;width:52px;height:52px;flex-shrink:0;border:1px solid var(--glass-edge);border-radius:11px;background:var(--raised);box-shadow:0 12px 22px #0000000d; }
.sketch-handoff>span { font-size:20px;font-weight:600;transform:rotate(-8deg); }
.sketch-handoff>b { border-radius:50%;width:45px;height:45px;font-weight:400;font-size:21px; }
.sketch-handoff>i { height:1px;flex:1;background:var(--line);position:relative; }
.sketch-handoff>i:after { content:'';position:absolute;left:0;top:-2px;width:5px;height:5px;border-radius:50%;background:var(--strong);animation:handoff-flow 3s ease-in-out infinite; }
.service-number { display:flex;flex-direction:column;gap:19px;align-items:flex-start; }
.service-number svg { width:20px;height:20px;color:var(--muted);transition:transform .3s; }
.service-row { position:relative;isolation:isolate;transition:background .3s; }
.service-row:before { content:'';position:absolute;left:0;top:20%;bottom:20%;width:2px;background:var(--ink);opacity:0;transform:scaleY(.2);transition:transform .3s,opacity .3s; }
.service-row:hover:before { opacity:1;transform:scaleY(1); }
.service-row:hover .service-number svg { transform:translateY(-3px);color:var(--ink); }
.service-arrow { transition:transform .25s; }.service-row:hover .service-arrow { transform:translate(3px,-3px); }
.bundle { position:relative;background:linear-gradient(115deg,var(--raised),var(--panel) 70%);box-shadow:var(--depth-shadow);overflow:hidden; }
.bundle-system { grid-column:1/-1;border-top:1px solid var(--line);padding-top:23px;width:100%; }
.bundle-system>p { font-size:11px;color:var(--muted);line-height:1.7; }
.bundle-route { display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:23px; }
.bundle-route>div { display:flex;align-items:center;gap:12px;position:relative;min-width:0; }
.bundle-node { display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--glass-edge);background:var(--paper);border-radius:9px;z-index:1;flex-shrink:0;box-shadow:0 5px 12px #0000000c; }
.bundle-node svg { width:21px;height:21px; }
.bundle-route strong { font-size:12px;font-weight:550;padding-right:15px; }
.bundle-link { flex:1;min-width:10px;height:1px;background:var(--line);margin-right:15px;position:relative; }
.bundle-link i { position:absolute;width:5px;height:5px;background:var(--strong);top:-2px;left:0;border-radius:50%;animation:handoff-flow 3s ease-in-out infinite; }
.bundle-route>div:nth-child(2) .bundle-link i { animation-delay:1s; }.bundle-route>div:nth-child(3) .bundle-link i { animation-delay:2s; }
.bundle-route>div:last-child .bundle-link { display:none; }
.work-grid { gap:26px; }
.work-display { isolation:isolate;border:1px solid var(--glass-edge);border-radius:12px;box-shadow:var(--depth-shadow);--pointer-x:0;--pointer-y:0; }
.crm-display { background:radial-gradient(ellipse at 56% 12%,#555a5d,#24272a 74%); }
.work-display .demo-badge { z-index:5;border-color:#ffffff2a;background:#24262999;backdrop-filter:blur(12px);color:#dfe1dd; }
.interface-chart { position:absolute;inset:0;width:100%;height:100%;opacity:.75; }
.chart-grid { stroke:#e4e9eb;stroke-width:.5;opacity:.09; }
.chart-route { stroke:#d4dcdf;stroke-width:1;opacity:.2; }
.chart-traveller { stroke:#d4dcdf;stroke-width:1.5;stroke-dasharray:40 1050;animation:chart-travel 10s linear infinite;opacity:.7; }
.crm-background-word { font-size:70px;color:#b9bdb7;opacity:.3;z-index:0;left:26px;top:164px;letter-spacing:-3px; }
.work-display .phone { z-index:2;transform:translateX(-20%) rotate(9deg) translate3d(calc(var(--pointer-x)*12px),calc(var(--pointer-y)*10px),0);transition:transform .7s cubic-bezier(.16,1,.3,1);box-shadow:0 45px 50px #0008,0 0 0 1px #ffffff30,inset 0 1px 0 #fff5; }
.crm-insight { position:absolute;left:27px;bottom:32px;width:185px;padding:17px 18px;border:1px solid #ffffff30;background:#303438d9;border-radius:10px;backdrop-filter:blur(16px);z-index:3;box-shadow:0 15px 30px #0003;transform:translate3d(calc(var(--pointer-x)*-12px),calc(var(--pointer-y)*-8px),0);transition:transform .7s cubic-bezier(.16,1,.3,1); }
.insight-label { font-size:9px;color:#c2c5c5; }
.crm-insight>strong { display:flex;align-items:baseline;gap:10px;font-size:28px;color:#eff0eb;font-weight:500;margin-top:7px;letter-spacing:-1px; }
.crm-insight>strong>span { font-size:8px;font-weight:400;letter-spacing:0;color:#b1b6b8; }
.insight-bars { display:flex;align-items:flex-end;gap:7px;height:32px;margin:7px 0 13px; }
.insight-bars i { flex:1;background:#b9c0c3;height:55%;transform-origin:bottom;animation:insight-bars 5s ease-in-out infinite alternate; }
.insight-bars i:nth-child(2n) { height:82%;background:#747c81;animation-delay:-2s; }.insight-bars i:nth-child(3n) { height:35%;animation-delay:-3s; }
.insight-footer { display:flex;align-items:center;gap:7px;color:#c2c5c5;padding-top:10px;border-top:1px solid #ffffff20; }
.insight-footer svg { width:13px;height:13px; }.insight-footer span { font-size:8px; }
.content-display { background:radial-gradient(ellipse at 40% 15%,#d8dbd4,#9b9e99 90%); }
.content-orbit { position:absolute;inset:0;display:grid;place-items:center; }
.content-orbit>i { position:absolute;width:430px;height:430px;border:1px solid #373d4226;border-radius:50%; }
.content-orbit>i:nth-child(2) { width:330px;height:330px; }.content-orbit>i:nth-child(3) { width:530px;height:530px; }
.content-orbit>i:first-child:after { content:'';position:absolute;top:50%;left:-4px;width:7px;height:7px;border-radius:50%;background:#4a5055; }
.content-orbit>i:first-child { animation:content-orbit 45s linear infinite; }
.content-paper { position:absolute;width:62%;height:270px;left:18%;top:93px;background:#e6e8e1;border:1px solid #535a5933;border-radius:7px;box-shadow:0 20px 30px #272b3826;z-index:-1; }
.paper-back { transform:rotate(-13deg) translate(-23px,-4px);background:#cbd0c7; }.paper-mid { transform:rotate(9deg) translate(9px,-12px); }
.content-board { box-shadow:0 25px 50px #272b3833;transform:rotate(-6deg) translate3d(calc(var(--pointer-x)*11px),calc(var(--pointer-y)*9px),0);transition:transform .7s cubic-bezier(.16,1,.3,1); }
.content-channel { position:absolute;top:95px;right:23px;z-index:3;display:flex;align-items:center;gap:9px;padding:13px 14px;border-radius:7px;background:#292d30;color:#e8ebe5;border:1px solid #ffffff33;box-shadow:0 15px 30px #0002;animation:channel-float 7s ease-in-out infinite; }
.content-channel svg { width:18px;height:18px; }.content-channel>span { font-size:8px;letter-spacing:1.2px; }.content-channel>i { font-size:17px; }
.notification { z-index:3;animation:notification-float 8s ease-in-out infinite;box-shadow:0 20px 35px #242a3b29; }
.process-grid { position:relative; }
.process-item { position:relative;padding-top:95px;border-top:0; }
.process-item:before { content:'';position:absolute;top:39px;left:30px;right:-40px;height:1px;background:var(--line); }
.process-item:last-child:before { display:none; }
.process-item>span { font-size:12px;letter-spacing:1px;color:var(--quiet); }
.process-item h3 { margin-top:17px; }
.process-orbit { position:absolute;left:0;top:0;width:80px;height:80px;display:grid;place-items:center;isolation:isolate; }
.process-orbit:before { content:'';position:absolute;inset:11px;border:1px solid var(--glass-edge);border-radius:50%;background:var(--panel);box-shadow:inset 0 1px 0 #ffffff14,0 8px 18px #0000000f;z-index:-1; }
.process-orbit>i { position:absolute;inset:0;border:1px dashed var(--line);border-radius:50%;animation:content-orbit 45s linear infinite; }
.process-orbit>i:after { content:'';position:absolute;top:50%;left:-2px;width:3px;height:3px;background:var(--strong);border-radius:50%; }
.process-orbit svg { width:23px;height:23px;color:var(--muted); }
.process-item.is-visible .process-orbit svg { color:var(--ink); }
.process-item.is-visible:after { content:'';position:absolute;top:37px;left:80px;width:5px;height:5px;border-radius:50%;background:var(--strong);animation:process-travel 5s ease-in-out infinite; }
.process-item:last-child:after { display:none; }.process-item:nth-child(2):after { animation-delay:1.2s; }.process-item:nth-child(3):after { animation-delay:2.4s; }
.final-section { position:relative;isolation:isolate;padding:75px 48px 68px;border:1px solid var(--line);border-radius:13px;background:linear-gradient(120deg,var(--panel),var(--paper));overflow:hidden; }
.final-section>div:not(.final-grid) { position:relative;z-index:1; }
.final-grid { position:absolute;inset:0;z-index:-1;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:68px 68px;opacity:.4;mask-image:linear-gradient(90deg,transparent 40%,#000);transform:perspective(500px) rotateY(-19deg) rotateZ(-10deg) scale(1.2); }
.final-arrow { position:relative;text-shadow:1px 2px 0 var(--paper),5px 7px 0 var(--line),14px 16px 28px #0002;background:linear-gradient(135deg,var(--ink),var(--quiet));background-clip:text;-webkit-background-clip:text;color:transparent;animation:final-arrow 7s ease-in-out infinite; }
.reveal-item.is-visible { animation:section-arrive .7s cubic-bezier(.16,1,.3,1) var(--reveal-delay,0ms) both; }
@keyframes sculpture-float { 0%,100%{transform:translateY(0) rotate(-.5deg)}50%{transform:translateY(-10px) rotate(.5deg)} }
@keyframes orbit-flow { to{stroke-dashoffset:-1595} }
@keyframes signal-bars { to{transform:scaleY(.4);opacity:.35} }
@keyframes connection-flow { 0%{transform:translateX(0);opacity:0}30%{opacity:1}100%{transform:translateX(24px);opacity:0} }
@keyframes workspace-pulse { 50%{box-shadow:0 0 0 5px var(--ambient)} }
@keyframes chat-dot { 0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-3px);opacity:1} }
@keyframes design-adjust { 0%,100%{transform:translate(0,0)}50%{transform:translate(-18px,-5px)} }
@keyframes handoff-flow { 0%{left:0;opacity:0}25%{opacity:1}90%{opacity:1}100%{left:100%;opacity:0} }
@keyframes chart-travel { to{stroke-dashoffset:-1090} }
@keyframes insight-bars { to{transform:scaleY(.65)} }
@keyframes content-orbit { to{transform:rotate(360deg)} }
@keyframes notification-float { 0%,100%{translate:0 0}50%{translate:0 -6px} }
@keyframes channel-float { 0%,100%{translate:0 -3px}50%{translate:0 5px} }
@keyframes process-travel { 0%{left:80px;opacity:0}20%{opacity:.6}95%{opacity:.6}100%{left:calc(100% + 25px);opacity:0} }
@keyframes final-arrow { 0%,100%{transform:translate(0,0)}50%{transform:translate(5px,-5px)} }
@keyframes section-arrive { from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)} }
.motion-scene:not(.in-view) *, .hero-visual:not(.in-view) *, .demo-workspace:not(.in-view) *, .page-hidden *, .page-hidden *:after { animation-play-state:paused!important; }
.motion-scene:not(.in-view) *:before, .motion-scene:not(.in-view) *:after, .page-hidden *:before { animation-play-state:paused!important; }
@media(min-width:1561px) { .hero-stage{height:511px}.hero{min-height:760px}.hero-copy{padding-top:116px} }
@media(max-width:1150px) {
  .hero{min-height:680px}.hero-copy{padding-top:91px}.hero-visual{padding-left:8px}.hero-technical-label{left:8px}.hero-stage{height:445px;margin-left:-8px;margin-right:-10px}.hero-art-wrap{inset:8% -11% 0 -11%}.pin-0{top:47px;left:17%}.module-pin{min-width:115px;padding:9px;gap:7px}.module-pin-icon{width:29px;height:29px}.module-pin strong{font-size:11px}.module-pin>i{margin-left:2px}.pin-1{left:-6px}.pin-2{right:-7px}.pin-3{bottom:41px;right:0}.hero-detail{grid-template-columns:35px 1fr;padding:18px 15px 22px;column-gap:12px;min-height:126px}.detail-signal{display:none}.detail-copy h2{font-size:14px}.detail-copy p{font-size:11px}.detail-index{font-size:23px}.detail-track{left:62px;right:15px}.stage-hint{font-size:9px}.promise-grid article{padding:21px}.promise-grid h3{font-size:20px}.bundle-route{gap:10px}.bundle-route>div{gap:8px}.bundle-route strong{font-size:10px;padding-right:0}.bundle-link{margin-right:0}.bundle-node{width:35px;height:35px}.bundle-node svg{width:18px;height:18px}.crm-insight{left:19px;bottom:24px;width:162px;padding:14px}.crm-background-word{font-size:57px;left:19px}.content-channel{right:13px;top:85px;padding:11px;gap:7px}.content-channel>span{font-size:7px}.work-display .phone{transform:translateX(-15%) rotate(9deg) translate3d(calc(var(--pointer-x)*12px),calc(var(--pointer-y)*10px),0)}.work-display{height:465px}.final-section{padding:55px 35px}
}
@media(min-width:761px) and (max-width:900px) {
  .hero{min-height:700px}.hero-copy{padding-top:88px}.hero-stage{height:441px}.module-pin{min-width:101px}.module-pin-icon{width:23px;height:27px;border:0}.module-pin-icon svg{width:17px;height:17px}.module-pin>i{display:none}.pin-0{left:15%}.pin-2{top:33%;right:-3px}.pin-1{left:-7px;top:50%}.pin-3{bottom:35px;right:0}.hero-art-wrap{inset:10% -20% 0 -14%}.detail-copy h2{font-size:13px}.detail-copy p{font-size:10px}.stage-coordinate{font-size:7px;bottom:27px}.promise-grid{gap:12px}.promise-grid article{padding:18px}.promise-grid h3{font-size:18px}.promise-grid p{font-size:13px}.sketch-chat,.sketch-design,.sketch-handoff{scale:.83}.crm-insight{width:137px;padding:12px;left:14px;bottom:23px}.crm-insight>strong>span{font-size:7px}.crm-background-word{font-size:48px}.content-channel{padding:10px;right:11px;top:74px}.content-channel>span{display:none}.bundle-route strong{font-size:10px}.bundle-route{gap:9px}.bundle-node{width:30px;height:33px}.bundle-route>div{gap:7px}.bundle-link{min-width:5px}.process-item:before{right:-25px}.final-section{padding:47px 29px}
}
@media(max-width:760px) {
  .hero{min-height:0;overflow:clip}.hero-copy{padding-top:45px}.hero-copy h1{margin-right:0}.hero-visual{height:auto;min-height:0;margin-top:20px;padding:50px 0 25px;display:block}.hero-technical-label{display:flex;left:0;top:0;height:42px;font-size:8px;letter-spacing:1.3px}.hero-stage{height:365px;margin:0 -4%;width:auto}.hero-art-wrap{inset:9% -5% -4%;}.hero-visual .hero-art-wrap img{width:100%;max-width:none;max-height:none;height:auto;margin:0}.module-pin{min-width:103px;padding:9px;gap:7px;border-radius:7px;min-height:51px}.module-pin-icon{width:24px;height:27px;border:0}.module-pin-icon svg{width:18px;height:18px}.module-pin small{font-size:7px}.module-pin strong{font-size:11px}.module-pin>i{display:none}.pin-0{top:19px;left:20%}.pin-1{top:42%;left:2%}.pin-2{top:28%;right:1%}.pin-3{bottom:37px;right:4%}.stage-coordinate{left:4%;bottom:21px;font-size:7px}.stage-orbits{width:113%;left:-6%}.hero-detail{grid-template-columns:33px 1fr;min-height:113px;padding:19px 15px 22px;gap:11px}.detail-copy h2{font-size:14px;letter-spacing:-.2px}.detail-copy p{font-size:11px;line-height:1.75}.detail-index{font-size:22px}.detail-track{left:59px}.stage-hint{font-size:9px;line-height:1.9;margin-top:11px;max-width:320px}.principles>span+span:before{display:none}.principles{padding:22px 6%}.demo-workspace{box-shadow:0 26px 45px -30px #0006}.demo-panel.is-current{animation:panel-arrive .3s both;box-shadow:0 8px 16px -10px #0005}.demo-scene{min-height:465px}.panel-connection{display:none}.demo-step{gap:8px}.demo-step>span{width:21px;height:21px;font-size:8px}.demo-step strong{font-size:10px}.promise-grid{gap:15px}.promise-grid article{padding:22px 24px 27px}.promise-sketch{height:116px}.promise-grid h3{font-size:22px;margin-top:22px}.promise-grid p{font-size:14px;line-height:1.9}.service-number{gap:20px}.service-number svg{width:17px;height:17px}.service-row:hover:before{display:none}.bundle-system{margin-top:25px;padding-top:23px}.bundle-system>p{font-size:11px;max-width:230px;line-height:1.8}.bundle-route{grid-template-columns:1fr 1fr;gap:21px 15px;margin-top:22px}.bundle-node{width:34px;height:34px}.bundle-route strong{font-size:10px}.bundle-route>div{gap:9px}.bundle-route>div:nth-child(2) .bundle-link{display:none}.bundle-link{min-width:8px}.work-display{height:463px;border-radius:9px}.work-display .phone{left:48%;width:251px;top:73px;transform:translateX(-19%) rotate(9deg)}.crm-background-word{left:20px;top:155px;font-size:54px}.crm-insight{left:20px;bottom:25px;width:161px}.insight-label{font-size:9px}.crm-insight>strong{font-size:28px}.crm-insight>strong>span{font-size:7px}.insight-bars{height:27px}.content-channel{right:16px;top:95px;padding:11px}.content-channel>span{display:block;font-size:7px}.content-board{top:105px}.paper-back{top:120px}.paper-mid{top:120px}.content-orbit>i{width:350px;height:350px}.content-orbit>i:nth-child(2){width:260px;height:260px}.content-orbit>i:nth-child(3){width:450px;height:450px}.notification{bottom:35px;right:19px}.process-grid{gap:32px 20px}.process-item{padding-top:81px}.process-orbit{width:66px;height:66px}.process-orbit:before{inset:9px}.process-orbit svg{width:20px;height:20px}.process-item:before{top:32px;right:-20px}.process-item:nth-child(2):before,.process-item:nth-child(2):after{display:none}.process-item.is-visible:after{top:30px;animation-name:process-travel-mobile}.process-item h3{margin-top:15px}.final-section{padding:35px 25px 39px;margin-bottom:49px;border-radius:9px}.final-section h2{font-size:34px;letter-spacing:-1.5px}.final-grid{opacity:.22;mask-image:linear-gradient(110deg,transparent 20%,#000)}.final-description{font-size:14px;line-height:1.9}.final-section .button{font-size:12px;gap:18px;padding:16px 18px}.footer{padding-top:26px}
  @keyframes panel-arrive { from{opacity:.5;transform:translateY(7px)}to{opacity:1;transform:translateY(0)} }
  @keyframes process-travel-mobile { 0%{left:66px;opacity:0}20%{opacity:.6}95%{opacity:.6}100%{left:calc(100% + 16px);opacity:0} }
}
@media(min-width:500px) and (max-width:760px) { .hero-stage{height:420px;margin:0}.hero-art-wrap{inset:0 0 -4%}.pin-0{left:25%;top:25px}.pin-1{left:3%}.pin-2{right:4%}.pin-3{right:7%;bottom:40px}.hero-detail{grid-template-columns:42px 1fr 42px}.detail-signal{display:flex}.detail-track{left:72px}.hero-visual{max-width:560px;align-self:center}.hero-detail{min-height:103px}.stage-hint{max-width:none}.promise-grid article{padding:25px 28px}.work-display{height:500px}.work-display .phone{width:290px;left:53%}.crm-insight{width:190px}.content-board{top:90px;width:70%;left:15%}.content-channel{right:25px}.notification{right:35px} }
@media(max-width:370px) {
  .hero-stage{height:315px}.hero-visual{padding-top:48px}.module-pin{min-width:90px;padding:7px;gap:4px;min-height:47px}.module-pin strong{font-size:10px}.module-pin-icon{width:22px}.module-pin-icon svg{width:16px}.module-pin:before{right:7px;top:7px;width:3px;height:3px}.pin-0{left:22%;top:17px}.pin-2{right:0;top:32%}.pin-1{left:0;top:42%}.pin-3{right:2%;bottom:23px}.stage-coordinate{bottom:16px;left:2%}.hero-detail{padding:17px 12px 20px;column-gap:9px;grid-template-columns:29px 1fr;min-height:121px}.detail-copy h2{font-size:13px}.detail-copy p{font-size:10px}.detail-track{left:50px;right:12px}.stage-hint{font-size:8px}.work-display{height:427px}.work-display .phone{left:42%;width:240px}.crm-insight{width:143px;left:14px;padding:12px;bottom:22px}.crm-insight>strong{font-size:25px;gap:6px}.crm-background-word{left:15px;font-size:48px}.content-channel{right:10px;top:95px;padding:9px}.content-channel>span{font-size:6px}.content-board{top:103px}.notification{width:235px;bottom:28px}.promise-grid article{padding:20px}.promise-grid h3{font-size:20px}.bundle-route{gap:18px 12px}.bundle-node{width:28px;height:30px}.bundle-node svg{width:16px;height:16px}.bundle-route>div{gap:7px}.bundle-route strong{font-size:9px}.bundle-link{min-width:5px}.final-section{padding:30px 20px}.final-section h2{font-size:29px}.final-section .button{font-size:11px;gap:12px}.demo-step strong{font-size:9px}
}
/* Manual pause and OS reduced motion leave every control and all text available. */
:root[data-motion=paused] *, :root[data-motion=paused] *:before, :root[data-motion=paused] *:after { animation:none!important;transition:none!important; }
:root[data-motion=paused] { scroll-behavior:auto; }
:root[data-motion=paused] .reveal-item { opacity:1; }
@media(prefers-reduced-motion:reduce) {
  html{scroll-behavior:auto} *,*:before,*:after{animation:none!important;transition:none!important}
  .reveal-item{opacity:1}.hero-art-wrap,.module-pin,.crm-insight{translate:0 0}
}