/* Native document flow outside the autonomous fullscreen sequence. */
html,body{overflow-x:clip}
.challenges{min-height:120svh}.challenges-inner{padding-bottom:140px}
.takeover-surface{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:3;display:none}
.problem-anchors{position:relative;z-index:4}.problem-anchors li{transform-origin:0 0}.problem-anchors li>div{color:inherit}.problem-anchors{color:#40364e}

.infrastructure-sequence{position:relative}.infrastructure-pin{position:relative}
.story-enhanced .infrastructure-sequence{height:calc(var(--challenge-height) + var(--story-distance))}
.story-enhanced .infrastructure-pin{position:sticky;top:calc(var(--scene-height) - var(--challenge-height));height:var(--challenge-height)}
.story-enhanced .takeover-surface{display:block}.story-enhanced .challenges{height:var(--challenge-height);min-height:0;background-color:#f5f6f9}
.story-enhanced .system-story{position:absolute;bottom:0;left:0;width:100%;height:var(--scene-height);background:transparent;pointer-events:none}
.story-enhanced .system-stage{height:100%;padding:0;background:none;opacity:0}
.story-enhanced .system-heading{position:absolute;left:7%;top:14%;width:29%;max-width:none}
.story-enhanced .system-heading h2{font-size:clamp(36px,3.4vw,60px)}
.story-enhanced .system-heading>p:last-child{max-width:360px}
.story-enhanced .system-board{position:absolute;left:41%;right:5%;top:18%;bottom:16%;height:auto;margin:0}
.story-enhanced .system-payoff{position:absolute;left:7%;width:29%;top:55%;margin:0}
.story-enhanced .system-story a,.story-enhanced .system-node{pointer-events:auto}

.story-enhanced .problem-anchors li{z-index:5;pointer-events:none}
.story-enhanced .problem-anchors{border-color:transparent}
.story-enhanced .system-skip{top:12%}
/* Pricing stays in the DOM throughout. The sticky element's real height includes
   its full content, so release continues down the same canvas without a swap. */
.calm-pricing-sequence{position:relative;background:#f7f7fc}
.calm-pricing-pin{position:relative}
.horizontal-enhanced .calm-pricing-sequence{height:calc(var(--pricing-height) + var(--horizontal-distance));padding-bottom:0}
.horizontal-enhanced .calm-pricing-pin{position:sticky;top:0;min-height:var(--scene-height);isolation:isolate}
.horizontal-enhanced .calm-scene{position:absolute;left:0;top:0;width:100%;height:var(--scene-height);min-height:0;z-index:1}
.horizontal-enhanced .calm-scene:after{content:'';position:absolute;inset:0;background:#f7f7fc;opacity:var(--scene-wash,0);pointer-events:none;z-index:2}
.horizontal-enhanced .pricing-section{position:relative;z-index:3;min-height:var(--scene-height);background:transparent;transform:translate3d(92vw,0,0);padding-top:clamp(104px,12vh,140px)}
.horizontal-enhanced .pricing-section:before{content:'';position:absolute;inset:0 0 0 -20vw;z-index:-1;background:linear-gradient(90deg,transparent,#f7f7fc 17%,#f7f7fc);opacity:var(--pricing-surface,0);pointer-events:none}
.horizontal-enhanced .pricing-tier{position:relative}
.horizontal-enhanced .pricing-tier+.pricing-tier{border-left-color:transparent}
.horizontal-enhanced .pricing-tier+.pricing-tier:before{content:'';position:absolute;left:0;top:0;bottom:0;width:1px;background:#e1ddec;transform:scaleY(var(--separator-progress,0));transform-origin:top}

.case-carousel{position:relative;min-width:0;touch-action:pan-y;cursor:grab;user-select:none;outline-offset:8px}
.case-carousel.is-dragging{cursor:grabbing}.case-stack{position:relative;height:260px;margin-right:44px}
.case-card{position:absolute;inset:0;padding:28px;border:1px solid #a99ac177;border-radius:7px;background:linear-gradient(125deg,#1e1b2d,#090c13 75%);display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 10px 35px #0003}
.case-card small{font-size:12px;letter-spacing:.23em;color:#bca8d7}.case-card h4{font-size:clamp(21px,2vw,28px);font-weight:450;line-height:1.3;letter-spacing:-.025em;margin:16px 0}.case-card a{font-size:14px;color:#cbb6e6;align-self:flex-start}.case-position{font-size:12px!important;letter-spacing:.18em;text-align:right;color:#a89cb8!important;margin-top:25px!important;max-width:none!important}
.trust-bridge{background:#06080e;color:#eeeaf5;padding:90px 0 80px}.trust-inner{width:min(1400px,calc(100% - 112px));margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}.team-photo-slot{margin:0;min-height:330px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:#101119;color:#9c92ac}.team-photo-slot>span{font-size:16px}.team-photo-slot figcaption{font-size:12px;color:#7f758d}.team-photo-slot img{width:100%;height:100%;object-fit:cover}.trust-copy .eyebrow{margin-bottom:25px;color:#b7a1d8}.trust-copy h2{font-size:clamp(30px,3vw,48px)}.trust-copy h2 span{color:#b59bce}.trust-copy>p:last-child{max-width:450px;font-size:16px;line-height:1.7;color:#a6a0b6;margin-top:25px}.trust-companies{grid-column:1/-1;padding-top:25px}.trust-companies[hidden]{display:none}.trust-logo-rail{display:flex;align-items:center;justify-content:space-between;gap:45px;margin-top:30px}.trust-logo-rail img{width:140px;height:42px;object-fit:contain;filter:grayscale(1);opacity:.55;transition:opacity .2s}.trust-logo-rail img:hover{opacity:1}
.contact-architecture{inset:0;height:auto;min-height:0;background:none}.contact-architecture img{width:100%;height:100%;object-fit:cover;object-position:center}.contact-architecture:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#07090dbd,#07090de0 60%,#07090df5),linear-gradient(#06080e,transparent 35%,#07090d)}
@media(min-width:1101px) and (max-height:800px){.story-enhanced .system-heading{top:14%}.story-enhanced .system-heading h2{font-size:42px}.story-enhanced .system-heading>p:last-child{margin-top:18px;line-height:1.6}.story-enhanced .system-payoff{top:55%}.story-enhanced .system-payoff h3{font-size:28px}.story-enhanced .system-payoff p{line-height:1.5;margin:14px 0}}
@media(max-width:1100px){.challenges{min-height:120svh}.trust-inner{width:calc(100% - 64px);gap:35px}.system-board{max-width:850px;margin-inline:auto}.system-payoff{max-width:650px}.system-heading{max-width:650px}}
@media(max-width:760px){.challenges{min-height:0}.challenges-inner{padding-bottom:85px}.trust-bridge{padding:65px 0}.trust-inner{width:calc(100% - 40px);grid-template-columns:1fr;gap:30px}.team-photo-slot{min-height:230px}.trust-copy h2{font-size:34px}.trust-logo-rail{flex-wrap:wrap;justify-content:flex-start;gap:28px}.contact-details{margin-top:50px}.contact-architecture{inset:0;height:auto;min-height:0}.case-stack{height:235px;margin-right:35px}.case-card{padding:24px}.system-status{bottom:0}.system-payoff{margin-top:45px}}
@media(prefers-reduced-motion:reduce){.takeover-surface{display:none}.system-node{--online:1}.initializing{display:none}.problem-new{display:none}.calm-pricing-sequence{background:#06080e}}


/* Timed scene transitions share stable document geometry. */
html{scrollbar-gutter:stable}

.story-enhanced .calm-pricing-sequence{margin-top:calc(var(--scene-height)*-2.05);background:transparent;height:calc(var(--pricing-height) + var(--handoff-distance) + var(--horizontal-distance));pointer-events:none;z-index:6}
.story-enhanced .calm-pricing-pin{pointer-events:none}
.story-enhanced .pricing-section:not([inert]){pointer-events:auto}
.story-enhanced .calm-dot-slot{visibility:hidden}
.operational-origin{display:none}
.story-enhanced .operational-origin{display:block;width:7px;height:7px;flex-shrink:0}
.story-enhanced .calm-pricing-pin>.operational-dot{position:absolute;top:0;left:0;z-index:5;pointer-events:none}
.story-enhanced .system-board{bottom:12%}
.story-enhanced .system-model{opacity:.6}

/* Contact: original split composition, photographic polish only. */
.contact-architecture:after{background:linear-gradient(90deg,#07090d55 0%,#07090d9c 35%,#07090df2 61%,#07090d 100%)}
.contact-topics{gap:14px;margin-bottom:38px}.contact-topic>span{border-color:#77708244;background:transparent;font-weight:400}.contact-topic input:checked+span{border-color:#ac83d288;background:#ac83d20b}.contact-field textarea{background:#0a0b1133}
.contact-available i{animation:none}
/* Pricing and demo share a dark underlay. No gradient, masks or shapes. */
.calm-pricing-sequence{background:#06080e}
.pricing-section{background:#06080e;isolation:isolate}
.pricing-section:before{content:'';position:absolute;inset:0;background:#f7f7fc;z-index:-1;opacity:var(--light-surface,1);pointer-events:none}
.horizontal-enhanced .pricing-section:before{opacity:calc(var(--pricing-surface,0)*var(--light-surface,1))}
.demo-transition{position:relative;height:50svh;background:#06080e;isolation:isolate}
.demo-transition:before{content:'';position:absolute;inset:0;background:#f7f7fc;opacity:var(--light-surface,1);pointer-events:none}
.demo-transition:after{display:none}.demo-section:before{inset:50svh 0 0}
/* All nodes and both status labels use one shared component and timeline. */
.system-story .system-node{background:#100d1ae6;border:1px solid #a774ee55;border-radius:8px;box-shadow:inset 0 0 18px #a774ee05;transform-origin:center;transition:none}
.system-status{min-height:24px}.system-status>span{position:absolute;inset:0;line-height:24px}.system-status .operational{height:24px}
.problem-anchors li{transition:none}
@media(max-width:760px){.contact-architecture:after{background:linear-gradient(180deg,#07090d88,#07090ddd 40%,#07090dfa 68%)}.contact-details{margin-top:45px}.contact-form-area{padding-top:55px}.demo-transition{height:45svh}.demo-section:before{inset:45svh 0 0}}
@media(prefers-reduced-motion:reduce){.contact-finale *{animation:none!important;transition:none!important}.calm-pricing-sequence{margin-top:0}}
.horizontal-enhanced .pricing-section{background:#06080e}

/* Scroll-driven canvas. Native document slots provide the complete timeline;
   fixing the visual layers never locks or intercepts document scrolling. */
.story-enhanced .infrastructure-sequence{height:calc(var(--challenge-height) + var(--scene-height))}
.story-enhanced .infrastructure-pin{position:relative;top:auto;height:calc(var(--challenge-height) + var(--scene-height))}
.story-enhanced .calm-pricing-sequence{margin-top:0;height:calc(var(--scene-height)*3.2);background:#06080e}
.horizontal-enhanced .calm-pricing-pin{position:relative;top:auto;height:calc(var(--scene-height)*2)}
.horizontal-enhanced .pricing-section{position:absolute;top:var(--scene-height);width:100%;height:var(--scene-height);min-height:0;padding:24px 0;display:flex;flex-direction:column;justify-content:center}
.demo-transition{display:none}.demo-section:before{inset:0}

.scroll-scene-active .infrastructure-pin{position:fixed;top:calc(var(--scene-height) - var(--challenge-height));left:0;width:100%;height:var(--challenge-height);z-index:20}
.scroll-scene-active .calm-pricing-pin{position:fixed;top:0;left:0;width:100%;height:var(--scene-height);z-index:21}
.scroll-scene-active .pricing-section{top:0}
.scroll-scene-active .demo-section{position:fixed;inset:0 0 auto;width:100%;min-height:100vh;z-index:22}
.scroll-scene-active .demo-entry-slot{background:#06080e}
.scroll-scene-active body{background:#06080e}
.story-enhanced:not(.scroll-scene-active) .system-story{background:#06080e}
/* Fit the same editorial composition using vertical spacing, not text scaling. */
.horizontal-enhanced .pricing-heading{margin-bottom:22px}
.horizontal-enhanced .pricing-heading .eyebrow{margin-bottom:14px}
.horizontal-enhanced .pricing-heading p:not(.eyebrow){margin-top:14px}
.horizontal-enhanced .pricing-tier h3{margin-top:12px}
.horizontal-enhanced .pricing-price{margin-top:10px;min-height:52px}
.horizontal-enhanced .pricing-tier ul{padding:14px 0 12px}
.horizontal-enhanced .pricing-tier li{margin-bottom:6px}
.horizontal-enhanced .pricing-note{margin-top:10px;padding-top:12px}
/* Reveal owns the full Demo scene; disable the former observer's entry animation. */
.demo-section.is-entered .demo-copy,.demo-section.is-entered .demo-control-plane,.demo-section.is-entered .demo-node{animation:none}
@media(min-width:1101px) and (max-height:850px){
.horizontal-enhanced .pricing-section{padding:16px 0}
.horizontal-enhanced .pricing-heading{margin-bottom:12px}
.horizontal-enhanced .pricing-heading h2{font-size:clamp(34px,3vw,42px)}
.horizontal-enhanced .pricing-heading p:not(.eyebrow){margin-top:8px}
.horizontal-enhanced .pricing-tier{padding-bottom:0}
.horizontal-enhanced .pricing-description{min-height:52px}
.horizontal-enhanced .pricing-tier li{margin-bottom:4px}
.horizontal-enhanced .pricing-note{padding-top:6px}
}

/* Keep the shared dot above the diagram, but do not paint the scrolling
   spacer over it. Only the fixed cinematic children own the visual handoff.
   An opaque spacer clips the graph from below before its timeline completes. */
.scroll-scene-active .calm-pricing-sequence{z-index:21;background:transparent}
.shared-dot-enabled .operational-origin{display:block;width:7px;height:7px;flex-shrink:0}
.shared-dot-enabled .calm-dot-slot{visibility:hidden}
.shared-dot-enabled .calm-pricing-pin>.operational-dot{position:absolute;top:0;left:0;z-index:5;pointer-events:none}

/* Keep the full photographic scene visible in natural mobile flow. */
html:not(.horizontal-enhanced) .calm-scene:after{display:none}
html:not(.horizontal-enhanced) .pricing-section{position:relative;overflow:clip}
html:not(.horizontal-enhanced) .calm-pricing-sequence{background:#06080e}

/* Keep the cinematic canvas readable on 21:9 / 32:9 displays. */
.story-enhanced .system-stage{max-width:1600px;margin-inline:auto}
html:not(.story-enhanced) .system-stage{max-width:1440px;margin-inline:auto}
.calm-copy{max-width:1000px;margin-left:max(5%,calc((100% - 1600px)/2))}
.contact-topics{grid-template-columns:repeat(auto-fit,minmax(min(100%,160px),1fr))}
.contact-topic>span{height:100%;overflow-wrap:anywhere}
.contact-footer>div{flex-wrap:wrap}
@media(min-width:1600px){
  .pricing-section>.container{width:min(1400px,calc(100% - 112px))}
  .pricing-heading{gap:clamp(40px,4vw,64px)}
}
/* Small windows use the normal document layout, including short laptop screens. */
@media(max-width:1199px),(max-height:700px){
  .hero-note{display:none}
}
@media(min-width:701px) and (max-width:1199px){
  .system-board{max-width:850px;margin-inline:auto}
}
@media(min-width:601px) and (max-width:760px){
  .demo-dashboard{grid-template-columns:minmax(0,1fr) 140px}
  .demo-sidebar{display:none}
}
@media(max-width:700px){
  .calm-copy{width:100%;max-width:none;margin-left:0;padding:clamp(72px,12svh,120px) 24px}
  .system-story .system-node{width:min(140px,calc((100% - 32px)/2));overflow-wrap:anywhere}
}
@media(max-width:760px){
  .hero{min-height:100svh}
  .hero-content{padding:118px 0 110px}
  .demo-primary{max-width:100%;white-space:normal}
  .contact-footer>div{margin-left:0;gap:12px}
}
@media(max-width:380px){
  .nav-wrap{gap:8px}
  .brand{font-size:18px;gap:6px}
  .nav-cta{font-size:11px;padding:8px;gap:6px}
  .nav-cta>span{display:none}
  .menu-toggle{flex-shrink:0;width:34px}
  .hero h1{font-size:clamp(38px,12vw,45px)}
  .hero .button-primary{min-width:0;width:100%}
  .calm-copy{padding-inline:20px}
  .calm-scene h2{font-size:clamp(32px,10vw,38px)}
  .pricing-heading h2{font-size:clamp(30px,9vw,34px)}
  .demo-toolbar{flex-wrap:wrap;row-gap:12px}
  .case-card{padding:22px 18px}
  .contact-message h2{font-size:32px}
}