
@font-face{font-family:Manrope;src:url('/fonts/Manrope.ttf') format('truetype');font-weight:200 800;font-display:swap}
:root{
  --bg:#080c14;--bg-soft:#101827;--ink:#eff3fc;--muted:#9aa9c1;--quiet:#697c9d;
  --blue:#94d7ff;--violet:#b094f5;--warm:#ffc4a7;--green:#91e4c1;
  --border:rgba(174,198,255,.17);--panel:rgba(21,31,49,.6);
  --ease:cubic-bezier(.22,1,.36,1);--header:88px;--scene-x:.25;--scene-y:0;--scene-scale:.73;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:110px}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Manrope,'Segoe UI',sans-serif;font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:clip}
::selection{background:#a090f34f;color:white}
button,input,textarea{font:inherit}
a{color:inherit;text-decoration:none}
button{color:inherit;cursor:pointer}
button,a{-webkit-tap-highlight-color:transparent}
button{border:0;background:none}
button:disabled{opacity:.3;cursor:default}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid #a8d7ff;outline-offset:5px}
img{display:block;max-width:100%}
svg.icon{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.symbol-library{position:absolute;width:0;height:0;overflow:hidden}
.container{width:min(1280px,calc(100% - 112px));margin-inline:auto}
main{position:relative;z-index:2}
.section{padding-top:136px;padding-bottom:132px}
.scene{position:relative}
h1,h2,h3,p{margin:0}
h1,h2,h3{font-weight:560;letter-spacing:-.055em}
h1{font-size:clamp(65px,5.55vw,86px);line-height:1.045}
h2{font-size:clamp(40px,4.2vw,64px);line-height:1.12}
h3{font-size:34px;line-height:1.2}
.gradient-text{color:#b1b6ff;background:linear-gradient(105deg,#a0ddff 2%,#9eb6ff 40%,#b392f0 85%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.secondary-text{color:#8697b4}
.eyebrow{display:flex;align-items:center;gap:9px;font-size:10px;line-height:1.7;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#9eb7d9}
.status-dot,.source-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#93e6c4;flex:none;box-shadow:0 0 12px #72d6b52a}
.source-dot{background:#99d9ff;box-shadow:0 0 12px #7ec7ff50}
.section-heading{margin-bottom:52px}
.section-heading .eyebrow{margin-bottom:22px}
.section-heading p{color:var(--muted);line-height:1.8;font-size:16px}
.split-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:45px}
.split-heading p{padding-bottom:5px}
.external-arrow{color:#96a4c2;font-size:15px}
.skip-link{position:fixed;z-index:1000;top:10px;left:10px;background:#dcf0ff;color:#111b2d;padding:12px 18px;transform:translateY(-160%);border-radius:10px}
.skip-link:focus{transform:translateY(0)}
.desktop-only{display:block}

/* A single material. Highlights are compositor-translated, not a whole-card hover. */
.glass{
  position:relative;isolation:isolate;
  background:linear-gradient(135deg,rgba(137,166,223,.115),rgba(68,83,120,.055) 47%,rgba(130,113,184,.09)),var(--panel);
  border:1px solid var(--border);
  box-shadow:inset 0 1px 0 #e0ecff0d,inset 0 -1px 0 #525c8f20,0 22px 70px #0003;
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  border-radius:30px;overflow:hidden;
  --mx:50%;--my:40%;--spec-opacity:0;--sheen-x:0px;--sheen-y:0px;
}
.glass::before{
  content:"";position:absolute;left:0;top:0;width:430px;height:430px;pointer-events:none;z-index:-1;
  background:radial-gradient(circle,rgba(210,232,255,.2),rgba(129,160,239,.05) 34%,transparent 66%);
  transform:translate3d(calc(var(--mx) - 215px),calc(var(--my) - 215px),0);
  opacity:var(--spec-opacity);mix-blend-mode:screen;transition:opacity .55s;z-index:4;
}
.glass::after{
  content:"";position:absolute;inset:-45%;pointer-events:none;z-index:-1;
  background:linear-gradient(120deg,transparent 30%,rgba(178,209,255,.03) 47%,rgba(231,223,255,.08) 49%,transparent 57%);
  transform:translate3d(var(--sheen-x),var(--sheen-y),0);
  opacity:calc(.22 + var(--spec-opacity)*.3);z-index:3;
}
.glass:focus-within{border-color:rgba(168,205,255,.37)}
[data-tilt]{transform-style:preserve-3d;will-change:transform}
.glass.is-pointer-active::before,.glass.is-pointer-active::after{will-change:transform,opacity}
html:not(.webgl-ready) #ring-canvas{opacity:0!important}

/* Header */
.site-header{position:absolute;z-index:30;top:0;left:0;width:100%;height:var(--header)}
.header-inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:26px}
.brand{display:block;flex:none;width:124px;height:54px}
.brand-crop{--brand-scale:.35;display:block;width:calc(340px*var(--brand-scale));height:calc(145px*var(--brand-scale));background-image:url('/assets/brand-reference.png');background-repeat:no-repeat;background-size:calc(1920px*var(--brand-scale)) calc(819px*var(--brand-scale));background-position:calc(-180px*var(--brand-scale)) calc(-220px*var(--brand-scale));mix-blend-mode:screen;mask-image:linear-gradient(to right,transparent,black 6%,black 94%,transparent),linear-gradient(to bottom,transparent,black 9%,black 88%,transparent);mask-composite:intersect}
.desktop-nav{display:flex;gap:31px;align-items:center}
.desktop-nav a{font-size:12px;color:#a7b3c9;transition:color .2s}
.desktop-nav a:hover,.desktop-nav a[aria-current=true]{color:#eff6ff}
.header-actions{display:flex;align-items:center;gap:12px}
.icon-button{height:42px;width:42px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;border:1px solid #9caedd32;color:#b5c5e0;background:#1a223d15;transition:background .25s,transform .3s,border-color .25s;flex:none}
.icon-button:hover{background:#a5bff31a;border-color:#aec8fc65}
.icon-button:active{transform:scale(.94)}
.icon-button .icon{width:18px;height:18px}
.pause-symbol{font-size:13px;letter-spacing:2px;margin-left:2px}
.motion-toggle{width:34px;height:34px;border-color:transparent;color:#657590}
.motion-toggle:hover{color:white}
.menu-toggle{display:none}
.reading-progress{position:fixed;left:0;top:0;right:0;height:2px;background:linear-gradient(90deg,#8cd5ff,#af91ff,#ffbda6);transform-origin:left;transform:scaleX(0);box-shadow:0 0 12px #98c7ff55;z-index:50}
.mobile-menu[hidden]{display:none}

/* Buttons: calm pressure, luminous edge, clear focus. */
.button{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:22px;min-height:54px;padding:16px 24px;border-radius:99px;font-size:13px;font-weight:600;white-space:nowrap;isolation:isolate;overflow:hidden;transition:transform .28s var(--ease),box-shadow .28s,border-color .28s;background:linear-gradient(120deg,#e4f6ff 0%,#9bbdff 42%,#ac91ef 87%);color:#0a1426;border:1px solid #eaf5ffb5;box-shadow:inset 0 1px 5px #fff8,0 0 22px #8aa8fc16}
.button::before{content:"";position:absolute;inset:-110% -20%;z-index:-1;background:linear-gradient(110deg,transparent 30%,#fff9 45%,transparent 56%);transform:translate3d(-50%,0,0) rotate(-5deg);transition:transform .8s var(--ease);opacity:.4}
.button:hover{transform:translateY(-2px);box-shadow:inset 0 1px 8px #fffb,0 3px 25px #93a6fc33}
.button:hover::before{transform:translate3d(45%,0,0) rotate(-5deg)}
.button:active{transform:translateY(1px) scale(.98)}
.button .icon{width:20px;height:20px;transition:transform .3s var(--ease)}
.button:hover .icon{transform:translateX(3px)}
.button--small{font-size:11px;min-height:41px;padding:10px 20px;gap:19px}
.button--outline{background:linear-gradient(120deg,#c3d9ff0b,#9b95d70c);color:#dae7ff;border-color:#879aca55;box-shadow:inset 0 1px 0 #e5efff0e}
.button--large{min-height:63px;font-size:16px;padding:18px 39px;gap:35px}
.text-link{display:inline-flex;align-items:center;gap:12px;font-size:12px;line-height:1.35;color:#d2dcef;transition:color .25s}
.text-link>.icon{width:25px;height:25px;padding:4px;box-sizing:content-box;border:1px solid #9cb3e347;border-radius:12px}
.text-link small{display:block;margin-top:5px;color:#7185a6;font-size:10px}
.text-link:hover{color:white}
.text-link:hover .external-arrow{color:#bcdfff}
.text-button{font-size:12px;color:#a0b8dc;text-decoration:underline;text-underline-offset:4px}

/* The persistent optical scene is independent from accessible page content. */
.scene-layer{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.scene-layer canvas{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity 1.1s}
.webgl-ready .scene-layer canvas{opacity:1}
.scene-aura{position:absolute;left:30%;right:-18%;top:-28%;height:140%;background:radial-gradient(ellipse at 55% 48%,#152e6238,transparent 57%);transform:translate3d(0,0,0)}
.light-ribbon{position:absolute;inset:0;display:block;width:100%;height:100%;opacity:.8;transform:translate3d(0,var(--ribbon-y,0px),0) rotate(var(--ribbon-angle,0deg));will-change:transform}
.ribbon-glint{position:absolute;width:200px;height:80px;left:18%;top:86%;background:radial-gradient(ellipse,#a9bfff29,transparent 65%);transform:translate3d(var(--glint-x,0px),var(--glint-y,0px),0)}
.ring-fallback{position:absolute;left:50%;top:50%;width:620px;height:620px;transform:translate(-50%,-50%) translate3d(calc(var(--scene-x)*100vw),calc(var(--scene-y)*-100vh),0) scale(var(--scene-scale));will-change:transform;opacity:1;transition:opacity .7s}
.webgl-ready .ring-fallback{opacity:0}
.fallback-band{position:absolute;inset:0;border-radius:50%;transform:perspective(800px) rotateY(-28deg) rotateX(36deg) rotateZ(-36deg);background:conic-gradient(from -25deg,#7291d81a,#b2cfff99 7%,#d8dbff26 18%,#5a489638 31%,#adc5ff2b 48%,#f9c3b4b3 52%,#b391f063 57%,#42568b22 68%,#9fd9ff77 79%,#b8b4ff55 92%,#7291d81a);box-shadow:inset 1px 2px 3px #d9ecffb3,inset 0 0 20px #819eff30,0 0 40px #6089ff13;mask-image:radial-gradient(circle,transparent 51%,#000 52% 65%,transparent 66%);-webkit-mask-image:radial-gradient(circle,transparent 51%,#000 52% 65%,transparent 66%)}
.fallback-edge{position:absolute;inset:51px;border:2px solid #91beffa8;border-radius:50%;transform:perspective(800px) rotateY(-28deg) rotateX(36deg) rotateZ(-36deg);box-shadow:inset 0 0 14px #8aabfc55,0 0 13px #9bb7ff22}
.fallback-glint{position:absolute;inset:13px 0;border-radius:50%;border:1px solid #b6cfff25;transform:perspective(800px) rotateY(-28deg) rotateX(36deg) rotateZ(-36deg)}

/* Hero */
.hero{min-height:920px;padding-top:192px;padding-bottom:44px;display:grid;grid-template-columns:1.08fr 1fr;grid-template-rows:1fr auto}
.hero-copy{position:relative;z-index:3;padding-top:4px}
.hero-eyebrow{padding:9px 14px;border:1px solid #b2caef2e;border-radius:99px;background:linear-gradient(100deg,#63789416,#b2b3e307);width:fit-content;margin-bottom:29px;font-size:10px;letter-spacing:.02em;text-transform:none;color:#b9c8df}
.hero h1{margin-left:-4px;max-width:710px}
.hero-description{margin-top:25px;color:#a8b5cc;font-size:18px;line-height:1.75;max-width:510px}
.hero-actions{display:flex;align-items:center;gap:25px;margin-top:34px}
.hero-object-space{min-width:0;position:relative;pointer-events:none}
.hero-message{position:absolute;bottom:89px;right:-14px;display:flex;align-items:center;gap:14px;padding:20px 22px;width:384px;border-radius:22px;pointer-events:auto;background-color:#1520334f}
.hero-message strong{display:block;font-size:12px;font-weight:500;letter-spacing:-.01em}
.hero-message div>span{display:block;font-size:10px;margin-top:4px;color:#8395b3}
.hero-message .quiet-check{margin-left:auto;color:#95cebc;font-size:14px}
.icon-box{width:42px;height:42px;display:inline-grid;place-items:center;border:1px solid #ada5ef39;background:#a18bdb08;border-radius:13px;color:#bca9f8;flex:none}
.icon-box .icon{width:23px;height:23px}
.orbital-label{position:absolute;font-size:8px;letter-spacing:.22em;color:#718bad}
.orbital-label--top{right:14px;top:10px}
.hero-bottom{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;margin-top:73px;border-top:1px solid #9bb9f11a;padding-top:25px}
.hero-bottom p{font-size:12px;line-height:1.7;color:#b1bfd7}
.hero-bottom p span{color:#6d809f}
.hero-footnote{font-size:10px;color:#6f82a1;text-align:right;line-height:1.7}
.scroll-cue{display:flex;align-items:center;justify-content:center;width:42px;height:54px;position:relative;color:#c1d5f8;border:1px solid #a4c5fa44;border-radius:99px}
.scroll-cue .icon{width:17px;height:17px;transform:rotate(90deg)}
.scroll-cue:hover{background:#92acdd10}

/* Six capabilities, one changing workspace. */
.capabilities{padding-top:132px}
.feature-tabs{display:flex;align-items:center;gap:9px;margin-bottom:64px;border-bottom:1px solid #a1bbec15;padding-bottom:15px;flex-wrap:wrap}
.feature-tab{display:flex;align-items:center;gap:9px;padding:12px 16px;border-radius:99px;border:1px solid transparent;min-height:44px;color:#7e93b2;font-size:12px;transition:background .25s,color .25s,border-color .25s}
.feature-tab .icon{width:17px;height:17px}
.feature-tab:hover{background:#b2c7f010;color:#cddcf4}
.feature-tab[aria-selected=true]{background:linear-gradient(110deg,#a4c5ff12,#b497fa0d);border-color:#a6c6f03e;color:#dae7ff;box-shadow:inset 0 1px 1px #e5f1ff0d}
.feature-layout{display:grid;grid-template-columns:.82fr 1.18fr;gap:95px;align-items:center}
.feature-index{font-size:10px;letter-spacing:.15em;color:#5d7295}
.feature-description h3{margin-top:24px;margin-bottom:22px;font-size:37px;max-width:420px}
.feature-description p{font-size:17px;line-height:1.8;color:#a0b0c8;max-width:430px}
.feature-detail{display:block;margin-top:27px;font-size:11px;color:#6b819f;max-width:370px}
.feature-demo{min-height:318px;border-radius:27px}
.mini-titlebar{height:48px;border-bottom:1px solid #b4c9f31a;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 21px;font-size:9px;letter-spacing:.1em;color:#7b91b1}
.window-dots{display:inline-flex;align-items:center;gap:5px}
.window-dots i{width:5px;height:5px;border-radius:50%;background:#7889a9}
.window-dots i:nth-child(2){opacity:.6}.window-dots i:nth-child(3){opacity:.35}
.demo-label{font-size:8px;color:#677c9f;font-weight:500;letter-spacing:.02em;border:1px solid #8ba1cb24;border-radius:7px;padding:3px 7px;white-space:nowrap}
.feature-visual{min-height:270px;display:flex;align-items:center;justify-content:center;padding:28px 31px}
.feature-visual>div{width:100%}
.feature-chat .preview-bubble{padding:14px 17px;border:1px solid #a7bee31c;background:#8ca2c00a;border-radius:14px 14px 14px 4px;max-width:85%;margin-bottom:13px;font-size:12px;color:#b0c2dc;line-height:1.65}
.feature-chat .preview-bubble small{display:block;color:#6f86a8;font-size:8px;margin-bottom:6px}
.feature-chat .preview-bubble.out{margin-left:auto;margin-bottom:0;background:#8e7dce12;border-color:#a29ae12c;border-radius:14px 14px 4px 14px;color:#ced8f1}
.feature-sizes>p{font-size:12px;color:#96abc8;margin-bottom:24px}
.feature-sizes .sizes{display:flex;gap:12px}
.feature-sizes .sizes button{flex:1;padding:15px 8px;border:1px solid #9fbae623;border-radius:15px;font-size:20px;background:#7897bf03;transition:background .25s,border-color .25s}
.feature-sizes .sizes button small{display:block;font-size:8px;margin-top:4px;color:#71829d}
.feature-sizes .sizes button[aria-pressed=true]{background:#789dd21c;border-color:#9bccff75;color:#b4ddff}
.feature-sizes .sizes button:disabled{opacity:.32}
.feature-sizes .sizes-note{color:#7189a9;font-size:10px;margin:19px 0 0}
.feature-order .order-line{display:flex;gap:16px;align-items:center;padding:16px 0;border-bottom:1px solid #a2bbe71a}
.feature-order .order-line:last-child{border-bottom:0}
.feature-order .order-line>.icon{width:25px;height:25px;color:#96bbeb}
.feature-order .order-line div{flex:1;font-size:12px}
.feature-order .order-line div small{display:block;color:#7188a7;font-size:9px;margin-top:4px}
.feature-order .order-line>.tag{font-size:8px;color:#9dceb6;border:1px solid #83bc9e29;background:#7fb19208;border-radius:99px;padding:4px 8px}
.feature-stock .stock-mini-head,.stock-mini-row{display:grid;grid-template-columns:1fr 80px 80px;gap:20px;font-size:11px;padding:15px 0;border-bottom:1px solid #a2bbe717}
.feature-stock .stock-mini-head{font-size:8px;color:#748aac;padding-top:0}
.stock-mini-row span:not(:first-child),.stock-mini-head span:not(:first-child){text-align:right}
.stock-mini-row .ok{color:#99d3c2}
.feature-stock small{display:block;margin-top:19px;font-size:9px;color:#7086a7}
.photo-demo{display:flex;gap:13px}
.photo-original{height:159px;flex:1;border:1px solid #879fce25;border-radius:15px;background:linear-gradient(150deg,#4d71941a,#131a2b00);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:19px;color:#a2b9d9}
.photo-original .icon{width:45px;height:45px}
.photo-original small{font-size:9px;color:#7186a4}
.always-visual{text-align:center}
.always-visual>.icon{width:40px;height:40px;color:#a49be5;margin-bottom:22px}
.always-visual strong{display:block;font-size:26px;font-weight:500;letter-spacing:-1px}
.always-visual p{font-size:11px;color:#748baa;margin-top:14px;line-height:1.8}

/* Scroll-linked workflow. Usable from buttons and keyboard as well as scroll. */
.workflow-section{height:310vh;min-height:2050px}
.workflow-sticky{position:sticky;top:80px;min-height:700px;height:calc(100svh - 115px);max-height:920px;display:grid;grid-template-columns:.72fr 1.28fr;align-items:center;gap:65px}
.workflow-copy>.eyebrow{margin-bottom:23px}
.workflow-copy h2{font-size:54px}
.workflow-copy>p{color:#9cacc6;font-size:15px;line-height:1.9;margin-top:25px}
.workflow-step-copy{margin-top:52px;min-height:155px}
.workflow-step-copy>span{display:block;font-size:8px;text-transform:uppercase;letter-spacing:.13em;color:#849ec3}
.workflow-step-copy h3{font-size:24px;margin:14px 0}
.workflow-step-copy p{font-size:12px;line-height:1.9;color:#7e94b4;max-width:320px}
.step-navigation{display:flex;align-items:center;gap:18px;margin-top:24px}
.step-navigation>span{font-size:10px;font-variant-numeric:tabular-nums;color:#879cbb;min-width:45px;text-align:center}
.rotate-180{transform:rotate(180deg)}
.workflow-stage{min-width:0}
.workflow-tabs{display:flex;align-items:center;justify-content:space-between;gap:4px;margin:0 5px 23px}
.workflow-tab{font-size:9px;color:#5d7396;min-height:44px;padding:10px 9px;border-radius:99px;border:1px solid transparent;transition:color .3s,border-color .3s,background .3s}
.workflow-tab[aria-current=step]{color:#c5deff;border-color:#94b8f23d;background:#96b4ed08}
.workflow-tab.passed{color:#8b9ec0}
.workbench{border-radius:29px;background-color:#0f1927b0;min-height:499px}
.workbench-top{height:58px;border-bottom:1px solid #a7c4ef20;padding:0 22px;display:flex;align-items:center;justify-content:space-between;gap:15px}
.brand-small{display:inline-flex;align-items:center;gap:9px;font-size:16px;font-weight:600}
.small-orbit{display:inline-block;width:23px;height:16px;border:1px solid #a6ceff;border-radius:50%;transform:rotate(-40deg);box-shadow:inset 0 0 6px #a6baff42}
.workbench-location{font-size:8px;color:#6a83a8}
.workbench-inner{display:flex;min-height:438px}
.workbench-sidebar{width:128px;flex:none;padding:24px 13px;background:#8ca1d204;border-right:1px solid #8da8d61a}
.workbench-sidebar>span{display:flex;align-items:center;gap:9px;font-size:9px;color:#5a7396;min-height:36px;padding:9px 8px;border-radius:7px}
.workbench-sidebar .icon{width:13px;height:13px}
.workbench-sidebar>span.selected{color:#a1c1ef;background:#718cb718}
.workbench-main{flex:1;min-width:0;padding:24px;display:grid;gap:11px;align-content:start}
.scenario-message{font-size:11px;padding:13px 15px;border:1px solid #9cb3de20;background:#a0b7df06;border-radius:13px 13px 13px 3px;max-width:93%}
.scenario-message p{line-height:1.8}
.bubble-author{display:flex;justify-content:space-between;color:#7e96ba;font-size:8px;margin-bottom:8px}
.bubble-author time{color:#506789}
.scenario-out{background:#8074ca14;border-color:#a39cec2b;border-radius:13px 13px 3px 13px;max-width:100%;margin-left:13px}
.scenario-out .bubble-author{color:#b2a7ed}
.message-read{display:flex;align-items:center;justify-content:flex-end;gap:5px;color:#6a87a1;font-size:7px;margin-top:6px}
.message-read .icon{width:11px;height:11px}
.scenario-size{margin:2px 0 0}
.scenario-buyer-choice{font-size:9px;color:#a7b7d1;margin-bottom:11px}
.size-options{display:flex;gap:9px}
.size-options>span{width:53px;height:32px;display:flex;align-items:center;justify-content:center;gap:8px;border:1px solid #7c95c12b;border-radius:9px;color:#526988;font-size:10px}
.size-options>.chosen{color:#bcdfff;border-color:#99c9ff70;background:#7db0e315}
.size-options .icon{width:11px;height:11px}
.scenario-size small{display:block;font-size:8px;color:#618d9a;margin-top:8px}
.scenario-order,.scenario-shipping{display:flex;align-items:center;gap:10px;padding:12px 13px;border-radius:11px;background:#74b49c0a;border:1px solid #79c6af27;font-size:10px}
.scenario-order>.icon{color:#91d5bb;width:19px;height:19px}
.scenario-order>span:nth-child(2){flex:1}
.scenario-order small{display:block;font-size:8px;color:#577f83;margin-top:3px}
.order-status{font-size:7px;color:#8fc1af}
.scenario-shipping{background:#88a2d507;border-color:#879dce26;font-size:9px}
.scenario-shipping>.icon{width:17px;height:17px;color:#9cb3d7}
.scenario-shipping>.icon:last-child{margin-left:auto;color:#86bfae}
.scene-caption{font-size:9px;line-height:1.8;text-align:center;color:#566f91;margin-top:19px}
.step-pending{opacity:.15;transform:translate3d(0,14px,0) scale(.98);filter:blur(2px);pointer-events:none}
.step-active,.step-done{opacity:1;transform:translate3d(0,0,0) scale(1);filter:blur(0)}
[data-step-event]{transition:transform .7s var(--ease),opacity .6s,filter .5s}

/* Actual UI, never a generated SaaS screenshot. */
.interface-section{padding-top:110px}
.interface-frame-wrap{perspective:1300px;padding:13px 12px}
.interface-frame{border-radius:29px;transform:rotateX(4deg) rotateY(-3deg);background:#101624cc}
.interface-top{height:53px;padding:0 24px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #9ebae224;font-size:8px;letter-spacing:.1em;color:#7c94b9}
.interface-top .icon-button{width:30px;height:30px;border-color:transparent}
.interface-top .icon{width:14px;height:14px}
.real-ui-viewport{height:542px;overflow:hidden;background:#181818}
.real-ui-viewport img{width:100%;height:auto;transform:translate3d(0,var(--ui-shift,0px),0);will-change:transform}
.interface-scanline{position:absolute;left:0;right:0;top:53px;height:1px;background:linear-gradient(90deg,transparent,#b0d8ff8c,transparent);box-shadow:0 0 20px #b5ccff33;transform:translateY(var(--scan-y,0px));opacity:.7;pointer-events:none}
.ui-callout{position:absolute;right:25px;bottom:23px;background:#0e182bd4;border:1px solid #92b2eb44;border-radius:99px;padding:12px 18px;backdrop-filter:blur(16px);font-size:10px;display:flex;gap:9px;align-items:center;box-shadow:0 5px 30px #0005}
.interface-meta{display:flex;align-items:center;justify-content:space-between;margin:23px 17px 0;font-size:9px;color:#617b9e;gap:20px}
.interface-meta a{color:#9ab1cf}
.interface-meta a:hover{color:white}

/* Real snapshot metrics; no fake counter or invented graph. */
.results-section{padding-top:95px}
.results-panel{display:grid;grid-template-columns:repeat(3,1fr);padding:40px 20px;overflow:hidden;border-radius:34px}
.metric{padding:0 38px;position:relative}
.metric+.metric{border-left:1px solid #9cb8ed2a}
.metric-value{display:block;font-size:56px;font-weight:530;letter-spacing:-3px;line-height:1.1;font-variant-numeric:tabular-nums}
.metric-label{display:block;margin-top:16px;font-size:14px;color:#cad7ed}
.metric-definition{display:block;font-size:10px;color:#7187a7;margin-top:7px}
.results-meta{display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#778faf;margin-top:24px;gap:20px}
.results-meta>span{display:flex;align-items:center;gap:9px}
.results-meta a{color:#9aafd1}
.results-meta a:hover{color:white}
.results-note{font-size:10px;line-height:1.8;color:#5f7699;margin-top:13px}
.results-panel.is-revealed .metric{animation:metric-enter .9s var(--ease) both}
.results-panel.is-revealed .metric:nth-of-type(2){animation-delay:.12s}
.results-panel.is-revealed .metric:nth-of-type(3){animation-delay:.24s}
@keyframes metric-enter{from{opacity:0;transform:translate3d(0,15px,0)}to{opacity:1;transform:translate3d(0,0,0)}}

/* A second scroll story. Events, not a clock pretending to be live. */
.night-section{height:245vh;min-height:1650px}
.night-sticky{position:sticky;top:70px;min-height:690px;height:calc(100svh - 110px);max-height:900px;display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:center}
.night-copy>.eyebrow{margin-bottom:25px}
.night-copy h2{font-size:56px}
.night-copy>p{font-size:16px;line-height:1.85;color:#93a8c7;margin-top:28px}
.night-copy>.night-condition{font-size:10px;line-height:1.8;color:#617b9f;margin-top:25px}
.night-clock-panel{padding:30px 35px;border-radius:32px}
.night-clock-header{display:flex;align-items:center;justify-content:space-between;gap:20px}
.night-clock-header>.eyebrow{font-size:8px}
.night-clock{display:flex;align-items:center;justify-content:space-between;padding:20px 0 30px;color:#b9c9f4}
.night-clock>span{font-size:55px;letter-spacing:-3px;font-weight:400;font-variant-numeric:tabular-nums}
.night-clock>.icon{color:#97a9db;width:33px;height:33px}
.night-timeline{position:relative}
.night-rail{position:absolute;left:4px;top:21px;bottom:28px;width:1px;background:#667da32b;overflow:hidden}
.night-rail>span{position:absolute;inset:0;background:linear-gradient(#91cfff,#b395fc,#c5ddff);transform-origin:top;transform:scaleY(var(--night-progress,0));box-shadow:0 0 10px #b1b6f9}
.night-event{display:flex;align-items:center;gap:17px;min-height:88px;position:relative;transition:opacity .6s,transform .7s var(--ease);opacity:.3;transform:translate3d(0,7px,0)}
.night-event.is-active,.night-event.is-complete{opacity:1;transform:translate3d(0,0,0)}
.night-event-dot{width:9px;height:9px;background:#3a4a68;border-radius:50%;position:relative;z-index:1;flex:none;border:1px solid #647599}
.night-event.is-active .night-event-dot{background:#c2b6ff;border-color:#dfd7ff;box-shadow:0 0 13px #b4a3ff70}
.night-event.is-complete .night-event-dot{background:#9bc9ff;border-color:#badbff}
.night-event-time{font-size:15px;color:#96adcf;font-variant-numeric:tabular-nums;min-width:48px}
.night-event>div{flex:1;border-bottom:1px solid #6e87b52b;min-height:88px;display:flex;flex-direction:column;justify-content:center}
.night-event:last-child>div{border-bottom:0}
.night-event strong{font-size:12px;font-weight:500;color:#c3d3ec}
.night-event div>span{font-size:9px;color:#6f87aa;margin-top:5px}
.night-event>.icon{width:19px;height:19px;color:#839cc3}
.night-demo-note{display:block;margin-top:24px;text-align:center;color:#5b7296;font-size:8px}

/* Resources, invitation and footer remain part of the same glass scene. */
.resources-section{padding-top:110px;padding-bottom:80px}
.resources-banner{display:flex;align-items:center;gap:30px;padding:42px;border-radius:30px}
.resource-mark{width:66px;height:66px;border:1px solid #94afe23b;background:linear-gradient(135deg,#8ca7e018,#8d82d306);border-radius:19px;display:grid;place-items:center;color:#b5c5f2;flex:none}
.resource-mark .icon{width:27px;height:27px}
.resources-banner h2{font-size:34px;margin:9px 0}
.resources-banner .eyebrow{font-size:8px}
.resources-banner p{font-size:12px;color:#758fb1}
.resources-banner .button{margin-left:auto;font-size:11px;min-height:45px;padding:12px 24px;gap:34px}
.cta-section{min-height:660px;display:flex;align-items:center;justify-content:center;text-align:center;padding:130px 0 120px}
.cta-copy{width:100%;position:relative}
.cta-copy>.eyebrow{justify-content:center;margin-bottom:25px}
.cta-copy h2{font-size:81px;line-height:1.08}
.cta-copy p{font-size:18px;line-height:1.8;color:#97aac8;margin-top:25px;margin-bottom:35px}
.footer{padding-bottom:45px}
.footer-panel{border-radius:40px;padding:54px 48px 24px}
.footer-top{display:grid;grid-template-columns:1.25fr .8fr .95fr .8fr;gap:50px;padding-bottom:48px}
.brand--footer{width:170px;height:75px}
.brand--footer .brand-crop{--brand-scale:.48}
.footer-brand-block>p{font-size:22px;line-height:1.4;letter-spacing:-.6px;font-weight:550;margin-top:14px}
.footer-column{display:flex;align-items:flex-start;flex-direction:column;gap:15px;padding-top:17px}
.footer-column>span{font-size:11px;color:#97aac9;margin-bottom:7px}
.footer-column>a,.footer-column>button{font-size:11px;color:#c0cfe6;padding:0;min-height:20px;text-align:left;transition:color .2s}
.footer-column>a:hover,.footer-column>button:hover{color:#b4a8fa}
.footer-bottom{border-top:1px solid #9cb9ed2c;display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:22px;font-size:9px;color:#748bae}
.footer-bottom>a{width:34px;height:34px;border:1px solid #97b6eb31;border-radius:50%;display:grid;place-items:center;font-size:17px;color:#adc0e1}
.footer-bottom>a:hover{background:#a7c7ff10}

/* Forms have a real, honest local action. They never talk to production. */
dialog{color:var(--ink);background:var(--bg-soft);border:1px solid #a4b9ed38}
dialog::backdrop{background:#04070ecf;backdrop-filter:blur(10px)}
.connect-dialog{width:min(500px,calc(100% - 32px));padding:45px 38px 30px;max-height:calc(100svh - 40px);border-radius:30px;background-color:#10182bea;overflow:auto}
.connect-dialog[open]{animation:dialog-open .35s var(--ease)}
@keyframes dialog-open{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
.dialog-close{position:absolute;right:15px;top:15px;width:31px;height:31px;border-color:transparent;z-index:3}
.dialog-close .icon{width:17px;height:17px}
.connect-dialog h2{font-size:39px;margin:13px 0 19px}
.connect-dialog p{font-size:12px;line-height:1.8;color:#8ca2c5}
#connection-form{display:flex;flex-direction:column;gap:17px;margin-top:26px}
#connection-form label{font-size:10px;color:#a7b9d6;display:flex;flex-direction:column;gap:8px}
#connection-form input,#connection-form textarea{display:block;width:100%;border:1px solid #849aca3d;background:linear-gradient(120deg,#7d9ac20a,#a48ac00c);border-radius:13px;color:#e0eafd;padding:13px 15px;outline-offset:2px;font-size:13px;transition:border-color .25s,background .25s;resize:vertical}
#connection-form input:hover,#connection-form textarea:hover{border-color:#a3bcf261}
#connection-form input:focus,#connection-form textarea:focus{border-color:#a0cfff8c;background-color:#96b2e408}
#connection-form input::placeholder,#connection-form textarea::placeholder{color:#4f6689}
.optional{font-size:8px;color:#556e93}
#connection-form .button{width:100%;margin-top:8px;font-size:12px}
.dialog-doc-link{display:block;text-align:center;margin-top:20px;font-size:10px;color:#a1b5d9}
.connect-dialog .form-local-note{text-align:center;font-size:8px;color:#5d769b;margin-top:23px;line-height:1.8}
.dialog-success{text-align:center;padding:30px 0 10px}
.dialog-success[hidden]{display:none}
.success-mark{display:inline-grid;place-items:center;width:66px;height:66px;border:1px solid #94d6c04b;background:#80bda00b;border-radius:50%;color:#a7e6cd;margin-bottom:20px}
.success-mark .icon{width:29px;height:29px}
.dialog-success h2{font-size:34px}
.dialog-success .button{margin-top:26px;font-size:10px;min-height:45px}
.dialog-success .text-button{display:block;font-size:10px;margin:24px auto 0}
.interface-dialog{width:min(1100px,calc(100% - 30px));padding:40px 20px 20px;max-height:92svh;overflow:auto;border-radius:25px;background:#0e1420}
.interface-dialog p{font-size:11px;color:#859abc;margin:0 15px 20px}
.interface-dialog img{width:100%;height:auto}
.noscript-note{text-align:center;padding:20px;font-size:12px;color:#8b9dbc;position:relative;z-index:3}
.noscript-note a{text-decoration:underline}

/* Motion enhancement comes after the fully visible static pass. */
.motion-ready .reveal{opacity:0;transform:translate3d(0,26px,0);filter:blur(4px)}
.motion-ready .reveal.is-revealed{opacity:1;transform:translate3d(0,0,0);filter:blur(0);transition:opacity .95s var(--ease),transform 1s var(--ease),filter .7s}
.motion-ready .hero-copy{animation:hero-enter 1.1s var(--ease) both}
.motion-ready .hero-message{animation:hero-enter 1.4s .2s var(--ease) both}
@keyframes hero-enter{from{opacity:0;transform:translate3d(0,20px,0);filter:blur(4px)}to{opacity:1;transform:translate3d(0,0,0);filter:blur(0)}}

/* Documentation deliberately lives outside the landing's story. */
.docs-page{position:relative;z-index:2;background:radial-gradient(ellipse at 100% 0,#17264444,transparent 45%),var(--bg);min-height:100vh}
.docs-header{height:92px;display:flex;align-items:center;justify-content:space-between}
.docs-header>a:last-child{font-size:12px;color:#9fb4d7}
.docs-layout{display:grid;grid-template-columns:210px 1fr;gap:70px;padding:55px 0 110px}
.docs-toc{position:sticky;top:28px;align-self:start;display:flex;flex-direction:column;gap:15px;font-size:11px;color:#7c94b5;border-left:1px solid #708ab32b;padding-left:20px}
.docs-toc a:hover{color:#c3dfff}
.docs-content{min-width:0;max-width:840px}
.docs-content h1{font-size:52px;line-height:1.12;letter-spacing:-2.5px}
.docs-content>.docs-lead{font-size:17px;color:#95a9c8;line-height:1.8;margin-top:24px}
.docs-content section{margin-top:65px;scroll-margin-top:40px}
.docs-content h2{font-size:30px;line-height:1.3;letter-spacing:-1px;margin-bottom:25px}
.docs-content h3{font-size:18px;letter-spacing:-.4px;margin:28px 0 13px}
.docs-content p,.docs-content li{color:#96a9c7;font-size:13px;line-height:1.95}
.docs-content p+p{margin-top:16px}
.docs-content li{margin:10px 0}
.docs-content strong{color:#d0def5;font-weight:550}
.docs-content a{color:#a5d4fc;text-decoration:underline;text-underline-offset:4px}
.docs-content code{font-family:Consolas,monospace;color:#b9c8e6;background:#98b3e00b;padding:2px 6px;border-radius:5px;font-size:12px}
.docs-content pre{border:1px solid #91add42e;background:#111b2a;padding:19px;border-radius:14px;overflow:auto}
.docs-content pre code{background:none;padding:0}
.docs-table{width:100%;border-collapse:collapse;font-size:11px;text-align:left}
.docs-table th{color:#aec3e4;font-weight:550;border-bottom:1px solid #8aa6d13b;padding:14px 13px 14px 0}
.docs-table td{color:#839bbc;border-bottom:1px solid #8aa6d11b;padding:16px 17px 16px 0;vertical-align:top;line-height:1.9}
.docs-note{border-left:2px solid #ad9bed55;padding:14px 20px;background:#a497d006;color:#899fc1;font-size:12px;line-height:1.8;margin:25px 0}
.docs-content details{border-top:1px solid #8fa6d127;padding:19px 0}
.docs-content summary{cursor:pointer;color:#c1d2ed;font-size:13px}
.docs-content details p{padding-top:15px}
.docs-content .button{text-decoration:none;color:#071122;margin-top:20px;font-size:11px}

/* Tablet */
@media(max-width:1150px){
  .container{width:calc(100% - 72px)}
  .desktop-nav{gap:20px}.desktop-nav a{font-size:10px}
  .header-actions{gap:7px}.brand{width:108px}
  .hero{min-height:850px;padding-top:180px}
  h1{font-size:70px}.hero-description{font-size:16px}
  .hero-actions{gap:18px;flex-wrap:wrap}.hero-actions .button{font-size:11px;padding:15px 20px}
  .hero-message{width:320px;right:-5px;bottom:100px;padding:17px}.hero-message strong{font-size:10px}.hero-message div>span{font-size:9px}
  .hero-message .icon-box{width:35px;height:35px}
  .feature-layout{gap:55px}.feature-description h3{font-size:32px}.feature-description p{font-size:15px}
  .workflow-sticky{gap:35px;grid-template-columns:.76fr 1.24fr}
  .workflow-copy h2{font-size:43px}.workbench-sidebar{width:104px;padding-inline:9px}.workbench-sidebar>span{font-size:8px}
  .workbench-main{padding:20px 16px}
  .night-sticky{gap:55px}.night-copy h2{font-size:46px}.night-clock-panel{padding:27px}
  .resources-banner{gap:23px;padding:32px}.resources-banner h2{font-size:30px}
  .footer-top{gap:30px}.footer-panel{padding:38px 30px 24px}
}
@media(max-width:900px){
  .container{width:calc(100% - 56px)}
  .desktop-nav{gap:16px}.header-actions .motion-toggle{display:none}
  h1{font-size:60px}.hero{min-height:820px;padding-top:165px}
  .hero-eyebrow{font-size:8px;padding:9px 11px}.hero-description{font-size:15px}
  .hero-actions .text-link{font-size:10px}.hero-actions .text-link small{font-size:8px}
  .hero-message{width:285px;bottom:95px;padding:16px 15px;gap:11px}
  .hero-message strong{font-size:9px}.hero-message div>span{font-size:8px}.hero-message .quiet-check{display:none}
  .feature-tabs{gap:5px}.feature-tab{font-size:10px;padding:12px}
  .feature-layout{gap:32px;grid-template-columns:.85fr 1.15fr}
  .feature-description h3{font-size:29px}
  .feature-visual{padding:23px}
  .workflow-section{height:300vh;min-height:1800px}
  .workflow-sticky{grid-template-columns:.7fr 1.3fr;gap:28px;top:60px}
  .workflow-copy h2{font-size:35px}.workflow-copy>p{font-size:12px}
  .workflow-step-copy{margin-top:35px}.workflow-step-copy h3{font-size:21px}.workflow-step-copy p{font-size:11px}
  .workbench-sidebar{display:none}.workflow-tab{font-size:8px;padding-inline:6px}
  .workbench-main{padding:20px}.workbench-top{padding-inline:18px}
  .workbench-location{display:none}
  .split-heading{gap:25px}.split-heading p{font-size:12px}
  .real-ui-viewport{height:400px}.ui-callout{font-size:8px}
  .metric{padding-inline:23px}.metric-value{font-size:45px}.metric-label{font-size:12px}
  .night-copy h2{font-size:39px}.night-copy>p{font-size:13px}
  .night-sticky{gap:35px}.night-clock-panel{padding:24px 20px}
  .night-event{gap:11px}.night-event-time{font-size:12px;min-width:38px}
  .night-event strong{font-size:10px}.night-event div>span{font-size:8px}
  .night-clock>span{font-size:47px}
  .resources-banner{flex-wrap:wrap}.resources-banner .button{margin-left:90px}
  .footer-top{grid-template-columns:1.25fr 1fr 1fr}.footer-column:last-child{grid-column:2}
  .docs-layout{grid-template-columns:170px 1fr;gap:35px}
}

/* Mobile: same story, touch + scroll, not a shrunken desktop. */
@media(max-width:700px){
  :root{--header:77px}
  .container{width:calc(100% - 40px)}
  .site-header{height:77px}.brand{width:100px;height:47px}.brand-crop{--brand-scale:.30}
  .desktop-nav{display:none}.header-actions{gap:8px}.header-actions .button{font-size:9px;min-height:36px;padding:9px 13px;gap:13px}.header-actions .button .icon{width:14px;height:14px}
  .menu-toggle{display:flex;flex-direction:column;gap:5px;width:35px;height:35px}
  .menu-toggle span{display:block;width:13px;height:1px;background:#a2b8de;transition:transform .25s}
  .menu-toggle[aria-expanded=true] span:first-child{transform:translateY(3px) rotate(45deg)}
  .menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-3px) rotate(-45deg)}
  .mobile-menu{position:fixed;z-index:35;left:20px;right:20px;top:82px;background-color:#101a2bef;border-radius:22px;padding:20px;display:flex;flex-direction:column;gap:6px;box-shadow:0 20px 80px #0009}
  .mobile-menu a{padding:12px 15px;font-size:13px}
  h1{font-size:clamp(44px,12vw,63px);line-height:1.08;letter-spacing:-.055em}
  h2{font-size:39px;line-height:1.17}
  .section{padding-top:88px;padding-bottom:85px}
  .hero{min-height:1030px;height:calc(100svh + 180px);max-height:1190px;padding-top:140px;padding-bottom:25px;display:flex;flex-direction:column}
  .hero-copy{padding-top:0;width:100%}
  .hero-eyebrow{font-size:8px;letter-spacing:0;margin-bottom:25px}
  .hero h1{margin-left:-2px;max-width:100%}
  .hero-description{font-size:14px;line-height:1.85;max-width:100%;margin-top:23px}
  .hero-actions{margin-top:27px;gap:21px;align-items:flex-start;flex-direction:column}
  .hero-actions .button{min-height:50px;font-size:11px;padding:14px 21px;gap:26px}
  .hero-actions .text-link{font-size:10px;gap:10px}
  .hero-actions .text-link small{font-size:8px;margin-top:3px}.hero-actions .text-link>.icon{width:20px;height:20px}
  .hero-object-space{flex:1;width:100%;min-height:315px}
  .orbital-label--top{top:32px;font-size:6px;right:8px}
  .hero-message{bottom:22px;right:3px;width:267px;padding:15px;border-radius:17px}
  .hero-message .icon-box{width:30px;height:30px;border-radius:9px}.hero-message .icon-box .icon{width:17px;height:17px}
  .hero-bottom{margin-top:22px;width:100%;padding-top:18px;gap:15px}
  .hero-bottom p{font-size:9px;line-height:1.8}
  .hero-footnote{display:none}
  .scroll-cue{width:33px;height:42px}
  .ring-fallback{width:540px;height:540px;--scene-x:0;--scene-y:-.25;--scene-scale:.62}
  .section-heading{margin-bottom:34px}.section-heading .eyebrow{font-size:8px;margin-bottom:18px}
  .feature-tabs{margin-bottom:32px;gap:4px;padding-bottom:12px}
  .feature-tab{font-size:10px;padding:10px 12px;gap:7px}.feature-tab .icon{width:14px;height:14px}
  .feature-layout{grid-template-columns:1fr;gap:29px}
  .feature-index{font-size:8px}
  .feature-description h3{font-size:31px;max-width:320px;margin:18px 0 16px}
  .feature-description p{font-size:14px;line-height:1.85}
  .feature-detail{font-size:9px;line-height:1.8;margin-top:18px}
  .feature-demo{min-height:284px;border-radius:22px}
  .mini-titlebar{height:42px;font-size:7px;padding-inline:17px}
  .feature-visual{min-height:240px;padding:23px 20px}
  .feature-chat .preview-bubble{font-size:11px;padding:12px 14px}
  .photo-original{height:137px}.photo-original small{font-size:8px}
  .photo-demo{gap:8px}
  .workflow-section{height:285vh;min-height:1780px}
  .workflow-sticky{top:16px;height:calc(100svh - 30px);min-height:680px;max-height:860px;display:flex;align-items:stretch;justify-content:center;flex-direction:column;gap:19px}
  .workflow-copy>.eyebrow{font-size:7px;margin-bottom:12px}
  .workflow-copy h2{font-size:32px;line-height:1.14}
  .workflow-copy>p{display:none}
  .workflow-step-copy{margin-top:17px;min-height:75px}
  .workflow-step-copy>span{font-size:7px}
  .workflow-step-copy h3{font-size:17px;margin:9px 0}
  .workflow-step-copy p{font-size:10px;line-height:1.8;max-width:100%}
  .step-navigation{position:absolute;right:0;top:23px;gap:8px}
  .step-navigation .icon-button{width:29px;height:29px}
  .step-navigation .icon-button .icon{width:13px;height:13px}
  .step-navigation>span{font-size:8px;min-width:34px}
  .workflow-tabs{margin:0 0 10px;gap:1px}
  .workflow-tab{font-size:7px;min-height:31px;padding:7px 6px}
  .workbench{border-radius:21px;min-height:0}
  .workbench-top{height:44px;padding-inline:15px}
  .brand-small{font-size:12px}.small-orbit{width:17px;height:12px}
  .workbench-top .demo-label{font-size:7px}
  .workbench-inner{min-height:387px}
  .workbench-main{padding:16px;gap:9px}
  .scenario-message{font-size:10px;padding:10px 12px}
  .bubble-author{font-size:7px;margin-bottom:5px}
  .scenario-size{margin-top:0}.scenario-buyer-choice{font-size:8px;margin-bottom:8px}
  .scenario-size small{font-size:7px;margin-top:6px}
  .size-options>span{width:43px;height:27px;font-size:9px;border-radius:7px}
  .scenario-order,.scenario-shipping{font-size:9px;padding:9px 10px;gap:8px}
  .scenario-order small{font-size:7px}
  .scenario-shipping{font-size:8px}
  .scene-caption{font-size:7px;margin-top:12px;line-height:1.8}
  .split-heading{display:block}.split-heading p{font-size:12px;line-height:1.9;margin-top:22px}
  .interface-frame-wrap{padding:0}
  .interface-frame{border-radius:22px}
  .interface-top{height:43px;padding-inline:15px;font-size:6px}
  .real-ui-viewport{height:350px;overflow:auto}
  .real-ui-viewport img{width:100%;min-width:620px;max-width:none;transform:none}
  .ui-callout{font-size:7px;padding:8px 11px;right:13px;bottom:14px;gap:6px}
  .interface-scanline{display:none}
  .interface-meta{font-size:7px;line-height:1.8;margin:18px 2px 0;align-items:flex-start}
  .interface-meta p{max-width:180px}
  .interface-meta a{max-width:118px;text-align:right}
  .results-panel{grid-template-columns:1fr;padding:10px 25px;border-radius:25px}
  .metric{padding:28px 0}
  .metric+.metric{border-left:none;border-top:1px solid #9cb8ed24}
  .metric-value{font-size:46px;letter-spacing:-2.8px}
  .metric-label{font-size:13px;margin-top:11px}
  .metric-definition{position:absolute;right:0;bottom:33px;font-size:8px}
  .results-meta{font-size:8px;line-height:1.9;gap:20px;align-items:flex-start;flex-direction:column;margin-top:21px}
  .results-note{font-size:8px;line-height:1.9;margin-top:14px}
  .night-section{height:245vh;min-height:1550px}
  .night-sticky{top:20px;min-height:700px;max-height:850px;height:calc(100svh - 35px);display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:29px}
  .night-copy>.eyebrow{font-size:7px;margin-bottom:15px}
  .night-copy h2{font-size:33px;line-height:1.17}
  .night-copy>p{font-size:11px;line-height:1.85;margin-top:15px}
  .night-copy>.night-condition{font-size:8px;line-height:1.8;margin-top:13px}
  .night-clock-panel{padding:21px 22px;border-radius:24px}
  .night-clock-header>.eyebrow{font-size:7px}
  .night-clock{padding:14px 0 18px}
  .night-clock>span{font-size:42px}
  .night-clock>.icon{width:25px;height:25px}
  .night-event{min-height:65px;gap:12px}
  .night-event>div{min-height:65px}
  .night-event-time{font-size:11px;min-width:35px}
  .night-event strong{font-size:9px}
  .night-event div>span{font-size:7px;margin-top:4px}
  .night-event>.icon{width:15px;height:15px}
  .night-rail{top:22px;bottom:25px}
  .night-demo-note{font-size:6px;margin-top:19px}
  .resources-section{padding-top:80px;padding-bottom:45px}
  .resources-banner{display:block;padding:27px;border-radius:25px}
  .resource-mark{width:48px;height:48px;border-radius:14px;margin-bottom:22px}.resource-mark .icon{width:23px;height:23px}
  .resources-banner h2{font-size:28px;margin:13px 0}
  .resources-banner .eyebrow{font-size:7px}
  .resources-banner p{font-size:11px;line-height:1.9}
  .resources-banner .button{margin:25px 0 0;font-size:10px;padding:12px 18px;min-height:43px}
  .cta-section{min-height:580px;padding:100px 0 105px}
  .cta-copy>.eyebrow{font-size:7px;margin-bottom:23px}
  .cta-copy h2{font-size:52px;line-height:1.13}
  .cta-copy p{font-size:13px;line-height:1.9;margin:23px 0 30px}
  .button--large{min-height:55px;font-size:13px;padding:16px 28px;gap:30px}
  .footer{padding-bottom:25px}
  .footer-panel{border-radius:28px;padding:29px 25px 20px}
  .footer-top{grid-template-columns:1fr 1fr;gap:28px;padding-bottom:27px}
  .footer-brand-block{grid-column:1/-1}
  .brand--footer{height:62px;width:140px}.brand--footer .brand-crop{--brand-scale:.39}
  .footer-brand-block>p{font-size:20px;margin-top:14px}
  .footer-column{padding-top:2px;gap:11px}
  .footer-column>span{font-size:10px;margin-bottom:5px}
  .footer-column>a,.footer-column>button{font-size:9px}
  .footer-column:last-child{grid-column:1/-1}
  .footer-bottom{padding-top:19px;gap:17px;align-items:flex-start;flex-wrap:wrap;font-size:7px;line-height:1.9}
  .footer-bottom>span:nth-child(2){display:none}
  .footer-bottom>a{width:27px;height:27px;font-size:15px;margin-left:auto}
  .connect-dialog{padding:43px 25px 25px;border-radius:25px}
  .connect-dialog h2{font-size:35px}
  .connect-dialog>.eyebrow{font-size:8px}
  #connection-form input,#connection-form textarea{font-size:16px;padding:12px 13px}
  .connect-dialog p{font-size:11px}
  .dialog-success h2{font-size:29px}
  .dialog-success p{font-size:11px}
  .interface-dialog{border-radius:18px;padding:45px 10px 10px}
  .interface-dialog p{font-size:9px;margin-left:5px}
  .docs-header{height:83px}.docs-header .brand{height:45px}
  .docs-header>a:last-child{font-size:10px}
  .docs-layout{grid-template-columns:1fr;gap:35px;padding-top:25px;padding-bottom:70px}
  .docs-toc{position:relative;top:0;flex-direction:row;flex-wrap:wrap;border-left:0;border-bottom:1px solid #91a6cb26;padding:0 0 22px;gap:10px 18px;font-size:9px}
  .docs-content h1{font-size:38px;letter-spacing:-1.8px}
  .docs-content>.docs-lead{font-size:14px}
  .docs-content section{margin-top:49px}
  .docs-content h2{font-size:25px}
  .docs-content p,.docs-content li{font-size:12px}
  .docs-table{font-size:9px}
  .docs-table td{padding:13px 10px 13px 0}.docs-table th{font-size:9px}
}
@media(max-width:360px){
  .container{width:calc(100% - 32px)}
  .header-actions .button{font-size:8px;padding:9px 11px;gap:8px}
  .header-inner{gap:10px}.brand{width:85px}.brand-crop{--brand-scale:.27}
  h1{font-size:43px}
  .hero-description{font-size:13px}
  .hero-message{width:246px;padding:13px 12px}
  .hero-message strong{font-size:8px}
  .hero-message div>span{font-size:7px}
  .workflow-sticky{min-height:720px}
  .workflow-copy h2{font-size:29px}
  .step-navigation{top:12px}
  .step-navigation .icon-button{width:25px;height:25px}
  .step-navigation>span{min-width:30px;font-size:7px}
  .workflow-tabs{gap:0}.workflow-tab{font-size:6px;padding:7px 5px}
  .workbench-main{padding:13px}
  .scenario-order{font-size:8px}.order-status{font-size:6px}
  .night-clock-panel{padding-inline:17px}
  .night-event{gap:9px}.night-event strong{font-size:8px}.night-event-time{font-size:10px;min-width:32px}
  .cta-copy h2{font-size:46px}
}

/* A user's accessibility choice always wins over the visual spectacle. */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .motion-ready .reveal{opacity:1;transform:none;filter:none}
  [data-tilt]{transform:none!important;will-change:auto}
  .interface-frame{transform:none}
  .real-ui-viewport img{transform:none!important;will-change:auto}
  .workflow-section,.night-section{height:auto;min-height:0;padding-block:85px}
  .workflow-sticky,.night-sticky{position:relative;top:0;min-height:0;height:auto;max-height:none}
  [data-step-event],.night-event{opacity:1!important;transform:none!important;filter:none!important}
}
.motion-paused .reveal{opacity:1;transform:none;filter:none}
.motion-paused *{animation-play-state:paused!important}
.motion-paused .hero-copy,.motion-paused .hero-message{animation:none;opacity:1;transform:none;filter:none}
.motion-paused [data-tilt]{transform:none!important}
.motion-paused .reveal{filter:none}
@media print{.scene-layer,.site-header,.mobile-menu,.icon-button,.workflow-tabs,.step-navigation,dialog{display:none!important}.workflow-section,.night-section{height:auto;min-height:0}.workflow-sticky,.night-sticky{position:relative;height:auto;min-height:0;display:block}.motion-ready .reveal{opacity:1;transform:none;filter:none}.step-pending{opacity:1;transform:none;filter:none}.glass{backdrop-filter:none;box-shadow:none}body{background:#080c14}}


/* Comfortable touch controls; the same scene remains keyboard accessible. */
@media(max-width:700px){
 .header-actions .button{min-height:44px}
 .menu-toggle,.dialog-close{width:44px;height:44px}
 .step-navigation{position:relative;top:auto;right:auto;display:flex;margin-top:15px;justify-content:flex-start;gap:9px}
 .step-navigation .icon-button{width:44px;height:44px}
 .workflow-tab{min-height:44px}
 .resources-banner .button{min-height:44px}
 .footer-bottom>a{width:44px;height:44px}
}
