.hs-story { scroll-margin-top:110px; }
.hs-route-layout { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:1.6rem; margin-top:2rem; align-items:start; }

.hs-route-diagram .systems-node-title { margin:0; }
.hs-route-diagram .systems-node {
 grid-template-columns:22px minmax(0,1fr); align-items:center; align-content:center;
 gap:.55rem .55rem; padding:.85rem; border-radius:16px;
 border-color:rgba(130,192,215,.25); background:linear-gradient(155deg,#122231,#09131f);
 height:auto; min-height:88px;
}
.hs-route-diagram .hs-node-icon { display:grid; place-items:center; width:22px; height:26px; color:#89d7e7; font-size:.95rem; }
.hs-route-diagram .systems-node-title { font-size:.85rem; line-height:1.35; letter-spacing:-.015em; }
.hs-route-diagram .systems-node .hs-node-caption { grid-column:1 / -1; font-size:.61rem; line-height:1.6; letter-spacing:.04em; }
.hs-route-diagram .systems-node-primary { grid-template-columns:54px minmax(0,1fr); gap:.65rem 1rem; padding:.95rem 1.05rem; min-height:102px; border-color:rgba(87,242,255,.16); background:linear-gradient(180deg,rgba(20,39,60,.9),rgba(8,13,22,.97)); }
.hs-route-diagram .systems-node-primary .systems-node-title { font-size:1.08rem; }
.hs-route-diagram .systems-node-primary .hs-node-caption { grid-column:1 / -1; padding-left:0; }
.hs-story .hs-route-diagram .hs-node-caption { margin:0; color:#9cb0c8; font-family:"IBM Plex Mono",monospace; font-size:.65rem; line-height:1.55; text-transform:uppercase; letter-spacing:.06em; }
.hs-route-diagram .systems-node-primary .hs-node-caption { grid-column:2; }
.hs-route-diagram .systems-node-bsides { left:57%; width:36%; top:82%; }
.hs-route-copy .hs-capabilities { margin-top:0; grid-template-columns:1fr; }
.hs-route-map,.hs-route-diagram.systems-diagram { min-height:1250px; }
@media(prefers-reduced-motion:reduce) { .hs-route-diagram .systems-route-particle { display:none; } }
@media(max-width:1000px) { .hs-route-layout { grid-template-columns:1fr; } }
@media(max-width:540px) {
 .hs-route-diagram .systems-node { padding:.65rem; gap:.4rem; grid-template-columns:18px minmax(0,1fr); }
 .hs-route-diagram .systems-node-title { font-size:.78rem; }
 .hs-route-diagram .hs-node-icon { width:18px; height:22px; font-size:.85rem; }
 .hs-story .hs-route-diagram .systems-node .hs-node-caption { font-size:.56rem; letter-spacing:.02em; }
 .hs-route-diagram .systems-node-primary { grid-template-columns:44px minmax(0,1fr); padding:.78rem .9rem; gap:.28rem .72rem; }
}
.hs-story .section-heading { max-width:850px; }
/* Size nodes to their labels instead of narrow percentage boxes. */
.hs-route-diagram .systems-node { width:max-content; max-width:calc(100% - 32px); }
.hs-story .hs-route-diagram .systems-node .hs-node-caption { white-space:nowrap; font-size:.65rem; letter-spacing:.04em; grid-column:1 / -1; }
.hs-route-diagram .systems-node-primary { min-width:280px; }
.hs-story .hs-route-diagram .systems-node-primary .hs-node-caption { text-align:center; justify-self:stretch; }
.hs-route-diagram .systems-node-ai,.hs-route-diagram .systems-node-credomatic,.hs-route-diagram .systems-node-bsides { left:auto; right:4%; }
@media(max-width:540px) {
 .hs-route-diagram .systems-node { max-width:92%; }
 .hs-route-diagram .systems-node-primary { left:4%; min-width:0; width:92%; }
}
.hs-story p { color:#acbfcd; line-height:1.75; }
.hs-story .hs-caption { color:#79c8d6; font-size:.74rem; letter-spacing:.045em; margin:0; }
.hs-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin:2rem 0 1rem; border-block:1px solid #ffffff24; }
.hs-stats > div { padding:1.4rem 1.5rem; }
.hs-stats > div + div { border-left:1px solid #ffffff24; }
.hs-stats h3 { margin:0 0 .3rem; font-size:clamp(1.4rem,3vw,2.1rem); color:#e5f8fc; }
.hs-stats p { margin:0; font-size:.85rem; }
.hs-demo { margin-block:2rem; padding:1.6rem; border:1px solid #43616b; border-radius:20px; background:linear-gradient(135deg,#102530e6,#080e18f5); box-shadow:0 20px 55px #0003; }
.hs-stage-tabs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.5rem; margin:1.25rem 0; }
.hs-demo:not([data-enhanced]) .hs-stage-tabs,.hs-demo:not([data-enhanced]) .hs-demo-controls button { display:none; }
.hs-stage-tabs button { display:flex; align-items:center; gap:.8rem; padding:.9rem 1rem; border-radius:9px; border:1px solid #ffffff28; background:#14212b; color:#bfd0dd; font:inherit; font-size:.9rem; font-weight:600; cursor:pointer; }
.hs-stage-tabs button span { color:#84d9e8; font-family:"IBM Plex Mono",monospace; font-size:.75rem; }
.hs-stage-tabs button[aria-pressed="true"] { background:#a5ebf5; color:#08232b; border-color:#a5ebf5; }
.hs-stage-tabs button[aria-pressed="true"] span { color:#235566; }
.hs-scene { padding:1rem 0; border-top:1px solid #ffffff20; }
.hs-scene h3 { margin:0 0 .85rem; color:#effaff; font-size:clamp(1.25rem,2.4vw,1.8rem); line-height:1.3; }
.hs-scene > p { max-width:75ch; margin:0; }
.hs-demo[data-enhanced] .hs-scenes { display:grid; }
.hs-demo[data-enhanced] .hs-scene { grid-area:1/1; visibility:hidden; opacity:0; pointer-events:none; transition:opacity .45s ease; }
.hs-demo[data-enhanced] .hs-scene[data-active] { visibility:visible; opacity:1; pointer-events:auto; }
.hs-demo-flow { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-top:1.6rem; }
.hs-demo[data-playing] .hs-scene[data-active] .hs-flow-item { animation:hs-confirm 2s ease both; }
.hs-demo[data-playing] .hs-scene[data-active] .hs-flow-item + .hs-flow-item { animation-delay:.65s; }
@keyframes hs-confirm { from { border-left-color:#334b58; background:#07141e; } to { border-left-color:#9aebcc; background:#0c2630; } }
.hs-story .hs-flow-item { margin:0; padding:1.2rem 1.3rem; border-left:2px solid #64bacd; border-radius:0 10px 10px 0; background:#07141eb0; font-size:.95rem; color:#e0f0f7; }
.hs-demo-controls { display:flex; align-items:center; justify-content:space-between; gap:1rem; border-top:1px solid #ffffff20; padding-top:1.2rem; margin-top:.7rem; }
.hs-demo-controls button { font:inherit; color:#cceaf1; font-size:.8rem; min-height:44px; padding:.5rem .8rem; background:#142a35; border:1px solid #55717e; border-radius:8px; cursor:pointer; }
.hs-capabilities { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; background:#ffffff22; border:1px solid #ffffff22; border-radius:16px; overflow:hidden; margin-top:1.5rem; }
.hs-capabilities article { padding:1.65rem; background:#0b1520; }
.hs-capabilities h3,.hs-problems h3 { margin:.7rem 0; font-size:1.15rem; line-height:1.4; }
.hs-capabilities p,.hs-problems p { margin:0; font-size:.93rem; }
.hs-problems { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2rem; }
.hs-problems article { border-top:2px solid #517884; padding-top:.8rem; }
.hs-story-footer { display:flex; flex-wrap:wrap; gap:1rem; margin:1.6rem 0 1rem; }
.hs-cta { padding:2.5rem; border:1px solid #41616c; border-radius:18px; background:linear-gradient(125deg,#102b36,#0b1420); }
.hs-cta h2 { max-width:850px; }
.hs-cta > p { max-width:80ch; }
@media(max-width:700px) {
 .hs-demo { padding:1.1rem; border-radius:14px; }
 .hs-stage-tabs { grid-template-columns:1fr 1fr; }
 .hs-stage-tabs button { font-size:.8rem; padding:.8rem; gap:.55rem; }
 .hs-capabilities,.hs-problems,.hs-demo-flow { grid-template-columns:1fr; }
 .hs-capabilities article { padding:1.3rem; }
 .hs-stats { grid-template-columns:1fr; }
 .hs-stats > div { padding:1rem 0; }
 .hs-stats > div + div { border-left:0; border-top:1px solid #ffffff20; }
 .hs-demo-controls { align-items:flex-start; flex-direction:column; gap:.7rem; }
 .hs-cta { padding:1.4rem; }
 .hs-story-footer { flex-direction:column; }
}
@media(prefers-reduced-motion:reduce) { .hs-demo[data-enhanced] .hs-scene { transition:none; } .hs-demo .hs-scene .hs-flow-item { animation:none!important; } }
